@mcp-b/react-components 0.6.5 → 0.7.0

package/dist/components/Marker.js

@@ -0,0 +1,89 @@
+import { t as cx } from "../class-names-9UtZwb0J.js";
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Marker.tsx
+function markerVariants({ variant = "default", className } = {}) {
+	return cx("marker", `marker--${variant ?? "default"}`, className);
+}
+function assignRef(ref, value) {
+	if (!ref) return;
+	if (typeof ref === "function") {
+		ref(value);
+		return;
+	}
+	ref.current = value;
+}
+function mergeRefs(...refs) {
+	const activeRefs = refs.filter(Boolean);
+	if (activeRefs.length === 0) return void 0;
+	return (value) => {
+		for (const activeRef of activeRefs) assignRef(activeRef, value);
+	};
+}
+function isEventHandler(propName, value) {
+	return /^on[A-Z]/.test(propName) && typeof value === "function";
+}
+function mergeRenderedMarkerProps(renderProps, markerProps) {
+	const mergedProps = {
+		...renderProps,
+		...markerProps
+	};
+	const markerPropsRecord = markerProps;
+	for (const propName of Object.keys(renderProps)) {
+		const renderValue = renderProps[propName];
+		const markerValue = markerPropsRecord[propName];
+		if (isEventHandler(propName, renderValue) && isEventHandler(propName, markerValue)) mergedProps[propName] = (...args) => {
+			renderValue(...args);
+			markerValue(...args);
+		};
+	}
+	mergedProps.className = cx(renderProps.className, markerProps.className);
+	mergedProps.style = renderProps.style || markerProps.style ? {
+		...renderProps.style,
+		...markerProps.style
+	} : void 0;
+	mergedProps.ref = mergeRefs(renderProps.ref, markerProps.ref);
+	return mergedProps;
+}
+/**
+* Compact status or separator row for transcript events like compaction,
+* checkpoints, and progress markers.
+*/
+function Marker({ className, variant = "default", render, ref, ...props }) {
+	const rootProps = {
+		ref,
+		"data-slot": "marker",
+		"data-variant": variant,
+		className: markerVariants({
+			variant,
+			className
+		}),
+		...props
+	};
+	const markerProps = {
+		...rootProps,
+		ref
+	};
+	if (typeof render === "function") return render(markerProps, { variant });
+	if (React.isValidElement(render)) return React.cloneElement(render, mergeRenderedMarkerProps(render.props, markerProps));
+	return /* @__PURE__ */ jsx("div", { ...rootProps });
+}
+function MarkerIcon({ className, ref, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		"data-slot": "marker-icon",
+		"aria-hidden": "true",
+		className: cx("marker__icon", className),
+		...props
+	});
+}
+function MarkerContent({ className, ref, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		ref,
+		"data-slot": "marker-content",
+		className: cx("marker__content", className),
+		...props
+	});
+}
+//#endregion
+export { Marker, MarkerContent, MarkerIcon, markerVariants };

package/dist/components/MessageScroller.d.ts

@@ -0,0 +1,52 @@
+import { r as ButtonProps } from "../Button-Ct5I6aTu.js";
+import * as React from "react";
+import { MessageScroller as MessageScroller$1, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from "@shadcn/react/message-scroller";
+
+//#region src/components/MessageScroller.d.ts
+type MessageScrollerProviderProps = React.ComponentProps<typeof MessageScroller$1.Provider>;
+interface MessageScrollerProps extends React.ComponentProps<typeof MessageScroller$1.Root> {
+  /** Extra class names merged onto the scroll container. */
+  className?: string;
+}
+type MessageScrollerViewportProps = React.ComponentProps<typeof MessageScroller$1.Viewport>;
+type MessageScrollerContentProps = React.ComponentProps<typeof MessageScroller$1.Content>;
+type MessageScrollerItemProps = React.ComponentProps<typeof MessageScroller$1.Item>;
+declare function MessageScrollerProvider(props: MessageScrollerProviderProps): React.JSX.Element;
+/**
+ * Scroll container for chat transcripts, wrapping shadcn's message scroller
+ * primitive with design-system classes.
+ */
+declare function MessageScroller({
+  className,
+  ...props
+}: MessageScrollerProps): React.JSX.Element;
+declare function MessageScrollerViewport({
+  className,
+  ...props
+}: MessageScrollerViewportProps): React.JSX.Element;
+declare function MessageScrollerContent({
+  className,
+  ...props
+}: MessageScrollerContentProps): React.JSX.Element;
+declare function MessageScrollerItem({
+  className,
+  scrollAnchor,
+  ...props
+}: MessageScrollerItemProps): React.JSX.Element;
+interface MessageScrollerButtonProps extends Omit<React.ComponentProps<typeof MessageScroller$1.Button>, "children" | "className" | "color" | "render">, Pick<ButtonProps, "color" | "size" | "variant"> {
+  className?: string;
+  children?: React.ReactNode;
+  render?: React.ComponentProps<typeof MessageScroller$1.Button>["render"];
+}
+declare function MessageScrollerButton({
+  className,
+  children,
+  color,
+  direction,
+  render,
+  size,
+  variant,
+  ...props
+}: MessageScrollerButtonProps): React.JSX.Element;
+//#endregion
+export { MessageScroller, MessageScrollerButton, MessageScrollerButtonProps, MessageScrollerContent, MessageScrollerContentProps, MessageScrollerItem, MessageScrollerItemProps, MessageScrollerProps, MessageScrollerProvider, MessageScrollerProviderProps, MessageScrollerViewport, MessageScrollerViewportProps, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility };

package/dist/components/MessageScroller.js

@@ -0,0 +1,62 @@
+import { t as cx } from "../class-names-9UtZwb0J.js";
+import { t as ArrowDownIcon } from "../icons-BCNawx-T.js";
+import { Button } from "./Button.js";
+import "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { MessageScroller as MessageScroller$1, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from "@shadcn/react/message-scroller";
+//#region src/components/MessageScroller.tsx
+function MessageScrollerProvider(props) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Provider, { ...props });
+}
+/**
+* Scroll container for chat transcripts, wrapping shadcn's message scroller
+* primitive with design-system classes.
+*/
+function MessageScroller({ className, ...props }) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Root, {
+		"data-slot": "message-scroller",
+		className: cx("message-scroller", className),
+		...props
+	});
+}
+function MessageScrollerViewport({ className, ...props }) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Viewport, {
+		"data-slot": "message-scroller-viewport",
+		className: cx("message-scroller__viewport", className),
+		...props
+	});
+}
+function MessageScrollerContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Content, {
+		"data-slot": "message-scroller-content",
+		className: cx("message-scroller__content", className),
+		...props
+	});
+}
+function MessageScrollerItem({ className, scrollAnchor = false, ...props }) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Item, {
+		"data-slot": "message-scroller-item",
+		scrollAnchor,
+		className: cx("message-scroller__item", className),
+		...props
+	});
+}
+function MessageScrollerButton({ className, children, color = "neutral", direction = "end", render, size = "icon-sm", variant = "outline", ...props }) {
+	return /* @__PURE__ */ jsx(MessageScroller$1.Button, {
+		"data-slot": "message-scroller-button",
+		direction,
+		className: cx("message-scroller__button", className),
+		render: render ?? /* @__PURE__ */ jsx(Button, {
+			color,
+			size,
+			variant
+		}),
+		...props,
+		children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ArrowDownIcon, {}), /* @__PURE__ */ jsx("span", {
+			className: "message-scroller__button-label",
+			children: direction === "end" ? "Scroll to end" : "Scroll to start"
+		})] })
+	});
+}
+//#endregion
+export { MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility };