@cccsaurora/clue-ui 0.15.0 → 1.0.0-dev.49

package/ActionForm-c5hLIfQ-.js

@@ -0,0 +1,436 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { materialRenderers, materialCells } from "@jsonforms/material-renderers";
+import { JsonForms } from "@jsonforms/react";
+import { Stack, Typography, IconButton, Modal, Paper, Box, Button, Divider, CircularProgress, Collapse } from "@mui/material";
+import Iconified from "./components/display/icons/Iconified.js";
+import { J as JSONViewer } from "./index-BDrtH5ec.js";
+import { ClueComponentContext } from "./hooks/ClueComponentContext.js";
+import { c as createContext, u as useContextSelector, a as useContext } from "./index-BDVjGvMI.js";
+import { A as Ajv } from "./index-Dn2NHyXg.js";
+import { a as api } from "./useClueTypeConfig-D4zcy8Gr.js";
+import { useState, useCallback, useEffect, useMemo, memo } from "react";
+import ErrorBoundary from "./components/ErrorBoundary.js";
+import { adaptSchema } from "./components/actions/form/schemaAdapter.js";
+import { d as toString } from "./_baseGet-BSK_nnoz.js";
+import { b as baseSlice } from "./_baseSlice-GAv_YFTT.js";
+import { i as isEqual } from "./utils-CxIhC2xH.js";
+import ResultModal from "./components/actions/ResultModal.js";
+import { SNACKBAR_EVENT_ID } from "./data/event.js";
+import { safeDispatchEvent } from "./utils/window.js";
+import useClue from "./hooks/useClue.js";
+function castSlice(array, start, end) {
+  var length = array.length;
+  end = end === void 0 ? length : end;
+  return !start && end >= length ? array : baseSlice(array, start, end);
+}
+var rsAstralRange$1 = "\\ud800-\\udfff", rsComboMarksRange$1 = "\\u0300-\\u036f", reComboHalfMarksRange$1 = "\\ufe20-\\ufe2f", rsComboSymbolsRange$1 = "\\u20d0-\\u20ff", rsComboRange$1 = rsComboMarksRange$1 + reComboHalfMarksRange$1 + rsComboSymbolsRange$1, rsVarRange$1 = "\\ufe0e\\ufe0f";
+var rsZWJ$1 = "\\u200d";
+var reHasUnicode = RegExp("[" + rsZWJ$1 + rsAstralRange$1 + rsComboRange$1 + rsVarRange$1 + "]");
+function hasUnicode(string) {
+  return reHasUnicode.test(string);
+}
+function asciiToArray(string) {
+  return string.split("");
+}
+var rsAstralRange = "\\ud800-\\udfff", rsComboMarksRange = "\\u0300-\\u036f", reComboHalfMarksRange = "\\ufe20-\\ufe2f", rsComboSymbolsRange = "\\u20d0-\\u20ff", rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange, rsVarRange = "\\ufe0e\\ufe0f";
+var rsAstral = "[" + rsAstralRange + "]", rsCombo = "[" + rsComboRange + "]", rsFitz = "\\ud83c[\\udffb-\\udfff]", rsModifier = "(?:" + rsCombo + "|" + rsFitz + ")", rsNonAstral = "[^" + rsAstralRange + "]", rsRegional = "(?:\\ud83c[\\udde6-\\uddff]){2}", rsSurrPair = "[\\ud800-\\udbff][\\udc00-\\udfff]", rsZWJ = "\\u200d";
+var reOptMod = rsModifier + "?", rsOptVar = "[" + rsVarRange + "]?", rsOptJoin = "(?:" + rsZWJ + "(?:" + [rsNonAstral, rsRegional, rsSurrPair].join("|") + ")" + rsOptVar + reOptMod + ")*", rsSeq = rsOptVar + reOptMod + rsOptJoin, rsSymbol = "(?:" + [rsNonAstral + rsCombo + "?", rsCombo, rsRegional, rsSurrPair, rsAstral].join("|") + ")";
+var reUnicode = RegExp(rsFitz + "(?=" + rsFitz + ")|" + rsSymbol + rsSeq, "g");
+function unicodeToArray(string) {
+  return string.match(reUnicode) || [];
+}
+function stringToArray(string) {
+  return hasUnicode(string) ? unicodeToArray(string) : asciiToArray(string);
+}
+function createCaseFirst(methodName) {
+  return function(string) {
+    string = toString(string);
+    var strSymbols = hasUnicode(string) ? stringToArray(string) : void 0;
+    var chr = strSymbols ? strSymbols[0] : string.charAt(0);
+    var trailing = strSymbols ? castSlice(strSymbols, 1).join("") : string.slice(1);
+    return chr[methodName]() + trailing;
+  };
+}
+var upperFirst = createCaseFirst("toUpperCase");
+function capitalize(string) {
+  return upperFirst(toString(string).toLowerCase());
+}
+const AJV = new Ajv({ removeAdditional: true, coerceTypes: true, strict: false });
+const ClueActionContext = createContext(null);
+const ClueActionProvider = ({
+  baseURL,
+  children,
+  classification: defaultClassification,
+  getToken,
+  onNetworkCall
+}) => {
+  const { t } = useContextSelector(ClueComponentContext, (ctx) => ctx.i18next);
+  const { ready } = useClue();
+  const [runningActionData, setRunningActionData] = useState(null);
+  const [actionResults, setActionResults] = useState({});
+  const [showResultModal, setShowResultModal] = useState(false);
+  const [lastResult, setLastResult] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [availableActions, setAvailableActions] = useState({});
+  const refreshActions = useCallback(async () => {
+    if (!ready) {
+      return;
+    }
+    const headers = {};
+    const token = getToken == null ? void 0 : getToken();
+    if (token) {
+      headers.Authorization = `Bearer ${token}`;
+    }
+    let requestConfig = { baseURL, headers };
+    if (onNetworkCall) {
+      requestConfig = onNetworkCall(requestConfig);
+    }
+    const _actions = await api.actions.get(requestConfig);
+    if (_actions) {
+      setAvailableActions(_actions);
+    }
+    return _actions;
+  }, [baseURL, getToken, onNetworkCall, ready]);
+  useEffect(() => {
+    refreshActions();
+  }, [baseURL, ready]);
+  const getHashKey = useCallback(
+    (type, value, classification) => JSON.stringify({ type, value, classification: classification ?? defaultClassification }),
+    [defaultClassification]
+  );
+  const executeAction = useCallback(
+    async (actionId, selectors, params, options) => {
+      const { forceMenu, onComplete, skipMenu, timeout } = {
+        forceMenu: false,
+        skipMenu: false,
+        onComplete: null,
+        timeout: null,
+        ...options
+      };
+      const headers = {};
+      const token = getToken == null ? void 0 : getToken();
+      if (token) {
+        headers.Authorization = `Bearer ${token}`;
+      }
+      if (!Object.keys(availableActions).includes(actionId)) {
+        throw new Error("Invalid action id");
+      }
+      const stringifiedSelectors = selectors.map(
+        (selector) => selector.type === "telemetry" ? { ...selector, value: JSON.stringify(selector.value) } : selector
+      );
+      const actionToRun = availableActions[actionId];
+      const validator = AJV.compile(actionToRun.params);
+      const validatedParams = { selectors: stringifiedSelectors, ...params };
+      setLoading(true);
+      if (!validator(validatedParams) || forceMenu) {
+        if (skipMenu && !forceMenu) {
+          console.error(`Form is not valid (${validator.errors.length} errors)`);
+          throw new Error("Form is not completed");
+        }
+        if ((runningActionData == null ? void 0 : runningActionData.id) === actionId) {
+          console.error(`Form is not valid (${validator.errors.length} errors)`);
+          safeDispatchEvent(
+            new CustomEvent(SNACKBAR_EVENT_ID, {
+              detail: {
+                message: t("action.error.validation"),
+                level: "error"
+              }
+            })
+          );
+        }
+        setRunningActionData({
+          id: actionId,
+          action: actionToRun,
+          selectors,
+          params: validatedParams ?? {},
+          onComplete,
+          timeout
+        });
+        return;
+      }
+      try {
+        let requestConfig = { baseURL, headers };
+        if (onNetworkCall) {
+          requestConfig = onNetworkCall(requestConfig);
+        }
+        const actionResult = await api.actions.post(
+          actionId,
+          stringifiedSelectors,
+          validatedParams ?? {},
+          { timeout },
+          requestConfig
+        );
+        const actionResultWithData = { ...actionResult, actionId, action: actionToRun };
+        onComplete == null ? void 0 : onComplete(actionResultWithData);
+        setActionResults((_results) => {
+          const keys = selectors.map((value) => getHashKey(value.type, value.value, value.classification));
+          return {
+            ..._results,
+            ...keys.reduce(
+              (acc, key) => ({
+                ...acc,
+                [key]: [..._results[key] ?? [], actionResultWithData]
+              }),
+              {}
+            )
+          };
+        });
+        safeDispatchEvent(
+          new CustomEvent(SNACKBAR_EVENT_ID, {
+            detail: {
+              message: /* @__PURE__ */ jsxs(Stack, { direction: "row", alignItems: "center", spacing: 0.5, width: "100%", children: [
+                /* @__PURE__ */ jsx(Typography, { children: actionResult.summary }),
+                actionResult.link && /* @__PURE__ */ jsx(IconButton, { component: "a", href: actionResult.link, size: "small", target: "_blank", children: /* @__PURE__ */ jsx(Iconified, { icon: "ic:baseline-open-in-new", fontSize: "small" }) })
+              ] }),
+              timeout: actionResult.link ? null : 5e3,
+              level: actionResult.outcome === "success" ? "success" : "error",
+              options: {
+                style: {
+                  minWidth: 0
+                },
+                SnackbarProps: {
+                  style: {
+                    minWidth: 0
+                  }
+                }
+              }
+            }
+          })
+        );
+        if (actionResult.outcome === "success") {
+          setRunningActionData(null);
+        }
+        if (actionResult.format) {
+          setLastResult({ ...actionResult, actionId, action: actionToRun });
+          if (actionResult.format !== "pivot") {
+            setShowResultModal(true);
+          } else {
+            window.open(actionResult.output, "_blank", "noreferrer");
+          }
+        }
+      } catch (e) {
+        safeDispatchEvent(
+          new CustomEvent(SNACKBAR_EVENT_ID, {
+            detail: {
+              message: e.toString(),
+              level: "error"
+            }
+          })
+        );
+      } finally {
+        setLoading(false);
+      }
+    },
+    [availableActions, baseURL, getHashKey, getToken, onNetworkCall, runningActionData == null ? void 0 : runningActionData.id, t]
+  );
+  const cancelAction = useCallback(() => {
+    setRunningActionData(null);
+    setLoading(false);
+  }, []);
+  const getActionResults = useCallback(
+    (type, value, classification) => actionResults[getHashKey(type, value, classification)] ?? [],
+    [actionResults, getHashKey]
+  );
+  const context = useMemo(
+    () => ({
+      availableActions,
+      executeAction,
+      cancelAction,
+      getActionResults,
+      loading,
+      refreshActions
+    }),
+    [availableActions, cancelAction, executeAction, getActionResults, loading, refreshActions]
+  );
+  return /* @__PURE__ */ jsxs(ClueActionContext.Provider, { value: context, children: [
+    children,
+    /* @__PURE__ */ jsxs(ErrorBoundary, { children: [
+      runningActionData && /* @__PURE__ */ jsx(ActionForm$1, { runningActionData }),
+      /* @__PURE__ */ jsx(
+        ResultModal,
+        {
+          show: showResultModal && !!lastResult,
+          result: lastResult,
+          onClose: () => setShowResultModal(false)
+        }
+      )
+    ] })
+  ] });
+};
+const useClueActions = () => {
+  return useContext(ClueActionContext);
+};
+const WRAPPED_RENDERERS = materialRenderers.map((value) => ({
+  ...value,
+  renderer: ({ ...props }) => /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(value.renderer, { ...props }) })
+}));
+const ActionForm = ({ runningActionData }) => {
+  const { executeAction, cancelAction } = useClueActions();
+  const { t } = useContextSelector(ClueComponentContext, (ctx) => ctx.i18next);
+  const [loading, setLoading] = useState(false);
+  const [errors, setErrors] = useState(null);
+  const [formData, setFormData] = useState(runningActionData == null ? void 0 : runningActionData.params);
+  const [showFormDataJson, setShowFormDataJson] = useState(false);
+  const formSchema = useMemo(
+    () => (runningActionData == null ? void 0 : runningActionData.action) ? { ...adaptSchema(runningActionData.action.params), ...runningActionData.action.extra_schema ?? {} } : null,
+    [runningActionData == null ? void 0 : runningActionData.action]
+  );
+  const uiSchema = useMemo(
+    () => ({
+      type: "VerticalLayout",
+      elements: Object.entries((formSchema == null ? void 0 : formSchema.properties) ?? {}).sort(([a_key, a_ent], [b_key, b_ent]) => {
+        if (!!a_ent.order || !!b_ent.order) {
+          return a_ent.order - b_ent.order;
+        } else {
+          return +(formSchema == null ? void 0 : formSchema.required.includes(a_key)) - +(formSchema == null ? void 0 : formSchema.required.includes(b_key));
+        }
+      }).map(([key, value]) => ({
+        type: "Control",
+        scope: `#/properties/${key}`,
+        options: {
+          autocomplete: !!value.enum,
+          showUnfocusedDescription: true,
+          ...value.options
+        },
+        rule: value.rule
+      }))
+    }),
+    [formSchema == null ? void 0 : formSchema.properties, formSchema == null ? void 0 : formSchema.required]
+  );
+  const execute = useCallback(async () => {
+    try {
+      setLoading(true);
+      const options = {};
+      if (runningActionData == null ? void 0 : runningActionData.onComplete) {
+        options.onComplete = runningActionData == null ? void 0 : runningActionData.onComplete;
+      }
+      if (runningActionData == null ? void 0 : runningActionData.timeout) {
+        options.timeout = runningActionData == null ? void 0 : runningActionData.timeout;
+      }
+      await executeAction(runningActionData == null ? void 0 : runningActionData.id, runningActionData == null ? void 0 : runningActionData.selectors, formData, options);
+    } catch (e) {
+      console.error(e);
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    executeAction,
+    runningActionData == null ? void 0 : runningActionData.id,
+    runningActionData == null ? void 0 : runningActionData.selectors,
+    runningActionData == null ? void 0 : runningActionData.onComplete,
+    runningActionData == null ? void 0 : runningActionData.timeout,
+    formData
+  ]);
+  if (!(runningActionData == null ? void 0 : runningActionData.action)) {
+    return;
+  }
+  try {
+    return /* @__PURE__ */ jsx(Modal, { open: true, sx: { display: "flex", alignItems: "center", justifyContent: "center" }, onClose: cancelAction, children: /* @__PURE__ */ jsx(
+      Paper,
+      {
+        sx: { maxHeight: "80%", maxWidth: "80%", height: "100%", px: 2, pt: 2, minWidth: "750px", overflow: "auto" },
+        children: /* @__PURE__ */ jsxs(
+          Stack,
+          {
+            spacing: 1,
+            height: "100%",
+            sx: {
+              ".MuiFormHelperText-root": {
+                marginLeft: "0 !important",
+                "&:last-of-type": { mb: 3 }
+              }
+            },
+            children: [
+              /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, children: [
+                /* @__PURE__ */ jsxs(Stack, { direction: "column", spacing: 1, children: [
+                  /* @__PURE__ */ jsxs(Typography, { variant: "h5", children: [
+                    t("actions.executing"),
+                    " ",
+                    runningActionData == null ? void 0 : runningActionData.action.id.replace(/_/g, " ").split(" ").map(capitalize).join(" ")
+                  ] }),
+                  (runningActionData == null ? void 0 : runningActionData.action.summary) && /* @__PURE__ */ jsx(Typography, { variant: "body1", color: "text.secondary", sx: { pb: 1.5 }, children: runningActionData == null ? void 0 : runningActionData.action.summary })
+                ] }),
+                /* @__PURE__ */ jsx(Box, { flex: 1 }),
+                /* @__PURE__ */ jsx(Box, { alignContent: "end", children: /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outlined",
+                    onClick: () => setShowFormDataJson((prev) => !prev),
+                    startIcon: /* @__PURE__ */ jsx(
+                      Box,
+                      {
+                        component: "span",
+                        sx: (theme) => ({
+                          transition: theme.transitions.create("transform"),
+                          transform: showFormDataJson ? "rotate(180deg)" : "rotate(0deg)"
+                        }),
+                        children: /* @__PURE__ */ jsx(Iconified, { icon: "ic:baseline-keyboard-double-arrow-right" })
+                      }
+                    ),
+                    children: !showFormDataJson ? t("actions.json.show") : t("actions.json.hide")
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ jsx(Divider, { orientation: "horizontal", variant: "middle" }),
+              /* @__PURE__ */ jsx(Box, { pt: 1.5 }),
+              /* @__PURE__ */ jsxs(Stack, { flexGrow: 1, direction: "row", spacing: 1, children: [
+                /* @__PURE__ */ jsxs(Stack, { direction: "column", flexGrow: 1, children: [
+                  /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(
+                    JsonForms,
+                    {
+                      schema: formSchema,
+                      uischema: uiSchema,
+                      renderers: WRAPPED_RENDERERS,
+                      cells: materialCells,
+                      data: formData,
+                      onChange: ({ data, errors: _errors }) => {
+                        if (!isEqual(data, formData)) {
+                          setFormData(data);
+                        }
+                        setErrors(_errors);
+                      },
+                      config: {}
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, pb: 1, children: [
+                    /* @__PURE__ */ jsx("div", { style: { flex: 1 } }),
+                    /* @__PURE__ */ jsx(Button, { color: "error", variant: "outlined", onClick: cancelAction, children: t("cancel") }),
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        color: "success",
+                        variant: "outlined",
+                        disabled: loading || (errors == null ? void 0 : errors.length) > 0,
+                        onClick: execute,
+                        endIcon: loading && /* @__PURE__ */ jsx(CircularProgress, { color: "inherit", size: 18 }),
+                        children: t("actions.execute")
+                      }
+                    )
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsx(Collapse, { orientation: "horizontal", in: showFormDataJson, unmountOnExit: true, mountOnEnter: true, children: /* @__PURE__ */ jsxs(Stack, { direction: "row", height: "100%", spacing: 1, children: [
+                  /* @__PURE__ */ jsx(Divider, { orientation: "vertical" }),
+                  /* @__PURE__ */ jsxs(Stack, { children: [
+                    /* @__PURE__ */ jsx(Typography, { variant: "h5", children: t("action.data") }),
+                    /* @__PURE__ */ jsx(Box, { width: 600, height: "100%", children: /* @__PURE__ */ jsx(JSONViewer, { data: formData, slotProps: { stack: { height: "100%" }, json: { name: false } } }) })
+                  ] })
+                ] }) })
+              ] })
+            ]
+          }
+        )
+      }
+    ) });
+  } catch (e) {
+    console.warn(e);
+    return null;
+  }
+};
+const ActionForm$1 = memo(ActionForm);
+export {
+  ActionForm$1 as A,
+  ClueActionProvider as C,
+  ClueActionContext as a,
+  capitalize as c,
+  useClueActions as u
+};

package/AnnotationPreview-BvNpZOP0.js

@@ -0,0 +1,188 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { I as Icon } from "./iconify-CXMreGTg.js";
+import { useTheme, Popper, Fade, Paper, Stack, Typography, Divider } from "@mui/material";
+import AnnotationDetailPopover from "./components/AnnotationDetailPopover.js";
+import useAnnotations from "./hooks/useAnnotations.js";
+import { t as twitterShort } from "./utils-CxIhC2xH.js";
+import { useState, useRef, useCallback, useEffect, useMemo } from "react";
+import { c as createContext, u as useContextSelector } from "./index-BDVjGvMI.js";
+import { SHOW_EVENT_ID, HIDE_EVENT_ID } from "./data/event.js";
+import { safeDispatchEvent, safeAddEventListener } from "./utils/window.js";
+import { i as isNull } from "./isUndefined-CE8h73dH.js";
+const CluePopupContext = createContext(null);
+const CluePopupProvider = ({ children }) => {
+  const [popupType, setPopupType] = useState(null);
+  const [detailsAnchorEl, setDetailsAnchorEl] = useState(null);
+  const [detailsData, setDetailsData] = useState(null);
+  const [detailsContent, setDetailsContent] = useState(null);
+  const [popoverProps, setPopoverProps] = useState({});
+  const externalOnClose = useRef(null);
+  const showInfo = useCallback((type, anchorEl, value, options) => {
+    safeDispatchEvent(
+      new CustomEvent(SHOW_EVENT_ID, {
+        detail: {
+          type,
+          anchorEl,
+          value,
+          options
+        }
+      })
+    );
+  }, []);
+  const closeInfo = useCallback(
+    (type, value) => {
+      safeDispatchEvent(
+        new CustomEvent(HIDE_EVENT_ID, {
+          detail: {
+            type,
+            value
+          }
+        })
+      );
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  const handleShowPopup = useCallback((event) => {
+    const { detail } = event;
+    setPopupType(detail.type);
+    setDetailsData(detail.value);
+    if (detail.options) {
+      if (detail.options.content) {
+        setDetailsContent(detail.options.content);
+      }
+      if (detail.options.onClose) {
+        externalOnClose.current = detail.options.onClose;
+      }
+      if (detail.options.popoverProps) {
+        setPopoverProps(detail.options.popoverProps);
+      }
+    }
+    setDetailsAnchorEl(detail.anchorEl);
+  }, []);
+  const handleHidePopup = useCallback(
+    (event) => {
+      const { detail } = event;
+      if (detailsData && (detail.type !== popupType || detailsData.type !== detail.value.type || detailsData.value !== detail.value.value)) {
+        return;
+      }
+      setPopupType(null);
+      setDetailsAnchorEl(null);
+      setDetailsData(null);
+      setDetailsContent(null);
+      setPopoverProps({});
+      externalOnClose.current = null;
+    },
+    [detailsData, popupType]
+  );
+  useEffect(() => {
+    const cleanupShow = safeAddEventListener(SHOW_EVENT_ID, handleShowPopup);
+    const cleanupHide = safeAddEventListener(HIDE_EVENT_ID, handleHidePopup);
+    return () => {
+      cleanupShow();
+      cleanupHide();
+    };
+  }, [handleShowPopup, handleHidePopup]);
+  const context = useMemo(
+    () => ({
+      showInfo,
+      closeInfo,
+      __detailsContent: detailsContent
+    }),
+    [closeInfo, detailsContent, showInfo]
+  );
+  return /* @__PURE__ */ jsxs(CluePopupContext.Provider, { value: context, children: [
+    children,
+    /* @__PURE__ */ jsx(
+      AnnotationDetailPopover,
+      {
+        ...popoverProps,
+        anchorEl: detailsAnchorEl,
+        open: !!detailsAnchorEl && popupType === "details",
+        enrichRequest: detailsData,
+        onClose: () => {
+          if (externalOnClose.current) {
+            externalOnClose.current();
+          } else {
+            closeInfo("details", detailsData);
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      AnnotationPreview,
+      {
+        ...popoverProps,
+        anchorEl: detailsAnchorEl,
+        open: !!detailsAnchorEl && !isNull(popupType) && popupType !== "details",
+        annotationType: popupType,
+        enrichRequest: detailsData
+      }
+    )
+  ] });
+};
+const AnnotationPreview = ({ annotationType, anchorEl, enrichRequest, open, ...otherProps }) => {
+  const theme = useTheme();
+  const _detailsContent = useContextSelector(CluePopupContext, (state) => state.__detailsContent);
+  const [annotations] = useAnnotations(enrichRequest == null ? void 0 : enrichRequest.type, enrichRequest == null ? void 0 : enrichRequest.value, enrichRequest == null ? void 0 : enrichRequest.classification);
+  const filteredAnnotations = useMemo(
+    () => annotationType === "actionResults" ? [] : annotations.filter((annotation) => annotation.type === annotationType),
+    [annotationType, annotations]
+  );
+  const getZIndex = useCallback((_anchorEl) => {
+    try {
+      const zIndex = parseInt(window.getComputedStyle(_anchorEl, null).getPropertyValue("z-index"));
+      if (isNaN(zIndex)) {
+        return getZIndex(_anchorEl.parentElement);
+      }
+      return (zIndex + 2).toString();
+    } catch {
+      return "2";
+    }
+  }, []);
+  if (!filteredAnnotations.length && !_detailsContent) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Popper,
+    {
+      ...otherProps,
+      open,
+      anchorEl,
+      placement: "bottom-start",
+      sx: [{ zIndex: getZIndex(anchorEl) }, ...Array.isArray(otherProps.sx) ? otherProps.sx : [otherProps.sx]],
+      children: /* @__PURE__ */ jsx(Fade, { in: !!anchorEl, children: /* @__PURE__ */ jsx(Paper, { sx: { overflowY: "auto", maxWidth: "500px", boxShadow: theme.shadows[2] }, children: /* @__PURE__ */ jsx(Stack, { direction: "column", sx: { p: 1 }, spacing: 1, divider: /* @__PURE__ */ jsx(Divider, { orientation: "horizontal" }), children: _detailsContent ?? filteredAnnotations.map((annotation) => /* @__PURE__ */ jsxs(
+        Stack,
+        {
+          direction: "column",
+          spacing: 1,
+          children: [
+            /* @__PURE__ */ jsxs(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+              annotation.analytic_icon && /* @__PURE__ */ jsx(
+                Icon,
+                {
+                  icon: annotation.analytic_icon,
+                  style: { filter: "drop-shadow(0px 0px 1px rgb(0 0 0 / 0.4))" }
+                }
+              ),
+              /* @__PURE__ */ jsx(Typography, { variant: "body1", sx: { textTransform: "capitalize" }, children: annotation.analytic ?? annotation.author }),
+              /* @__PURE__ */ jsxs(Typography, { variant: "caption", color: "text.secondary", children: [
+                "(",
+                twitterShort(annotation.timestamp),
+                ")"
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(Typography, { variant: "body2", children: annotation.summary }),
+            /* @__PURE__ */ jsx(Typography, { variant: "caption", color: "text.secondary", children: annotation.value })
+          ]
+        },
+        annotation.analytic + annotation.author + annotation.value + annotation.link + annotation.summary + annotation.timestamp
+      )) }) }) })
+    }
+  );
+};
+export {
+  AnnotationPreview as A,
+  CluePopupContext as C,
+  CluePopupProvider as a
+};