first commit

frontend/node_modules/antd/es/typography/Base/CopyBtn.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import type { CopyConfig } from '.';
+import type { Locale } from '../../locale';
+export interface CopyBtnProps extends Omit<CopyConfig, 'onCopy'> {
+    prefixCls: string;
+    copied: boolean;
+    locale: Locale['Text'];
+    onCopy: React.MouseEventHandler<HTMLButtonElement>;
+    iconOnly: boolean;
+    loading: boolean;
+}
+declare const CopyBtn: React.FC<CopyBtnProps>;
+export default CopyBtn;

frontend/node_modules/antd/es/typography/Base/CopyBtn.js

@@ -0,0 +1,43 @@
+"use client";
+
+import * as React from 'react';
+import CheckOutlined from "@ant-design/icons/es/icons/CheckOutlined";
+import CopyOutlined from "@ant-design/icons/es/icons/CopyOutlined";
+import LoadingOutlined from "@ant-design/icons/es/icons/LoadingOutlined";
+import classNames from 'classnames';
+import Tooltip from '../../tooltip';
+import { getNode, toList } from './util';
+const CopyBtn = ({
+  prefixCls,
+  copied,
+  locale,
+  iconOnly,
+  tooltips,
+  icon,
+  tabIndex,
+  onCopy,
+  loading: btnLoading
+}) => {
+  const tooltipNodes = toList(tooltips);
+  const iconNodes = toList(icon);
+  const {
+    copied: copiedText,
+    copy: copyText
+  } = locale !== null && locale !== void 0 ? locale : {};
+  const systemStr = copied ? copiedText : copyText;
+  const copyTitle = getNode(tooltipNodes[copied ? 1 : 0], systemStr);
+  const ariaLabel = typeof copyTitle === 'string' ? copyTitle : systemStr;
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    title: copyTitle
+  }, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: classNames(`${prefixCls}-copy`, {
+      [`${prefixCls}-copy-success`]: copied,
+      [`${prefixCls}-copy-icon-only`]: iconOnly
+    }),
+    onClick: onCopy,
+    "aria-label": ariaLabel,
+    tabIndex: tabIndex
+  }, copied ? getNode(iconNodes[1], /*#__PURE__*/React.createElement(CheckOutlined, null), true) : getNode(iconNodes[0], btnLoading ? /*#__PURE__*/React.createElement(LoadingOutlined, null) : /*#__PURE__*/React.createElement(CopyOutlined, null), true)));
+};
+export default CopyBtn;

frontend/node_modules/antd/es/typography/Base/Ellipsis.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export interface EllipsisProps {
+    enableMeasure?: boolean;
+    text?: React.ReactNode;
+    width: number;
+    rows: number;
+    children: (cutChildren: React.ReactNode[], 
+    /** Tell current `text` is exceed the `rows` which can be ellipsis */
+    canEllipsis: boolean) => React.ReactNode;
+    onEllipsis: (isEllipsis: boolean) => void;
+    expanded: boolean;
+    /**
+     * Mark for misc update. Which will not affect ellipsis content length.
+     * e.g. tooltip content update.
+     */
+    miscDeps: any[];
+}
+export default function EllipsisMeasure(props: EllipsisProps): React.JSX.Element;

frontend/node_modules/antd/es/typography/Base/Ellipsis.js

