@industry-theme/github-panels 0.1.54 → 0.1.56

package/dist/panels.bundle.js

@@ -130,7 +130,7 @@ const createLucideIcon = (iconName, iconNode) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$F = [
+const __iconNode$G = [
   ["path", { d: "M12 7v14", key: "1akyts" }],
   [
     "path",
@@ -140,14 +140,14 @@ const __iconNode$F = [
     }
   ]
 ];
-const BookOpen = createLucideIcon("book-open", __iconNode$F);
+const BookOpen = createLucideIcon("book-open", __iconNode$G);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$E = [
+const __iconNode$F = [
   ["path", { d: "M10 12h4", key: "a56b0p" }],
   ["path", { d: "M10 8h4", key: "1sr2af" }],
   ["path", { d: "M14 21v-3a2 2 0 0 0-4 0v3", key: "1rgiei" }],
@@ -160,108 +160,108 @@ const __iconNode$E = [
   ],
   ["path", { d: "M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16", key: "16ra0t" }]
 ];
-const Building2 = createLucideIcon("building-2", __iconNode$E);
+const Building2 = createLucideIcon("building-2", __iconNode$F);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$D = [
+const __iconNode$E = [
   ["path", { d: "M8 2v4", key: "1cmpym" }],
   ["path", { d: "M16 2v4", key: "4m81vk" }],
   ["rect", { width: "18", height: "18", x: "3", y: "4", rx: "2", key: "1hopcy" }],
   ["path", { d: "M3 10h18", key: "8toen8" }]
 ];
-const Calendar = createLucideIcon("calendar", __iconNode$D);
+const Calendar = createLucideIcon("calendar", __iconNode$E);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$C = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
-const Check = createLucideIcon("check", __iconNode$C);
+const __iconNode$D = [["path", { d: "M20 6 9 17l-5-5", key: "1gmf2c" }]];
+const Check = createLucideIcon("check", __iconNode$D);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$B = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$B);
+const __iconNode$C = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$C);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$A = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
-const ChevronRight = createLucideIcon("chevron-right", __iconNode$A);
+const __iconNode$B = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$B);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$z = [
+const __iconNode$A = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["line", { x1: "12", x2: "12", y1: "8", y2: "12", key: "1pkeuh" }],
   ["line", { x1: "12", x2: "12.01", y1: "16", y2: "16", key: "4dfq90" }]
 ];
-const CircleAlert = createLucideIcon("circle-alert", __iconNode$z);
+const CircleAlert = createLucideIcon("circle-alert", __iconNode$A);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$y = [
+const __iconNode$z = [
   ["path", { d: "M21.801 10A10 10 0 1 1 17 3.335", key: "yps3ct" }],
   ["path", { d: "m9 11 3 3L22 4", key: "1pflzl" }]
 ];
-const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$y);
+const CircleCheckBig = createLucideIcon("circle-check-big", __iconNode$z);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$x = [
+const __iconNode$y = [
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }],
   ["circle", { cx: "12", cy: "12", r: "1", key: "41hilf" }]
 ];
-const CircleDot = createLucideIcon("circle-dot", __iconNode$x);
+const CircleDot = createLucideIcon("circle-dot", __iconNode$y);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$w = [
+const __iconNode$x = [
   ["rect", { width: "14", height: "14", x: "8", y: "8", rx: "2", ry: "2", key: "17jyea" }],
   ["path", { d: "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2", key: "zix9uf" }]
 ];
-const Copy = createLucideIcon("copy", __iconNode$w);
+const Copy = createLucideIcon("copy", __iconNode$x);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$v = [
+const __iconNode$w = [
   ["path", { d: "M12 15V3", key: "m9g1x1" }],
   ["path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4", key: "ih7n3h" }],
   ["path", { d: "m7 10 5 5 5-5", key: "brsn70" }]
 ];
-const Download = createLucideIcon("download", __iconNode$v);
+const Download = createLucideIcon("download", __iconNode$w);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$u = [
+const __iconNode$v = [
   ["path", { d: "m15 15 6 6", key: "1s409w" }],
   ["path", { d: "m15 9 6-6", key: "ko1vev" }],
   ["path", { d: "M21 16v5h-5", key: "1ck2sf" }],
@@ -271,19 +271,44 @@ const __iconNode$u = [
   ["path", { d: "M3 8V3h5", key: "1ln10m" }],
   ["path", { d: "M9 9 3 3", key: "v551iv" }]
 ];
-const Expand = createLucideIcon("expand", __iconNode$u);
+const Expand = createLucideIcon("expand", __iconNode$v);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$t = [
+const __iconNode$u = [
   ["path", { d: "M15 3h6v6", key: "1q9fwt" }],
   ["path", { d: "M10 14 21 3", key: "gplh6r" }],
   ["path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6", key: "a6xqqp" }]
 ];
-const ExternalLink = createLucideIcon("external-link", __iconNode$t);
+const ExternalLink = createLucideIcon("external-link", __iconNode$u);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$t = [
+  [
+    "path",
+    {
+      d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
+      key: "ct8e1f"
+    }
+  ],
+  ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
+  [
+    "path",
+    {
+      d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
+      key: "13bj9a"
+    }
+  ],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }]
+];
+const EyeOff = createLucideIcon("eye-off", __iconNode$t);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -49159,6 +49184,7 @@ const GitHubIssueDetailPanelContent = ({ events }) => {
   const [modalStep, setModalStep] = useState("type");
   const [selectedTaskType, setSelectedTaskType] = useState(null);
   const [additionalInstructions, setAdditionalInstructions] = useState("");
+  const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
   const panelRef = useRef(null);
   gt(
     "github-issue-detail",
@@ -49259,6 +49285,21 @@ const GitHubIssueDetailPanelContent = ({ events }) => {
       });
     }
   };
+  const handleDelete2 = () => {
+    if (selectedIssue && events) {
+      events.emit({
+        type: "github-issue:delete",
+        source: "github-issue-detail-panel",
+        timestamp: Date.now(),
+        payload: {
+          owner,
+          repo,
+          number: selectedIssue.number
+        }
+      });
+    }
+    setShowDeleteConfirm(false);
+  };
   const containerStyle = {
     display: "flex",
     flexDirection: "column",
@@ -49390,6 +49431,28 @@ const GitHubIssueDetailPanelContent = ({ events }) => {
             }
           ),
           /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => setShowDeleteConfirm(true),
+              title: "Delete issue",
+              style: {
+                display: "inline-flex",
+                alignItems: "center",
+                justifyContent: "center",
+                width: "28px",
+                height: "28px",
+                padding: 0,
+                border: `1px solid ${theme2.colors.border}`,
+                borderRadius: "6px",
+                backgroundColor: theme2.colors.background,
+                color: theme2.colors.textSecondary,
+                cursor: "pointer"
+              },
+              children: /* @__PURE__ */ jsx(Trash2, { size: 14 })
+            }
+          ),
           /* @__PURE__ */ jsx(
             "a",
             {
@@ -50072,6 +50135,149 @@ const GitHubIssueDetailPanelContent = ({ events }) => {
           }
         )
       }
