@cccsaurora/clue-ui 1.0.4 → 1.1.0-dev.100

package/components/EnrichedChip.js

@@ -1,151 +1,170 @@
-import { jsx as l, 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-dYinoSA9.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 x, useCallback as Z, useEffect as _, memo as F } from "react";
-import { u as d } from "../index-E7g8cRyW.js";
-const D = X.memo(
+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(
   ({
-    type: b,
-    value: o,
-    classification: k,
-    contextIcon: y = !1,
-    counters: a = !1,
-    hideDetails: T = !1,
-    hideLoading: A = !1,
-    forceDetails: f = !1,
-    setForceDetails: u = null,
-    useDetailsIcon: p = !1,
-    skipEnrichment: R = !1,
-    slotProps: s = {},
-    ...t
+    type: _type,
+    value,
+    classification: _classification,
+    contextIcon = false,
+    counters = false,
+    hideDetails = false,
+    hideLoading = false,
+    forceDetails = false,
+    setForceDetails = null,
+    useDetailsIcon = false,
+    skipEnrichment = false,
+    slotProps = {},
+    ...otherProps
   }) => {
-    const { t: j } = d(L, (i) => i.i18next), C = Y(), S = d(N, (i) => i == null ? void 0 : i.type), w = Q((i) => i.defaultClassification), n = x(() => b ?? S, [b, S]), e = x(
-      () => k ?? w,
-      [k, w]
+    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]
     );
-    if (!n)
+    if (!type) {
       throw new Error("Type was not provided as a prop, and component is not used in a group context.");
-    const [m, c] = U(n, o, e, { skipEnrichment: R }), g = d(E, (i) => i.showInfo), M = d(E, (i) => i.closeInfo), h = Z(() => {
-      const i = {};
-      return u && (i.onClose = () => u(!1)), s != null && s.popover && (i.popoverProps = s.popover), i;
-    }, [u, s.popover]), I = x(
-      () => c ? (
-        // We need to give a dummy callback when loading so the popover doesn't get confused
-        (i) => {
-          var r;
-          (r = t.onClick) == null || r.call(t, i);
-        }
-      ) : !T || p ? (i) => {
-        var r;
-        g("details", C.current, { type: n, value: o, classification: e }, h()), (r = t.onClick) == null || r.call(t, i), i.stopPropagation(), i.preventDefault();
-      } : t.onClick,
+    }
+    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,
       // eslint-disable-next-line react-hooks/exhaustive-deps
-      [c, T, p, t, n, o, e]
+      [hideDetails, useDetailsIcon, otherProps, type, value, classification]
     );
-    return _(() => {
-      f ? g("details", C.current, { type: n, value: o, classification: e }, h()) : M("details", {
-        type: n,
-        value: o,
-        classification: e
-      });
-    }, [e, f, n, o]), /* @__PURE__ */ l(
-      B,
+    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,
       {
-        ...t,
-        ref: C,
-        variant: t.variant || "outlined",
+        ...otherProps,
+        ref: anchorRef,
+        variant: otherProps.variant || "outlined",
         sx: {
-          height: t.size !== "small" ? "40px" : "unset",
+          height: otherProps.size !== "small" ? "40px" : "unset",
           "& .MuiChip-label": { overflow: "visible" },
-          ...t.sx ?? {}
+          ...otherProps.sx ?? {}
         },
-        label: /* @__PURE__ */ O(H, { direction: "row", spacing: 1, alignItems: "center", children: [
-          /* @__PURE__ */ l(
-            v,
+        label: /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+          /* @__PURE__ */ jsx(
+            AssessmentIcon,
             {
-              ubiquitous: !0,
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              disableTooltip: f,
+              ubiquitous: true,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ l(
-            z,
+          /* @__PURE__ */ jsx(
+            OpinionIcon,
             {
-              ubiquitous: !0,
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              disableTooltip: f,
+              ubiquitous: true,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ l(
-            q,
+          /* @__PURE__ */ jsx(
+            ContextIcon,
             {
-              ubiquitous: !0,
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              showExtraIcon: y,
-              disableTooltip: f,
+              ubiquitous: true,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              showExtraIcon: contextIcon,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          t.label ?? /* @__PURE__ */ l(W, { fontSize: "inherit", annotations: m, value: o }),
-          /* @__PURE__ */ l(
-            v,
+          otherProps.label ?? /* @__PURE__ */ jsx(FrequencyText, { fontSize: "inherit", annotations, value }),
+          /* @__PURE__ */ jsx(
+            AssessmentIcon,
             {
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              disableTooltip: f,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ l(
-            z,
+          /* @__PURE__ */ jsx(
+            OpinionIcon,
             {
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              disableTooltip: f,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ l(
-            q,
+          /* @__PURE__ */ jsx(
+            ContextIcon,
             {
-              value: { type: n, value: o, classification: e },
-              annotations: m,
-              counters: a,
-              showExtraIcon: y,
-              disableTooltip: f,
+              value: { type, value, classification },
+              annotations,
+              counters,
+              showExtraIcon: contextIcon,
+              disableTooltip: forceDetails,
               style: { flexShrink: 0 }
             }
           ),
-          /* @__PURE__ */ l(V, { counters: a, value: { type: n, value: o, classification: e }, disableTooltip: f }),
-          c && !A && /* @__PURE__ */ l(J, { color: "primary", size: 16 })
+          /* @__PURE__ */ jsx(ActionIcon, { counters, value: { type, value, classification }, disableTooltip: forceDetails }),
+          loading && !hideLoading && /* @__PURE__ */ jsx(CircularProgress, { color: "primary", size: 16 })
         ] }),
-        onClick: p ? void 0 : I,
-        onDelete: !c && p ? I : void 0,
-        deleteIcon: p ? /* @__PURE__ */ l(G, { title: j("details.open"), children: /* @__PURE__ */ l($, { component: "span", sx: { pr: 1 }, children: /* @__PURE__ */ l(K, { icon: "ic:outline-info" }) }) }) : null
+        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
       }
     );
   }
-), ui = F(D);
+);
+const EnrichedChip$1 = memo(EnrichedChip);
 export {
-  ui as default
+  EnrichedChip$1 as default
 };

package/components/EnrichedTypography.d.ts

@@ -10,7 +10,7 @@ export interface EnrichedTypographyProps extends EnrichmentProps {
 }
 declare const _default: import('react').NamedExoticComponent<EnrichedTypographyProps & import('@mui/material').TypographyOwnProps & import('@mui/material/OverridableComponent').CommonProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: import('react').Ref<HTMLSpanElement>;
-}, "fontSize" | "color" | "style" | "left" | "right" | "bottom" | "top" | "flex" | "position" | "border" | "padding" | "children" | "variant" | "classes" | "className" | "margin" | "sx" | "p" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "marginBlock" | "marginInline" | "overflow" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "align" | "noWrap" | "paragraph" | "gutterBottom" | "variantMapping"> & {
+}, "fontSize" | "color" | "style" | "left" | "right" | "bottom" | "top" | "flex" | "position" | "border" | "padding" | "children" | "variant" | "classes" | "className" | "margin" | "sx" | "p" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "marginBlock" | "marginInline" | "overflow" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "align" | "noWrap" | "gutterBottom" | "paragraph" | "variantMapping"> & {
     component?: React.ElementType;
 }>;
 export default _default;

package/components/EnrichedTypography.js

@@ -1,152 +1,173 @@
-import { jsxs as J, jsx as a } from "react/jsx-runtime";
-import { useTheme as K, Stack as L, CircularProgress as N, Tooltip as Q, IconButton as U } from "@mui/material";
-import V from "./display/icons/Iconified.js";
-import { ClueComponentContext as W } from "../hooks/ClueComponentContext.js";
-import { ClueGroupContext as X } from "../hooks/ClueGroupContext.js";
-import { C as S } from "../AnnotationPreview-dYinoSA9.js";
-import { useClueEnrichSelector as Y } from "../hooks/selectors.js";
-import Z from "../hooks/useAnnotations.js";
-import F from "../icons/Action.js";
-import j from "../icons/Assessment.js";
-import z from "../icons/Context.js";
-import O from "../icons/Opinion.js";
-import _ from "../text/Frequency.js";
-import { memo as D, useRef as P, useMemo as y, useCallback as ii, useEffect as ni } from "react";
-import { u as C } from "../index-E7g8cRyW.js";
-const oi = ({
-  type: k,
-  value: t,
-  classification: s,
-  contextIcon: g = !1,
-  counters: r = !1,
-  hideDetails: l = !1,
-  hideLoading: R = !1,
-  forceDetails: c = !1,
-  setForceDetails: b = null,
-  useDetailsIcon: p = !1,
-  skipEnrichment: $ = !1,
-  slotProps: n = {},
-  children: G,
-  ...m
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTheme, Stack, CircularProgress, Tooltip, IconButton } 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 { memo, useRef, useMemo, useCallback, useEffect } from "react";
+import { u as useContextSelector } from "../index-BDVjGvMI.js";
+const EnrichedTypography = ({
+  type: _type,
+  value,
+  classification: _classification,
+  contextIcon = false,
+  counters = false,
+  hideDetails = false,
+  hideLoading = false,
+  forceDetails = false,
+  setForceDetails = null,
+  useDetailsIcon = false,
+  skipEnrichment = false,
+  slotProps = {},
+  children,
+  ...otherProps
 }) => {
-  var q, v, B;
-  const { t: M } = C(W, (i) => i.i18next), x = K(), T = P(), I = C(X, (i) => i == null ? void 0 : i.type), w = Y((i) => i.defaultClassification), o = y(() => k ?? I, [k, I]), e = y(
-    () => s ?? w,
-    [s, w]
+  var _a, _b, _c, _d;
+  const { t } = useContextSelector(ClueComponentContext, (ctx) => ctx.i18next);
+  const theme = useTheme();
+  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]
   );
-  if (!o)
+  if (!type) {
     throw new Error("Type was not provided as a prop, and component is not used in a group context.");
-  const [f, d] = Z(o, t, e, { skipEnrichment: $ }), E = C(S, (i) => i.showInfo), H = C(S, (i) => i.closeInfo), h = ii(() => {
-    const i = {};
-    return b && (i.onClose = () => b(!1)), n != null && n.popover && (i.popoverProps = n.popover), i;
-  }, [b, n.popover]), A = y(
-    () => d ? (
-      // We need to give a dummy callback when loading so the popover doesn't get confused
-      (i) => {
-        var u;
-        (u = m.onClick) == null || u.call(m, i);
-      }
-    ) : !l || p ? (i) => {
-      var u;
-      E("details", T.current, { type: o, value: t, classification: e }, h()), (u = m.onClick) == null || u.call(m, i), i.stopPropagation(), i.preventDefault();
-    } : m.onClick,
+  }
+  const [annotations, loading] = useAnnotations(type, value, classification, { skipEnrichment });
+  const showInfo = useContextSelector(CluePopupContext, (state) => state.showInfo);
+  const closeInfo = useContextSelector(CluePopupContext, (state) => state.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 _a2;
+      showInfo("details", anchorRef.current, { type, value, classification }, buildOptions());
+      (_a2 = otherProps.onClick) == null ? void 0 : _a2.call(otherProps, e);
+      e.stopPropagation();
+      e.preventDefault();
+    } : otherProps.onClick,
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [d, l, p, m, o, t, e]
+    [hideDetails, useDetailsIcon, otherProps, type, value, classification]
   );
-  return ni(() => {
-    c ? E("details", T.current, { type: o, value: t, classification: e }, h()) : H("details", {
-      type: o,
-      value: t,
-      classification: e
-    });
-  }, [e, c, o, t]), /* @__PURE__ */ J(
-    L,
+  useEffect(() => {
+    if (forceDetails) {
+      showInfo("details", anchorRef.current, { type, value, classification }, buildOptions());
+    } else {
+      closeInfo("details", {
+        type,
+        value,
+        classification
+      });
+    }
+  }, [classification, forceDetails, type, value]);
+  return /* @__PURE__ */ jsxs(
+    Stack,
     {
-      ref: T,
+      ref: anchorRef,
       direction: "row",
       spacing: 1,
       alignItems: "center",
-      ...n == null ? void 0 : n.stack,
+      ...slotProps == null ? void 0 : slotProps.stack,
+      className: `enriched-typography ${((_a = slotProps == null ? void 0 : slotProps.stack) == null ? void 0 : _a.className) ?? ""}`.trim(),
       sx: [
         {
-          cursor: !d && !l ? "pointer" : "inherit",
+          cursor: !loading && !hideDetails ? "pointer" : "inherit",
           borderBottom: "1px solid transparent",
-          transition: x.transitions.create(["border-bottom-color"]),
+          transition: theme.transitions.create(["border-bottom-color"]),
           "&:hover": {
-            borderBottomColor: !d && (l ? null : x.palette.primary.light)
+            borderBottomColor: !loading && (!hideDetails ? theme.palette.primary.light : null)
           }
         },
-        ...Array.isArray((q = n == null ? void 0 : n.stack) == null ? void 0 : q.sx) ? (v = n == null ? void 0 : n.stack) == null ? void 0 : v.sx : [(B = n == null ? void 0 : n.stack) == null ? void 0 : B.sx]
+        ...Array.isArray((_b = slotProps == null ? void 0 : slotProps.stack) == null ? void 0 : _b.sx) ? (_c = slotProps == null ? void 0 : slotProps.stack) == null ? void 0 : _c.sx : [(_d = slotProps == null ? void 0 : slotProps.stack) == null ? void 0 : _d.sx]
       ],
-      onClick: p ? void 0 : A,
+      onClick: !useDetailsIcon ? clicker : void 0,
       children: [
-        /* @__PURE__ */ a(
-          j,
+        /* @__PURE__ */ jsx(
+          AssessmentIcon,
           {
-            ubiquitous: !0,
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            disableTooltip: c
+            ubiquitous: true,
+            value: { type, value, classification },
+            annotations,
+            counters,
+            disableTooltip: forceDetails
           }
         ),
-        /* @__PURE__ */ a(
-          O,
+        /* @__PURE__ */ jsx(
+          OpinionIcon,
           {
-            ubiquitous: !0,
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            disableTooltip: c
+            ubiquitous: true,
+            value: { type, value, classification },
+            annotations,
+            counters,
+            disableTooltip: forceDetails
           }
         ),
-        /* @__PURE__ */ a(
-          z,
+        /* @__PURE__ */ jsx(
+          ContextIcon,
           {
-            ubiquitous: !0,
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            showExtraIcon: g,
-            disableTooltip: c
+            ubiquitous: true,
+            value: { type, value, classification },
+            annotations,
+            counters,
+            showExtraIcon: contextIcon,
+            disableTooltip: forceDetails
           }
         ),
-        G ?? /* @__PURE__ */ a(_, { id: `enriched-${o}-value`, ...m, annotations: f, value: t }),
-        /* @__PURE__ */ a(
-          j,
+        children ?? /* @__PURE__ */ jsx(FrequencyText, { id: `enriched-${type}-value`, ...otherProps, annotations, value }),
+        /* @__PURE__ */ jsx(
+          AssessmentIcon,
           {
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            disableTooltip: c
+            value: { type, value, classification },
+            annotations,
+            counters,
+            disableTooltip: forceDetails
           }
         ),
-        /* @__PURE__ */ a(
-          O,
+        /* @__PURE__ */ jsx(
+          OpinionIcon,
           {
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            disableTooltip: c
+            value: { type, value, classification },
+            annotations,
+            counters,
+            disableTooltip: forceDetails
           }
         ),
-        /* @__PURE__ */ a(
-          z,
+        /* @__PURE__ */ jsx(
+          ContextIcon,
           {
-            value: { type: o, value: t, classification: e },
-            annotations: f,
-            counters: r,
-            showExtraIcon: g,
-            disableTooltip: c
+            value: { type, value, classification },
+            annotations,
+            counters,
+            showExtraIcon: contextIcon,
+            disableTooltip: forceDetails
           }
         ),
-        /* @__PURE__ */ a(F, { counters: r, value: { type: o, value: t, classification: e }, disableTooltip: c }),
-        d && !R && /* @__PURE__ */ a(N, { color: "primary", size: 18 }),
-        !d && p && /* @__PURE__ */ a(Q, { title: M("details.open"), children: /* @__PURE__ */ a(U, { size: "small", onClick: A, sx: { color: x.palette.action.disabled }, children: /* @__PURE__ */ a(V, { icon: "ic:outline-info" }) }) })
+        /* @__PURE__ */ jsx(ActionIcon, { counters, value: { type, value, classification }, disableTooltip: forceDetails }),
+        loading && !hideLoading && /* @__PURE__ */ jsx(CircularProgress, { color: "primary", size: 18 }),
+        !loading && useDetailsIcon && /* @__PURE__ */ jsx(Tooltip, { title: t("details.open"), children: /* @__PURE__ */ jsx(IconButton, { size: "small", onClick: clicker, sx: { color: theme.palette.action.disabled }, children: /* @__PURE__ */ jsx(Iconified, { icon: "ic:outline-info" }) }) })
       ]
     }
   );
-}, yi = D(oi);
+};
+const EnrichedTypography$1 = memo(EnrichedTypography);
 export {
-  yi as default
+  EnrichedTypography$1 as default
 };