@@ -0,0 +1,200 @@
+"use client";
+
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import * as React from 'react';
+import toArray from "rc-util/es/Children/toArray";
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { isValidText } from './util';
+const MeasureText = /*#__PURE__*/React.forwardRef(({
+  style,
+  children
+}, ref) => {
+  const spanRef = React.useRef(null);
+  React.useImperativeHandle(ref, () => ({
+    isExceed: () => {
+      const span = spanRef.current;
+      return span.scrollHeight > span.clientHeight;
+    },
+    getHeight: () => spanRef.current.clientHeight
+  }));
+  return /*#__PURE__*/React.createElement("span", {
+    "aria-hidden": true,
+    ref: spanRef,
+    style: Object.assign({
+      position: 'fixed',
+      display: 'block',
+      left: 0,
+      top: 0,
+      pointerEvents: 'none',
+      backgroundColor: 'rgba(255, 0, 0, 0.65)'
+    }, style)
+  }, children);
+});
+const getNodesLen = nodeList => nodeList.reduce((totalLen, node) => totalLen + (isValidText(node) ? String(node).length : 1), 0);
+function sliceNodes(nodeList, len) {
+  let currLen = 0;
+  const currentNodeList = [];
+  for (let i = 0; i < nodeList.length; i += 1) {
+    // Match to return
+    if (currLen === len) {
+      return currentNodeList;
+    }
+    const node = nodeList[i];
+    const canCut = isValidText(node);
+    const nodeLen = canCut ? String(node).length : 1;
+    const nextLen = currLen + nodeLen;
+    // Exceed but current not which means we need cut this
+    // This will not happen on validate ReactElement
+    if (nextLen > len) {
+      const restLen = len - currLen;
+      currentNodeList.push(String(node).slice(0, restLen));
+      return currentNodeList;
+    }
+    currentNodeList.push(node);
+    currLen = nextLen;
+  }
+  return nodeList;
+}
+// Measure for the `text` is exceed the `rows` or not
+const STATUS_MEASURE_NONE = 0;
+const STATUS_MEASURE_PREPARE = 1;
+const STATUS_MEASURE_START = 2;
+const STATUS_MEASURE_NEED_ELLIPSIS = 3;
+const STATUS_MEASURE_NO_NEED_ELLIPSIS = 4;
+const lineClipStyle = {
+  display: '-webkit-box',
+  overflow: 'hidden',
+  WebkitBoxOrient: 'vertical'
+};
+export default function EllipsisMeasure(props) {
+  const {
+    enableMeasure,
+    width,
+    text,
+    children,
+    rows,
+    expanded,
+    miscDeps,
+    onEllipsis
+  } = props;
+  const nodeList = React.useMemo(() => toArray(text), [text]);
+  const nodeLen = React.useMemo(() => getNodesLen(nodeList), [text]);
+  // ========================= Full Content =========================
+  // Used for measure only, which means it's always render as no need ellipsis
+  const fullContent = React.useMemo(() => children(nodeList, false), [text]);
+  // ========================= Cut Content ==========================
+  const [ellipsisCutIndex, setEllipsisCutIndex] = React.useState(null);
+  const cutMidRef = React.useRef(null);
+  // ========================= NeedEllipsis =========================
+  const measureWhiteSpaceRef = React.useRef(null);
+  const needEllipsisRef = React.useRef(null);
+  // Measure for `rows-1` height, to avoid operation exceed the line height
+  const descRowsEllipsisRef = React.useRef(null);
+  const symbolRowEllipsisRef = React.useRef(null);
+  const [canEllipsis, setCanEllipsis] = React.useState(false);
+  const [needEllipsis, setNeedEllipsis] = React.useState(STATUS_MEASURE_NONE);
+  const [ellipsisHeight, setEllipsisHeight] = React.useState(0);
+  const [parentWhiteSpace, setParentWhiteSpace] = React.useState(null);
+  // Trigger start measure
+  useLayoutEffect(() => {
+    if (enableMeasure && width && nodeLen) {
+      setNeedEllipsis(STATUS_MEASURE_PREPARE);
+    } else {
+      setNeedEllipsis(STATUS_MEASURE_NONE);
+    }
+  }, [width, text, rows, enableMeasure, nodeList]);
+  // Measure process
+  useLayoutEffect(() => {
+    var _a, _b, _c, _d;
+    if (needEllipsis === STATUS_MEASURE_PREPARE) {
+      setNeedEllipsis(STATUS_MEASURE_START);
+      // Parent ref `white-space`
+      const nextWhiteSpace = measureWhiteSpaceRef.current && getComputedStyle(measureWhiteSpaceRef.current).whiteSpace;
+      setParentWhiteSpace(nextWhiteSpace);
+    } else if (needEllipsis === STATUS_MEASURE_START) {
+      const isOverflow = !!((_a = needEllipsisRef.current) === null || _a === void 0 ? void 0 : _a.isExceed());
+      setNeedEllipsis(isOverflow ? STATUS_MEASURE_NEED_ELLIPSIS : STATUS_MEASURE_NO_NEED_ELLIPSIS);
+      setEllipsisCutIndex(isOverflow ? [0, nodeLen] : null);
+      setCanEllipsis(isOverflow);
+      // Get the basic height of ellipsis rows
+      const baseRowsEllipsisHeight = ((_b = needEllipsisRef.current) === null || _b === void 0 ? void 0 : _b.getHeight()) || 0;
+      // Get the height of `rows - 1` + symbol height
+      const descRowsEllipsisHeight = rows === 1 ? 0 : ((_c = descRowsEllipsisRef.current) === null || _c === void 0 ? void 0 : _c.getHeight()) || 0;
+      const symbolRowEllipsisHeight = ((_d = symbolRowEllipsisRef.current) === null || _d === void 0 ? void 0 : _d.getHeight()) || 0;
+      const maxRowsHeight = Math.max(baseRowsEllipsisHeight,
+      // height of rows with ellipsis
+      descRowsEllipsisHeight + symbolRowEllipsisHeight);
+      setEllipsisHeight(maxRowsHeight + 1);
+      onEllipsis(isOverflow);
+    }
+  }, [needEllipsis]);
+  // ========================= Cut Measure ==========================
+  const cutMidIndex = ellipsisCutIndex ? Math.ceil((ellipsisCutIndex[0] + ellipsisCutIndex[1]) / 2) : 0;
+  useLayoutEffect(() => {
+    var _a;
+    const [minIndex, maxIndex] = ellipsisCutIndex || [0, 0];
+    if (minIndex !== maxIndex) {
+      const midHeight = ((_a = cutMidRef.current) === null || _a === void 0 ? void 0 : _a.getHeight()) || 0;
+      const isOverflow = midHeight > ellipsisHeight;
+      let targetMidIndex = cutMidIndex;
+      if (maxIndex - minIndex === 1) {
+        targetMidIndex = isOverflow ? minIndex : maxIndex;
+      }
+      setEllipsisCutIndex(isOverflow ? [minIndex, targetMidIndex] : [targetMidIndex, maxIndex]);
+    }
+  }, [ellipsisCutIndex, cutMidIndex]);
+  // ========================= Text Content =========================
+  const finalContent = React.useMemo(() => {
+    // Skip everything if `enableMeasure` is disabled
+    if (!enableMeasure) {
+      return children(nodeList, false);
+    }
+    if (needEllipsis !== STATUS_MEASURE_NEED_ELLIPSIS || !ellipsisCutIndex || ellipsisCutIndex[0] !== ellipsisCutIndex[1]) {
+      const content = children(nodeList, false);
+      // Limit the max line count to avoid scrollbar blink unless no need ellipsis
+      // https://github.com/ant-design/ant-design/issues/42958
+      if ([STATUS_MEASURE_NO_NEED_ELLIPSIS, STATUS_MEASURE_NONE].includes(needEllipsis)) {
+        return content;
+      }
+      return /*#__PURE__*/React.createElement("span", {
+        style: Object.assign(Object.assign({}, lineClipStyle), {
+          WebkitLineClamp: rows
+        })
+      }, content);
+    }
+    return children(expanded ? nodeList : sliceNodes(nodeList, ellipsisCutIndex[0]), canEllipsis);
+  }, [expanded, needEllipsis, ellipsisCutIndex, nodeList].concat(_toConsumableArray(miscDeps)));
+  // ============================ Render ============================
+  const measureStyle = {
+    width,
+    margin: 0,
+    padding: 0,
+    whiteSpace: parentWhiteSpace === 'nowrap' ? 'normal' : 'inherit'
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, finalContent, needEllipsis === STATUS_MEASURE_START && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MeasureText, {
+    style: Object.assign(Object.assign(Object.assign({}, measureStyle), lineClipStyle), {
+      WebkitLineClamp: rows
+    }),
+    ref: needEllipsisRef
+  }, fullContent), /*#__PURE__*/React.createElement(MeasureText, {
+    style: Object.assign(Object.assign(Object.assign({}, measureStyle), lineClipStyle), {
+      WebkitLineClamp: rows - 1
+    }),
+    ref: descRowsEllipsisRef
+  }, fullContent), /*#__PURE__*/React.createElement(MeasureText, {
+    style: Object.assign(Object.assign(Object.assign({}, measureStyle), lineClipStyle), {
+      WebkitLineClamp: 1
+    }),
+    ref: symbolRowEllipsisRef
+  }, children([], true)))), needEllipsis === STATUS_MEASURE_NEED_ELLIPSIS && ellipsisCutIndex && ellipsisCutIndex[0] !== ellipsisCutIndex[1] && (/*#__PURE__*/React.createElement(MeasureText, {
+    style: Object.assign(Object.assign({}, measureStyle), {
+      top: 400
+    }),
+    ref: cutMidRef
+  }, children(sliceNodes(nodeList, cutMidIndex), true))), needEllipsis === STATUS_MEASURE_PREPARE && (/*#__PURE__*/React.createElement("span", {
+    style: {
+      whiteSpace: 'inherit'
+    },
+    ref: measureWhiteSpaceRef
+  })));
+}

