@anvia/react-ui 1.2.2 → 1.3.1

package/dist/selection-toolbar-CIkOoM-7.js

@@ -0,0 +1,171 @@
+import { l as InternalSelectionToolbarProvider, u as useSelectionToolbar } from "./contexts-B4ijG24z.js";
+import { t as messageElementFromNode } from "./elements-D4vmkkF8.js";
+import { t as renderPrimitive } from "./primitives-xfE7zfwJ.js";
+import { forwardRef, useCallback, useEffect, useMemo, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { createPortal } from "react-dom";
+// src/selection-toolbar/parts.tsx
+const SelectionToolbarRoot = forwardRef(function SelectionToolbarRoot({ children, container, onQuote, onSelectionChange, style, ...props }, ref) {
+	const [selection, setSelectionState] = useState();
+	const portalContainer = container ?? globalThis.document?.body;
+	const setSelection = useCallback((nextSelection) => {
+		setSelectionState((currentSelection) => {
+			if (sameSelection(currentSelection, nextSelection)) return currentSelection;
+			onSelectionChange?.(nextSelection);
+			return nextSelection;
+		});
+	}, [onSelectionChange]);
+	const clear = useCallback(() => {
+		globalThis.document?.getSelection()?.removeAllRanges();
+		setSelection(void 0);
+	}, [setSelection]);
+	const copy = useCallback(async () => {
+		if (selection === void 0) return;
+		await globalThis.navigator?.clipboard?.writeText(selection.text);
+		clear();
+	}, [clear, selection]);
+	const quote = useCallback(() => {
+		if (selection === void 0) return;
+		onQuote?.(selection);
+		clear();
+	}, [
+		clear,
+		onQuote,
+		selection
+	]);
+	const value = useMemo(() => {
+		const context = {
+			quote,
+			copy,
+			clear
+		};
+		if (selection !== void 0) context.selection = selection;
+		return context;
+	}, [
+		clear,
+		copy,
+		quote,
+		selection
+	]);
+	useEffect(() => {
+		const document = globalThis.document;
+		if (document === void 0) return;
+		const handleSelectionChange = () => {
+			setSelection(selectionFromDocument(document));
+		};
+		document.addEventListener("selectionchange", handleSelectionChange);
+		document.addEventListener("mouseup", handleSelectionChange);
+		document.addEventListener("keyup", handleSelectionChange);
+		document.addEventListener("scroll", handleSelectionChange, true);
+		return () => {
+			document.removeEventListener("selectionchange", handleSelectionChange);
+			document.removeEventListener("mouseup", handleSelectionChange);
+			document.removeEventListener("keyup", handleSelectionChange);
+			document.removeEventListener("scroll", handleSelectionChange, true);
+		};
+	}, [setSelection]);
+	if (selection === void 0 || portalContainer === void 0) return null;
+	const toolbarStyle = {
+		position: "fixed",
+		top: selection.rect.top,
+		left: selection.rect.left + selection.rect.width / 2,
+		transform: "translate(-50%, calc(-100% - 8px))",
+		...style
+	};
+	const toolbar = /* @__PURE__ */ jsx(InternalSelectionToolbarProvider, {
+		value,
+		children: renderPrimitive("div", {
+			...props,
+			children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(SelectionToolbarQuote, {}), /* @__PURE__ */ jsx(SelectionToolbarCopy, {})] }),
+			style: toolbarStyle,
+			role: props.role ?? "toolbar"
+		}, ref)
+	});
+	return createPortal(toolbar, portalContainer);
+});
+const SelectionToolbarQuote = forwardRef(function SelectionToolbarQuote({ onClick, ...props }, ref) {
+	const { disabled, handleClick } = useSelectionToolbarAction("quote", props.disabled, onClick);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Quote",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+const SelectionToolbarCopy = forwardRef(function SelectionToolbarCopy({ onClick, ...props }, ref) {
+	const { disabled, handleClick } = useSelectionToolbarAction("copy", props.disabled, onClick);
+	return renderPrimitive("button", {
+		...props,
+		children: props.children ?? "Copy",
+		disabled,
+		onClick: handleClick,
+		type: props.type ?? "button",
+		"data-state": disabled ? "disabled" : "enabled"
+	}, ref);
+});
+function useSelectionToolbarAction(actionName, disabledProp, onClick) {
+	const toolbar = useSelectionToolbar();
+	const disabled = disabledProp ?? toolbar.selection === void 0;
+	const action = toolbar[actionName];
+	return {
+		disabled,
+		handleClick: useCallback((event) => {
+			onClick?.(event);
+			if (event.defaultPrevented || disabled) return;
+			action();
+		}, [
+			action,
+			disabled,
+			onClick
+		])
+	};
+}
+function selectionFromDocument(document) {
+	const selection = document.getSelection();
+	if (selection === null || selection.rangeCount === 0) return;
+	const text = selection.toString();
+	if (text.trim().length === 0) return;
+	const anchorMessage = messageElementFromNode(selection.anchorNode);
+	const focusMessage = messageElementFromNode(selection.focusNode);
+	if (anchorMessage === void 0 || focusMessage === void 0 || anchorMessage.element !== focusMessage.element) return;
+	const range = selection.getRangeAt(0);
+	return {
+		text,
+		messageId: anchorMessage.messageId,
+		rect: selectionRect(range)
+	};
+}
+function selectionRect(range) {
+	const rect = range.getBoundingClientRect?.();
+	if (rect !== void 0 && (rect.width > 0 || rect.height > 0)) return rect;
+	const firstRect = range.getClientRects().item(0);
+	if (firstRect !== null) return firstRect;
+	const DOMRectConstructor = globalThis.DOMRect;
+	if (DOMRectConstructor !== void 0) return new DOMRectConstructor(0, 0, 0, 0);
+	return {
+		bottom: 0,
+		height: 0,
+		left: 0,
+		right: 0,
+		top: 0,
+		width: 0,
+		x: 0,
+		y: 0,
+		toJSON: () => ({})
+	};
+}
+function sameSelection(currentSelection, nextSelection) {
+	if (currentSelection === void 0 || nextSelection === void 0) return currentSelection === nextSelection;
+	return currentSelection.text === nextSelection.text && currentSelection.messageId === nextSelection.messageId && currentSelection.rect.left === nextSelection.rect.left && currentSelection.rect.top === nextSelection.rect.top && currentSelection.rect.width === nextSelection.rect.width && currentSelection.rect.height === nextSelection.rect.height;
+}
+// src/selection-toolbar/index.ts
+const SelectionToolbarPrimitive = {
+	Root: SelectionToolbarRoot,
+	Quote: SelectionToolbarQuote,
+	Copy: SelectionToolbarCopy
+};
+export { SelectionToolbarPrimitive as t };
+
+//# sourceMappingURL=selection-toolbar-CIkOoM-7.js.map

