@flamingo-stack/openframe-frontend-core 0.0.764 → 0.0.766

package/dist/components/ui/incident-feed.js

@@ -12,73 +12,74 @@ const INCIDENT_TONE = {
 function IncidentStatusLine({ status, label, className }) {
   return /* @__PURE__ */ jsx(StatusLine, { tone: INCIDENT_TONE[status], label, className });
 }
+const FEED_CLASS = "flex min-h-0 flex-1 flex-col gap-3 overflow-hidden p-4 md:px-5";
+const FEED_BOTTOM_CLASS = "justify-end [mask-image:linear-gradient(180deg,transparent_0,#000_48px)]";
+const OPEN_ITEM_CLASS = "flex flex-col gap-1.5 rounded-md border border-ods-border bg-ods-bg px-4 py-3.5";
+const META_CLASS = "flex items-center justify-between gap-3";
+const SOURCE_TAG_CLASS = "inline-flex shrink-0 rounded-md border border-ods-border px-2 py-1 text-ods-text-secondary text-h5";
 function SourceTag({ children }) {
-  return /* @__PURE__ */ jsx("span", { className: "inline-flex shrink-0 rounded-md border border-ods-border px-2 py-1 text-ods-text-secondary text-h5", children });
+  return /* @__PURE__ */ jsx("span", { className: SOURCE_TAG_CLASS, children });
 }
 function ItemMeta({ item }) {
   if (!item.source && !item.time) return null;
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+  return /* @__PURE__ */ jsxs("div", { className: META_CLASS, children: [
     item.source ? /* @__PURE__ */ jsx(SourceTag, { children: item.source }) : /* @__PURE__ */ jsx("span", {}),
     item.time && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-ods-text-secondary text-h6", children: item.time })
   ] });
 }
-function IncidentFeed({ items, statusLabels, emptyLabel, anchor = "top", className }) {
+function IncidentFeed({
+  items,
+  statusLabels,
+  emptyLabel,
+  anchor = "top",
+  className
+}) {
   const lastIndex = items.length - 1;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: cn(
-        "flex min-h-0 flex-1 flex-col gap-3 overflow-hidden p-4 md:px-5",
-        anchor === "bottom" && "justify-end [mask-image:linear-gradient(180deg,transparent_0,#000_48px)]",
-        className
-      ),
-      children: [
-        items.length === 0 && emptyLabel && /* @__PURE__ */ jsx(AnalyzingState, { label: emptyLabel, className: "m-auto" }),
-        items.map((item, index) => {
-          const open = index === lastIndex || item.status === "waiting";
-          if (!open) {
-            return /* @__PURE__ */ jsxs(
-              "div",
+  return /* @__PURE__ */ jsxs("div", { className: cn(FEED_CLASS, anchor === "bottom" && FEED_BOTTOM_CLASS, className), children: [
+    items.length === 0 && emptyLabel && /* @__PURE__ */ jsx(AnalyzingState, { label: emptyLabel, className: "m-auto" }),
+    items.map((item, index) => {
+      const open = index === lastIndex || item.status === "waiting";
+      if (!open) {
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex flex-col gap-2 rounded-md border border-ods-border bg-ods-bg px-3.5 py-2.5",
+            children: [
+              /* @__PURE__ */ jsx(ItemMeta, { item }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+                /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-ods-text-primary text-h4", children: item.title }),
+                /* @__PURE__ */ jsx(IncidentStatusLine, { status: item.status, label: statusLabels[item.status] })
+              ] })
+            ]
+          },
+          item.id
+        );
+      }
+      return /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: cn(OPEN_ITEM_CLASS, "duration-300 animate-in fade-in motion-reduce:animate-none"),
+          children: [
+            /* @__PURE__ */ jsx(ItemMeta, { item }),
+            /* @__PURE__ */ jsxs("span", { className: "flex items-start gap-2.5", children: [
+              item.avatar,
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 text-ods-text-primary text-h4", children: item.title })
+            ] }),
+            item.detail && /* @__PURE__ */ jsx(
+              "p",
               {
-                className: "flex flex-col gap-2 rounded-md border border-ods-border bg-ods-bg px-3.5 py-2.5",
-                children: [
-                  /* @__PURE__ */ jsx(ItemMeta, { item }),
-                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
-                    /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-ods-text-primary text-h4", children: item.title }),
-                    /* @__PURE__ */ jsx(IncidentStatusLine, { status: item.status, label: statusLabels[item.status] })
-                  ] })
-                ]
+                className: "m-0 text-ods-text-secondary duration-300 animate-in fade-in text-h4 motion-reduce:animate-none",
+                children: item.detail
               },
-              item.id
-            );
-          }
-          return /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "flex flex-col gap-1.5 rounded-md border border-ods-border bg-ods-bg px-4 py-3.5 duration-300 animate-in fade-in motion-reduce:animate-none",
-              children: [
-                /* @__PURE__ */ jsx(ItemMeta, { item }),
-                /* @__PURE__ */ jsxs("span", { className: "flex items-start gap-2.5", children: [
-                  item.avatar,
-                  /* @__PURE__ */ jsx("span", { className: "min-w-0 text-ods-text-primary text-h4", children: item.title })
-                ] }),
-                item.detail && /* @__PURE__ */ jsx(
-                  "p",
-                  {
-                    className: "m-0 text-ods-text-secondary duration-300 animate-in fade-in text-h4 motion-reduce:animate-none",
-                    children: item.detail
-                  },
-                  item.status
-                ),
-                /* @__PURE__ */ jsx(IncidentStatusLine, { status: item.status, label: statusLabels[item.status] })
-              ]
-            },
-            item.id
-          );
-        })
-      ]
-    }
-  );
+              item.status
+            ),
+            /* @__PURE__ */ jsx(IncidentStatusLine, { status: item.status, label: statusLabels[item.status] })
+          ]
+        },
+        item.id
+      );
+    })
+  ] });
 }
 export {
   IncidentFeed,