frontend/node_modules/antd/es/typography/Base/EllipsisTooltip.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import type { TooltipProps } from '../../tooltip';
+export interface EllipsisTooltipProps {
+    tooltipProps?: TooltipProps;
+    enableEllipsis: boolean;
+    isEllipsis?: boolean;
+    children: React.ReactElement;
+}
+declare const EllipsisTooltip: React.FC<EllipsisTooltipProps>;
+export default EllipsisTooltip;

frontend/node_modules/antd/es/typography/Base/EllipsisTooltip.js

@@ -0,0 +1,21 @@
+"use client";
+
+import * as React from 'react';
+import Tooltip from '../../tooltip';
+const EllipsisTooltip = ({
+  enableEllipsis,
+  isEllipsis,
+  children,
+  tooltipProps
+}) => {
+  if (!(tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.title) || !enableEllipsis) {
+    return children;
+  }
+  return /*#__PURE__*/React.createElement(Tooltip, Object.assign({
+    open: isEllipsis ? undefined : false
+  }, tooltipProps), children);
+};
+if (process.env.NODE_ENV !== 'production') {
+  EllipsisTooltip.displayName = 'EllipsisTooltip';
+}
+export default EllipsisTooltip;

frontend/node_modules/antd/es/typography/Base/index.d.ts