+    ),
+    showDeleteConfirm && selectedIssue && /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          right: 0,
+          bottom: 0,
+          backgroundColor: "rgba(0, 0, 0, 0.5)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          zIndex: 1e3
+        },
+        onClick: () => setShowDeleteConfirm(false),
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              backgroundColor: theme2.colors.background,
+              border: `1px solid ${theme2.colors.border}`,
+              borderRadius: "8px",
+              padding: "24px",
+              minWidth: "320px",
+              maxWidth: "400px",
+              boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)"
+            },
+            onClick: (e) => e.stopPropagation(),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "12px",
+                    marginBottom: "16px"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        style: {
+                          width: "40px",
+                          height: "40px",
+                          borderRadius: "50%",
+                          backgroundColor: theme2.colors.error ? `${theme2.colors.error}20` : "#ef444420",
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          color: theme2.colors.error || "#ef4444"
+                        },
+                        children: /* @__PURE__ */ jsx(Trash2, { size: 20 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "h3",
+                      {
+                        style: {
+                          margin: 0,
+                          fontFamily: theme2.fonts.heading,
+                          fontSize: theme2.fontSizes[2],
+                          fontWeight: 600,
+                          color: theme2.colors.text
+                        },
+                        children: "Delete Issue?"
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "p",
+                {
+                  style: {
+                    margin: "0 0 24px 0",
+                    fontFamily: theme2.fonts.body,
+                    fontSize: theme2.fontSizes[1],
+                    color: theme2.colors.textSecondary,
+                    lineHeight: 1.5
+                  },
+                  children: [
+                    'Are you sure you want to delete "',
+                    selectedIssue.title,
+                    '"? This action cannot be undone.'
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    gap: "12px",
+                    justifyContent: "flex-end"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => setShowDeleteConfirm(false),
+                        style: {
+                          padding: "8px 16px",
+                          border: `1px solid ${theme2.colors.border}`,
+                          borderRadius: "6px",
+                          backgroundColor: theme2.colors.background,
+                          color: theme2.colors.text,
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1],
+                          cursor: "pointer"
+                        },
+                        children: "Cancel"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: handleDelete2,
+                        style: {
+                          padding: "8px 16px",
+                          border: "none",
+                          borderRadius: "6px",
+                          backgroundColor: theme2.colors.error || "#ef4444",
+                          color: "#ffffff",
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1],
+                          fontWeight: 500,
+                          cursor: "pointer"
+                        },
+                        children: "Delete"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      }
     )
   ] });
 };
@@ -50087,6 +50293,26 @@ const GitHubIssueDetailPanelMetadata = {
   slices: [],
   surfaces: ["panel"]
 };
+const REACTION_EMOJI = {
+  "+1": "👍",
+  "-1": "👎",
+  "laugh": "😄",
+  "hooray": "🎉",
+  "confused": "😕",
+  "heart": "❤️",
+  "rocket": "🚀",
+  "eyes": "👀"
+};
+const REACTION_ORDER = [
+  "+1",
+  "heart",
+  "hooray",
+  "rocket",
+  "eyes",
+  "laugh",
+  "confused",
+  "-1"
+];
 const formatDate = (dateString) => {
   const date = new Date(dateString);
   const now = /* @__PURE__ */ new Date();
@@ -50111,6 +50337,12 @@ const formatDate = (dateString) => {
   return `${years}y ago`;
 };
 const formatSha = (sha) => sha.substring(0, 7);
+const getEventTimestamp = (event) => {
+  if ("created_at" in event) return event.created_at;
+  if ("submitted_at" in event) return event.submitted_at;
+  if ("committer" in event) return event.committer.date;
+  return "";
+};
 const Avatar = ({ user, size = 32 }) => {
   const { theme: theme2 } = useTheme();
   return /* @__PURE__ */ jsx(
@@ -50127,152 +50359,294 @@ const Avatar = ({ user, size = 32 }) => {
     }
   );
 };
-const ReactionsDisplay = ({ reactions }) => {
+const ReactionBar = ({ reactions, onToggleReaction, disabled }) => {
   const { theme: theme2 } = useTheme();
-  if (reactions.total_count === 0) return null;
-  const reactionEmojis = {
-    "+1": "👍",
-    "-1": "👎",
-    laugh: "😄",
-    hooray: "🎉",
-    confused: "😕",
-    heart: "❤️",
-    rocket: "🚀",
-    eyes: "👀"
-  };
-  const reactionCounts = {
-    "+1": reactions["+1"],
-    "-1": reactions["-1"],
-    laugh: reactions.laugh,
-    hooray: reactions.hooray,
-    confused: reactions.confused,
-    heart: reactions.heart,
-    rocket: reactions.rocket,
-    eyes: reactions.eyes
-  };
-  const activeReactions = Object.entries(reactionEmojis).filter(([key]) => reactionCounts[key] > 0).map(([key, emoji]) => ({
-    emoji,
-    count: reactionCounts[key]
-  }));
-  return /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "8px", marginTop: "8px" }, children: activeReactions.map(({ emoji, count }) => /* @__PURE__ */ jsxs(
-    "span",
-    {
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        gap: "4px",
-        padding: "2px 8px",
-        borderRadius: "12px",
-        backgroundColor: theme2.colors.backgroundSecondary,
-        border: `1px solid ${theme2.colors.border}`,
-        fontSize: theme2.fontSizes[0]
+  const [showPicker, setShowPicker] = useState(false);
+  const sortedReactions = REACTION_ORDER.filter((type) => reactions[type] > 0).map((type) => {
+    var _a, _b;
+    return {
+      type,
+      count: reactions[type],
+      viewerReacted: !!((_a = reactions.viewerReactions) == null ? void 0 : _a[type]),
+      reactionId: (_b = reactions.viewerReactions) == null ? void 0 : _b[type]
+    };
+  });
+  const handleReactionClick = (type, reactionId) => {
+    if (disabled || !onToggleReaction) return;
+    onToggleReaction(type, reactionId);
+  };
+  const handlePickerSelect = (type) => {
+    var _a;
+    setShowPicker(false);
+    if (disabled || !onToggleReaction) return;
+    const reactionId = (_a = reactions.viewerReactions) == null ? void 0 : _a[type];
+    onToggleReaction(type, reactionId);
+  };
+  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", marginTop: "8px", flexWrap: "wrap", position: "relative" }, children: [
+    sortedReactions.map(({ type, count, viewerReacted, reactionId }) => /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: (e) => {
+          e.stopPropagation();
+          handleReactionClick(type, reactionId);
+        },
+        disabled,
+        style: {
+          display: "inline-flex",
+          alignItems: "center",
+          gap: "4px",
+          padding: "2px 8px",
+          borderRadius: "12px",
+          backgroundColor: viewerReacted ? `${theme2.colors.primary}20` : theme2.colors.backgroundSecondary,
+          border: `1px solid ${viewerReacted ? theme2.colors.primary : theme2.colors.border}`,
+          fontSize: theme2.fontSizes[0],
+          cursor: disabled ? "default" : "pointer",
+          opacity: disabled ? 0.5 : 1,
+          transition: "all 0.2s"
+        },
+        title: viewerReacted ? "Remove reaction" : "Add reaction",
+        children: [
+          /* @__PURE__ */ jsx("span", { children: REACTION_EMOJI[type] }),
+          /* @__PURE__ */ jsx("span", { style: { fontFamily: theme2.fonts.body, color: viewerReacted ? theme2.colors.primary : theme2.colors.textSecondary }, children: count })
+        ]
       },
-      children: [
-        /* @__PURE__ */ jsx("span", { children: emoji }),
-        /* @__PURE__ */ jsx("span", { style: { fontFamily: theme2.fonts.body, color: theme2.colors.textSecondary }, children: count })
-      ]
-    },
-    emoji
-  )) });
+      type
+    )),
+    onToggleReaction && /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: (e) => {
+            e.stopPropagation();
+            setShowPicker(!showPicker);
+          },
+          disabled,
+          style: {
+            display: "inline-flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: "24px",
+            height: "24px",
+            borderRadius: "12px",
+            backgroundColor: theme2.colors.backgroundSecondary,
+            border: `1px solid ${theme2.colors.border}`,
+            fontSize: theme2.fontSizes[1],
+            color: theme2.colors.textMuted,
+            cursor: disabled ? "default" : "pointer",
+            opacity: disabled ? 0.5 : 1,
+            transition: "all 0.2s"
+          },
+          title: "Add reaction",
+          children: "+"
+        }
+      ),
+      showPicker && /* @__PURE__ */ jsx(
+        "div",
+        {
+          style: {
+            position: "absolute",
+            bottom: "100%",
+            left: 0,
+            marginBottom: "4px",
+            padding: "4px",
+            borderRadius: "8px",
+            backgroundColor: theme2.colors.background,
+            border: `1px solid ${theme2.colors.border}`,
+            boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
+            display: "flex",
+            gap: "2px",
+            zIndex: 1e3
+          },
+          onClick: (e) => e.stopPropagation(),
+          children: REACTION_ORDER.map((type) => {
+            var _a;
+            const viewerReacted = !!((_a = reactions.viewerReactions) == null ? void 0 : _a[type]);
+            return /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: (e) => {
+                  e.stopPropagation();
+                  handlePickerSelect(type);
+                },
+                style: {
+                  padding: "4px",
+                  borderRadius: "4px",
+                  backgroundColor: viewerReacted ? `${theme2.colors.primary}20` : "transparent",
+                  border: "none",
+                  cursor: "pointer",
+                  fontSize: "16px",
+                  transition: "transform 0.2s"
+                },
+                title: type,
+                onMouseEnter: (e) => {
+                  e.currentTarget.style.transform = "scale(1.25)";
+                },
+                onMouseLeave: (e) => {
+                  e.currentTarget.style.transform = "scale(1)";
+                },
+                children: REACTION_EMOJI[type]
+              },
+              type
+            );
+          })
+        }
+      )
+    ] })
+  ] });
 };