package/dist/selection-toolbar-CIkOoM-7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selection-toolbar-CIkOoM-7.js","names":["rangeWithRect"],"sources":["../src/selection-toolbar/parts.tsx","../src/selection-toolbar/index.ts"],"sourcesContent":["import {\n  type CSSProperties,\n  forwardRef,\n  type MouseEvent,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from \"react\";\nimport { createPortal } from \"react-dom\";\n\nimport {\n  InternalSelectionToolbarProvider,\n  type SelectionToolbarContextValue,\n  type SelectionToolbarSelection,\n  useSelectionToolbar,\n} from \"../contexts\";\nimport { messageElementFromNode } from \"../message/elements\";\nimport { type PrimitiveProps, renderPrimitive } from \"../primitives\";\n\ntype SelectionToolbarRootProps = Omit<PrimitiveProps<\"div\">, \"children\"> & {\n  children?: ReactNode;\n  container?: Element | DocumentFragment;\n  onQuote?: (selection: SelectionToolbarSelection) => void;\n  onSelectionChange?: (selection: SelectionToolbarSelection | undefined) => void;\n};\n\nconst SelectionToolbarRoot = forwardRef<HTMLDivElement, SelectionToolbarRootProps>(\n  function SelectionToolbarRoot(\n    { children, container, onQuote, onSelectionChange, style, ...props },\n    ref,\n  ) {\n    const [selection, setSelectionState] = useState<SelectionToolbarSelection | undefined>();\n    const portalContainer = container ?? globalThis.document?.body;\n\n    const setSelection = useCallback(\n      (nextSelection: SelectionToolbarSelection | undefined) => {\n        setSelectionState((currentSelection) => {\n          if (sameSelection(currentSelection, nextSelection)) {\n            return currentSelection;\n          }\n          onSelectionChange?.(nextSelection);\n          return nextSelection;\n        });\n      },\n      [onSelectionChange],\n    );\n\n    const clear = useCallback(() => {\n      globalThis.document?.getSelection()?.removeAllRanges();\n      setSelection(undefined);\n    }, [setSelection]);\n\n    const copy = useCallback(async () => {\n      if (selection === undefined) {\n        return;\n      }\n      await globalThis.navigator?.clipboard?.writeText(selection.text);\n      clear();\n    }, [clear, selection]);\n\n    const quote = useCallback(() => {\n      if (selection === undefined) {\n        return;\n      }\n      onQuote?.(selection);\n      clear();\n    }, [clear, onQuote, selection]);\n\n    const value = useMemo<SelectionToolbarContextValue>(() => {\n      const context: SelectionToolbarContextValue = { quote, copy, clear };\n      if (selection !== undefined) context.selection = selection;\n      return context;\n    }, [clear, copy, quote, selection]);\n\n    useEffect(() => {\n      const document = globalThis.document;\n      if (document === undefined) {\n        return;\n      }\n\n      const handleSelectionChange = () => {\n        setSelection(selectionFromDocument(document));\n      };\n\n      document.addEventListener(\"selectionchange\", handleSelectionChange);\n      document.addEventListener(\"mouseup\", handleSelectionChange);\n      document.addEventListener(\"keyup\", handleSelectionChange);\n      document.addEventListener(\"scroll\", handleSelectionChange, true);\n      return () => {\n        document.removeEventListener(\"selectionchange\", handleSelectionChange);\n        document.removeEventListener(\"mouseup\", handleSelectionChange);\n        document.removeEventListener(\"keyup\", handleSelectionChange);\n        document.removeEventListener(\"scroll\", handleSelectionChange, true);\n      };\n    }, [setSelection]);\n\n    if (selection === undefined || portalContainer === undefined) {\n      return null;\n    }\n\n    const toolbarStyle: CSSProperties = {\n      position: \"fixed\",\n      top: selection.rect.top,\n      left: selection.rect.left + selection.rect.width / 2,\n      transform: \"translate(-50%, calc(-100% - 8px))\",\n      ...style,\n    };\n\n    const toolbar = (\n      <InternalSelectionToolbarProvider value={value}>\n        {renderPrimitive(\n          \"div\",\n          {\n            ...props,\n            children: children ?? (\n              <>\n                <SelectionToolbarQuote />\n                <SelectionToolbarCopy />\n              </>\n            ),\n            style: toolbarStyle,\n            role: props.role ?? \"toolbar\",\n          } as PrimitiveProps<\"div\">,\n          ref,\n        )}\n      </InternalSelectionToolbarProvider>\n    );\n\n    return createPortal(toolbar, portalContainer);\n  },\n);\n\nconst SelectionToolbarQuote = forwardRef<HTMLButtonElement, PrimitiveProps<\"button\">>(\n  function SelectionToolbarQuote({ onClick, ...props }, ref) {\n    const { disabled, handleClick } = useSelectionToolbarAction(\"quote\", props.disabled, onClick);\n\n    return renderPrimitive(\n      \"button\",\n      {\n        ...props,\n        children: props.children ?? \"Quote\",\n        disabled,\n        onClick: handleClick,\n        type: props.type ?? \"button\",\n        \"data-state\": disabled ? \"disabled\" : \"enabled\",\n      } as PrimitiveProps<\"button\">,\n      ref,\n    );\n  },\n);\n\nconst SelectionToolbarCopy = forwardRef<HTMLButtonElement, PrimitiveProps<\"button\">>(\n  function SelectionToolbarCopy({ onClick, ...props }, ref) {\n    const { disabled, handleClick } = useSelectionToolbarAction(\"copy\", props.disabled, onClick);\n\n    return renderPrimitive(\n      \"button\",\n      {\n        ...props,\n        children: props.children ?? \"Copy\",\n        disabled,\n        onClick: handleClick,\n        type: props.type ?? \"button\",\n        \"data-state\": disabled ? \"disabled\" : \"enabled\",\n      } as PrimitiveProps<\"button\">,\n      ref,\n    );\n  },\n);\n\ntype SelectionToolbarAction = \"copy\" | \"quote\";\n\nfunction useSelectionToolbarAction(\n  actionName: SelectionToolbarAction,\n  disabledProp: boolean | undefined,\n  onClick: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined,\n): {\n  disabled: boolean;\n  handleClick(event: MouseEvent<HTMLButtonElement>): void;\n} {\n  const toolbar = useSelectionToolbar();\n  const disabled = disabledProp ?? toolbar.selection === undefined;\n  const action = toolbar[actionName];\n  const handleClick = useCallback(\n    (event: MouseEvent<HTMLButtonElement>) => {\n      onClick?.(event);\n      if (event.defaultPrevented || disabled) {\n        return;\n      }\n      void action();\n    },\n    [action, disabled, onClick],\n  );\n  return { disabled, handleClick };\n}\n\nfunction selectionFromDocument(document: Document): SelectionToolbarSelection | undefined {\n  const selection = document.getSelection();\n  if (selection === null || selection.rangeCount === 0) {\n    return undefined;\n  }\n  const text = selection.toString();\n  if (text.trim().length === 0) {\n    return undefined;\n  }\n\n  const anchorMessage = messageElementFromNode(selection.anchorNode);\n  const focusMessage = messageElementFromNode(selection.focusNode);\n  if (\n    anchorMessage === undefined ||\n    focusMessage === undefined ||\n    anchorMessage.element !== focusMessage.element\n  ) {\n    return undefined;\n  }\n\n  const range = selection.getRangeAt(0);\n  return {\n    text,\n    messageId: anchorMessage.messageId,\n    rect: selectionRect(range),\n  };\n}\n\nfunction selectionRect(range: Range): DOMRect {\n  const rangeWithRect = range as Range & {\n    getBoundingClientRect?: () => DOMRect;\n  };\n  const rect = rangeWithRect.getBoundingClientRect?.();\n  if (rect !== undefined && (rect.width > 0 || rect.height > 0)) {\n    return rect;\n  }\n  const firstRect = range.getClientRects().item(0);\n  if (firstRect !== null) {\n    return firstRect;\n  }\n  const DOMRectConstructor = globalThis.DOMRect;\n  if (DOMRectConstructor !== undefined) {\n    return new DOMRectConstructor(0, 0, 0, 0);\n  }\n  return {\n    bottom: 0,\n    height: 0,\n    left: 0,\n    right: 0,\n    top: 0,\n    width: 0,\n    x: 0,\n    y: 0,\n    toJSON: () => ({}),\n  } as DOMRect;\n}\n\nfunction sameSelection(\n  currentSelection: SelectionToolbarSelection | undefined,\n  nextSelection: SelectionToolbarSelection | undefined,\n): boolean {\n  if (currentSelection === undefined || nextSelection === undefined) {\n    return currentSelection === nextSelection;\n  }\n  return (\n    currentSelection.text === nextSelection.text &&\n    currentSelection.messageId === nextSelection.messageId &&\n    currentSelection.rect.left === nextSelection.rect.left &&\n    currentSelection.rect.top === nextSelection.rect.top &&\n    currentSelection.rect.width === nextSelection.rect.width &&\n    currentSelection.rect.height === nextSelection.rect.height\n  );\n}\n\nexport { SelectionToolbarCopy, SelectionToolbarQuote, SelectionToolbarRoot };\n","import { SelectionToolbarCopy, SelectionToolbarQuote, SelectionToolbarRoot } from \"./parts\";\n\nexport const SelectionToolbarPrimitive = {\n  Root: SelectionToolbarRoot,\n  Quote: SelectionToolbarQuote,\n  Copy: SelectionToolbarCopy,\n} as const;\n\nexport type { SelectionToolbarContextValue, SelectionToolbarSelection } from \"../contexts\";\nexport { useSelectionToolbar } from \"../contexts\";\n"],"mappings":"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"}