@@ -0,0 +1,59 @@
+import * as React from 'react';
+import type { JSX } from 'react';
+import type { AutoSizeType } from 'rc-textarea';
+import type { TooltipProps } from '../../tooltip';
+import type { TypographyProps } from '../Typography';
+export type BaseType = 'secondary' | 'success' | 'warning' | 'danger';
+export interface CopyConfig {
+    text?: string | (() => string | Promise<string>);
+    onCopy?: (event?: React.MouseEvent<HTMLButtonElement>) => void;
+    icon?: React.ReactNode;
+    tooltips?: React.ReactNode;
+    format?: 'text/plain' | 'text/html';
+    tabIndex?: number;
+}
+interface EditConfig {
+    text?: string;
+    editing?: boolean;
+    icon?: React.ReactNode;
+    tooltip?: React.ReactNode;
+    onStart?: () => void;
+    onChange?: (value: string) => void;
+    onCancel?: () => void;
+    onEnd?: () => void;
+    maxLength?: number;
+    autoSize?: boolean | AutoSizeType;
+    triggerType?: ('icon' | 'text')[];
+    enterIcon?: React.ReactNode;
+    tabIndex?: number;
+}
+export interface EllipsisConfig {
+    rows?: number;
+    expandable?: boolean | 'collapsible';
+    suffix?: string;
+    symbol?: React.ReactNode | ((expanded: boolean) => React.ReactNode);
+    defaultExpanded?: boolean;
+    expanded?: boolean;
+    onExpand?: (e: React.MouseEvent<HTMLElement, MouseEvent>, info: {
+        expanded: boolean;
+    }) => void;
+    onEllipsis?: (ellipsis: boolean) => void;
+    tooltip?: React.ReactNode | TooltipProps;
+}
+export interface BlockProps<C extends keyof JSX.IntrinsicElements = keyof JSX.IntrinsicElements> extends TypographyProps<C> {
+    title?: string;
+    editable?: boolean | EditConfig;
+    copyable?: boolean | CopyConfig;
+    type?: BaseType;
+    disabled?: boolean;
+    ellipsis?: boolean | EllipsisConfig;
+    code?: boolean;
+    mark?: boolean;
+    underline?: boolean;
+    delete?: boolean;
+    strong?: boolean;
+    keyboard?: boolean;
+    italic?: boolean;
+}
+declare const Base: React.ForwardRefExoticComponent<BlockProps<keyof JSX.IntrinsicElements> & React.RefAttributes<HTMLElement>>;
+export default Base;

frontend/node_modules/antd/es/typography/Base/index.js