-const CommentEvent = ({ event }) => {
+const CommentEvent = ({ event, onToggleReaction, getMergedReactions }) => {
   const { theme: theme2 } = useTheme();
   const user = event.user || event.actor;
+  const containerRef = useRef(null);
+  const [isLargeView, setIsLargeView] = useState(true);
+  useEffect(() => {
+    const checkWidth = () => {
+      if (containerRef.current) {
+        setIsLargeView(containerRef.current.offsetWidth >= 400);
+      }
+    };
+    checkWidth();
+    window.addEventListener("resize", checkWidth);
+    return () => window.removeEventListener("resize", checkWidth);
+  }, []);
+  const mergedReactions = getMergedReactions ? getMergedReactions(event.id, "comment", event.reactions) : event.reactions;
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ref: containerRef,
       style: {
-        display: "flex",
-        gap: "12px",
         padding: "16px",
         borderBottom: `1px solid ${theme2.colors.border}`
       },
       children: [
-        /* @__PURE__ */ jsx(Avatar, { user }),
-        /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: "8px",
-                marginBottom: "8px"
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontWeight: 600,
-                      color: theme2.colors.text,
-                      fontFamily: theme2.fonts.body,
-                      fontSize: theme2.fontSizes[1]
-                    },
-                    children: user.login
-                  }
-                ),
-                /* @__PURE__ */ jsxs(
-                  "span",
-                  {
-                    style: {
-                      fontFamily: theme2.fonts.body,
-                      color: theme2.colors.textMuted,
-                      fontSize: theme2.fontSizes[0]
-                    },
-                    children: [
-                      "commented ",
-                      formatDate(event.created_at)
-                    ]
-                  }
-                ),
-                event.author_association && event.author_association !== "NONE" && /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      padding: "2px 6px",
-                      borderRadius: "4px",
-                      backgroundColor: theme2.colors.backgroundSecondary,
-                      border: `1px solid ${theme2.colors.border}`,
-                      fontFamily: theme2.fonts.body,
-                      fontSize: theme2.fontSizes[0],
-                      color: theme2.colors.textSecondary,
-                      textTransform: "uppercase"
-                    },
-                    children: event.author_association.toLowerCase()
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                backgroundColor: theme2.colors.backgroundSecondary,
-                border: `1px solid ${theme2.colors.border}`,
-                borderRadius: "8px",
-                overflow: "hidden"
-              },
-              children: /* @__PURE__ */ jsx(
-                DocumentView,
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              gap: "12px",
+              alignItems: "center",
+              marginBottom: "8px"
+            },
+            children: [
+              /* @__PURE__ */ jsx(Avatar, { user }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    flex: 1,
+                    minWidth: 0
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontWeight: 600,
+                          color: theme2.colors.text,
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1]
+                        },
+                        children: user.login
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: theme2.fonts.body,
+                          color: theme2.colors.textMuted,
+                          fontSize: theme2.fontSizes[0]
+                        },
+                        children: [
+                          "commented ",
+                          formatDate(event.created_at)
+                        ]
+                      }
+                    ),
+                    event.author_association && event.author_association !== "NONE" && /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          padding: "2px 6px",
+                          borderRadius: "4px",
+                          backgroundColor: theme2.colors.backgroundSecondary,
+                          border: `1px solid ${theme2.colors.border}`,
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[0],
+                          color: theme2.colors.textSecondary,
+                          textTransform: "uppercase"
+                        },
+                        children: event.author_association.toLowerCase()
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              marginLeft: isLargeView ? "44px" : "0"
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    backgroundColor: theme2.colors.backgroundSecondary,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: "8px",
+                    overflow: "hidden"
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    DocumentView,
+                    {
+                      content: event.body,
+                      theme: theme2,
+                      maxWidth: "100%",
+                      transparentBackground: true
+                    }
+                  )
+                }
+              ),
+              mergedReactions && /* @__PURE__ */ jsx(
+                ReactionBar,
                 {
-                  content: event.body,
-                  theme: theme2,
-                  maxWidth: "100%",
-                  transparentBackground: true
+                  reactions: mergedReactions,
+                  onToggleReaction: onToggleReaction ? (type, reactionId) => onToggleReaction(event.id, "comment", type, reactionId) : void 0
                 }
               )
