@cccsaurora/clue-ui 1.1.0-dev.91 → 1.1.0

package/components/EnrichedCard.js

@@ -1,168 +1,155 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { I as Icon } from "../iconify-CXMreGTg.js";
-import { useTheme, Card, CardHeader, Stack, CircularProgress, Divider, CardContent, Grid, Chip, Typography, Tooltip, Box } from "@mui/material";
-import { ClueComponentContext } from "../hooks/ClueComponentContext.js";
-import { useClueEnrichSelector } from "../hooks/selectors.js";
-import useAnnotations from "../hooks/useAnnotations.js";
-import useErrors from "../hooks/useErrors.js";
-import AssessmentIcon from "../icons/Assessment.js";
-import ContextIcon from "../icons/Context.js";
-import OpinionIcon from "../icons/Opinion.js";
-import { ICON_MAP } from "../icons/iconMap.js";
-import FrequencyText from "../text/Frequency.js";
-import { u as uniq } from "../ClueEnrichContext-6NJfXpUB.js";
-import { memo, useState, useMemo, useCallback } from "react";
-import { u as useContextSelector } from "../index-BDVjGvMI.js";
-import AnnotationEntry from "./AnnotationEntry.js";
-import ExecutePopover from "./actions/ExecutePopover.js";
-import EnrichPopover from "./enrichment/EnrichPopover.js";
-const EnrichedCard = ({
-  type,
-  value,
-  classification: _classification,
-  contextIcon = false,
-  counters = false,
-  hideLoading = false,
-  ...otherProps
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { I as C } from "../iconify-BBckr5AQ.js";
+import { useTheme as F, Card as M, CardHeader as O, Stack as W, CircularProgress as $, Divider as B, CardContent as D, Grid as c, Chip as g, Typography as b, Tooltip as G, Box as H } from "@mui/material";
+import { ClueComponentContext as N } from "../hooks/ClueComponentContext.js";
+import { useClueEnrichSelector as v } from "../hooks/selectors.js";
+import R from "../hooks/useAnnotations.js";
+import J from "../hooks/useErrors.js";
+import K from "../icons/Assessment.js";
+import L from "../icons/Context.js";
+import Q from "../icons/Opinion.js";
+import { ICON_MAP as y } from "../icons/iconMap.js";
+import U from "../text/Frequency.js";
+import { u as V } from "../ClueEnrichContext-CrFpdYhh.js";
+import { memo as X, useState as Y, useMemo as T, useCallback as Z } from "react";
+import { u as _ } from "../index-E7g8cRyW.js";
+import P from "./AnnotationEntry.js";
+import ii from "./actions/ExecutePopover.js";
+import ei from "./enrichment/EnrichPopover.js";
+const ti = ({
+  type: s,
+  value: o,
+  classification: p,
+  contextIcon: z = !1,
+  counters: d = !1,
+  hideLoading: E = !1,
+  ...t
 }) => {
-  const theme = useTheme();
-  const { t } = useContextSelector(ClueComponentContext, (ctx) => ctx.i18next);
-  const defaultClassification = useClueEnrichSelector((ctx) => ctx.defaultClassification);
-  const enrich = useClueEnrichSelector((state) => state.enrich);
-  const [filter, setFilter] = useState("all");
-  const classification = useMemo(
-    () => _classification ?? defaultClassification,
-    [_classification, defaultClassification]
-  );
-  const [annotations, loading] = useAnnotations(type, value, classification);
-  const errors = useErrors(value);
-  const enrichRequest = { type, value, classification };
-  const options = useMemo(() => ["all", ...uniq(annotations.map((annotation) => annotation.type))], [annotations]);
-  const forceEnrich = useCallback(() => {
-    return enrich(type, value, {
-      classification,
-      timeout: 15,
-      force: true
-    });
-  }, [classification, enrich, type, value]);
-  return /* @__PURE__ */ jsxs(
-    Card,
+  const u = F(), { t: I } = _(N, (i) => i.i18next), x = v((i) => i.defaultClassification), h = v((i) => i.enrich), [S, A] = Y("all"), m = T(
+    () => p ?? x,
+    [p, x]
+  ), [n, k] = R(s, o, m), a = J(o), l = { type: s, value: o, classification: m }, q = T(() => ["all", ...V(n.map((i) => i.type))], [n]), w = Z(() => h(s, o, {
+    classification: m,
+    timeout: 15,
+    force: !0
+  }), [m, h, s, o]);
+  return /* @__PURE__ */ r(
+    M,
     {
       sx: [
         {
           maxWidth: "900px"
         },
-        ...Array.isArray(otherProps == null ? void 0 : otherProps.sx) ? otherProps == null ? void 0 : otherProps.sx : [otherProps == null ? void 0 : otherProps.sx]
+        ...Array.isArray(t == null ? void 0 : t.sx) ? t == null ? void 0 : t.sx : [t == null ? void 0 : t.sx]
       ],
-      ...otherProps,
+      ...t,
       children: [
-        /* @__PURE__ */ jsx(
-          CardHeader,
+        /* @__PURE__ */ e(
+          O,
           {
-            title: /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
-              /* @__PURE__ */ jsx(FrequencyText, { annotations, value, variant: "h6" }),
-              /* @__PURE__ */ jsx(
-                AssessmentIcon,
+            title: /* @__PURE__ */ r(W, { direction: "row", spacing: 1, alignItems: "center", children: [
+              /* @__PURE__ */ e(U, { annotations: n, value: o, variant: "h6" }),
+              /* @__PURE__ */ e(
+                K,
                 {
-                  value: enrichRequest,
-                  annotations,
-                  counters,
+                  value: l,
+                  annotations: n,
+                  counters: d,
                   fontSize: "1em",
-                  disableTooltip: true
+                  disableTooltip: !0
                 }
               ),
-              /* @__PURE__ */ jsx(
-                OpinionIcon,
+              /* @__PURE__ */ e(
+                Q,
                 {
-                  value: enrichRequest,
-                  annotations,
-                  counters,
+                  value: l,
+                  annotations: n,
+                  counters: d,
                   fontSize: "1em",
-                  disableTooltip: true
+                  disableTooltip: !0
                 }
               ),
-              /* @__PURE__ */ jsx(
-                ContextIcon,
+              /* @__PURE__ */ e(
+                L,
                 {
-                  value: enrichRequest,
-                  annotations,
-                  counters,
-                  showExtraIcon: contextIcon,
+                  value: l,
+                  annotations: n,
+                  counters: d,
+                  showExtraIcon: z,
                   fontSize: "inherit",
-                  disableTooltip: true
+                  disableTooltip: !0
                 }
               ),
-              loading && !hideLoading && /* @__PURE__ */ jsx(CircularProgress, { color: "primary", size: 18 }),
-              /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
-              /* @__PURE__ */ jsx(EnrichPopover, { selector: enrichRequest }),
-              /* @__PURE__ */ jsx(ExecutePopover, { selectors: [enrichRequest] })
+              k && !E && /* @__PURE__ */ e($, { color: "primary", size: 18 }),
+              /* @__PURE__ */ e("div", { style: { flex: 1 } }),
+              /* @__PURE__ */ e(ei, { selector: l }),
+              /* @__PURE__ */ e(ii, { selectors: [l] })
             ] })
           }
         ),
-        /* @__PURE__ */ jsx(Divider, { sx: { mx: 1 } }),
-        /* @__PURE__ */ jsxs(CardContent, { sx: { p: 1 }, children: [
-          /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 0.5, sx: { mb: 1 }, children: [
-            options.map((opt, id) => (
+        /* @__PURE__ */ e(B, { sx: { mx: 1 } }),
+        /* @__PURE__ */ r(D, { sx: { p: 1 }, children: [
+          /* @__PURE__ */ r(c, { container: !0, spacing: 0.5, sx: { mb: 1 }, children: [
+            q.map((i, f) => (
               // eslint-disable-next-line react/no-array-index-key
-              /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
-                Chip,
+              /* @__PURE__ */ e(c, { item: !0, children: /* @__PURE__ */ e(
+                g,
                 {
                   size: "small",
-                  variant: opt === filter ? "filled" : "outlined",
-                  icon: ICON_MAP[opt] && /* @__PURE__ */ jsx(Icon, { icon: ICON_MAP[opt] }),
-                  label: /* @__PURE__ */ jsxs(Typography, { variant: "caption", textTransform: "capitalize", children: [
-                    opt,
+                  variant: i === S ? "filled" : "outlined",
+                  icon: y[i] && /* @__PURE__ */ e(C, { icon: y[i] }),
+                  label: /* @__PURE__ */ r(b, { variant: "caption", textTransform: "capitalize", children: [
+                    i,
                     ":",
                     " ",
-                    opt === "all" ? annotations.length : annotations.filter((annotation) => annotation.type === opt).length
+                    i === "all" ? n.length : n.filter((j) => j.type === i).length
                   ] }),
-                  onClick: () => setFilter(opt)
+                  onClick: () => A(i)
                 }
-              ) }, id)
+              ) }, f)
             )),
-            (errors == null ? void 0 : errors.length) > 0 && /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
-              Tooltip,
+            (a == null ? void 0 : a.length) > 0 && /* @__PURE__ */ e(c, { item: !0, children: /* @__PURE__ */ e(
+              G,
               {
-                title: /* @__PURE__ */ jsx("div", { onClick: (e) => e.stopPropagation(), children: errors.map((err) => /* @__PURE__ */ jsxs("div", { children: [
-                  /* @__PURE__ */ jsx("span", { style: { textTransform: "capitalize" }, children: err.source.replace(/-/g, " ") }),
+                title: /* @__PURE__ */ e("div", { onClick: (i) => i.stopPropagation(), children: a.map((i) => /* @__PURE__ */ r("div", { children: [
+                  /* @__PURE__ */ e("span", { style: { textTransform: "capitalize" }, children: i.source.replace(/-/g, " ") }),
                   ":",
                   " ",
-                  err.message
-                ] }, err.source)) }),
-                children: /* @__PURE__ */ jsx(
-                  Chip,
+                  i.message
+                ] }, i.source)) }),
+                children: /* @__PURE__ */ e(
+                  g,
                   {
                     size: "small",
                     variant: "outlined",
-                    icon: /* @__PURE__ */ jsx(
-                      Icon,
+                    icon: /* @__PURE__ */ e(
+                      C,
                       {
                         icon: "material-symbols:timer-outline",
-                        color: theme.palette.error.main,
+                        color: u.palette.error.main,
                         style: { filter: "drop-shadow(0px 0px 1px rgb(0 0 0 / 0.4))" }
                       }
                     ),
-                    label: /* @__PURE__ */ jsxs(Typography, { variant: "caption", textTransform: "capitalize", children: [
-                      t("annotation.failed"),
+                    label: /* @__PURE__ */ r(b, { variant: "caption", textTransform: "capitalize", children: [
+                      I("annotation.failed"),
                       ": ",
-                      errors.length
+                      a.length
                     ] }),
-                    onClick: forceEnrich
+                    onClick: w
                   }
                 )
               }
             ) })
           ] }),
-          /* @__PURE__ */ jsx(Grid, { container: true, spacing: 1, alignItems: "stretch", children: annotations.map((annotation, id) => (
+          /* @__PURE__ */ e(c, { container: !0, spacing: 1, alignItems: "stretch", children: n.map((i, f) => (
             // eslint-disable-next-line react/no-array-index-key
-            /* @__PURE__ */ jsx(Grid, { item: true, xs: 6, minWidth: "300px", children: /* @__PURE__ */ jsx(Box, { sx: { border: `thin solid ${theme.palette.divider}`, p: 1, height: "100%" }, children: /* @__PURE__ */ jsx(AnnotationEntry, { annotation }) }) }, id)
+            /* @__PURE__ */ e(c, { item: !0, xs: 6, minWidth: "300px", children: /* @__PURE__ */ e(H, { sx: { border: `thin solid ${u.palette.divider}`, p: 1, height: "100%" }, children: /* @__PURE__ */ e(P, { annotation: i }) }) }, f)
           )) })
         ] })
       ]
     }
   );
-};
-const EnrichedCard$1 = memo(EnrichedCard);
+}, yi = X(ti);
 export {
-  EnrichedCard$1 as default
+  yi as default
 };

package/components/EnrichedChip.js

@@ -1,170 +1,145 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Chip, Tooltip, Box, Stack, CircularProgress } from "@mui/material";
-import Iconified from "./display/icons/Iconified.js";
-import { ClueComponentContext } from "../hooks/ClueComponentContext.js";
-import { ClueGroupContext } from "../hooks/ClueGroupContext.js";
-import { C as CluePopupContext } from "../AnnotationPreview-CQwKs8se.js";
-import { useClueEnrichSelector } from "../hooks/selectors.js";
-import useAnnotations from "../hooks/useAnnotations.js";
-import ActionIcon from "../icons/Action.js";
-import AssessmentIcon from "../icons/Assessment.js";
-import ContextIcon from "../icons/Context.js";
-import OpinionIcon from "../icons/Opinion.js";
-import FrequencyText from "../text/Frequency.js";
-import React__default, { useRef, useMemo, useCallback, useEffect, memo } from "react";
-import { u as useContextSelector } from "../index-BDVjGvMI.js";
-const EnrichedChip = React__default.memo(
+import { jsx as e, jsxs as O } from "react/jsx-runtime";
+import { Chip as B, Tooltip as G, Box as $, Stack as H, CircularProgress as J } from "@mui/material";
+import K from "./display/icons/Iconified.js";
+import { ClueComponentContext as L } from "../hooks/ClueComponentContext.js";
+import { ClueGroupContext as N } from "../hooks/ClueGroupContext.js";
+import { C as E } from "../AnnotationPreview-CKMGCoUH.js";
+import { useClueEnrichSelector as Q } from "../hooks/selectors.js";
+import U from "../hooks/useAnnotations.js";
+import V from "../icons/Action.js";
+import v from "../icons/Assessment.js";
+import q from "../icons/Context.js";
+import z from "../icons/Opinion.js";
+import W from "../text/Frequency.js";
+import X, { useRef as Y, useMemo as u, useCallback as Z, useEffect as _, memo as F } from "react";
+import { u as m } from "../index-E7g8cRyW.js";
+const D = X.memo(
   ({
-    type: _type,
-    value,
-    classification: _classification,
-    contextIcon = false,
-    counters = false,
-    hideDetails = false,
-    hideLoading = false,
-    forceDetails = false,
-    setForceDetails = null,
-    useDetailsIcon = false,
-    skipEnrichment = false,
-    slotProps = {},
-    ...otherProps
+    type: C,
+    value: i,
+    classification: x,
+    contextIcon: b = !1,
+    counters: p = !1,
+    hideDetails: h = !1,
+    hideLoading: A = !1,
+    forceDetails: r = !1,
+    setForceDetails: c = null,
+    useDetailsIcon: s = !1,
+    skipEnrichment: R = !1,
+    slotProps: a = {},
+    ...l
   }) => {
-    const { t } = useContextSelector(ClueComponentContext, (ctx) => ctx.i18next);
-    const anchorRef = useRef();
-    const groupType = useContextSelector(ClueGroupContext, (ctx) => ctx == null ? void 0 : ctx.type);
-    const defaultClassification = useClueEnrichSelector((ctx) => ctx.defaultClassification);
-    const type = useMemo(() => _type ?? groupType, [_type, groupType]);
-    const classification = useMemo(
-      () => _classification ?? defaultClassification,
-      [_classification, defaultClassification]
+    const { t: j } = m(L, (o) => o.i18next), d = Y(), k = m(N, (o) => o == null ? void 0 : o.type), y = Q((o) => o.defaultClassification), n = u(() => C ?? k, [C, k]), t = u(
+      () => x ?? y,
+      [x, y]
     );
-    if (!type) {
+    if (!n)
       throw new Error("Type was not provided as a prop, and component is not used in a group context.");
-    }
-    const [annotations, loading] = useAnnotations(type, value, classification, { skipEnrichment });
-    const showInfo = useContextSelector(CluePopupContext, (ctx) => ctx.showInfo);
-    const closeInfo = useContextSelector(CluePopupContext, (ctx) => ctx.closeInfo);
-    const buildOptions = useCallback(() => {
-      const options = {};
-      if (setForceDetails) {
-        options.onClose = () => setForceDetails(false);
-      }
-      if (slotProps == null ? void 0 : slotProps.popover) {
-        options.popoverProps = slotProps.popover;
-      }
-      return options;
-    }, [setForceDetails, slotProps.popover]);
-    const clicker = useMemo(
-      () => !hideDetails || useDetailsIcon ? (e) => {
-        var _a;
-        showInfo("details", anchorRef.current, { type, value, classification }, buildOptions());
-        (_a = otherProps.onClick) == null ? void 0 : _a.call(otherProps, e);
-        e.stopPropagation();
-        e.preventDefault();
-      } : otherProps.onClick,
+    const [f, T] = U(n, i, t, { skipEnrichment: R }), S = m(E, (o) => o.showInfo), M = m(E, (o) => o.closeInfo), w = Z(() => {
+      const o = {};
+      return c && (o.onClose = () => c(!1)), a != null && a.popover && (o.popoverProps = a.popover), o;
+    }, [c, a.popover]), g = u(
+      () => !h || s ? (o) => {
+        var I;
+        S("details", d.current, { type: n, value: i, classification: t }, w()), (I = l.onClick) == null || I.call(l, o), o.stopPropagation(), o.preventDefault();
+      } : l.onClick,
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [hideDetails, useDetailsIcon, otherProps, type, value, classification]
+      [h, s, l, n, i, t]
     );
-    useEffect(() => {
-      if (forceDetails) {
-        showInfo("details", anchorRef.current, { type, value, classification }, buildOptions());
-      } else {
-        closeInfo("details", {
-          type,
-          value,
-          classification
-        });
-      }
-    }, [classification, forceDetails, type, value]);
-    return /* @__PURE__ */ jsx(
-      Chip,
+    return _(() => {
+      r ? S("details", d.current, { type: n, value: i, classification: t }, w()) : M("details", {
+        type: n,
+        value: i,
+        classification: t
+      });
+    }, [t, r, n, i]), /* @__PURE__ */ e(
+      B,
       {
-        ...otherProps,
-        ref: anchorRef,
-        variant: otherProps.variant || "outlined",
+        ...l,
+        ref: d,
+        variant: l.variant || "outlined",
         sx: {
-          height: otherProps.size !== "small" ? "40px" : "unset",
+          height: l.size !== "small" ? "40px" : "unset",
           "& .MuiChip-label": { overflow: "visible" },
-          ...otherProps.sx ?? {}
+          ...l.sx ?? {}
         },
-        label: /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
-          /* @__PURE__ */ jsx(
-            AssessmentIcon,
+        label: /* @__PURE__ */ O(H, { direction: "row", spacing: 1, alignItems: "center", children: [
+          /* @__PURE__ */ e(
+            v,
             {
-              ubiquitous: true,
-              value: { type, value, classification },
-              annotations,
-              counters,
-              disableTooltip: forceDetails,
+              ubiquitous: !0,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ jsx(
-            OpinionIcon,
+          /* @__PURE__ */ e(
+            z,
             {
-              ubiquitous: true,
-              value: { type, value, classification },
-              annotations,
-              counters,
-              disableTooltip: forceDetails,
+              ubiquitous: !0,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ jsx(
-            ContextIcon,
+          /* @__PURE__ */ e(
+            q,
             {
-              ubiquitous: true,
-              value: { type, value, classification },
-              annotations,
-              counters,
-              showExtraIcon: contextIcon,
-              disableTooltip: forceDetails,
+              ubiquitous: !0,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              showExtraIcon: b,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          otherProps.label ?? /* @__PURE__ */ jsx(FrequencyText, { fontSize: "inherit", annotations, value }),
-          /* @__PURE__ */ jsx(
-            AssessmentIcon,
+          l.label ?? /* @__PURE__ */ e(W, { fontSize: "inherit", annotations: f, value: i }),
+          /* @__PURE__ */ e(
+            v,
             {
-              value: { type, value, classification },
-              annotations,
-              counters,
-              disableTooltip: forceDetails,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ jsx(
-            OpinionIcon,
+          /* @__PURE__ */ e(
+            z,
             {
-              value: { type, value, classification },
-              annotations,
-              counters,
-              disableTooltip: forceDetails,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ jsx(
-            ContextIcon,
+          /* @__PURE__ */ e(
+            q,
             {
-              value: { type, value, classification },
-              annotations,
-              counters,
-              showExtraIcon: contextIcon,
-              disableTooltip: forceDetails,
+              value: { type: n, value: i, classification: t },
+              annotations: f,
+              counters: p,
+              showExtraIcon: b,
+              disableTooltip: r,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ jsx(ActionIcon, { counters, value: { type, value, classification }, disableTooltip: forceDetails }),
-          loading && !hideLoading && /* @__PURE__ */ jsx(CircularProgress, { color: "primary", size: 16 })
+          /* @__PURE__ */ e(V, { counters: p, value: { type: n, value: i, classification: t }, disableTooltip: r }),
+          T && !A && /* @__PURE__ */ e(J, { color: "primary", size: 16 })
         ] }),
-        onClick: !useDetailsIcon ? clicker : void 0,
-        onDelete: !loading && useDetailsIcon ? clicker : void 0,
-        deleteIcon: useDetailsIcon ? /* @__PURE__ */ jsx(Tooltip, { title: t("details.open"), children: /* @__PURE__ */ jsx(Box, { component: "span", sx: { pr: 1 }, children: /* @__PURE__ */ jsx(Iconified, { icon: "ic:outline-info" }) }) }) : null
+        onClick: s ? void 0 : g,
+        onDelete: !T && s ? g : void 0,
+        deleteIcon: s ? /* @__PURE__ */ e(G, { title: j("details.open"), children: /* @__PURE__ */ e($, { component: "span", sx: { pr: 1 }, children: /* @__PURE__ */ e(K, { icon: "ic:outline-info" }) }) }) : null
       }
     );
   }
-);
-const EnrichedChip$1 = memo(EnrichedChip);
+), Co = F(D);
 export {
-  EnrichedChip$1 as default
+  Co as default
 };