@@ -0,0 +1,359 @@
+"use client";
+
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+import * as React from 'react';
+import EditOutlined from "@ant-design/icons/es/icons/EditOutlined";
+import classNames from 'classnames';
+import ResizeObserver from 'rc-resize-observer';
+import toArray from "rc-util/es/Children/toArray";
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import useMergedState from "rc-util/es/hooks/useMergedState";
+import omit from "rc-util/es/omit";
+import { composeRef } from "rc-util/es/ref";
+import { isStyleSupport } from '../../_util/styleChecker';
+import { ConfigContext } from '../../config-provider';
+import useLocale from '../../locale/useLocale';
+import Tooltip from '../../tooltip';
+import Editable from '../Editable';
+import useCopyClick from '../hooks/useCopyClick';
+import useMergedConfig from '../hooks/useMergedConfig';
+import usePrevious from '../hooks/usePrevious';
+import useTooltipProps from '../hooks/useTooltipProps';
+import Typography from '../Typography';
+import CopyBtn from './CopyBtn';
+import Ellipsis from './Ellipsis';
+import EllipsisTooltip from './EllipsisTooltip';
+import { isEleEllipsis, isValidText } from './util';
+function wrapperDecorations({
+  mark,
+  code,
+  underline,
+  delete: del,
+  strong,
+  keyboard,
+  italic
+}, content) {
+  let currentContent = content;
+  function wrap(tag, needed) {
+    if (!needed) {
+      return;
+    }
+    currentContent = /*#__PURE__*/React.createElement(tag, {}, currentContent);
+  }
+  wrap('strong', strong);
+  wrap('u', underline);
+  wrap('del', del);
+  wrap('code', code);
+  wrap('mark', mark);
+  wrap('kbd', keyboard);
+  wrap('i', italic);
+  return currentContent;
+}
+const ELLIPSIS_STR = '...';
+const DECORATION_PROPS = ['delete', 'mark', 'code', 'underline', 'strong', 'keyboard', 'italic'];
+const Base = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _a;
+  const {
+      prefixCls: customizePrefixCls,
+      className,
+      style,
+      type,
+      disabled,
+      children,
+      ellipsis,
+      editable,
+      copyable,
+      component,
+      title
+    } = props,
+    restProps = __rest(props, ["prefixCls", "className", "style", "type", "disabled", "children", "ellipsis", "editable", "copyable", "component", "title"]);
+  const {
+    getPrefixCls,
+    direction
+  } = React.useContext(ConfigContext);
+  const [textLocale] = useLocale('Text');
+  const typographyRef = React.useRef(null);
+  const editIconRef = React.useRef(null);
+  // ============================ MISC ============================
+  const prefixCls = getPrefixCls('typography', customizePrefixCls);
+  const textProps = omit(restProps, DECORATION_PROPS);
+  // ========================== Editable ==========================
+  const [enableEdit, editConfig] = useMergedConfig(editable);
+  const [editing, setEditing] = useMergedState(false, {
+    value: editConfig.editing
+  });
+  const {
+    triggerType = ['icon']
+  } = editConfig;
+  const triggerEdit = edit => {
+    var _a;
+    if (edit) {
+      (_a = editConfig.onStart) === null || _a === void 0 ? void 0 : _a.call(editConfig);
+    }
+    setEditing(edit);
+  };
+  // Focus edit icon when back
+  const prevEditing = usePrevious(editing);
+  useLayoutEffect(() => {
+    var _a;
+    if (!editing && prevEditing) {
+      (_a = editIconRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+  }, [editing]);
+  const onEditClick = e => {
+    e === null || e === void 0 ? void 0 : e.preventDefault();
+    triggerEdit(true);
+  };
+  const onEditChange = value => {
+    var _a;
+    (_a = editConfig.onChange) === null || _a === void 0 ? void 0 : _a.call(editConfig, value);
+    triggerEdit(false);
+  };
+  const onEditCancel = () => {
+    var _a;
+    (_a = editConfig.onCancel) === null || _a === void 0 ? void 0 : _a.call(editConfig);
+    triggerEdit(false);
+  };
+  // ========================== Copyable ==========================
+  const [enableCopy, copyConfig] = useMergedConfig(copyable);
+  const {
+    copied,
+    copyLoading,
+    onClick: onCopyClick
+  } = useCopyClick({
+    copyConfig,
+    children
+  });
+  // ========================== Ellipsis ==========================
+  const [isLineClampSupport, setIsLineClampSupport] = React.useState(false);
+  const [isTextOverflowSupport, setIsTextOverflowSupport] = React.useState(false);
+  const [isJsEllipsis, setIsJsEllipsis] = React.useState(false);
+  const [isNativeEllipsis, setIsNativeEllipsis] = React.useState(false);
+  const [isNativeVisible, setIsNativeVisible] = React.useState(true);
+  const [enableEllipsis, ellipsisConfig] = useMergedConfig(ellipsis, {
+    expandable: false,
+    symbol: isExpanded => isExpanded ? textLocale === null || textLocale === void 0 ? void 0 : textLocale.collapse : textLocale === null || textLocale === void 0 ? void 0 : textLocale.expand
+  });
+  const [expanded, setExpanded] = useMergedState(ellipsisConfig.defaultExpanded || false, {
+    value: ellipsisConfig.expanded
+  });
+  const mergedEnableEllipsis = enableEllipsis && (!expanded || ellipsisConfig.expandable === 'collapsible');
+  // Shared prop to reduce bundle size
+  const {
+    rows = 1
+  } = ellipsisConfig;
+  const needMeasureEllipsis = React.useMemo(() =>
+  // Disable ellipsis
+  mergedEnableEllipsis && (
+  // Provide suffix
+  ellipsisConfig.suffix !== undefined || ellipsisConfig.onEllipsis ||
+  // Can't use css ellipsis since we need to provide the place for button
+  ellipsisConfig.expandable || enableEdit || enableCopy), [mergedEnableEllipsis, ellipsisConfig, enableEdit, enableCopy]);
+  useLayoutEffect(() => {
+    if (enableEllipsis && !needMeasureEllipsis) {
+      setIsLineClampSupport(isStyleSupport('webkitLineClamp'));
+      setIsTextOverflowSupport(isStyleSupport('textOverflow'));
+    }
+  }, [needMeasureEllipsis, enableEllipsis]);
+  const [cssEllipsis, setCssEllipsis] = React.useState(mergedEnableEllipsis);
+  const canUseCssEllipsis = React.useMemo(() => {
+    if (needMeasureEllipsis) {
+      return false;
+    }
+    if (rows === 1) {
+      return isTextOverflowSupport;
+    }
+    return isLineClampSupport;
+  }, [needMeasureEllipsis, isTextOverflowSupport, isLineClampSupport]);
+  // We use effect to change from css ellipsis to js ellipsis.
+  // To make SSR still can see the ellipsis.
+  useLayoutEffect(() => {
+    setCssEllipsis(canUseCssEllipsis && mergedEnableEllipsis);
+  }, [canUseCssEllipsis, mergedEnableEllipsis]);
+  const isMergedEllipsis = mergedEnableEllipsis && (cssEllipsis ? isNativeEllipsis : isJsEllipsis);
+  const cssTextOverflow = mergedEnableEllipsis && rows === 1 && cssEllipsis;
+  const cssLineClamp = mergedEnableEllipsis && rows > 1 && cssEllipsis;
+  // >>>>> Expand
+  const onExpandClick = (e, info) => {
+    var _a;
+    setExpanded(info.expanded);
+    (_a = ellipsisConfig.onExpand) === null || _a === void 0 ? void 0 : _a.call(ellipsisConfig, e, info);
+  };
+  const [ellipsisWidth, setEllipsisWidth] = React.useState(0);
+  const onResize = ({
+    offsetWidth
+  }) => {
+    setEllipsisWidth(offsetWidth);
+  };
+  // >>>>> JS Ellipsis
+  const onJsEllipsis = jsEllipsis => {
+    var _a;
+    setIsJsEllipsis(jsEllipsis);
+    // Trigger if changed
+    if (isJsEllipsis !== jsEllipsis) {
+      (_a = ellipsisConfig.onEllipsis) === null || _a === void 0 ? void 0 : _a.call(ellipsisConfig, jsEllipsis);
+    }
+  };
+  // >>>>> Native ellipsis
+  React.useEffect(() => {
+    const textEle = typographyRef.current;
+    if (enableEllipsis && cssEllipsis && textEle) {
+      const currentEllipsis = isEleEllipsis(textEle);
+      if (isNativeEllipsis !== currentEllipsis) {
+        setIsNativeEllipsis(currentEllipsis);
+      }
+    }
+  }, [enableEllipsis, cssEllipsis, children, cssLineClamp, isNativeVisible, ellipsisWidth]);
+  // https://github.com/ant-design/ant-design/issues/36786
+  // Use IntersectionObserver to check if element is invisible
+  React.useEffect(() => {
+    const textEle = typographyRef.current;
+    if (typeof IntersectionObserver === 'undefined' || !textEle || !cssEllipsis || !mergedEnableEllipsis) {
+      return;
+    }
+    /* eslint-disable-next-line compat/compat */
+    const observer = new IntersectionObserver(() => {
+      setIsNativeVisible(!!textEle.offsetParent);
+    });
+    observer.observe(textEle);
+    return () => {
+      observer.disconnect();
+    };
+  }, [cssEllipsis, mergedEnableEllipsis]);
+  // ========================== Tooltip ===========================
+  const tooltipProps = useTooltipProps(ellipsisConfig.tooltip, editConfig.text, children);
+  const topAriaLabel = React.useMemo(() => {
+    if (!enableEllipsis || cssEllipsis) {
+      return undefined;
+    }
+    return [editConfig.text, children, title, tooltipProps.title].find(isValidText);
+  }, [enableEllipsis, cssEllipsis, title, tooltipProps.title, isMergedEllipsis]);
+  // =========================== Render ===========================
+  // >>>>>>>>>>> Editing input
+  if (editing) {
+    return /*#__PURE__*/React.createElement(Editable, {
+      value: (_a = editConfig.text) !== null && _a !== void 0 ? _a : typeof children === 'string' ? children : '',
+      onSave: onEditChange,
+      onCancel: onEditCancel,
+      onEnd: editConfig.onEnd,
+      prefixCls: prefixCls,
+      className: className,
+      style: style,
+      direction: direction,
+      component: component,
+      maxLength: editConfig.maxLength,
+      autoSize: editConfig.autoSize,
+      enterIcon: editConfig.enterIcon
+    });
+  }
+  // >>>>>>>>>>> Typography
+  // Expand
+  const renderExpand = () => {
+    const {
+      expandable,
+      symbol
+    } = ellipsisConfig;
+    return expandable ? (/*#__PURE__*/React.createElement("button", {
+      type: "button",
+      key: "expand",
+      className: `${prefixCls}-${expanded ? 'collapse' : 'expand'}`,
+      onClick: e => onExpandClick(e, {
+        expanded: !expanded
+      }),
+      "aria-label": expanded ? textLocale.collapse : textLocale === null || textLocale === void 0 ? void 0 : textLocale.expand
+    }, typeof symbol === 'function' ? symbol(expanded) : symbol)) : null;
+  };
+  // Edit
+  const renderEdit = () => {
+    if (!enableEdit) {
+      return;
+    }
+    const {
+      icon,
+      tooltip,
+      tabIndex
+    } = editConfig;
+    const editTitle = toArray(tooltip)[0] || (textLocale === null || textLocale === void 0 ? void 0 : textLocale.edit);
+    const ariaLabel = typeof editTitle === 'string' ? editTitle : '';
+    return triggerType.includes('icon') ? (/*#__PURE__*/React.createElement(Tooltip, {
+      key: "edit",
+      title: tooltip === false ? '' : editTitle
+    }, /*#__PURE__*/React.createElement("button", {
+      type: "button",
+      ref: editIconRef,
+      className: `${prefixCls}-edit`,
+      onClick: onEditClick,
+      "aria-label": ariaLabel,
+      tabIndex: tabIndex
+    }, icon || /*#__PURE__*/React.createElement(EditOutlined, {
+      role: "button"
+    })))) : null;
+  };
+  // Copy
+  const renderCopy = () => {
+    if (!enableCopy) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement(CopyBtn, Object.assign({
+      key: "copy"
+    }, copyConfig, {
+      prefixCls: prefixCls,
+      copied: copied,
+      locale: textLocale,
+      onCopy: onCopyClick,
+      loading: copyLoading,
+      iconOnly: children === null || children === undefined
+    }));
+  };
+  const renderOperations = canEllipsis => [canEllipsis && renderExpand(), renderEdit(), renderCopy()];
+  const renderEllipsis = canEllipsis => [canEllipsis && !expanded && (/*#__PURE__*/React.createElement("span", {
+    "aria-hidden": true,
+    key: "ellipsis"
+  }, ELLIPSIS_STR)), ellipsisConfig.suffix, renderOperations(canEllipsis)];
+  return /*#__PURE__*/React.createElement(ResizeObserver, {
+    onResize: onResize,
+    disabled: !mergedEnableEllipsis
+  }, resizeRef => (/*#__PURE__*/React.createElement(EllipsisTooltip, {
+    tooltipProps: tooltipProps,
+    enableEllipsis: mergedEnableEllipsis,
+    isEllipsis: isMergedEllipsis
+  }, /*#__PURE__*/React.createElement(Typography, Object.assign({
+    className: classNames({
+      [`${prefixCls}-${type}`]: type,
+      [`${prefixCls}-disabled`]: disabled,
+      [`${prefixCls}-ellipsis`]: enableEllipsis,
+      [`${prefixCls}-ellipsis-single-line`]: cssTextOverflow,
+      [`${prefixCls}-ellipsis-multiple-line`]: cssLineClamp
+    }, className),
+    prefixCls: customizePrefixCls,
+    style: Object.assign(Object.assign({}, style), {
+      WebkitLineClamp: cssLineClamp ? rows : undefined
+    }),
+    component: component,
+    ref: composeRef(resizeRef, typographyRef, ref),
+    direction: direction,
+    onClick: triggerType.includes('text') ? onEditClick : undefined,
+    "aria-label": topAriaLabel === null || topAriaLabel === void 0 ? void 0 : topAriaLabel.toString(),
+    title: title
+  }, textProps), /*#__PURE__*/React.createElement(Ellipsis, {
+    enableMeasure: mergedEnableEllipsis && !cssEllipsis,
+    text: children,
+    rows: rows,
+    width: ellipsisWidth,
+    onEllipsis: onJsEllipsis,
+    expanded: expanded,
+    miscDeps: [copied, expanded, copyLoading, enableEdit, enableCopy, textLocale].concat(_toConsumableArray(DECORATION_PROPS.map(key => props[key])))
+  }, (node, canEllipsis) => wrapperDecorations(props, /*#__PURE__*/React.createElement(React.Fragment, null, node.length > 0 && canEllipsis && !expanded && topAriaLabel ? (/*#__PURE__*/React.createElement("span", {
+    key: "show-content",
+    "aria-hidden": true
+  }, node)) : node, renderEllipsis(canEllipsis))))))));
+});
+export default Base;

