@react-spot/ui-components 0.0.1

package/dist/index.cjs

@@ -0,0 +1,853 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+let react_jsx_runtime = require("react/jsx-runtime");
+let _base_ui_react_tooltip = require("@base-ui/react/tooltip");
+let _base_ui_react_button = require("@base-ui/react/button");
+let react = require("react");
+let _base_ui_react_separator = require("@base-ui/react/separator");
+let lucide_react = require("lucide-react");
+let _base_ui_react_popover = require("@base-ui/react/popover");
+let _base_ui_react_combobox = require("@base-ui/react/combobox");
+let _base_ui_react_menu = require("@base-ui/react/menu");
+let _base_ui_react_select = require("@base-ui/react/select");
+
+//#region src/Kbd.tsx
+const kbdStyle = {
+	display: "inline-flex",
+	alignItems: "center",
+	justifyContent: "center",
+	height: 20,
+	minWidth: 20,
+	padding: "0 4px",
+	gap: 4,
+	borderRadius: 4,
+	background: "#27272a",
+	border: "1px solid #52525b",
+	fontFamily: "system-ui, sans-serif",
+	fontSize: 11,
+	fontWeight: 500,
+	color: "#a1a1aa",
+	pointerEvents: "none",
+	userSelect: "none",
+	whiteSpace: "nowrap"
+};
+const kbdGroupStyle = {
+	display: "inline-flex",
+	alignItems: "center",
+	gap: 4
+};
+function Kbd({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("kbd", {
+		style: {
+			...kbdStyle,
+			...style
+		},
+		...props
+	});
+}
+function KbdGroup({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		style: {
+			...kbdGroupStyle,
+			...style
+		},
+		...props
+	});
+}
+
+//#endregion
+//#region src/Tooltip.tsx
+const popupStyle = {
+	display: "flex",
+	alignItems: "center",
+	gap: 6,
+	background: "#09090b",
+	border: "1px solid #3f3f46",
+	borderRadius: 6,
+	padding: "5px 8px",
+	boxShadow: "0 4px 12px rgba(0,0,0,0.5)",
+	whiteSpace: "nowrap",
+	fontFamily: "system-ui, sans-serif",
+	fontSize: 12,
+	color: "#d4d4d8",
+	pointerEvents: "none",
+	zIndex: 9999999
+};
+function Tooltip({ label, shortcut, container, render, children, ...triggerProps }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_tooltip.Tooltip.Root, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Trigger, {
+		render,
+		...triggerProps,
+		children
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Portal, {
+		container,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Positioner, {
+			sideOffset: 10,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_tooltip.Tooltip.Popup, {
+				style: popupStyle,
+				children: [label, shortcut && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Kbd, { children: shortcut })]
+			})
+		})
+	})] });
+}
+Tooltip.Provider = _base_ui_react_tooltip.Tooltip.Provider;
+
+//#endregion
+//#region src/Button.tsx
+const baseStyle$1 = {
+	display: "inline-flex",
+	alignItems: "center",
+	justifyContent: "center",
+	gap: 4,
+	height: 28,
+	padding: "0 8px",
+	borderRadius: 6,
+	fontSize: 12,
+	fontFamily: "system-ui, sans-serif",
+	fontWeight: 500,
+	transition: "opacity 0.15s",
+	cursor: "pointer",
+	whiteSpace: "nowrap"
+};
+const variantStyles = {
+	primary: {
+		background: "#fafafa",
+		border: "none",
+		color: "#18181b"
+	},
+	secondary: {
+		background: "transparent",
+		border: "1px solid #3f3f46",
+		color: "#d4d4d8"
+	},
+	accent: {
+		background: "rgba(59,130,246,0.15)",
+		border: "1px solid rgba(59,130,246,0.3)",
+		color: "#93c5fd"
+	}
+};
+function Button({ variant, style, render, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_button.Button, {
+		render,
+		style: (state) => ({
+			...baseStyle$1,
+			...variantStyles[variant],
+			opacity: state.disabled ? .5 : 1,
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			...style
+		}),
+		...props
+	});
+}
+
+//#endregion
+//#region src/IconButton.tsx
+const iconButtonStyle = {
+	display: "inline-flex",
+	alignItems: "center",
+	justifyContent: "center",
+	background: "transparent",
+	border: "none",
+	color: "#52525b",
+	padding: 4,
+	borderRadius: 4,
+	lineHeight: 1,
+	transition: "color 0.1s, opacity 0.15s"
+};
+function IconButton({ style, render, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_button.Button, {
+		render,
+		style: (state) => ({
+			...iconButtonStyle,
+			opacity: state.disabled ? .4 : 1,
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			...style
+		}),
+		...props
+	});
+}
+
+//#endregion
+//#region src/ToolbarButton.tsx
+const toolbarButtonStyle = {
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "center",
+	width: 32,
+	height: 32,
+	borderRadius: 7,
+	cursor: "pointer",
+	padding: 0,
+	background: "transparent",
+	border: 0,
+	outline: "none",
+	color: "#fafafa",
+	fontSize: 14,
+	transition: "background 0.15s, border-color 0.15s"
+};
+const ToolbarButton = (0, react.forwardRef)(function ToolbarButton({ style, render, type = "button", ...props }, ref) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_button.Button, {
+		ref,
+		type,
+		render,
+		style: (state) => ({
+			...toolbarButtonStyle,
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			opacity: state.disabled ? .4 : 1,
+			...style
+		}),
+		...props
+	});
+});
+
+//#endregion
+//#region src/PanelHeader.tsx
+const headerStyle = {
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "space-between",
+	padding: "10px 12px 8px",
+	borderBottom: "1px solid #27272a"
+};
+const titleBaseStyle = {
+	color: "#fafafa",
+	fontSize: 13,
+	fontWeight: 600,
+	fontFamily: "system-ui, sans-serif"
+};
+function PanelHeader({ title, actionsRender, style, titleStyle }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		style: {
+			...headerStyle,
+			...style
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			style: {
+				...titleBaseStyle,
+				...titleStyle
+			},
+			children: title
+		}), actionsRender]
+	});
+}
+
+//#endregion
+//#region src/Textarea.tsx
+const baseStyle = {
+	width: "100%",
+	background: "#0f0f11",
+	borderRadius: 4,
+	outline: "none",
+	resize: "vertical",
+	color: "#fafafa",
+	fontSize: 12,
+	fontFamily: "system-ui, sans-serif",
+	lineHeight: 1.4,
+	padding: "4px 6px",
+	boxSizing: "border-box",
+	caretColor: "#3b82f6"
+};
+const Textarea = (0, react.forwardRef)(function Textarea({ style, onFocus, onBlur, ...props }, ref) {
+	const [focused, setFocused] = (0, react.useState)(false);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+		ref,
+		style: {
+			...baseStyle,
+			border: `1px solid ${focused ? "#3b82f6" : "#3f3f46"}`,
+			...style
+		},
+		onFocus: (e) => {
+			setFocused(true);
+			onFocus?.(e);
+		},
+		onBlur: (e) => {
+			setFocused(false);
+			onBlur?.(e);
+		},
+		...props
+	});
+});
+
+//#endregion
+//#region src/Separator.tsx
+function Separator({ style }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_separator.Separator, { style: {
+		borderTop: "1px solid #27272a",
+		margin: "2px 0",
+		...style
+	} });
+}
+
+//#endregion
+//#region src/icons.tsx
+const DEFAULT_STROKE_WIDTH = 2;
+const DEFAULT_SIZE = 16;
+function SettingsIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Settings, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function ClipboardIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Clipboard, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function XIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.X, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function ChevronLeftIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeft, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function ChevronRightIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function OpenInEditorIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ExternalLink, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function ChatBubbleIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.MessageSquare, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function TrashIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Trash2, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function SaveIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Save, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function ExpandIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Maximize2, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function CollapseIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Minimize2, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function FolderIcon({ size = DEFAULT_SIZE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Folder, {
+		size,
+		strokeWidth: DEFAULT_STROKE_WIDTH,
+		"aria-hidden": true
+	});
+}
+function OpencodeIcon({ size = 13 }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		width: size,
+		height: size,
+		viewBox: "0 0 512 512",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		"aria-hidden": "true",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				fill: "#131010",
+				d: "M0 0h512v512H0z"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				d: "M320 224v128H192V224h128z",
+				fill: "#5A5858"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+				fillRule: "evenodd",
+				clipRule: "evenodd",
+				d: "M384 416H128V96h256v320zm-64-256H192v192h128V160z",
+				fill: "#fff"
+			})
+		]
+	});
+}
+
+//#endregion
+//#region src/Popover.tsx
+/**
+* Shared panel popup style (exported for callers that extend it)
+*/
+const panelPopupStyle = {
+	background: "#18181b",
+	border: "1px solid #27272a",
+	borderRadius: 8,
+	boxShadow: "0 8px 24px rgba(0,0,0,0.6)"
+};
+function StyledPopup$3({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_popover.Popover.Popup, {
+		style: {
+			...panelPopupStyle,
+			...style
+		},
+		...props
+	});
+}
+const Popover = {
+	Root: _base_ui_react_popover.Popover.Root,
+	Trigger: _base_ui_react_popover.Popover.Trigger,
+	Portal: _base_ui_react_popover.Popover.Portal,
+	Positioner: _base_ui_react_popover.Popover.Positioner,
+	Close: _base_ui_react_popover.Popover.Close,
+	Popup: StyledPopup$3
+};
+
+//#endregion
+//#region src/Combobox.tsx
+function StyledTrigger$1({ style, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_combobox.Combobox.Trigger, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "space-between",
+			gap: 4,
+			width: "100%",
+			background: "#0f0f11",
+			border: "1px solid #3f3f46",
+			borderRadius: 5,
+			color: "#fafafa",
+			fontSize: 12,
+			fontFamily: "system-ui, sans-serif",
+			padding: "5px 8px",
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			opacity: state.disabled ? .5 : 1,
+			boxSizing: "border-box",
+			...typeof style === "function" ? style(state) : style
+		}),
+		...props,
+		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, {
+			size: 12,
+			strokeWidth: 1.75,
+			"aria-hidden": true
+		})]
+	});
+}
+function StyledInput() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Input, { style: {
+		background: "#0f0f11",
+		color: "#fafafa",
+		border: "none",
+		outline: "none",
+		fontSize: 12,
+		fontFamily: "system-ui, sans-serif",
+		width: "100%"
+	} });
+}
+function StyledPositioner$1({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Positioner, {
+		align: "start",
+		side: "top",
+		sideOffset: 8,
+		...props
+	});
+}
+function StyledPopup$2({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Popup, {
+		style: {
+			...panelPopupStyle,
+			paddingBlock: 4,
+			...style
+		},
+		...props
+	});
+}
+function StyledList$1({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.List, {
+		style: {
+			...style,
+			width: "var(--anchor-width)"
+		},
+		...props
+	});
+}
+function StyledItem$2({ style: callerStyle, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Item, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			gap: 6,
+			padding: "7px 12px",
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			userSelect: "none",
+			outline: "none",
+			fontSize: 12,
+			fontFamily: "system-ui, sans-serif",
+			color: state.selected ? "#fafafa" : "#d4d4d8",
+			background: state.highlighted ? "rgba(59,130,246,0.2)" : "transparent",
+			transition: "background 0.1s",
+			...callerStyle
+		}),
+		...props
+	});
+}
+const Combobox = {
+	Root: _base_ui_react_combobox.Combobox.Root,
+	Trigger: StyledTrigger$1,
+	Value: _base_ui_react_combobox.Combobox.Value,
+	Portal: _base_ui_react_combobox.Combobox.Portal,
+	Positioner: StyledPositioner$1,
+	Popup: StyledPopup$2,
+	List: StyledList$1,
+	Empty: _base_ui_react_combobox.Combobox.Empty,
+	Item: StyledItem$2,
+	Input: StyledInput,
+	ItemIndicator: _base_ui_react_combobox.Combobox.ItemIndicator,
+	Group: _base_ui_react_combobox.Combobox.Group,
+	GroupLabel: _base_ui_react_combobox.Combobox.GroupLabel,
+	Separator: _base_ui_react_combobox.Combobox.Separator
+};
+
+//#endregion
+//#region src/DropdownMenu.tsx
+function StyledPopup$1({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Popup, {
+		style: {
+			...panelPopupStyle,
+			...style
+		},
+		...props
+	});
+}
+function StyledItem$1({ style: callerStyle, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Item, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			gap: 6,
+			padding: "7px 12px",
+			cursor: "pointer",
+			userSelect: "none",
+			outline: "none",
+			fontSize: 12,
+			color: "#d4d4d8",
+			fontFamily: "system-ui, sans-serif",
+			background: state.highlighted ? "rgba(59,130,246,0.2)" : "transparent",
+			transition: "background 0.1s",
+			...typeof callerStyle === "function" ? callerStyle(state) : callerStyle
+		}),
+		...props
+	});
+}
+function StyledSeparator({ style }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { style: {
+		borderTop: "1px solid #27272a",
+		margin: "2px 0",
+		...style
+	} });
+}
+function StyledSubmenuTrigger({ style: callerStyle, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.SubmenuTrigger, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			padding: "7px 12px",
+			cursor: "pointer",
+			userSelect: "none",
+			outline: "none",
+			width: "100%",
+			boxSizing: "border-box",
+			border: "none",
+			textAlign: "left",
+			background: state.highlighted || state.open ? "rgba(59,130,246,0.2)" : "transparent",
+			transition: "background 0.1s",
+			...typeof callerStyle === "function" ? callerStyle(state) : callerStyle
+		}),
+		...props
+	});
+}
+const DropdownMenu = {
+	Root: _base_ui_react_menu.Menu.Root,
+	Trigger: _base_ui_react_menu.Menu.Trigger,
+	Portal: _base_ui_react_menu.Menu.Portal,
+	Positioner: _base_ui_react_menu.Menu.Positioner,
+	Popup: StyledPopup$1,
+	Item: StyledItem$1,
+	Separator: StyledSeparator,
+	SubmenuRoot: _base_ui_react_menu.Menu.SubmenuRoot,
+	SubmenuTrigger: StyledSubmenuTrigger
+};
+
+//#endregion
+//#region src/Select.tsx
+function StyledTrigger({ style, children, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_select.Select.Trigger, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			justifyContent: "space-between",
+			gap: 4,
+			width: "100%",
+			background: "#0f0f11",
+			border: "1px solid #3f3f46",
+			borderRadius: 5,
+			color: "#fafafa",
+			fontSize: 12,
+			fontFamily: "system-ui, sans-serif",
+			padding: "5px 8px",
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			opacity: state.disabled ? .5 : 1,
+			boxSizing: "border-box",
+			...typeof style === "function" ? style(state) : style
+		}),
+		...props,
+		children: [children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, {
+			size: 12,
+			strokeWidth: 1.75,
+			"aria-hidden": true
+		})]
+	});
+}
+function StyledPositioner({ ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.Positioner, {
+		align: "start",
+		side: "top",
+		sideOffset: 4,
+		alignItemWithTrigger: false,
+		...props
+	});
+}
+function StyledPopup({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.Popup, {
+		style: {
+			...panelPopupStyle,
+			paddingBlock: 4,
+			...style
+		},
+		...props
+	});
+}
+function StyledList({ style, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.List, {
+		style: {
+			...style,
+			width: "var(--anchor-width)"
+		},
+		...props
+	});
+}
+function StyledItem({ style: callerStyle, ...props }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.Item, {
+		style: (state) => ({
+			display: "flex",
+			alignItems: "center",
+			gap: 6,
+			padding: "7px 12px",
+			cursor: state.disabled ? "not-allowed" : "pointer",
+			userSelect: "none",
+			outline: "none",
+			fontSize: 12,
+			fontFamily: "system-ui, sans-serif",
+			color: state.selected ? "#fafafa" : "#d4d4d8",
+			background: state.highlighted ? "rgba(59,130,246,0.2)" : "transparent",
+			transition: "background 0.1s",
+			...callerStyle
+		}),
+		...props
+	});
+}
+const Select = {
+	Root: _base_ui_react_select.Select.Root,
+	Trigger: StyledTrigger,
+	Value: _base_ui_react_select.Select.Value,
+	Portal: _base_ui_react_select.Select.Portal,
+	Positioner: StyledPositioner,
+	Popup: StyledPopup,
+	List: StyledList,
+	Item: StyledItem,
+	ItemText: _base_ui_react_select.Select.ItemText,
+	ItemIndicator: _base_ui_react_select.Select.ItemIndicator,
+	Group: _base_ui_react_select.Select.Group,
+	GroupLabel: _base_ui_react_select.Select.GroupLabel,
+	Separator: _base_ui_react_select.Select.Separator
+};
+
+//#endregion
+//#region src/Logo.tsx
+function Logo({ bgColor, size = 16 }) {
+	const linear1 = (0, react.useId)();
+	const linear2 = (0, react.useId)();
+	const linear3 = (0, react.useId)();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
+		xmlns: "http://www.w3.org/2000/svg",
+		viewBox: "12 16 132 130",
+		fill: "none",
+		width: size,
+		height: size,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("defs", { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("linearGradient", {
+					id: linear1,
+					x1: "0%",
+					y1: "0%",
+					x2: "100%",
+					y2: "100%",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+						offset: "0%",
+						stopColor: "#2196f3"
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+						offset: "100%",
+						stopColor: "#345580"
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("linearGradient", {
+					id: linear2,
+					href: `#${linear1}`,
+					x1: "100%",
+					y1: "0%",
+					x2: "0%",
+					y2: "0%"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("linearGradient", {
+					id: linear3,
+					x1: "0%",
+					y1: "0%",
+					x2: "100%",
+					y2: "100%",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+							offset: "0%",
+							stopColor: "#4dabf5"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+							offset: "50%",
+							stopColor: "#58a0c3"
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("stop", {
+							offset: "100%",
+							stopColor: "#4dabf5"
+						})
+					]
+				})
+			] }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+				transform: "matrix(5.5 0 0 5.5 75 75)",
+				stroke: `url(#${linear3})`,
+				strokeWidth: "1.5",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						r: "2",
+						fill: `url(#${linear3})`
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("ellipse", {
+						rx: "10",
+						ry: "4.5"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("ellipse", {
+						rx: "10",
+						ry: "4.5",
+						transform: "rotate(60)"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("ellipse", {
+						rx: "10",
+						ry: "4.5",
+						transform: "rotate(120)"
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+				cx: "95",
+				cy: "95",
+				r: "38",
+				fill: bgColor || "#18181b"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("g", {
+				transform: "matrix(3.2 0 0 3.2 70 70)",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "8",
+						cy: "8",
+						r: "8",
+						fill: "#fff"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "8",
+						cy: "8",
+						r: "8",
+						fill: `url(#${linear1})`,
+						opacity: ".8"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						stroke: `url(#${linear2})`,
+						strokeWidth: "4",
+						strokeLinecap: "round",
+						d: "M14 14l6 6"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
+						cx: "8",
+						cy: "8",
+						r: "8",
+						stroke: `url(#${linear1})`,
+						strokeWidth: "3"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
+						d: "M6 5.5L4 8l2 2.5M10 10.5L12 8l-2-2.5",
+						stroke: "#fff",
+						strokeWidth: "1.5",
+						strokeLinecap: "round",
+						strokeLinejoin: "round"
+					})
+				]
+			})
+		]
+	});
+}
+
+//#endregion
+exports.Button = Button;
+exports.ChatBubbleIcon = ChatBubbleIcon;
+exports.ChevronLeftIcon = ChevronLeftIcon;
+exports.ChevronRightIcon = ChevronRightIcon;
+exports.ClipboardIcon = ClipboardIcon;
+exports.CollapseIcon = CollapseIcon;
+exports.Combobox = Combobox;
+exports.DropdownMenu = DropdownMenu;
+exports.ExpandIcon = ExpandIcon;
+exports.FolderIcon = FolderIcon;
+exports.IconButton = IconButton;
+exports.Kbd = Kbd;
+exports.KbdGroup = KbdGroup;
+exports.Logo = Logo;
+exports.OpenInEditorIcon = OpenInEditorIcon;
+exports.OpencodeIcon = OpencodeIcon;
+exports.PanelHeader = PanelHeader;
+exports.Popover = Popover;
+exports.SaveIcon = SaveIcon;
+exports.Select = Select;
+exports.Separator = Separator;
+exports.SettingsIcon = SettingsIcon;
+exports.Textarea = Textarea;
+exports.ToolbarButton = ToolbarButton;
+exports.Tooltip = Tooltip;
+exports.TrashIcon = TrashIcon;
+exports.XIcon = XIcon;
+exports.panelPopupStyle = panelPopupStyle;
+//# sourceMappingURL=index.cjs.map