@better-zap/react 0.2.0 → 0.2.2

package/dist/index.d.cts

@@ -0,0 +1,19 @@
+import { Bubble, BubbleAlign, BubbleContent, BubbleContentProps, BubbleGroup, BubbleGroupProps, BubbleProps, BubbleReactions, BubbleReactionsProps, BubbleVariant } from "./bubble.cjs";
+import { Composer, ComposerButton, ComposerButtonProps, ComposerContextValue, ComposerError, ComposerErrorProps, ComposerProps, ComposerSend, ComposerSendProps, ComposerStateContextValue, ComposerTextarea, ComposerTextareaProps, useComposer, useComposerState, useComposerValue } from "./composer.cjs";
+import { a as ConversationListProps, c as ConversationFilterValue, i as ConversationListLabels, n as ConversationItemProps, o as ConversationFilterChips, r as ConversationList, s as ConversationFilterChipsProps, t as ConversationItem } from "./conversation-list-BlhJhDsc.cjs";
+import { MobileView, WhatsappDashboard, WhatsappDashboardContextValue, WhatsappDashboardProps, useOptionalWhatsappDashboard, useWhatsappDashboard } from "./whatsapp-dashboard.cjs";
+import { DateDivider, DateDividerRenderContext, MessageGroupPosition, MessageList, MessageListProps, MessageRenderContext, MessageView, MessageViewContent, MessageViewContentProps, MessageViewEmpty, MessageViewHeader, MessageViewHeaderLabels, MessageViewHeaderProps, MessageViewProps } from "./message-view.cjs";
+import { FormattedMessage, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps } from "./message-bubble.cjs";
+import { Message, MessageAlign, MessageAvatar, MessageAvatarProps, MessageContent, MessageContentProps, MessageFooter, MessageFooterProps, MessageGroup, MessageGroupProps, MessageHeader, MessageHeaderProps, MessageProps } from "./message.cjs";
+import { cn, getDisplayDate, renderSlot } from "./utils.cjs";
+import { FreeformWindowClosedError, MessageInput, MessageInputLabels, MessageInputProps } from "./message-input.cjs";
+import { Conversation, Conversation as Conversation$1, ConversationRecord, FreeformMessageWindow, FreeformMessageWindow as FreeformMessageWindow$1, UIMessage, UIMessage as UIMessage$1, UIMessageStatus } from "better-zap";
+
+//#region src/use-freeform-message-window.d.ts
+interface UseFreeformMessageWindowResult extends FreeformMessageWindow$1 {
+  /** Recompute with a fresh clock, update state, and return the fresh result. */
+  revalidate: () => FreeformMessageWindow$1;
+}
+declare function useFreeformMessageWindow(conversation?: Pick<Conversation$1, "freeformMessageWindow" | "lastIncomingMessageAt"> | null, messages?: UIMessage$1[]): UseFreeformMessageWindowResult;
+//#endregion
+export { Bubble, BubbleAlign, BubbleContent, BubbleContentProps, BubbleGroup, BubbleGroupProps, BubbleProps, BubbleReactions, BubbleReactionsProps, BubbleVariant, Composer, ComposerButton, ComposerButtonProps, ComposerContextValue, ComposerError, ComposerErrorProps, ComposerProps, ComposerSend, ComposerSendProps, ComposerStateContextValue, ComposerTextarea, ComposerTextareaProps, type Conversation, ConversationFilterChips, ConversationFilterChipsProps, ConversationFilterValue, ConversationItem, ConversationItemProps, ConversationList, ConversationListLabels, ConversationListProps, type ConversationRecord, DateDivider, DateDividerRenderContext, FormattedMessage, type FreeformMessageWindow, FreeformWindowClosedError, Message, MessageAlign, MessageAvatar, MessageAvatarProps, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps, MessageContent, MessageContentProps, MessageFooter, MessageFooterProps, MessageGroup, MessageGroupPosition, MessageGroupProps, MessageHeader, MessageHeaderProps, MessageInput, MessageInputLabels, MessageInputProps, MessageList, MessageListProps, MessageProps, MessageRenderContext, MessageView, MessageViewContent, MessageViewContentProps, MessageViewEmpty, MessageViewHeader, MessageViewHeaderLabels, MessageViewHeaderProps, MessageViewProps, MobileView, type UIMessage, type UIMessageStatus, UseFreeformMessageWindowResult, WhatsappDashboard, WhatsappDashboardContextValue, WhatsappDashboardProps, cn, getDisplayDate, renderSlot, useComposer, useComposerState, useComposerValue, useFreeformMessageWindow, useOptionalWhatsappDashboard, useWhatsappDashboard };