package/dist/shared-BSYElFU2.d.ts

@@ -0,0 +1,2 @@
+import "./index-Mw3ltwSG.js";
+import "./index-DqdyM0Jm.js";

package/dist/shared.d.ts

@@ -1,14 +1,4 @@
-export { A as AttachmentContextValue, u as useAttachment } from './attachment-mbjsroli.js';
-export { C as ChatController, a as ChatProvider, b as ChatProviderProps, u as useChatContext, c as useHumanInput } from './chat-PSj1Fo4W.js';
-export { C as CompletionController, a as CompletionInputContextValue, b as CompletionProvider, c as CompletionProviderProps, u as useCompletionContext, d as useCompletionInput } from './completion-input-DHlwrhxB.js';
-export { C as ComposerAttachmentInput, a as ComposerAttachmentsUpdate, b as ComposerContextValue, c as ComposerEntitiesUpdate, d as ComposerEntity, e as ComposerEntityData, f as ComposerMessageMetadata, g as ComposerQuote, h as ComposerTriggerDefinition, i as ComposerTriggerItem, j as ComposerTriggerItems, k as ComposerTriggerItemsArgs, l as ComposerTriggerState, m as ComposerTriggerStateUpdate, u as useComposer } from './composer-6iCSIq6L.js';
-export { A as ApprovalContextValue, Q as QuestionContextValue, a as QuestionPromptContextValue, u as useApproval, b as useQuestion, c as useQuestionPrompt } from './human-input-CkLrZ8IC.js';
-export { I as ImageContextValue, u as useImage } from './image-VZv6Ddsn.js';
-export { M as MessageContextValue, a as MessagePartContextValue, u as useMessage, b as useMessagePart } from './message-CNRnZQwU.js';
-export { S as SelectionToolbarContextValue, a as SelectionToolbarSelection, u as useSelectionToolbar } from './selection-toolbar-Cwjbuv5S.js';
-export { T as ThreadContextValue, u as useThread } from './thread-Bz6-1zaJ.js';
-export { T as ThreadListController, a as ThreadListItemContextValue, b as ThreadListProvider, c as ThreadListProviderProps, d as ThreadListRecord, u as useThreadList, e as useThreadListItem } from './thread-list-On8db4XL.js';
-export { P as PrimitiveProps, a as PrimitiveRef } from './render-CRKWam2v.js';
-import '@anvia/client';
-import '@anvia/react';
-import 'react';
+import { $ as CompletionProvider, A as ComposerEntitiesUpdate, B as ComposerTriggerStateUpdate, C as QuestionPromptContextValue, D as ComposerAttachmentInput, E as useQuestionPrompt, F as ComposerTriggerDefinition, H as CompletionInputContextValue, I as ComposerTriggerItem, L as ComposerTriggerItems, M as ComposerEntityData, N as ComposerMessageMetadata, O as ComposerAttachmentsUpdate, P as ComposerQuote, Q as CompletionController, R as ComposerTriggerItemsArgs, T as useQuestion, U as useCompletionInput, V as useComposer, _ as ImageContextValue, a as ThreadListRecord, at as useChatContext, c as ThreadContextValue, ct as useAttachment, d as SelectionToolbarSelection, et as CompletionProviderProps, f as useSelectionToolbar, g as useMessagePart, h as useMessage, i as ThreadListProviderProps, it as ChatProviderProps, j as ComposerEntity, k as ComposerContextValue, l as useThread, m as MessagePartContextValue, n as ThreadListItemContextValue, nt as ChatController, o as useThreadList, ot as useHumanInput, p as MessageContextValue, r as ThreadListProvider, rt as ChatProvider, s as useThreadListItem, st as AttachmentContextValue, t as ThreadListController, tt as useCompletionContext, u as SelectionToolbarContextValue, v as useImage, w as useApproval, x as QuestionContextValue, y as ApprovalContextValue, z as ComposerTriggerState } from "./index-Mw3ltwSG.js";
+import { n as PrimitiveRef, t as PrimitiveProps } from "./index-DqdyM0Jm.js";
+import "./shared-BSYElFU2.js";
+export { type ApprovalContextValue, type AttachmentContextValue, type ChatController, ChatProvider, type ChatProviderProps, type CompletionController, type CompletionInputContextValue, CompletionProvider, type CompletionProviderProps, type ComposerAttachmentInput, type ComposerAttachmentsUpdate, type ComposerContextValue, type ComposerEntitiesUpdate, type ComposerEntity, type ComposerEntityData, type ComposerMessageMetadata, type ComposerQuote, type ComposerTriggerDefinition, type ComposerTriggerItem, type ComposerTriggerItems, type ComposerTriggerItemsArgs, type ComposerTriggerState, type ComposerTriggerStateUpdate, type ImageContextValue, type MessageContextValue, type MessagePartContextValue, type PrimitiveProps, type PrimitiveRef, type QuestionContextValue, type QuestionPromptContextValue, type SelectionToolbarContextValue, type SelectionToolbarSelection, type ThreadContextValue, type ThreadListController, type ThreadListItemContextValue, ThreadListProvider, type ThreadListProviderProps, type ThreadListRecord, useApproval, useAttachment, useChatContext, useCompletionContext, useCompletionInput, useComposer, useHumanInput, useImage, useMessage, useMessagePart, useQuestion, useQuestionPrompt, useSelectionToolbar, useThread, useThreadList, useThreadListItem };