frontend/node_modules/antd/es/typography/Base/util.d.ts

@@ -0,0 +1,10 @@
+export declare function toList<T>(val: T | T[]): T[];
+export declare function getNode(dom: React.ReactNode, defaultNode: React.ReactNode, needDom?: boolean): import("react").ReactNode;
+/**
+ * Check for element is native ellipsis
+ * ref:
+ * - https://github.com/ant-design/ant-design/issues/50143
+ * - https://github.com/ant-design/ant-design/issues/50414
+ */
+export declare function isEleEllipsis(ele: HTMLElement): boolean;
+export declare const isValidText: (val: any) => val is string | number;

frontend/node_modules/antd/es/typography/Base/util.js

@@ -0,0 +1,39 @@
+export function toList(val) {
+  if (val === false) {
+    return [false, false];
+  }
+  return Array.isArray(val) ? val : [val];
+}
+export function getNode(dom, defaultNode, needDom) {
+  if (dom === true || dom === undefined) {
+    return defaultNode;
+  }
+  return dom || needDom && defaultNode;
+}
+/**
+ * Check for element is native ellipsis
+ * ref:
+ * - https://github.com/ant-design/ant-design/issues/50143
+ * - https://github.com/ant-design/ant-design/issues/50414
+ */
+export function isEleEllipsis(ele) {
+  // Create a new div to get the size
+  const childDiv = document.createElement('em');
+  ele.appendChild(childDiv);
+  // For test case
+  if (process.env.NODE_ENV !== 'production') {
+    childDiv.className = 'ant-typography-css-ellipsis-content-measure';
+  }
+  const rect = ele.getBoundingClientRect();
+  const childRect = childDiv.getBoundingClientRect();
+  // Reset
+  ele.removeChild(childDiv);
+  // Range checker
+  return (
+    // Horizontal out of range
+    rect.left > childRect.left || childRect.right > rect.right ||
+    // Vertical out of range
+    rect.top > childRect.top || childRect.bottom > rect.bottom
+  );
+}
+export const isValidText = val => ['string', 'number'].includes(typeof val);