package/dist/index.d.mts

@@ -0,0 +1,19 @@
+import { Bubble, BubbleAlign, BubbleContent, BubbleContentProps, BubbleGroup, BubbleGroupProps, BubbleProps, BubbleReactions, BubbleReactionsProps, BubbleVariant } from "./bubble.mjs";
+import { Composer, ComposerButton, ComposerButtonProps, ComposerContextValue, ComposerError, ComposerErrorProps, ComposerProps, ComposerSend, ComposerSendProps, ComposerStateContextValue, ComposerTextarea, ComposerTextareaProps, useComposer, useComposerState, useComposerValue } from "./composer.mjs";
+import { a as ConversationListProps, c as ConversationFilterValue, i as ConversationListLabels, n as ConversationItemProps, o as ConversationFilterChips, r as ConversationList, s as ConversationFilterChipsProps, t as ConversationItem } from "./conversation-list-BwQ4oK2J.mjs";
+import { MobileView, WhatsappDashboard, WhatsappDashboardContextValue, WhatsappDashboardProps, useOptionalWhatsappDashboard, useWhatsappDashboard } from "./whatsapp-dashboard.mjs";
+import { DateDivider, DateDividerRenderContext, MessageGroupPosition, MessageList, MessageListProps, MessageRenderContext, MessageView, MessageViewContent, MessageViewContentProps, MessageViewEmpty, MessageViewHeader, MessageViewHeaderLabels, MessageViewHeaderProps, MessageViewProps } from "./message-view.mjs";
+import { FormattedMessage, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps } from "./message-bubble.mjs";
+import { Message, MessageAlign, MessageAvatar, MessageAvatarProps, MessageContent, MessageContentProps, MessageFooter, MessageFooterProps, MessageGroup, MessageGroupProps, MessageHeader, MessageHeaderProps, MessageProps } from "./message.mjs";
+import { cn, getDisplayDate, renderSlot } from "./utils.mjs";
+import { FreeformWindowClosedError, MessageInput, MessageInputLabels, MessageInputProps } from "./message-input.mjs";
+import { Conversation, Conversation as Conversation$1, ConversationRecord, FreeformMessageWindow, FreeformMessageWindow as FreeformMessageWindow$1, UIMessage, UIMessage as UIMessage$1, UIMessageStatus } from "better-zap";
+
+//#region src/use-freeform-message-window.d.ts
+interface UseFreeformMessageWindowResult extends FreeformMessageWindow$1 {
+  /** Recompute with a fresh clock, update state, and return the fresh result. */
+  revalidate: () => FreeformMessageWindow$1;
+}
+declare function useFreeformMessageWindow(conversation?: Pick<Conversation$1, "freeformMessageWindow" | "lastIncomingMessageAt"> | null, messages?: UIMessage$1[]): UseFreeformMessageWindowResult;
+//#endregion
+export { Bubble, BubbleAlign, BubbleContent, BubbleContentProps, BubbleGroup, BubbleGroupProps, BubbleProps, BubbleReactions, BubbleReactionsProps, BubbleVariant, Composer, ComposerButton, ComposerButtonProps, ComposerContextValue, ComposerError, ComposerErrorProps, ComposerProps, ComposerSend, ComposerSendProps, ComposerStateContextValue, ComposerTextarea, ComposerTextareaProps, type Conversation, ConversationFilterChips, ConversationFilterChipsProps, ConversationFilterValue, ConversationItem, ConversationItemProps, ConversationList, ConversationListLabels, ConversationListProps, type ConversationRecord, DateDivider, DateDividerRenderContext, FormattedMessage, type FreeformMessageWindow, FreeformWindowClosedError, Message, MessageAlign, MessageAvatar, MessageAvatarProps, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps, MessageContent, MessageContentProps, MessageFooter, MessageFooterProps, MessageGroup, MessageGroupPosition, MessageGroupProps, MessageHeader, MessageHeaderProps, MessageInput, MessageInputLabels, MessageInputProps, MessageList, MessageListProps, MessageProps, MessageRenderContext, MessageView, MessageViewContent, MessageViewContentProps, MessageViewEmpty, MessageViewHeader, MessageViewHeaderLabels, MessageViewHeaderProps, MessageViewProps, MobileView, type UIMessage, type UIMessageStatus, UseFreeformMessageWindowResult, WhatsappDashboard, WhatsappDashboardContextValue, WhatsappDashboardProps, cn, getDisplayDate, renderSlot, useComposer, useComposerState, useComposerValue, useFreeformMessageWindow, useOptionalWhatsappDashboard, useWhatsappDashboard };

