@cccsaurora/clue-ui 1.0.1 → 1.1.0-dev.10

package/components/AnnotationDetails.js

@@ -1,157 +1,23 @@
-import { jsxs as n, jsx as i } from "react/jsx-runtime";
-import { I as E } from "../iconify-BBckr5AQ.js";
-import { useTheme as M, Stack as l, Typography as s, Tooltip as x, Box as z, IconButton as A, CircularProgress as N, Chip as S, Accordion as $, AccordionSummary as j, AccordionDetails as _, Divider as u } from "@mui/material";
-import g from "./display/icons/Iconified.js";
-import { SNACKBAR_EVENT_ID as O } from "../data/event.js";
-import { ClueComponentContext as F } from "../hooks/ClueComponentContext.js";
-import { useClueEnrichSelector as H } from "../hooks/selectors.js";
-import K from "../hooks/useAnnotations.js";
-import L from "../hooks/useErrors.js";
-import { ICON_MAP as T } from "../icons/iconMap.js";
-import { safeDispatchEvent as U } from "../utils/window.js";
-import { memo as V, useState as W, useMemo as k, useCallback as G, useEffect as J } from "react";
-import { u as P } from "../index-E7g8cRyW.js";
-import Q from "./actions/ExecutePopover.js";
-import X from "./AnnotationEntry.js";
-import Y from "./ClassificationChip.js";
-import Z from "./enrichment/EnrichPopover.js";
-import { u as q } from "../ClueEnrichContext-CbJVBm4w.js";
-import { g as R } from "../groupBy-BheQYl6f.js";
-import { i as w } from "../isUndefined-DiNCDKoz.js";
-const ii = ({ enrichRequest: o, setReady: d, updatePosition: p }) => {
-  const v = M(), { t: c } = P(F, (a) => a.i18next), [r, I] = W("all"), y = H((a) => a.enrich), [t, C] = K(
-    o == null ? void 0 : o.type,
-    o == null ? void 0 : o.value,
-    o == null ? void 0 : o.classification,
-    { skipEnrichment: !0 }
-  ), m = L(o == null ? void 0 : o.value), B = k(
-    () => ["all", ...q((t ?? []).map((a) => a.type))],
-    [t]
-  ), b = k(() => R(t ?? [], "type"), [t]), h = G(async () => {
-    await y(o.type, o.value, {
-      classification: o.classification,
-      timeout: 15,
-      force: !0
-    });
-  }, [o, y]);
-  return J(() => {
-    d && (d(o && !w(t)), p == null || p());
-  }, [t, o, d, p]), o && !w(t) && /* @__PURE__ */ n(l, { direction: "column", sx: { p: 1, width: "100%" }, spacing: 1, children: [
-    /* @__PURE__ */ n(l, { spacing: 1, children: [
-      /* @__PURE__ */ n(l, { direction: "row", spacing: 1, children: [
-        /* @__PURE__ */ n(l, { children: [
-          /* @__PURE__ */ n(l, { direction: "row", spacing: 1, children: [
-            /* @__PURE__ */ i(s, { variant: "body1", fontWeight: "bold", children: "Clue" }),
-            o.classification && /* @__PURE__ */ i(Y, { size: "small", classification: o.classification })
-          ] }),
-          /* @__PURE__ */ n(s, { variant: "caption", color: "text.secondary", children: [
-            o.type.toLocaleUpperCase(),
-            " ",
-            c("enrichment")
-          ] })
-        ] }),
-        /* @__PURE__ */ i("div", { style: { flex: 1 } }),
-        /* @__PURE__ */ i(x, { title: c("refresh"), children: /* @__PURE__ */ i(z, { sx: { alignSelf: "center", m: -1 }, children: /* @__PURE__ */ i(A, { onClick: () => h(), disabled: C, children: C ? /* @__PURE__ */ i(N, { variant: "indeterminate", size: 20 }) : /* @__PURE__ */ i(g, { icon: "ic:baseline-replay", fontSize: "small" }) }) }) }),
-        /* @__PURE__ */ i(x, { title: c("clipboard"), children: /* @__PURE__ */ i(
-          A,
-          {
-            sx: { alignSelf: "center", m: -1 },
-            onClick: () => {
-              navigator.clipboard.writeText(o.value), U(
-                new CustomEvent(O, {
-                  detail: {
-                    message: `${o.value} ${c("clipboard.success")}`,
-                    level: "success"
-                  }
-                })
-              );
-            },
-            children: /* @__PURE__ */ i(g, { icon: "ic:outline-assignment", fontSize: "small" })
-          }
-        ) }),
-        /* @__PURE__ */ i(Z, { selector: o }),
-        /* @__PURE__ */ i(Q, { selectors: [o] })
-      ] }),
-      /* @__PURE__ */ n(l, { direction: "row", spacing: 0.5, children: [
-        B.map((a, e) => /* @__PURE__ */ i(
-          S,
-          {
-            size: "small",
-            variant: a === r ? "filled" : "outlined",
-            icon: T[a] && /* @__PURE__ */ i(E, { icon: T[a] }),
-            label: /* @__PURE__ */ n(s, { variant: "caption", textTransform: "capitalize", children: [
-              a,
-              ":",
-              " ",
-              a === "all" ? t.length : t.filter((f) => f.type === a).length
-            ] }),
-            onClick: () => I(a)
-          },
-          e
-        )),
-        (m == null ? void 0 : m.length) > 0 && /* @__PURE__ */ i(
-          x,
-          {
-            title: /* @__PURE__ */ i("div", { onClick: (a) => a.stopPropagation(), children: m.map((a, e) => /* @__PURE__ */ n("div", { children: [
-              /* @__PURE__ */ i("span", { style: { textTransform: "capitalize" }, children: a.source.replace(/-/g, " ") }),
-              ":",
-              " ",
-              a.message
-            ] }, e)) }),
-            children: /* @__PURE__ */ i(
-              S,
-              {
-                size: "small",
-                variant: "outlined",
-                icon: /* @__PURE__ */ i(E, { icon: "material-symbols:timer-outline", color: v.palette.error.main }),
-                label: /* @__PURE__ */ n(s, { variant: "caption", textTransform: "capitalize", children: [
-                  c("annotation.failed"),
-                  ": ",
-                  m.length
-                ] }),
-                onClick: h
-              }
-            )
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ i(z, {}),
-    Object.keys(b).filter((a) => !r || r === "all" || a === r).map((a, e) => /* @__PURE__ */ n(
-      $,
-      {
-        defaultExpanded: !0,
-        sx: {
-          marginTop: `${v.spacing(1)} !important`,
-          marginBottom: "0 !important",
-          "&:before": { height: 0 }
-        },
-        children: [
-          r === "all" && /* @__PURE__ */ i(
-            j,
-            {
-              expandIcon: /* @__PURE__ */ i(g, { icon: "ic:baseline-arrow-drop-down" }),
-              sx: {
-                minHeight: "initial !important",
-                mt: 0.5,
-                mb: 0,
-                px: 1,
-                "& .MuiAccordionSummary-content": { my: 0.5, mx: 0 },
-                "& .MuiAccordionSummary-content.Mui-expanded": { my: 0.5, mx: 0 }
-              },
-              children: /* @__PURE__ */ i(s, { variant: "body1", textTransform: "capitalize", children: a }, a)
-            }
-          ),
-          /* @__PURE__ */ n(_, { sx: { px: 1 }, children: [
-            r === "all" && /* @__PURE__ */ i(u, { orientation: "horizontal", sx: { mb: 1 } }),
-            /* @__PURE__ */ i(l, { spacing: 1, divider: /* @__PURE__ */ i(u, { orientation: "horizontal", flexItem: !0 }), children: b[a].map((f, D) => /* @__PURE__ */ i(X, { annotation: f }, D)) })
-          ] })
-        ]
-      },
-      e
-    ))
-  ] });
-}, Ei = V(ii);
+import "react/jsx-runtime";
+import "../iconify-CXMreGTg.js";
+import "@mui/material";
+import "./display/icons/Iconified.js";
+import "../data/event.js";
+import "../hooks/ClueComponentContext.js";
+import "../hooks/selectors.js";
+import "../hooks/useAnnotations.js";
+import "../hooks/useErrors.js";
+import "../icons/iconMap.js";
+import "../utils/window.js";
+import "../groupBy-DC2oOuBN.js";
+import { A } from "../AnnotationDetails-YAPoqw3R.js";
+import "../ClueEnrichContext-DIn6g8tw.js";
+import "react";
+import "../index-BDVjGvMI.js";
+import "./actions/ExecutePopover.js";
+import "./AnnotationEntry.js";
+import "./ClassificationChip.js";
+import "./enrichment/EnrichPopover.js";
 export {
-  Ei as default
+  A as default
 };

package/components/AnnotationEntry.js

@@ -1,56 +1,54 @@
-import { jsxs as i, jsx as e, Fragment as t } from "react/jsx-runtime";
-import { I as o } from "../iconify-BBckr5AQ.js";
-import { Stack as l, Typography as c, Chip as s, IconButton as n } from "@mui/material";
-import a from "./display/icons/Iconified.js";
-import { t as m } from "../utils-C_RX5uMP.js";
-import { memo as p } from "react";
-import d from "./AnnotationBody.js";
-import f from "./ClassificationChip.js";
-const y = ({ annotation: r }) => /* @__PURE__ */ i(l, { direction: "column", spacing: 1, children: [
-  /* @__PURE__ */ i(l, { direction: "row", spacing: 1, alignItems: "center", children: [
-    r.analytic_icon && /* @__PURE__ */ e(
-      o,
-      {
-        style: { alignSelf: "center", filter: "drop-shadow(0px 0px 1px rgb(0 0 0 / 0.4))" },
-        icon: r.analytic_icon
-      }
-    ),
-    /* @__PURE__ */ e(c, { variant: "body1", sx: { textTransform: "capitalize", maxWidth: "275px" }, children: r.analytic ?? r.author }),
-    r.quantity > 1 && /* @__PURE__ */ i(c, { variant: "caption", color: "text.secondary", children: [
-      "(x",
-      r.quantity,
-      ")"
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import { I as Icon } from "../iconify-CXMreGTg.js";
+import { Stack, Typography, Chip, IconButton } from "@mui/material";
+import Iconified from "./display/icons/Iconified.js";
+import { t as twitterShort } from "../utils-Dr4wbKBZ.js";
+import { memo } from "react";
+import AnnotationBody from "./AnnotationBody.js";
+import ClassificationChip from "./ClassificationChip.js";
+const AnnotatonEntry = ({ annotation }) => {
+  return /* @__PURE__ */ jsxs(Stack, { direction: "column", spacing: 1, children: [
+    /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+      annotation.analytic_icon && /* @__PURE__ */ jsx(
+        Icon,
+        {
+          style: { alignSelf: "center", filter: "drop-shadow(0px 0px 1px rgb(0 0 0 / 0.4))" },
+          icon: annotation.analytic_icon
+        }
+      ),
+      /* @__PURE__ */ jsx(Typography, { variant: "body1", sx: { textTransform: "capitalize", maxWidth: "275px" }, children: annotation.analytic ?? annotation.author }),
+      annotation.quantity > 1 && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", children: [
+        "(x",
+        annotation.quantity,
+        ")"
+      ] }),
+      /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
+      annotation.version && /* @__PURE__ */ jsx(
+        Chip,
+        {
+          size: "small",
+          label: /* @__PURE__ */ jsxs(Fragment, { children: [
+            "v",
+            annotation.version.replace(/^v/, "")
+          ] })
+        }
+      ),
+      annotation.link && /* @__PURE__ */ jsx(IconButton, { component: "a", href: annotation.link, target: "_blank", rel: "noreferrer", size: "small", children: /* @__PURE__ */ jsx(Iconified, { icon: "ic:baseline-open-in-new", fontSize: "small" }) }),
+      annotation.classification && /* @__PURE__ */ jsx(ClassificationChip, { size: "small", classification: annotation.classification })
     ] }),
-    /* @__PURE__ */ e("div", { style: { flex: 1 } }),
-    r.version && /* @__PURE__ */ e(s, { size: "small", label: /* @__PURE__ */ i(t, { children: [
-      "v",
-      r.version.replace(/^v/, "")
-    ] }) }),
-    r.link && /* @__PURE__ */ e(
-      n,
-      {
-        component: "a",
-        href: r.link,
-        onClick: () => window.open(r.link, "_blank", "noreferrer"),
-        target: "_blank",
-        rel: "noreferrer",
-        size: "small",
-        children: /* @__PURE__ */ e(a, { icon: "ic:baseline-open-in-new", fontSize: "small" })
-      }
-    ),
-    r.classification && /* @__PURE__ */ e(f, { size: "small", classification: r.classification })
-  ] }),
-  /* @__PURE__ */ e(d, { annotation: r }),
-  /* @__PURE__ */ e(c, { variant: "caption", color: "text.secondary", children: r.summary }),
-  /* @__PURE__ */ i(l, { direction: "row", children: [
-    /* @__PURE__ */ e(c, { variant: "caption", color: "text.secondary", fontSize: "10px", children: m(r.timestamp) }),
-    /* @__PURE__ */ e("div", { style: { flex: 1 } }),
-    !!r.latency && /* @__PURE__ */ i(c, { variant: "caption", color: "text.secondary", fontSize: "10px", children: [
-      Math.round(r.latency),
-      "ms"
+    /* @__PURE__ */ jsx(AnnotationBody, { annotation }),
+    /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: annotation.summary }),
+    /* @__PURE__ */ jsxs(Stack, { direction: "row", children: [
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", fontSize: "10px", children: twitterShort(annotation.timestamp) }),
+      /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
+      !!annotation.latency && /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", fontSize: "10px", children: [
+        Math.round(annotation.latency),
+        "ms"
+      ] })
     ] })
-  ] })
-] }), b = p(y);
+  ] });
+};
+const AnnotationEntry = memo(AnnotatonEntry);
 export {
-  b as default
+  AnnotationEntry as default
 };

package/components/AnnotationPreview.js

@@ -1,11 +1,11 @@
 import "react/jsx-runtime";
-import "../iconify-BBckr5AQ.js";
+import "../iconify-CXMreGTg.js";
 import "@mui/material";
-import { A as d } from "../AnnotationPreview-DWRDhxUB.js";
+import { A } from "../AnnotationPreview-DiQDjt9s.js";
 import "../hooks/useAnnotations.js";
-import "../utils-C_RX5uMP.js";
+import "../utils-Dr4wbKBZ.js";
 import "react";
-import "../index-E7g8cRyW.js";
+import "../index-BDVjGvMI.js";
 export {
-  d as default
+  A as default
 };

package/components/ClassificationChip.js

@@ -1,31 +1,52 @@
-import { jsx as u } from "react/jsx-runtime";
-import { Tooltip as p, Chip as x } from "@mui/material";
-import D from "../hooks/useClueConfig.js";
-import { getParts as C, normalizedClassification as _ } from "../utils/classificationParser.js";
-import v, { useMemo as s, memo as y } from "react";
-const g = ["default", "primary", "secondary", "error", "info", "success", "warning"], A = v.memo(
-  ({ classification: r, ...n }) => {
-    var i, f;
-    const { config: e } = D(), t = s(() => e.c12nDef ? C(r, e.c12nDef, "short", !0) : null, [r, e.c12nDef]), d = s(() => !e.c12nDef || !t ? r : _(t, e.c12nDef, "short", !0), [r, e.c12nDef, t]), o = s(() => {
-      var c, a, m;
-      const l = (m = (a = e.c12nDef) == null ? void 0 : a.levels_styles_map[(c = e.c12nDef) == null ? void 0 : c.levels_map[t.lvlIdx]]) == null ? void 0 : m.color;
-      return g.includes(l) ? { color: l } : l ? { sx: { color: l } } : { color: "default" };
-    }, [(i = e.c12nDef) == null ? void 0 : i.levels_map, (f = e.c12nDef) == null ? void 0 : f.levels_styles_map, t.lvlIdx]);
-    return /* @__PURE__ */ u(p, { title: r, children: /* @__PURE__ */ u(
-      x,
+import { jsx } from "react/jsx-runtime";
+import { Tooltip, Chip } from "@mui/material";
+import useClueConfig from "../hooks/useClueConfig.js";
+import { getParts, normalizedClassification } from "../utils/classificationParser.js";
+import React__default, { useMemo, memo } from "react";
+const THEME_TYPES = ["default", "primary", "secondary", "error", "info", "success", "warning"];
+const ClassificationChip = React__default.memo(
+  ({ classification, ...otherProps }) => {
+    var _a, _b;
+    const { config } = useClueConfig();
+    const parts = useMemo(() => {
+      if (!config.c12nDef) {
+        return null;
+      }
+      return getParts(classification, config.c12nDef, "short", true);
+    }, [classification, config.c12nDef]);
+    const normalized = useMemo(() => {
+      if (!config.c12nDef || !parts) {
+        return classification;
+      }
+      return normalizedClassification(parts, config.c12nDef, "short", true);
+    }, [classification, config.c12nDef, parts]);
+    const chipProps = useMemo(() => {
+      var _a2, _b2, _c;
+      const definedColor = (_c = (_b2 = config.c12nDef) == null ? void 0 : _b2.levels_styles_map[(_a2 = config.c12nDef) == null ? void 0 : _a2.levels_map[parts.lvlIdx]]) == null ? void 0 : _c.color;
+      if (THEME_TYPES.includes(definedColor)) {
+        return { color: definedColor };
+      }
+      if (definedColor) {
+        return { sx: { color: definedColor } };
+      }
+      return { color: "default" };
+    }, [(_a = config.c12nDef) == null ? void 0 : _a.levels_map, (_b = config.c12nDef) == null ? void 0 : _b.levels_styles_map, parts.lvlIdx]);
+    return /* @__PURE__ */ jsx(Tooltip, { title: classification, children: /* @__PURE__ */ jsx(
+      Chip,
       {
-        variant: n.variant || "outlined",
-        label: d,
-        ...o,
-        ...n,
+        variant: otherProps.variant || "outlined",
+        label: normalized,
+        ...chipProps,
+        ...otherProps,
         sx: [
-          ...Array.isArray(o.sx) ? o.sx : [o.sx],
-          ...Array.isArray(n.sx) ? n.sx : [n.sx]
+          ...Array.isArray(chipProps.sx) ? chipProps.sx : [chipProps.sx],
+          ...Array.isArray(otherProps.sx) ? otherProps.sx : [otherProps.sx]
         ]
       }
     ) });
   }
-), M = y(A);
+);
+const ClassificationChip$1 = memo(ClassificationChip);
 export {
-  M as default
+  ClassificationChip$1 as default
 };

package/components/CountBadge.js

@@ -1,29 +1,34 @@
-import { jsx as m } from "react/jsx-runtime";
-import { Badge as l } from "@mui/material";
-import { forwardRef as d, cloneElement as f, Children as g } from "react";
-const b = d(({ children: r, color: a = "primary", count: t, disabled: n, ...e }, o) => n ? f(g.only(r), { ref: o, ...e }) : /* @__PURE__ */ m(
-  l,
-  {
-    ref: o,
-    ...e,
-    badgeContent: t < 100 ? t : "99+",
-    color: a,
-    sx: (i) => ({
-      "& .MuiBadge-badge": {
-        backgroundColor: "transparent",
-        color: i.palette[a].main,
-        fontWeight: "bold",
-        right: 0,
-        top: 0,
-        transform: `translateY(-25%) translateX(${Math.min(Math.ceil(Math.log10(t)), 3) * 10}%)`,
-        px: 0,
-        fontSize: ".85rem"
-      },
-      pr: 1.5
-    }),
-    children: r
+import { jsx } from "react/jsx-runtime";
+import { Badge } from "@mui/material";
+import { forwardRef, cloneElement, Children } from "react";
+const CountBadge = forwardRef(({ children, color = "primary", count, disabled, ...props }, ref) => {
+  if (disabled) {
+    return cloneElement(Children.only(children), { ref, ...props });
   }
-));
+  return /* @__PURE__ */ jsx(
+    Badge,
+    {
+      ref,
+      ...props,
+      badgeContent: count < 100 ? count : "99+",
+      color,
+      sx: (theme) => ({
+        "& .MuiBadge-badge": {
+          backgroundColor: "transparent",
+          color: theme.palette[color].main,
+          fontWeight: "bold",
+          right: 0,
+          top: 0,
+          transform: `translateY(-25%) translateX(${Math.min(Math.ceil(Math.log10(count)), 3) * 10}%)`,
+          px: 0,
+          fontSize: ".85rem"
+        },
+        pr: 1.5
+      }),
+      children
+    }
+  );
+});
 export {
-  b as default
+  CountBadge as default
 };