-            }
-          ),
-          event.reactions && /* @__PURE__ */ jsx(ReactionsDisplay, { reactions: event.reactions })
-        ] })
+            ]
+          }
+        )
       ]
     }
   );
 };
 const ReviewEvent = ({ event }) => {
   const { theme: theme2 } = useTheme();
+  const containerRef = useRef(null);
+  const [isLargeView, setIsLargeView] = useState(true);
+  useEffect(() => {
+    const checkWidth = () => {
+      if (containerRef.current) {
+        setIsLargeView(containerRef.current.offsetWidth >= 400);
+      }
+    };
+    checkWidth();
+    window.addEventListener("resize", checkWidth);
+    return () => window.removeEventListener("resize", checkWidth);
+  }, []);
   const stateConfig = {
     approved: {
       icon: /* @__PURE__ */ jsx(Check, { size: 16 }),
@@ -50299,85 +50673,104 @@ const ReviewEvent = ({ event }) => {
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ref: containerRef,
       style: {
-        display: "flex",
-        gap: "12px",
         padding: "16px",
         borderBottom: `1px solid ${theme2.colors.border}`
       },
       children: [
-        /* @__PURE__ */ jsx(Avatar, { user: event.user }),
-        /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: "8px",
-                marginBottom: event.body ? "8px" : 0
-              },
-              children: [
-                /* @__PURE__ */ jsx("span", { style: { color: config.color }, children: config.icon }),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontWeight: 600,
-                      color: theme2.colors.text,
-                      fontFamily: theme2.fonts.body,
-                      fontSize: theme2.fontSizes[1]
-                    },
-                    children: event.user.login
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontFamily: theme2.fonts.body,
-                      color: config.color,
-                      fontWeight: 500,
-                      fontSize: theme2.fontSizes[1]
-                    },
-                    children: config.label
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontFamily: theme2.fonts.body,
-                      color: theme2.colors.textMuted,
-                      fontSize: theme2.fontSizes[0]
-                    },
-                    children: formatDate(event.submitted_at)
-                  }
-                )
-              ]
-            }
-          ),
-          event.body && /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                backgroundColor: theme2.colors.backgroundSecondary,
-                border: `1px solid ${theme2.colors.border}`,
-                borderRadius: "8px",
-                overflow: "hidden"
-              },
-              children: /* @__PURE__ */ jsx(
-                DocumentView,
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              gap: "12px",
+              alignItems: "center",
+              marginBottom: event.body ? "8px" : 0
+            },
+            children: [
+              /* @__PURE__ */ jsx(Avatar, { user: event.user }),
+              /* @__PURE__ */ jsxs(
+                "div",
                 {
-                  content: event.body,
-                  theme: theme2,
-                  maxWidth: "100%",
-                  transparentBackground: true
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    flex: 1,
+                    minWidth: 0
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx("span", { style: { color: config.color }, children: config.icon }),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontWeight: 600,
+                          color: theme2.colors.text,
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1]
+                        },
+                        children: event.user.login
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: theme2.fonts.body,
+                          color: config.color,
+                          fontWeight: 500,
+                          fontSize: theme2.fontSizes[1]
+                        },
+                        children: config.label
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: theme2.fonts.body,
+                          color: theme2.colors.textMuted,
+                          fontSize: theme2.fontSizes[0]
+                        },
+                        children: formatDate(event.submitted_at)
+                      }
+                    )
+                  ]
                 }
               )
-            }
-          )
-        ] })
+            ]
+          }
+        ),
+        event.body && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              marginLeft: isLargeView ? "44px" : "0"
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: {
+                  backgroundColor: theme2.colors.backgroundSecondary,
+                  border: `1px solid ${theme2.colors.border}`,
+                  borderRadius: "8px",
+                  overflow: "hidden"
+                },
+                children: /* @__PURE__ */ jsx(
+                  DocumentView,
+                  {
+                    content: event.body,
+                    theme: theme2,
+                    maxWidth: "100%",
+                    transparentBackground: true
+                  }
+                )
+              }
+            )
+          }
+        )
       ]
     }
   );
@@ -50398,7 +50791,7 @@ const CommitEvent = ({ event }) => {
         gap: "12px",
         padding: "12px 16px",
         borderBottom: `1px solid ${theme2.colors.border}`,
-        backgroundColor: theme2.colors.background
+        backgroundColor: theme2.colors.backgroundSecondary
       },
       children: [
         /* @__PURE__ */ jsx(
@@ -50683,123 +51076,171 @@ const RefEvent = ({ event }) => {
     }
   );
 };