package/dist/index.mjs

@@ -0,0 +1,11 @@
+"use client";
+import { cn, getDisplayDate, renderSlot } from "./utils.mjs";
+import { WhatsappDashboard, useOptionalWhatsappDashboard, useWhatsappDashboard } from "./whatsapp-dashboard.mjs";
+import { Bubble, BubbleContent, BubbleGroup, BubbleReactions } from "./bubble.mjs";
+import { Message, MessageAvatar, MessageContent, MessageFooter, MessageGroup, MessageHeader } from "./message.mjs";
+import { FormattedMessage, MessageBubble } from "./message-bubble.mjs";
+import { DateDivider, MessageList, MessageView, MessageViewContent, MessageViewEmpty, MessageViewHeader } from "./message-view.mjs";
+import { n as ConversationList, r as ConversationFilterChips, t as ConversationItem } from "./conversation-list-C0EmReS-.mjs";
+import { Composer, ComposerButton, ComposerError, ComposerSend, ComposerTextarea, useComposer, useComposerState, useComposerValue } from "./composer.mjs";
+import { n as MessageInput, r as useFreeformMessageWindow, t as FreeformWindowClosedError } from "./message-input-CkaL6fb4.mjs";
+export { Bubble, BubbleContent, BubbleGroup, BubbleReactions, Composer, ComposerButton, ComposerError, ComposerSend, ComposerTextarea, ConversationFilterChips, ConversationItem, ConversationList, DateDivider, FormattedMessage, FreeformWindowClosedError, Message, MessageAvatar, MessageBubble, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageInput, MessageList, MessageView, MessageViewContent, MessageViewEmpty, MessageViewHeader, WhatsappDashboard, cn, getDisplayDate, renderSlot, useComposer, useComposerState, useComposerValue, useFreeformMessageWindow, useOptionalWhatsappDashboard, useWhatsappDashboard };

package/dist/message-bubble.cjs