package/dist/shared.js

@@ -1,43 +1 @@
-import {
-  ChatProvider,
-  CompletionProvider,
-  ThreadListProvider,
-  useApproval,
-  useAttachment,
-  useChatContext,
-  useCompletionContext,
-  useCompletionInput,
-  useComposer,
-  useHumanInput,
-  useImage,
-  useMessage,
-  useMessagePart,
-  useQuestion,
-  useQuestionPrompt,
-  useSelectionToolbar,
-  useThread,
-  useThreadList,
-  useThreadListItem
-} from "./chunk-E73S3SOF.js";
-export {
-  ChatProvider,
-  CompletionProvider,
-  ThreadListProvider,
-  useApproval,
-  useAttachment,
-  useChatContext,
-  useCompletionContext,
-  useCompletionInput,
-  useComposer,
-  useHumanInput,
-  useImage,
-  useMessage,
-  useMessagePart,
-  useQuestion,
-  useQuestionPrompt,
-  useSelectionToolbar,
-  useThread,
-  useThreadList,
-  useThreadListItem
-};
-//# sourceMappingURL=shared.js.map
+export { F as ChatProvider, N as CompletionProvider, r as ThreadListProvider, x as useApproval, z as useAttachment, I as useChatContext, P as useCompletionContext, D as useCompletionInput, T as useComposer, L as useHumanInput, _ as useImage, p as useMessage, m as useMessagePart, S as useQuestion, C as useQuestionPrompt, u as useSelectionToolbar, c as useThread, a as useThreadList, o as useThreadListItem } from "./contexts-B4ijG24z.js";