-const InlineReviewComment = ({ comment: comment2 }) => {
+const InlineReviewComment = ({ comment: comment2, onToggleReaction, getMergedReactions }) => {
   const { theme: theme2 } = useTheme();
+  const containerRef = useRef(null);
+  const [isLargeView, setIsLargeView] = useState(true);
+  useEffect(() => {
+    const checkWidth = () => {
+      if (containerRef.current) {
+        setIsLargeView(containerRef.current.offsetWidth >= 400);
+      }
+    };
+    checkWidth();
+    window.addEventListener("resize", checkWidth);
+    return () => window.removeEventListener("resize", checkWidth);
+  }, []);
+  const mergedReactions = getMergedReactions ? getMergedReactions(comment2.id, "review_comment", comment2.reactions) : comment2.reactions;
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      ref: containerRef,
       style: {
-        display: "flex",
-        gap: "12px",
         padding: "12px 16px",
         borderBottom: `1px solid ${theme2.colors.border}`,
         backgroundColor: theme2.colors.backgroundSecondary
       },
       children: [
-        /* @__PURE__ */ jsx(Avatar, { user: comment2.user, size: 28 }),
-        /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                display: "flex",
-                alignItems: "center",
-                gap: "8px",
-                marginBottom: "8px"
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontFamily: theme2.fonts.body,
-                      fontWeight: 600,
-                      color: theme2.colors.text,
-                      fontSize: theme2.fontSizes[0]
-                    },
-                    children: comment2.user.login
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontFamily: theme2.fonts.body,
-                      color: theme2.colors.textMuted,
-                      fontSize: theme2.fontSizes[0]
-                    },
-                    children: "on"
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "code",
-                  {
-                    style: {
-                      padding: "2px 6px",
-                      borderRadius: "4px",
-                      backgroundColor: theme2.colors.background,
-                      fontFamily: theme2.fonts.monospace,
-                      fontSize: "11px",
-                      color: theme2.colors.primary
-                    },
-                    children: comment2.path
-                  }
-                ),
-                comment2.line && /* @__PURE__ */ jsxs("span", { style: { fontFamily: theme2.fonts.body, fontSize: theme2.fontSizes[0], color: theme2.colors.textSecondary }, children: [
-                  "line ",
-                  comment2.line
-                ] })
-              ]
-            }
-          ),
-          comment2.diff_hunk && /* @__PURE__ */ jsx(
-            "pre",
-            {
-              style: {
-                margin: "0 0 8px 0",
-                padding: "8px",
-                backgroundColor: theme2.colors.background,
-                border: `1px solid ${theme2.colors.border}`,
-                borderRadius: "6px",
-                fontFamily: theme2.fonts.monospace,
-                fontSize: "11px",
-                color: theme2.colors.textSecondary,
-                overflow: "auto",
-                maxHeight: "100px"
-              },
-              children: comment2.diff_hunk
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                backgroundColor: theme2.colors.background,
-                border: `1px solid ${theme2.colors.border}`,
-                borderRadius: "6px",
-                overflow: "hidden"
-              },
-              children: /* @__PURE__ */ jsx(
-                DocumentView,
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              gap: "12px",
+              alignItems: "center",
+              marginBottom: "8px"
+            },
+            children: [
+              /* @__PURE__ */ jsx(Avatar, { user: comment2.user, size: 28 }),
+              /* @__PURE__ */ jsxs(
+                "div",
                 {
-                  content: comment2.body,
-                  theme: theme2,
-                  maxWidth: "100%",
-                  transparentBackground: true
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    flex: 1,
+                    minWidth: 0
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: theme2.fonts.body,
+                          fontWeight: 600,
+                          color: theme2.colors.text,
+                          fontSize: theme2.fontSizes[0]
+                        },
+                        children: comment2.user.login
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: theme2.fonts.body,
+                          color: theme2.colors.textMuted,
+                          fontSize: theme2.fontSizes[0]
+                        },
+                        children: "on"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "code",
+                      {
+                        style: {
+                          padding: "2px 6px",
+                          borderRadius: "4px",
+                          backgroundColor: theme2.colors.background,
+                          fontFamily: theme2.fonts.monospace,
+                          fontSize: "11px",
+                          color: theme2.colors.primary
+                        },
+                        children: comment2.path
+                      }
+                    ),
+                    comment2.line && /* @__PURE__ */ jsxs("span", { style: { fontFamily: theme2.fonts.body, fontSize: theme2.fontSizes[0], color: theme2.colors.textSecondary }, children: [
+                      "line ",
+                      comment2.line
+                    ] })
+                  ]
                 }
               )
-            }
-          ),
-          comment2.reactions && /* @__PURE__ */ jsx(ReactionsDisplay, { reactions: comment2.reactions })
-        ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              marginLeft: isLargeView ? "40px" : "0"
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    backgroundColor: theme2.colors.background,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: "6px",
+                    overflow: "hidden",
+                    marginBottom: comment2.diff_hunk ? "8px" : 0
+                  },
+                  children: /* @__PURE__ */ jsx(
+                    DocumentView,
+                    {
+                      content: comment2.body,
+                      theme: theme2,
+                      maxWidth: "100%",
+                      transparentBackground: true
+                    }
+                  )
+                }
+              ),
+              comment2.diff_hunk && /* @__PURE__ */ jsx(
+                "pre",
+                {
+                  style: {
+                    margin: 0,
+                    padding: "8px",
+                    backgroundColor: theme2.colors.background,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: "6px",
+                    fontFamily: theme2.fonts.monospace,
+                    fontSize: "11px",
+                    color: theme2.colors.textSecondary,
+                    overflow: "auto",
+                    maxHeight: "100px"
+                  },
+                  children: comment2.diff_hunk
+                }
+              ),
+              mergedReactions && /* @__PURE__ */ jsx(
+                ReactionBar,
+                {
+                  reactions: mergedReactions,
+                  onToggleReaction: onToggleReaction ? (type, reactionId) => onToggleReaction(comment2.id, "review_comment", type, reactionId) : void 0
+                }
+              )
+            ]
+          }
+        )
       ]
     }
   );
 };
