@almadar/ui 5.9.1 → 5.9.2

package/dist/avl/index.cjs

@@ -37088,6 +37088,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = React98.useState(false);
+      const [draft, setDraft] = React98.useState("");
       const handleVote = React98.useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -37097,8 +37099,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = React98.useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = React98.useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = React98.useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = React98.useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -37185,6 +37198,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {

package/dist/avl/index.js

@@ -37039,6 +37039,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = useState(false);
+      const [draft, setDraft] = useState("");
       const handleVote = useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -37048,8 +37050,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -37136,6 +37149,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsx(
             Button,
             {

package/dist/components/index.cjs

@@ -32547,6 +32547,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = React80.useState(false);
+      const [draft, setDraft] = React80.useState("");
       const handleVote = React80.useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -32556,8 +32558,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = React80.useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = React80.useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = React80.useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = React80.useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -32644,6 +32657,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              exports.Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(exports.Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                exports.Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(exports.Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsxRuntime.jsx(
             exports.Button,
             {

package/dist/components/index.js

@@ -32498,6 +32498,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = useState(false);
+      const [draft, setDraft] = useState("");
       const handleVote = useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -32507,8 +32509,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -32595,6 +32608,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsx(
             Button,
             {

package/dist/components/molecules/ReplyTree.d.ts

@@ -31,6 +31,7 @@ export interface ReplyTreeProps {
     }>;
     replyEvent?: EventEmit<{
         parentNodeId: string;
+        content: string;
     }>;
     flagEvent?: EventEmit<{
         nodeId: string;

package/dist/providers/index.cjs

@@ -33500,6 +33500,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = React86.useState(false);
+      const [draft, setDraft] = React86.useState("");
       const handleVote = React86.useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -33509,8 +33511,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = React86.useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = React86.useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = React86.useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = React86.useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -33597,6 +33610,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {

package/dist/providers/index.js

@@ -33451,6 +33451,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = useState(false);
+      const [draft, setDraft] = useState("");
       const handleVote = useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -33460,8 +33462,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -33548,6 +33561,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsx(
             Button,
             {

package/dist/runtime/index.cjs

@@ -33067,6 +33067,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = React85.useState(false);
+      const [draft, setDraft] = React85.useState("");
       const handleVote = React85.useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -33076,8 +33078,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = React85.useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = React85.useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = React85.useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = React85.useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -33164,6 +33177,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {

package/dist/runtime/index.js

@@ -33018,6 +33018,8 @@ var init_ReplyTree = __esm({
       const hasReplies = !!node.replies && node.replies.length > 0;
       const isCollapsed = collapsedSet.has(node.id);
       const atMaxDepth = depth >= maxDepth;
+      const [replyOpen, setReplyOpen] = useState(false);
+      const [draft, setDraft] = useState("");
       const handleVote = useCallback(
         (next) => {
           onVote?.(node.id, next);
@@ -33027,8 +33029,19 @@ var init_ReplyTree = __esm({
       );
       const handleReply = useCallback(() => {
         onReply?.(node.id);
-        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id });
-      }, [node.id, onReply, replyEvent, eventBus]);
+        setReplyOpen((open) => !open);
+      }, [node.id, onReply]);
+      const handleSubmitReply = useCallback(() => {
+        const content = draft.trim();
+        if (!content) return;
+        if (replyEvent) eventBus.emit(`UI:${replyEvent}`, { parentNodeId: node.id, content });
+        setDraft("");
+        setReplyOpen(false);
+      }, [node.id, draft, replyEvent, eventBus]);
+      const handleCancelReply = useCallback(() => {
+        setDraft("");
+        setReplyOpen(false);
+      }, []);
       const handleFlag = useCallback(() => {
         onFlag?.(node.id);
         if (flagEvent) eventBus.emit(`UI:${flagEvent}`, { nodeId: node.id });
@@ -33115,6 +33128,33 @@ var init_ReplyTree = __esm({
               }
             )
           ] }),
+          replyOpen && /* @__PURE__ */ jsxs(Box, { className: "flex flex-col gap-2 mt-1", children: [
+            /* @__PURE__ */ jsx(
+              Input,
+              {
+                inputType: "textarea",
+                rows: 2,
+                value: draft,
+                placeholder: `Reply to ${node.authorName}\u2026`,
+                onChange: (e) => setDraft(e.target.value),
+                "aria-label": `Reply to ${node.authorName}`
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { className: "flex flex-row gap-2 items-center", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "primary",
+                  size: "sm",
+                  leftIcon: "send",
+                  onClick: handleSubmitReply,
+                  disabled: !draft.trim(),
+                  children: "Send"
+                }
+              ),
+              /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "sm", onClick: handleCancelReply, children: "Cancel" })
+            ] })
+          ] }),
           hasReplies && !isCollapsed && (atMaxDepth ? /* @__PURE__ */ jsx(
             Button,
             {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@almadar/ui",
-  "version": "5.9.1",
+  "version": "5.9.2",
   "description": "React UI components, hooks, and providers for Almadar",
   "type": "module",
   "sideEffects": [