package/dist/stream/index.d.ts

@@ -1,22 +1,2 @@
-import * as react from 'react';
-import { Components, Options } from 'react-markdown';
-import { P as PrimitiveProps } from '../render-CRKWam2v.js';
-
-type StreamMarkdownProps = Omit<PrimitiveProps<"div">, "children"> & {
-    "data-state"?: string | undefined;
-    components?: Components;
-    content: string;
-    live?: boolean;
-    remarkPlugins?: Options["remarkPlugins"];
-    remarkRehypeOptions?: Options["remarkRehypeOptions"];
-};
-declare const StreamMarkdown: react.ForwardRefExoticComponent<Omit<PrimitiveProps<"div">, "children"> & {
-    "data-state"?: string | undefined;
-    components?: Components;
-    content: string;
-    live?: boolean;
-    remarkPlugins?: Options["remarkPlugins"];
-    remarkRehypeOptions?: Options["remarkRehypeOptions"];
-} & react.RefAttributes<HTMLDivElement>>;
-
-export { StreamMarkdown, type StreamMarkdownProps };
+import { n as StreamMarkdownProps, t as StreamMarkdown } from "../index-CE22tsua.js";
+export { StreamMarkdown, type StreamMarkdownProps };

package/dist/stream/index.js

@@ -1,8 +1 @@
-import {
-  StreamMarkdown
-} from "../chunk-F6AKBUO3.js";
-import "../chunk-T3ZFZ3NP.js";
-export {
-  StreamMarkdown
-};
-//# sourceMappingURL=index.js.map
+export { t as StreamMarkdown } from "../stream-CAO0x8_1.js";