-const TimelineEventRenderer = ({ event }) => {
+const TimelineEventRenderer = ({ event, onToggleReaction, getMergedReactions }) => {
   switch (event.event) {
     case "commented":
-      return /* @__PURE__ */ jsx(CommentEvent, { event });
+      return /* @__PURE__ */ jsx(
+        CommentEvent,
+        {
+          event,
+          onToggleReaction,
+          getMergedReactions
+        }
+      );
     case "reviewed":
       return /* @__PURE__ */ jsx(ReviewEvent, { event });
     case "committed":
@@ -50827,14 +51268,180 @@ const TimelineEventRenderer = ({ event }) => {
   }
 };
 const GitHubMessagesPanelContent = ({ context, events }) => {
+  var _a;
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
+  const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
+  const [localReactions, setLocalReactions] = useState({});
+  const [hiddenMessages, setHiddenMessages] = useState(() => {
+    if (typeof window !== "undefined") {
+      const stored = localStorage.getItem("github-messages-hidden");
+      return stored ? new Set(JSON.parse(stored)) : /* @__PURE__ */ new Set();
+    }
+    return /* @__PURE__ */ new Set();
+  });
+  const [showHiddenMessages, setShowHiddenMessages] = useState(false);
+  const [commentText, setCommentText] = useState("");
+  const [isSending, setIsSending] = useState(false);
+  const [sendError, setSendError] = useState(null);
+  const textareaRef = useRef(null);
+  const handleDelete2 = () => {
+    const messagesSlice2 = context.getSlice("github-messages");
+    const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
+    if ((messagesData2 == null ? void 0 : messagesData2.target) && events) {
+      const { target: target2, owner, repo } = messagesData2;
+      events.emit({
+        type: target2.type === "pull_request" ? "github-pr:delete" : "github-issue:delete",
+        source: "github-messages-panel",
+        timestamp: Date.now(),
+        payload: {
+          owner,
+          repo,
+          number: target2.number
+        }
+      });
+    }
+    setShowDeleteConfirm(false);
+  };
+  const handleToggleReaction = useCallback((itemId, itemType, reactionType, currentReactionId) => {
+    const messagesSlice2 = context.getSlice("github-messages");
+    const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
+    if (!(messagesData2 == null ? void 0 : messagesData2.target) || !events) return;
+    const { owner, repo, target: target2 } = messagesData2;
+    const key = `${itemType}-${itemId}`;
+    setLocalReactions((prev) => {
+      const current = prev[key] || {
+        url: "",
+        total_count: 0,
+        "+1": 0,
+        "-1": 0,
+        laugh: 0,
+        hooray: 0,
+        confused: 0,
+        heart: 0,
+        rocket: 0,
+        eyes: 0,
+        viewerReactions: {}
+      };
+      const updated = { ...current };
+      const viewerReactions = { ...updated.viewerReactions };
+      if (currentReactionId) {
+        updated[reactionType] = Math.max(0, (updated[reactionType] || 0) - 1);
+        updated.total_count = Math.max(0, updated.total_count - 1);
+        delete viewerReactions[reactionType];
+      } else {
+        updated[reactionType] = (updated[reactionType] || 0) + 1;
+        updated.total_count = (updated.total_count || 0) + 1;
+        viewerReactions[reactionType] = -1;
+      }
+      updated.viewerReactions = viewerReactions;
+      return { ...prev, [key]: updated };
+    });
+    if (currentReactionId) {
+      events.emit({
+        type: "github-messages:reaction:remove",
+        source: "github-messages-panel",
+        timestamp: Date.now(),
+        payload: {
+          owner,
+          repo,
+          targetType: target2.type,
+          targetNumber: target2.number,
+          itemType,
+          itemId,
+          reactionId: currentReactionId
+        }
+      });
+    } else {
+      events.emit({
+        type: "github-messages:reaction:add",
+        source: "github-messages-panel",
+        timestamp: Date.now(),
+        payload: {
+          owner,
+          repo,
+          targetType: target2.type,
+          targetNumber: target2.number,
+          itemType,
+          itemId,
+          reactionType
+        }
+      });
+      setHiddenMessages((prev) => {
+        const next2 = new Set(prev);
+        next2.add(key);
+        if (typeof window !== "undefined") {
+          localStorage.setItem("github-messages-hidden", JSON.stringify([...next2]));
+        }
+        return next2;
+      });
+    }
+  }, [context, events]);
+  const handleSendComment = useCallback(() => {
+    const messagesSlice2 = context.getSlice("github-messages");
+    const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
+    if (!events || !(messagesData2 == null ? void 0 : messagesData2.target) || !commentText.trim() || isSending) return;
+    const { owner, repo, target: target2 } = messagesData2;
+    setIsSending(true);
+    setSendError(null);
+    events.emit({
+      type: "github-messages:comment:create",
+      source: "github-messages-panel",
+      timestamp: Date.now(),
+      payload: {
+        owner,
+        repo,
+        targetType: target2.type,
+        targetNumber: target2.number,
+        body: commentText.trim()
+      }
+    });
+    setCommentText("");
+  }, [context, events, commentText, isSending]);
+  const getMergedReactions = useCallback((itemId, itemType, apiReactions) => {
+    const key = `${itemType}-${itemId}`;
+    const local = localReactions[key];
+    if (!apiReactions && !local) {
+      return {
+        url: "",
+        total_count: 0,
+        "+1": 0,
+        "-1": 0,
+        laugh: 0,
+        hooray: 0,
+        confused: 0,
+        heart: 0,
+        rocket: 0,
+        eyes: 0,
+        viewerReactions: {}
+      };
+    }
+    if (local) {
+      return local;
+    }
+    return {
+      ...apiReactions,
+      viewerReactions: {}
+    };
+  }, [localReactions]);
+  const getMergedTimeline = useCallback((timeline2, reviewComments2) => {
+    const merged = [
+      ...timeline2.map((event) => ({ type: "event", data: event })),
+      ...reviewComments2.map((comment2) => ({ type: "review_comment", data: comment2 }))
+    ];
+    merged.sort((a, b) => {
+      const timeA = a.type === "event" ? getEventTimestamp(a.data) : a.data.created_at;
+      const timeB = b.type === "event" ? getEventTimestamp(b.data) : b.data.created_at;
+      return new Date(timeA).getTime() - new Date(timeB).getTime();
+    });
+    return merged;
+  }, []);
   gt(
     "github-messages",
     events,
     () => {
-      var _a;
-      return (_a = panelRef.current) == null ? void 0 : _a.focus();
+      var _a2;
+      return (_a2 = panelRef.current) == null ? void 0 : _a2.focus();
     }
   );
   const messagesSlice = context.getSlice("github-messages");
@@ -50876,6 +51483,46 @@ const GitHubMessagesPanelContent = ({ context, events }) => {
       if (typeof unsubPR === "function") unsubPR();
     };
   }, [events]);
+  useEffect(() => {
+    if (textareaRef.current) {
+      const minHeight = 36;
+      const maxHeight = 200;
+      if (!commentText) {
+        textareaRef.current.style.height = `${minHeight}px`;
+        return;
+      }
+      textareaRef.current.style.height = `${minHeight}px`;
+      const scrollHeight = textareaRef.current.scrollHeight;
+      const newHeight = Math.min(Math.max(scrollHeight, minHeight), maxHeight);
+      textareaRef.current.style.height = `${newHeight}px`;
+    }
+  }, [commentText]);
+  useEffect(() => {
+    if (!events) return;
+    const messagesSlice2 = context.getSlice("github-messages");
+    const messagesData2 = messagesSlice2 == null ? void 0 : messagesSlice2.data;
+    const unsubscribers = [
+      events.on("github-messages:comment:created", (event) => {
+        const payload = event.payload;
+        if ((messagesData2 == null ? void 0 : messagesData2.target) && payload.targetNumber === messagesData2.target.number) {
+          setIsSending(false);
+          setSendError(null);
+        }
+      }),
+      events.on("github-messages:comment:error", (event) => {
+        const payload = event.payload;
+        if ((messagesData2 == null ? void 0 : messagesData2.target) && payload.targetNumber === messagesData2.target.number) {
+          setIsSending(false);
+          setSendError(payload.error);
+        }
+      })
+    ];
+    return () => {
+      unsubscribers.forEach((unsub) => {
+        if (typeof unsub === "function") unsub();
+      });
+    };
+  }, [events, context]);
   const containerStyle = {
     display: "flex",
     flexDirection: "column",
@@ -50976,30 +51623,128 @@ const GitHubMessagesPanelContent = ({ context, events }) => {
       "div",
       {
         style: {
-          height: "40px",
           minHeight: "40px",
-          padding: "0 12px",
+          padding: "8px 12px",
           borderBottom: `1px solid ${theme2.colors.border}`,
           backgroundColor: theme2.colors.backgroundSecondary,
           display: "flex",
           alignItems: "center",
-          gap: "12px",
-          boxSizing: "border-box"
+          gap: "8px",
+          boxSizing: "border-box",
+          flexWrap: "wrap"
         },
         children: [
-          /* @__PURE__ */ jsx(
-            "span",
+          target.labels && target.labels.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px", alignItems: "center", flexWrap: "wrap" }, children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                style: {
+                  fontFamily: theme2.fonts.body,
+                  fontSize: theme2.fontSizes[0],
+                  color: theme2.colors.textMuted,
+                  fontWeight: 500
+                },
+                children: "Tagged as"
+              }
+            ),
+            target.labels.map((label) => /* @__PURE__ */ jsx(
+              "span",
+              {
+                style: {
+                  padding: "2px 8px",
+                  borderRadius: "12px",
+                  backgroundColor: `#${label.color}`,
+                  color: parseInt(label.color, 16) > 8388607 ? "#000" : "#fff",
+                  fontFamily: theme2.fonts.body,
+                  fontSize: theme2.fontSizes[0],
+                  fontWeight: 500
+                },
+                children: label.name
+              },
+              label.id
+            ))
+          ] }),
+          target.assignees && target.assignees.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px", alignItems: "center", flexWrap: "wrap" }, children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                style: {
+                  fontFamily: theme2.fonts.body,
+                  fontSize: theme2.fontSizes[0],
+                  color: theme2.colors.textMuted,
+                  fontWeight: 500
+                },
+                children: "Assigned to"
+              }
+            ),
+            target.assignees.map((assignee) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  gap: "4px",
+                  padding: "2px 8px",
+                  borderRadius: "12px",
+                  backgroundColor: theme2.colors.backgroundSecondary,
+                  border: `1px solid ${theme2.colors.border}`
+                },
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "img",
+                    {
+                      src: assignee.avatar_url,
+                      alt: assignee.login,
+                      style: {
+                        width: 20,
+                        height: 20,
+                        borderRadius: "50%"
+                      }
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      style: {
+                        fontFamily: theme2.fonts.body,
+                        fontSize: theme2.fontSizes[0],
+                        color: theme2.colors.text,
+                        fontWeight: 500
+                      },
+                      children: assignee.login
+                    }
+                  )
+                ]
+              },
+              assignee.login
+            ))
+          ] }),
+          /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
+          hiddenMessages.size > 0 && /* @__PURE__ */ jsxs(
+            "button",
             {
+              type: "button",
+              onClick: () => setShowHiddenMessages(!showHiddenMessages),
+              title: showHiddenMessages ? "Hide reacted messages" : `Show ${hiddenMessages.size} hidden message${hiddenMessages.size > 1 ? "s" : ""}`,
               style: {
-                flex: 1,
-                overflow: "hidden",
-                textOverflow: "ellipsis",
-                whiteSpace: "nowrap",
-                fontFamily: theme2.fonts.heading,
-                color: theme2.colors.text,
-                fontSize: theme2.fontSizes[1]
+                display: "inline-flex",
+                alignItems: "center",
+                justifyContent: "center",
+                gap: "4px",
+                height: "28px",
+                padding: "0 8px",
+                border: `1px solid ${theme2.colors.border}`,
+                borderRadius: "6px",
+                backgroundColor: showHiddenMessages ? `${theme2.colors.primary}20` : theme2.colors.background,
+                color: showHiddenMessages ? theme2.colors.primary : theme2.colors.textSecondary,
+                cursor: "pointer",
+                fontSize: theme2.fontSizes[0],
+                fontFamily: theme2.fonts.body
               },
-              children: target.title
+              children: [
+                /* @__PURE__ */ jsx(EyeOff, { size: 14 }),
+                /* @__PURE__ */ jsx("span", { children: hiddenMessages.size })
+              ]
             }
           ),
           /* @__PURE__ */ jsx(
@@ -51047,32 +51792,335 @@ const GitHubMessagesPanelContent = ({ context, events }) => {
             },
             children: "No activity yet."
           }