@@ -0,0 +1,116 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_utils = require("./utils-Bp9IahGG.cjs");
+const require_bubble = require("./bubble.cjs");
+const require_message = require("./message.cjs");
+let react = require("react");
+react = require_utils.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let _hugeicons_react = require("@hugeicons/react");
+let _hugeicons_core_free_icons = require("@hugeicons/core-free-icons");
+//#region src/message-bubble.tsx
+const statusVariants = (0, require("class-variance-authority").cva)("flex items-center leading-none", {
+	variants: { variant: {
+		default: "text-[#111b21]/40",
+		read: "text-[#53bdeb]",
+		failed: "text-red-500"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function MessageBubble({ content, sender, timestamp, status, templateName, label, groupPosition = "single", className, ...props }) {
+	const isIncoming = sender === "user";
+	const isFailed = status === "failed";
+	const align = sender === "user" ? "start" : "end";
+	const variant = sender === "user" ? "default" : status === "failed" ? "destructive" : "primary";
+	const statusVariant = status === "read" ? "read" : isFailed ? "failed" : "default";
+	const statusIcon = isFailed ? _hugeicons_core_free_icons.Alert02Icon : status === "read" || status === "delivered" ? _hugeicons_core_free_icons.TickDouble02Icon : _hugeicons_core_free_icons.Tick02Icon;
+	const hasTail = groupPosition === "single" || groupPosition === "first";
+	const endsGroup = groupPosition === "single" || groupPosition === "last";
+	const displayContent = content || (templateName ? `[Template: ${templateName}]` : "[Conteúdo não disponível]");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_message.Message, {
+		align,
+		className: require_utils.cn(endsGroup ? "mb-3" : "mb-0.5", className),
+		...props,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_message.MessageContent, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_bubble.Bubble, {
+			variant,
+			align,
+			tail: hasTail,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_bubble.BubbleContent, { children: [
+				label && !isIncoming && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "mb-1 block text-xs font-medium opacity-70",
+					children: label
+				}),
+				templateName && !label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "mb-1 border-b border-black/5 pb-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+						className: "flex items-center gap-1 text-[11px] font-medium opacity-70",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_hugeicons_react.HugeiconsIcon, {
+							icon: _hugeicons_core_free_icons.File02Icon,
+							size: 12
+						}), templateName]
+					})
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormattedMessage, { text: displayContent }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "float-right -mb-1 ml-2 mt-1.5 flex items-center justify-end gap-1 shrink-0 h-[15px] select-none",
+					children: [timestamp && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: "text-[11px] text-[#111b21]/60 leading-none whitespace-nowrap",
+						children: timestamp
+					}), !isIncoming && status && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						role: "img",
+						"aria-label": String(status),
+						"data-status": status,
+						className: statusVariants({ variant: statusVariant }),
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_hugeicons_react.HugeiconsIcon, {
+							icon: statusIcon,
+							size: 15,
+							strokeWidth: 2
+						})
+					})]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "clear-both" })
+			] })
+		}) })
+	});
+}
+function FormattedMessage({ text }) {
+	if (!text) return null;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: text.split(/(\n)/g).map((line, lineIndex) => {
+		if (line === "\n") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("br", {}, lineIndex);
+		if (!line) return null;
+		const parts = line.split(/(```[\s\S]*?```|`[^`]+`|\*[^\s*](?:[^*]*[^\s*])?\*|_[^\s_](?:[^_]*[^\s_])?_|~[^\s~](?:[^~]*[^\s~])?~|https?:\/\/[^\s]+)/g);
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.default.Fragment, { children: parts.map((part, index) => {
+			if (!part) return null;
+			if (part.startsWith("```") && part.endsWith("```")) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+				className: "my-1 block whitespace-pre-wrap rounded bg-black/5 px-1 py-0.5 font-mono text-[13px]",
+				children: part.slice(3, -3)
+			}, index);
+			if (part.startsWith("`") && part.endsWith("`")) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("code", {
+				className: "rounded bg-black/5 px-1 font-mono text-[13px] text-[#df0165]",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("*") && part.endsWith("*")) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("strong", {
+				className: "font-bold",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("_") && part.endsWith("_")) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("em", {
+				className: "italic",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("~") && part.endsWith("~")) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("del", {
+				className: "text-gray-500 line-through",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.match(/^https?:\/\/[^\s]+$/)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+				href: part,
+				target: "_blank",
+				rel: "noopener noreferrer",
+				className: "text-[#027eb5] hover:underline",
+				children: part
+			}, index);
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: part }, index);
+		}) }, lineIndex);
+	}) });
+}
+//#endregion
+exports.FormattedMessage = FormattedMessage;
+exports.MessageBubble = MessageBubble;

package/dist/message-bubble.d.cts

@@ -0,0 +1,38 @@
+import React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { UIMessageStatus } from "better-zap";
+
+//#region src/message-bubble.d.ts
+type MessageBubbleGroupPosition = "single" | "first" | "middle" | "last";
+interface MessageBubbleProps extends React.HTMLAttributes<HTMLDivElement> {
+  content: string;
+  sender: "user" | "bot";
+  timestamp?: string;
+  status?: UIMessageStatus | string;
+  templateName?: string;
+  label?: string;
+  /**
+   * Position within a run of same-direction messages. Controls the corner
+   * tail (first/single only) and the gap to the next message, mirroring
+   * WhatsApp's grouping. @default "single"
+   */
+  groupPosition?: MessageBubbleGroupPosition;
+}
+declare function MessageBubble({
+  content,
+  sender,
+  timestamp,
+  status,
+  templateName,
+  label,
+  groupPosition,
+  className,
+  ...props
+}: MessageBubbleProps): react_jsx_runtime0.JSX.Element;
+declare function FormattedMessage({
+  text
+}: {
+  text: string;
+}): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { FormattedMessage, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps };

package/dist/message-bubble.d.mts

@@ -0,0 +1,38 @@
+import React from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { UIMessageStatus } from "better-zap";
+
+//#region src/message-bubble.d.ts
+type MessageBubbleGroupPosition = "single" | "first" | "middle" | "last";
+interface MessageBubbleProps extends React.HTMLAttributes<HTMLDivElement> {
+  content: string;
+  sender: "user" | "bot";
+  timestamp?: string;
+  status?: UIMessageStatus | string;
+  templateName?: string;
+  label?: string;
+  /**
+   * Position within a run of same-direction messages. Controls the corner
+   * tail (first/single only) and the gap to the next message, mirroring
+   * WhatsApp's grouping. @default "single"
+   */
+  groupPosition?: MessageBubbleGroupPosition;
+}
+declare function MessageBubble({
+  content,
+  sender,
+  timestamp,
+  status,
+  templateName,
+  label,
+  groupPosition,
+  className,
+  ...props
+}: MessageBubbleProps): react_jsx_runtime0.JSX.Element;
+declare function FormattedMessage({
+  text
+}: {
+  text: string;
+}): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+export { FormattedMessage, MessageBubble, MessageBubbleGroupPosition, MessageBubbleProps };

package/dist/message-bubble.mjs

@@ -0,0 +1,114 @@
+import { cn } from "./utils.mjs";
+import { Bubble, BubbleContent } from "./bubble.mjs";
+import { Message, MessageContent } from "./message.mjs";
+import React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Alert02Icon, File02Icon, Tick02Icon, TickDouble02Icon } from "@hugeicons/core-free-icons";
+import { cva } from "class-variance-authority";
+//#region src/message-bubble.tsx
+const statusVariants = cva("flex items-center leading-none", {
+	variants: { variant: {
+		default: "text-[#111b21]/40",
+		read: "text-[#53bdeb]",
+		failed: "text-red-500"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function MessageBubble({ content, sender, timestamp, status, templateName, label, groupPosition = "single", className, ...props }) {
+	const isIncoming = sender === "user";
+	const isFailed = status === "failed";
+	const align = sender === "user" ? "start" : "end";
+	const variant = sender === "user" ? "default" : status === "failed" ? "destructive" : "primary";
+	const statusVariant = status === "read" ? "read" : isFailed ? "failed" : "default";
+	const statusIcon = isFailed ? Alert02Icon : status === "read" || status === "delivered" ? TickDouble02Icon : Tick02Icon;
+	const hasTail = groupPosition === "single" || groupPosition === "first";
+	const endsGroup = groupPosition === "single" || groupPosition === "last";
+	const displayContent = content || (templateName ? `[Template: ${templateName}]` : "[Conteúdo não disponível]");
+	return /* @__PURE__ */ jsx(Message, {
+		align,
+		className: cn(endsGroup ? "mb-3" : "mb-0.5", className),
+		...props,
+		children: /* @__PURE__ */ jsx(MessageContent, { children: /* @__PURE__ */ jsx(Bubble, {
+			variant,
+			align,
+			tail: hasTail,
+			children: /* @__PURE__ */ jsxs(BubbleContent, { children: [
+				label && !isIncoming && /* @__PURE__ */ jsx("span", {
+					className: "mb-1 block text-xs font-medium opacity-70",
+					children: label
+				}),
+				templateName && !label && /* @__PURE__ */ jsx("div", {
+					className: "mb-1 border-b border-black/5 pb-1",
+					children: /* @__PURE__ */ jsxs("span", {
+						className: "flex items-center gap-1 text-[11px] font-medium opacity-70",
+						children: [/* @__PURE__ */ jsx(HugeiconsIcon, {
+							icon: File02Icon,
+							size: 12
+						}), templateName]
+					})
+				}),
+				/* @__PURE__ */ jsx(FormattedMessage, { text: displayContent }),
+				/* @__PURE__ */ jsxs("div", {
+					className: "float-right -mb-1 ml-2 mt-1.5 flex items-center justify-end gap-1 shrink-0 h-[15px] select-none",
+					children: [timestamp && /* @__PURE__ */ jsx("span", {
+						className: "text-[11px] text-[#111b21]/60 leading-none whitespace-nowrap",
+						children: timestamp
+					}), !isIncoming && status && /* @__PURE__ */ jsx("span", {
+						role: "img",
+						"aria-label": String(status),
+						"data-status": status,
+						className: statusVariants({ variant: statusVariant }),
+						children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+							icon: statusIcon,
+							size: 15,
+							strokeWidth: 2
+						})
+					})]
+				}),
+				/* @__PURE__ */ jsx("div", { className: "clear-both" })
+			] })
+		}) })
+	});
+}
+function FormattedMessage({ text }) {
+	if (!text) return null;
+	return /* @__PURE__ */ jsx(Fragment, { children: text.split(/(\n)/g).map((line, lineIndex) => {
+		if (line === "\n") return /* @__PURE__ */ jsx("br", {}, lineIndex);
+		if (!line) return null;
+		const parts = line.split(/(```[\s\S]*?```|`[^`]+`|\*[^\s*](?:[^*]*[^\s*])?\*|_[^\s_](?:[^_]*[^\s_])?_|~[^\s~](?:[^~]*[^\s~])?~|https?:\/\/[^\s]+)/g);
+		return /* @__PURE__ */ jsx(React.Fragment, { children: parts.map((part, index) => {
+			if (!part) return null;
+			if (part.startsWith("```") && part.endsWith("```")) return /* @__PURE__ */ jsx("code", {
+				className: "my-1 block whitespace-pre-wrap rounded bg-black/5 px-1 py-0.5 font-mono text-[13px]",
+				children: part.slice(3, -3)
+			}, index);
+			if (part.startsWith("`") && part.endsWith("`")) return /* @__PURE__ */ jsx("code", {
+				className: "rounded bg-black/5 px-1 font-mono text-[13px] text-[#df0165]",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("*") && part.endsWith("*")) return /* @__PURE__ */ jsx("strong", {
+				className: "font-bold",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("_") && part.endsWith("_")) return /* @__PURE__ */ jsx("em", {
+				className: "italic",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.startsWith("~") && part.endsWith("~")) return /* @__PURE__ */ jsx("del", {
+				className: "text-gray-500 line-through",
+				children: part.slice(1, -1)
+			}, index);
+			if (part.match(/^https?:\/\/[^\s]+$/)) return /* @__PURE__ */ jsx("a", {
+				href: part,
+				target: "_blank",
+				rel: "noopener noreferrer",
+				className: "text-[#027eb5] hover:underline",
+				children: part
+			}, index);
+			return /* @__PURE__ */ jsx("span", { children: part }, index);
+		}) }, lineIndex);
+	}) });
+}
+//#endregion
+export { FormattedMessage, MessageBubble };

package/dist/message-input-CkaL6fb4.mjs

@@ -0,0 +1,173 @@
+import { cn } from "./utils.mjs";
+import { Composer, ComposerButton, ComposerError, ComposerSend, ComposerTextarea, useComposerState } from "./composer.mjs";
+import { useCallback, useEffect, useState } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { HugeiconsIcon } from "@hugeicons/react";
+import { Add01Icon, Clock01Icon, Mic01Icon, SmileIcon } from "@hugeicons/core-free-icons";
+import { resolveConversationFreeformMessageWindow } from "better-zap";
+//#region src/use-freeform-message-window.ts
+const CLOSED_WINDOW = {
+	isOpen: false,
+	lastIncomingMessageAt: null,
+	expiresAt: null
+};
+const MAX_TIMEOUT_MS = 2 ** 31 - 1;
+function useFreeformMessageWindow(conversation, messages) {
+	const [now, setNow] = useState(() => /* @__PURE__ */ new Date());
+	const freeformWindow = conversation ? resolveConversationFreeformMessageWindow(conversation, messages, now) : CLOSED_WINDOW;
+	const revalidate = useCallback(() => {
+		const freshNow = /* @__PURE__ */ new Date();
+		setNow(freshNow);
+		if (!conversation) return CLOSED_WINDOW;
+		return resolveConversationFreeformMessageWindow(conversation, messages, freshNow);
+	}, [conversation, messages]);
+	useEffect(() => {
+		if (!conversation || !freeformWindow.isOpen || !freeformWindow.expiresAt) return;
+		const expiresAtMs = new Date(freeformWindow.expiresAt).getTime();
+		if (!Number.isFinite(expiresAtMs)) return;
+		const delay = Math.min(Math.max(0, expiresAtMs - Date.now()), MAX_TIMEOUT_MS);
+		const timeoutId = globalThis.setTimeout(() => {
+			setNow(/* @__PURE__ */ new Date());
+		}, delay);
+		return () => {
+			globalThis.clearTimeout(timeoutId);
+		};
+	}, [
+		conversation,
+		freeformWindow.isOpen,
+		freeformWindow.expiresAt,
+		now
+	]);
+	return {
+		...freeformWindow,
+		revalidate
+	};
+}
+//#endregion
+//#region src/message-input.tsx
+var FreeformWindowClosedError = class extends Error {
+	window;
+	constructor(freeformWindow) {
+		super("Freeform messaging window is closed");
+		this.name = "FreeformWindowClosedError";
+		this.window = freeformWindow;
+	}
+};
+const DEFAULT_LABELS = {
+	sending: "Enviando...",
+	expired: "A janela de 24h expirou. Mensagens de texto livre só podem ser enviadas dentro de 24h após a última mensagem do contato.",
+	emoji: "Emojis",
+	attach: "Anexar arquivo",
+	send: "Enviar",
+	mic: "Gravar áudio",
+	textarea: "Mensagem",
+	sendFailed: "Falha ao enviar. Tente novamente."
+};
+function MessageInputBody({ labels, placeholder, onEmojiClick, onAttachClick, onMicClick, showDefaultError }) {
+	const { isSending, hasText } = useComposerState();
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		(onEmojiClick || onAttachClick) && /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-1 text-[#54656f] shrink-0",
+			children: [onEmojiClick && /* @__PURE__ */ jsx(ComposerButton, {
+				"aria-label": labels.emoji,
+				title: labels.emoji,
+				onClick: onEmojiClick,
+				children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+					icon: SmileIcon,
+					size: 24
+				})
+			}), onAttachClick && /* @__PURE__ */ jsx(ComposerButton, {
+				"aria-label": labels.attach,
+				title: "Anexar",
+				onClick: onAttachClick,
+				children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+					icon: Add01Icon,
+					size: 24
+				})
+			})]
+		}),
+		/* @__PURE__ */ jsx("div", {
+			className: "flex-1 flex items-center min-h-[40px] py-2 px-2",
+			children: /* @__PURE__ */ jsx(ComposerTextarea, {
+				"aria-label": labels.textarea,
+				placeholder: isSending ? labels.sending : placeholder
+			})
+		}),
+		/* @__PURE__ */ jsx("div", {
+			className: "flex items-center pr-1 shrink-0",
+			children: hasText ? /* @__PURE__ */ jsx(ComposerSend, { "aria-label": labels.send }) : onMicClick ? /* @__PURE__ */ jsx(ComposerButton, {
+				"aria-label": labels.mic,
+				className: "text-[#54656f]",
+				onClick: onMicClick,
+				children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+					icon: Mic01Icon,
+					size: 24
+				})
+			}) : /* @__PURE__ */ jsx(ComposerSend, { "aria-label": labels.send })
+		}),
+		showDefaultError && /* @__PURE__ */ jsx(ComposerError, {
+			className: "px-2 pb-1 text-[13px] leading-[18px] text-red-600",
+			children: labels.sendFailed
+		})
+	] });
+}
+function MessageInput({ onSend, conversation, messages, disabled, placeholder = "Digite uma mensagem", className, contextWindowOpen = true, onSendError, onEmojiClick, onAttachClick, onMicClick, labels: labelsProp }) {
+	const labels = {
+		...DEFAULT_LABELS,
+		...labelsProp
+	};
+	const freeformFromHook = useFreeformMessageWindow(conversation, messages);
+	const freeformMessageWindow = conversation ? freeformFromHook : {
+		isOpen: contextWindowOpen,
+		lastIncomingMessageAt: null,
+		expiresAt: null,
+		revalidate: () => ({
+			isOpen: contextWindowOpen,
+			lastIncomingMessageAt: null,
+			expiresAt: null
+		})
+	};
+	const isContextWindowOpen = freeformMessageWindow.isOpen;
+	const revalidate = freeformMessageWindow.revalidate;
+	const handleSubmit = useCallback(async (text) => {
+		const windowState = revalidate();
+		if (!windowState.isOpen) throw new FreeformWindowClosedError(windowState);
+		return onSend(text);
+	}, [onSend, revalidate]);
+	const handleError = useCallback((error, context) => {
+		onSendError?.(error, context);
+	}, [onSendError]);
+	const showDefaultError = !(onSendError != null && labelsProp?.sendFailed === "");
+	if (!isContextWindowOpen) return /* @__PURE__ */ jsx("div", {
+		className: cn("w-full flex flex-col px-4 py-3 z-10 shrink-0", className),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-3 px-4 py-3 min-h-[52px] bg-[#ffeecd] rounded-[7.5px] shadow-[0_1px_0.5px_rgba(11,20,26,0.13)]",
+			children: [/* @__PURE__ */ jsx(HugeiconsIcon, {
+				icon: Clock01Icon,
+				size: 20,
+				className: "text-[#54656f] shrink-0"
+			}), /* @__PURE__ */ jsx("span", {
+				className: "text-[13px] leading-[18px] text-[#54656f]",
+				children: labels.expired
+			})]
+		})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("w-full flex flex-col px-4 py-3 z-10 shrink-0", className),
+		children: /* @__PURE__ */ jsx(Composer, {
+			onSubmit: handleSubmit,
+			onError: handleError,
+			disabled,
+			children: /* @__PURE__ */ jsx(MessageInputBody, {
+				labels,
+				placeholder,
+				onEmojiClick,
+				onAttachClick,
+				onMicClick,
+				showDefaultError
+			})
+		})
+	});
+}
+//#endregion
+export { MessageInput as n, useFreeformMessageWindow as r, FreeformWindowClosedError as t };