package/dist/stream-CAO0x8_1.js

@@ -0,0 +1,298 @@
+import { t as renderPrimitive } from "./primitives-xfE7zfwJ.js";
+import { createElement, forwardRef, memo, useCallback, useMemo, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import remarkGfm from "remark-gfm";
+import ReactMarkdown from "react-markdown";
+import { lexer } from "marked";
+// src/stream/markdown-blocks.ts
+function splitStreamMarkdownBlocks(content, options = {}) {
+	if (content.length === 0) return [];
+	if (options.singleDocument === true) return [{
+		content,
+		startOffset: 0
+	}];
+	try {
+		const tokens = lexer(content, { gfm: false });
+		if (tokens.some((token) => token.type === "def") || Object.keys(tokens.links).length > 0) return [{
+			content,
+			startOffset: 0
+		}];
+		const rawBlocks = [];
+		for (const token of tokens) if (token.type === "space" && rawBlocks.length > 0) {
+			const lastIndex = rawBlocks.length - 1;
+			rawBlocks[lastIndex] = `${rawBlocks[lastIndex] ?? ""}${token.raw}`;
+		} else rawBlocks.push(token.raw);
+		if (rawBlocks.length === 0 || rawBlocks.join("") !== content) return [{
+			content,
+			startOffset: 0
+		}];
+		let startOffset = 0;
+		return rawBlocks.map((block) => {
+			const result = {
+				content: block,
+				startOffset
+			};
+			startOffset += block.length;
+			return result;
+		});
+	} catch {
+		return [{
+			content,
+			startOffset: 0
+		}];
+	}
+}
+// src/stream/markdown-reveal.ts
+const streamRevealConfig = {
+	bandGraphemes: 2,
+	durationMs: 180,
+	minimumOpacity: .12,
+	tailGraphemes: 24
+};
+function createStreamGradientRevealPlugin(lifecycleScope, lifecycle) {
+	return function streamGradientRevealPlugin() {
+		return (tree) => {
+			if (lifecycle.activeScope !== lifecycleScope) {
+				lifecycle.activeScope = lifecycleScope;
+				lifecycle.settledRevealIds.clear();
+				lifecycle.startedAtByRevealId.clear();
+			}
+			const targets = collectTextTargets(tree);
+			wrapStreamRevealGraphemes(targets, createRevealGraphemes(targets.map((target) => target.node.value ?? "").join("")), lifecycleScope, lifecycle);
+		};
+	};
+}
+function collectTextTargets(tree) {
+	const targets = [];
+	let offset = 0;
+	function visit(node, parent, index) {
+		if (node.type === "element" && node.tagName === "pre") return;
+		if (node.type === "text" && node.value !== void 0 && parent !== void 0) {
+			if (!/\S/u.test(node.value)) return;
+			const startOffset = offset;
+			offset += node.value.length;
+			targets.push({
+				endOffset: offset,
+				index,
+				node,
+				parent,
+				startOffset
+			});
+			return;
+		}
+		for (const [childIndex, child] of (node.children ?? []).entries()) visit(child, node, childIndex);
+	}
+	visit(tree, void 0, 0);
+	return targets;
+}
+function createRevealGraphemes(content) {
+	const tail = segmentTailGraphemeRanges(content, streamRevealConfig.tailGraphemes);
+	const graphemes = [];
+	for (let index = 0; index < tail.length; index += 1) {
+		const grapheme = tail[index];
+		const bandStartIndex = Math.floor(index / streamRevealConfig.bandGraphemes) * streamRevealConfig.bandGraphemes;
+		const bandEndIndex = Math.min(bandStartIndex + streamRevealConfig.bandGraphemes, tail.length) - 1;
+		if (grapheme === void 0) continue;
+		const progress = tail.length === 1 ? 1 : bandEndIndex / (tail.length - 1);
+		graphemes.push({
+			startOffset: grapheme.startOffset,
+			endOffset: grapheme.endOffset,
+			opacity: Math.max(streamRevealConfig.minimumOpacity, 1 - progress * (1 - streamRevealConfig.minimumOpacity))
+		});
+	}
+	return graphemes;
+}
+function wrapStreamRevealGraphemes(targets, graphemes, lifecycleScope, lifecycle) {
+	const activeRevealIds = /* @__PURE__ */ new Set();
+	const nowMs = Date.now();
+	for (const target of [...targets].reverse()) {
+		const value = target.node.value ?? "";
+		const intersectingGraphemes = graphemes.filter((grapheme) => grapheme.endOffset > target.startOffset && grapheme.startOffset < target.endOffset);
+		if (intersectingGraphemes.length === 0) continue;
+		const replacement = [];
+		let cursor = 0;
+		for (const grapheme of intersectingGraphemes) {
+			const start = Math.max(0, grapheme.startOffset - target.startOffset);
+			const end = Math.min(value.length, grapheme.endOffset - target.startOffset);
+			if (start > cursor) replacement.push({
+				type: "text",
+				value: value.slice(cursor, start)
+			});
+			if (end > start) {
+				const text = value.slice(start, end);
+				const revealId = `${lifecycleScope}:${target.startOffset + start}:${target.startOffset + end}:${hashText(text)}`;
+				activeRevealIds.add(revealId);
+				const startedAt = lifecycle.startedAtByRevealId.get(revealId) ?? nowMs;
+				lifecycle.startedAtByRevealId.set(revealId, startedAt);
+				const elapsedMs = Math.max(0, nowMs - startedAt);
+				if (elapsedMs >= streamRevealConfig.durationMs) lifecycle.settledRevealIds.add(revealId);
+				if (lifecycle.settledRevealIds.has(revealId)) replacement.push({
+					type: "text",
+					value: text
+				});
+				else {
+					const progress = Math.min(elapsedMs / streamRevealConfig.durationMs, 1);
+					const opacity = grapheme.opacity + (1 - grapheme.opacity) * progress;
+					const remainingMs = Math.max(1, streamRevealConfig.durationMs - elapsedMs);
+					replacement.push({
+						type: "element",
+						tagName: "span",
+						properties: {
+							"data-reveal-duration-ms": String(remainingMs),
+							"data-reveal-opacity": String(opacity),
+							"data-reveal-id": revealId,
+							"data-state": "revealing"
+						},
+						children: [{
+							type: "text",
+							value: text
+						}]
+					});
+				}
+			}
+			cursor = Math.max(cursor, end);
+		}
+		if (cursor < value.length) replacement.push({
+			type: "text",
+			value: value.slice(cursor)
+		});
+		target.parent.children?.splice(target.index, 1, ...replacement);
+	}
+	pruneRevealLifecycle(lifecycle, activeRevealIds);
+}
+function pruneRevealLifecycle(lifecycle, activeRevealIds) {
+	for (const revealId of lifecycle.startedAtByRevealId.keys()) if (!activeRevealIds.has(revealId)) lifecycle.startedAtByRevealId.delete(revealId);
+	for (const revealId of lifecycle.settledRevealIds) if (!activeRevealIds.has(revealId)) lifecycle.settledRevealIds.delete(revealId);
+}
+function hashText(text) {
+	let hash = 2166136261;
+	for (let index = 0; index < text.length; index += 1) {
+		hash ^= text.charCodeAt(index);
+		hash = Math.imul(hash, 16777619);
+	}
+	return (hash >>> 0).toString(36);
+}
+function segmentTailGraphemeRanges(content, limit) {
+	if (typeof Intl !== "undefined" && typeof Intl.Segmenter === "function") {
+		const segments = new Intl.Segmenter(void 0, { granularity: "grapheme" }).segment(content);
+		const ranges = [];
+		let cursor = content.length;
+		while (cursor > 0 && ranges.length < limit) {
+			const segment = segments.containing(cursor - 1);
+			if (segment === void 0) break;
+			ranges.unshift({
+				startOffset: segment.index,
+				endOffset: segment.index + segment.segment.length
+			});
+			cursor = segment.index;
+		}
+		return ranges;
+	}
+	const ranges = [];
+	let cursor = content.length;
+	while (cursor > 0 && ranges.length < limit) {
+		let startOffset = cursor - 1;
+		const code = content.charCodeAt(startOffset);
+		if (code >= 56320 && code <= 57343 && startOffset > 0) {
+			const previousCode = content.charCodeAt(startOffset - 1);
+			if (previousCode >= 55296 && previousCode <= 56319) startOffset -= 1;
+		}
+		ranges.unshift({
+			startOffset,
+			endOffset: cursor
+		});
+		cursor = startOffset;
+	}
+	return ranges;
+}
+// src/stream/markdown.tsx
+const defaultRemarkPlugins = [remarkGfm];
+const StreamMarkdown = forwardRef(function StreamMarkdown({ components, content, live = false, remarkPlugins, remarkRehypeOptions, ...props }, ref) {
+	const revealLifecycleRef = useRef({
+		activeScope: null,
+		content,
+		id: 0,
+		settledRevealIds: /* @__PURE__ */ new Set(),
+		startedAtByRevealId: /* @__PURE__ */ new Map()
+	});
+	const revealLifecycle = revealLifecycleRef.current;
+	if (revealLifecycle.content !== content) {
+		if (!content.startsWith(revealLifecycle.content)) {
+			revealLifecycle.id += 1;
+			revealLifecycle.activeScope = null;
+			revealLifecycle.settledRevealIds.clear();
+			revealLifecycle.startedAtByRevealId.clear();
+		}
+		revealLifecycle.content = content;
+	}
+	if (!live && revealLifecycle.activeScope !== null) for (const revealId of revealLifecycle.startedAtByRevealId.keys()) revealLifecycle.settledRevealIds.add(revealId);
+	const settleReveal = useCallback((revealId) => {
+		revealLifecycleRef.current.settledRevealIds.add(revealId);
+	}, []);
+	const blocks = useMemo(() => splitStreamMarkdownBlocks(content, { singleDocument: remarkPlugins !== void 0 }), [content, remarkPlugins]);
+	const streamingComponents = useMemo(() => withStreamRevealComponent(components, settleReveal), [components, settleReveal]);
+	return renderPrimitive("div", {
+		...props,
+		children: blocks.map((block, index) => /* @__PURE__ */ jsx(StreamMarkdownBlock, {
+			components: streamingComponents,
+			content: block.content,
+			live: live && index === blocks.length - 1,
+			revealLifecycle,
+			revealScope: `${revealLifecycle.id}:${block.startOffset}`,
+			remarkPlugins: remarkPlugins ?? defaultRemarkPlugins,
+			remarkRehypeOptions
+		}, block.startOffset)),
+		"data-role": "markdown",
+		"data-state": props["data-state"] ?? (live ? "streaming" : "idle")
+	}, ref);
+});
+const StreamMarkdownBlock = memo(function StreamMarkdownBlock(props) {
+	const revealPlugin = useMemo(() => createStreamGradientRevealPlugin(props.revealScope, props.revealLifecycle), [props.revealScope, props.revealLifecycle]);
+	return /* @__PURE__ */ jsx(ReactMarkdown, {
+		components: props.components,
+		rehypePlugins: props.live ? [revealPlugin] : void 0,
+		remarkPlugins: props.remarkPlugins,
+		remarkRehypeOptions: props.remarkRehypeOptions,
+		children: props.content
+	});
+});
+function withStreamRevealComponent(components, onRevealSettled) {
+	const consumerSpan = components?.span;
+	return {
+		...components,
+		span(spanProps) {
+			const safeProps = componentPropsWithoutKey(spanProps);
+			const internalProps = safeProps;
+			if (internalProps["data-state"] === "revealing") return streamRevealSpan(internalProps, onRevealSettled);
+			if (consumerSpan !== void 0) return createElement(consumerSpan, safeProps);
+			const { node: _node, ...elementProps } = safeProps;
+			return /* @__PURE__ */ jsx("span", { ...elementProps });
+		}
+	};
+}
+function componentPropsWithoutKey(props) {
+	const result = {};
+	for (const name of Object.keys(props)) if (name !== "key") result[name] = props[name];
+	return result;
+}
+function streamRevealSpan(props, onRevealSettled) {
+	const { children, node: _node, "data-reveal-duration-ms": durationMs, "data-reveal-opacity": opacity, "data-reveal-id": revealId, onAnimationEnd, ...elementProps } = props;
+	const parsedOpacity = Number(opacity);
+	const parsedDurationMs = Number(durationMs);
+	return /* @__PURE__ */ createElement("span", {
+		...elementProps,
+		"data-state": "revealing",
+		key: revealId ?? "stream-reveal",
+		onAnimationEnd: (event) => {
+			onAnimationEnd?.(event);
+			if (revealId !== void 0) onRevealSettled(revealId);
+		},
+		style: {
+			"--anvia-stream-reveal-opacity": Number.isFinite(parsedOpacity) ? parsedOpacity : 1,
+			"--anvia-stream-reveal-duration": `${Number.isFinite(parsedDurationMs) ? parsedDurationMs : 180}ms`
+		}
+	}, children);
+}
+export { StreamMarkdown as t };
+
+//# sourceMappingURL=stream-CAO0x8_1.js.map