-        ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          timeline.map((event, index2) => /* @__PURE__ */ jsx(TimelineEventRenderer, { event }, `${event.event}-${index2}`)),
-          reviewComments.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsxs(
-              "div",
+        ) : /* @__PURE__ */ jsx(Fragment, { children: getMergedTimeline(timeline, reviewComments).filter((item) => {
+          if (item.type === "event") {
+            const event = item.data;
+            if (!showHiddenMessages && event.event === "commented") {
+              const key = `comment-${event.id}`;
+              if (hiddenMessages.has(key)) return false;
+            }
+            if (event.event === "labeled" || event.event === "unlabeled") {
+              return false;
+            }
+            if (event.event === "assigned" || event.event === "unassigned") {
+              return false;
+            }
+            return true;
+          } else {
+            const comment2 = item.data;
+            if (!showHiddenMessages) {
+              const key = `review_comment-${comment2.id}`;
+              if (hiddenMessages.has(key)) return false;
+            }
+            return true;
+          }
+        }).map((item, index2) => {
+          if (item.type === "event") {
+            const event = item.data;
+            return /* @__PURE__ */ jsx(
+              TimelineEventRenderer,
               {
-                style: {
-                  padding: "12px 16px",
-                  backgroundColor: theme2.colors.backgroundSecondary,
-                  borderBottom: `1px solid ${theme2.colors.border}`,
-                  fontFamily: theme2.fonts.heading,
-                  fontWeight: 600,
-                  fontSize: theme2.fontSizes[0],
-                  color: theme2.colors.textSecondary,
-                  textTransform: "uppercase"
-                },
-                children: [
-                  "Inline Review Comments (",
-                  reviewComments.length,
-                  ")"
-                ]
-              }
-            ),
-            reviewComments.map((comment2) => /* @__PURE__ */ jsx(InlineReviewComment, { comment: comment2 }, comment2.id))
-          ] })
-        ] })
+                event,
+                onToggleReaction: handleToggleReaction,
+                getMergedReactions
+              },
+              `event-${event.event}-${index2}`
+            );
+          } else {
+            const comment2 = item.data;
+            return /* @__PURE__ */ jsx(
+              InlineReviewComment,
+              {
+                comment: comment2,
+                onToggleReaction: handleToggleReaction,
+                getMergedReactions
+              },
+              `review-comment-${comment2.id}`
+            );
+          }
+        }) })
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: {
+          borderTop: `1px solid ${theme2.colors.border}`,
+          backgroundColor: theme2.colors.background,
+          padding: "12px",
+          display: "flex",
+          flexDirection: "column",
+          gap: "8px"
+        },
+        children: [
+          sendError && /* @__PURE__ */ jsxs(
+            "div",
+            {
+              style: {
+                padding: "8px 12px",
+                backgroundColor: theme2.colors.error ? `${theme2.colors.error}20` : "#ef444420",
+                border: `1px solid ${theme2.colors.error || "#ef4444"}`,
+                borderRadius: "6px",
+                color: theme2.colors.error || "#ef4444",
+                fontSize: theme2.fontSizes[0],
+                fontFamily: theme2.fonts.body,
+                display: "flex",
+                alignItems: "center",
+                gap: "8px"
+              },
+              children: [
+                /* @__PURE__ */ jsx(CircleAlert, { size: 14 }),
+                /* @__PURE__ */ jsx("span", { children: sendError }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setSendError(null),
+                    style: {
+                      marginLeft: "auto",
+                      background: "none",
+                      border: "none",
+                      cursor: "pointer",
+                      color: "inherit",
+                      padding: "2px"
+                    },
+                    children: /* @__PURE__ */ jsx(X, { size: 14 })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              style: {
+                display: "flex",
+                gap: "8px",
+                alignItems: "flex-end"
+              },
+              children: [
+                /* @__PURE__ */ jsx(
+                  "textarea",
+                  {
+                    ref: textareaRef,
+                    value: commentText,
+                    onChange: (e) => setCommentText(e.target.value),
+                    onKeyDown: (e) => {
+                      if ((e.metaKey || e.ctrlKey) && e.key === "Enter") {
+                        e.preventDefault();
+                        handleSendComment();
+                      }
+                    },
+                    placeholder: "Write a comment",
+                    disabled: isSending,
+                    "aria-label": "Write a comment",
+                    style: {
+                      flex: 1,
+                      height: "36px",
+                      maxHeight: "200px",
+                      padding: "8px 12px",
+                      border: `1px solid ${theme2.colors.border}`,
+                      borderRadius: "6px",
+                      backgroundColor: isSending ? theme2.colors.backgroundSecondary : theme2.colors.background,
+                      color: theme2.colors.text,
+                      fontFamily: theme2.fonts.body,
+                      fontSize: theme2.fontSizes[1],
+                      lineHeight: 1.5,
+                      resize: "none",
+                      outline: "none",
+                      transition: "border-color 0.2s",
+                      overflow: "hidden",
+                      boxSizing: "border-box"
+                    },
+                    onFocus: (e) => {
+                      e.currentTarget.style.borderColor = theme2.colors.primary;
+                    },
+                    onBlur: (e) => {
+                      e.currentTarget.style.borderColor = theme2.colors.border;
+                    }
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: handleSendComment,
+                    disabled: !commentText.trim() || isSending,
+                    "aria-label": "Send comment",
+                    title: isSending ? "Sending..." : "Send comment (Cmd/Ctrl+Enter)",
+                    style: {
+                      padding: "12px 20px",
+                      border: "none",
+                      borderRadius: "6px",
+                      backgroundColor: !commentText.trim() || isSending ? theme2.colors.backgroundSecondary : theme2.colors.primary,
+                      color: !commentText.trim() || isSending ? theme2.colors.textMuted : theme2.colors.textOnPrimary || "#ffffff",
+                      cursor: !commentText.trim() || isSending ? "not-allowed" : "pointer",
+                      fontFamily: theme2.fonts.body,
+                      fontSize: theme2.fontSizes[1],
+                      fontWeight: ((_a = theme2.fontWeights) == null ? void 0 : _a.medium) || 500,
+                      display: "flex",
+                      alignItems: "center",
+                      gap: "8px",
+                      transition: "background-color 0.2s",
+                      opacity: !commentText.trim() || isSending ? 0.5 : 1
+                    },
+                    children: isSending ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      /* @__PURE__ */ jsx(LoaderCircle, { size: 16, style: { animation: "spin 1s linear infinite" } }),
+                      "Sending..."
+                    ] }) : "Send"
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    ),
+    showDeleteConfirm && /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          position: "absolute",
+          top: 0,
+          left: 0,
+          right: 0,
+          bottom: 0,
+          backgroundColor: "rgba(0, 0, 0, 0.5)",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          zIndex: 1e3
+        },
+        onClick: () => setShowDeleteConfirm(false),
+        children: /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              backgroundColor: theme2.colors.background,
+              border: `1px solid ${theme2.colors.border}`,
+              borderRadius: "8px",
+              padding: "24px",
+              minWidth: "320px",
+              maxWidth: "400px",
+              boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)"
+            },
+            onClick: (e) => e.stopPropagation(),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "12px",
+                    marginBottom: "16px"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        style: {
+                          width: "40px",
+                          height: "40px",
+                          borderRadius: "50%",
+                          backgroundColor: theme2.colors.error ? `${theme2.colors.error}20` : "#ef444420",
+                          display: "flex",
+                          alignItems: "center",
+                          justifyContent: "center",
+                          color: theme2.colors.error || "#ef4444"
+                        },
+                        children: /* @__PURE__ */ jsx(Trash2, { size: 20 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      "h3",
+                      {
+                        style: {
+                          margin: 0,
+                          fontFamily: theme2.fonts.heading,
+                          fontSize: theme2.fontSizes[2],
+                          fontWeight: 600,
+                          color: theme2.colors.text
+                        },
+                        children: [
+                          "Delete ",
+                          target.type === "pull_request" ? "Pull Request" : "Issue",
+                          "?"
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "p",
+                {
+                  style: {
+                    margin: "0 0 24px 0",
+                    fontFamily: theme2.fonts.body,
+                    fontSize: theme2.fontSizes[1],
+                    color: theme2.colors.textSecondary,
+                    lineHeight: 1.5
+                  },
+                  children: [
+                    'Are you sure you want to delete "',
+                    target.title,
+                    '"? This action cannot be undone.'
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    gap: "12px",
+                    justifyContent: "flex-end"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: () => setShowDeleteConfirm(false),
+                        style: {
+                          padding: "8px 16px",
+                          border: `1px solid ${theme2.colors.border}`,
+                          borderRadius: "6px",
+                          backgroundColor: theme2.colors.background,
+                          color: theme2.colors.text,
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1],
+                          cursor: "pointer"
+                        },
+                        children: "Cancel"
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: handleDelete2,
+                        style: {
+                          padding: "8px 16px",
+                          border: "none",
+                          borderRadius: "6px",
+                          backgroundColor: theme2.colors.error || "#ef4444",
+                          color: "#ffffff",
+                          fontFamily: theme2.fonts.body,
+                          fontSize: theme2.fontSizes[1],
+                          fontWeight: 500,
+                          cursor: "pointer"
+                        },
+                        children: "Delete"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        )
       }
     )
   ] });