first commit

frontend/node_modules/antd/es/typography/Editable.js

@@ -0,0 +1,115 @@
+"use client";
+
+import * as React from 'react';
+import EnterOutlined from "@ant-design/icons/es/icons/EnterOutlined";
+import classNames from 'classnames';
+import KeyCode from "rc-util/es/KeyCode";
+import { cloneElement } from '../_util/reactNode';
+import TextArea from '../input/TextArea';
+import useStyle from './style';
+const Editable = props => {
+  const {
+    prefixCls,
+    'aria-label': ariaLabel,
+    className,
+    style,
+    direction,
+    maxLength,
+    autoSize = true,
+    value,
+    onSave,
+    onCancel,
+    onEnd,
+    component,
+    enterIcon = /*#__PURE__*/React.createElement(EnterOutlined, null)
+  } = props;
+  const ref = React.useRef(null);
+  const inComposition = React.useRef(false);
+  const lastKeyCode = React.useRef(null);
+  const [current, setCurrent] = React.useState(value);
+  React.useEffect(() => {
+    setCurrent(value);
+  }, [value]);
+  React.useEffect(() => {
+    var _a;
+    if ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.resizableTextArea) {
+      const {
+        textArea
+      } = ref.current.resizableTextArea;
+      textArea.focus();
+      const {
+        length
+      } = textArea.value;
+      textArea.setSelectionRange(length, length);
+    }
+  }, []);
+  const onChange = ({
+    target
+  }) => {
+    setCurrent(target.value.replace(/[\n\r]/g, ''));
+  };
+  const onCompositionStart = () => {
+    inComposition.current = true;
+  };
+  const onCompositionEnd = () => {
+    inComposition.current = false;
+  };
+  const onKeyDown = ({
+    keyCode
+  }) => {
+    // We don't record keyCode when IME is using
+    if (inComposition.current) {
+      return;
+    }
+    lastKeyCode.current = keyCode;
+  };
+  const confirmChange = () => {
+    onSave(current.trim());
+  };
+  const onKeyUp = ({
+    keyCode,
+    ctrlKey,
+    altKey,
+    metaKey,
+    shiftKey
+  }) => {
+    // Check if it's a real key
+    if (lastKeyCode.current !== keyCode || inComposition.current || ctrlKey || altKey || metaKey || shiftKey) {
+      return;
+    }
+    if (keyCode === KeyCode.ENTER) {
+      confirmChange();
+      onEnd === null || onEnd === void 0 ? void 0 : onEnd();
+    } else if (keyCode === KeyCode.ESC) {
+      onCancel();
+    }
+  };
+  const onBlur = () => {
+    confirmChange();
+  };
+  const [wrapCSSVar, hashId, cssVarCls] = useStyle(prefixCls);
+  const textAreaClassName = classNames(prefixCls, `${prefixCls}-edit-content`, {
+    [`${prefixCls}-rtl`]: direction === 'rtl',
+    [`${prefixCls}-${component}`]: !!component
+  }, className, hashId, cssVarCls);
+  return wrapCSSVar(/*#__PURE__*/React.createElement("div", {
+    className: textAreaClassName,
+    style: style
+  }, /*#__PURE__*/React.createElement(TextArea, {
+    ref: ref,
+    maxLength: maxLength,
+    value: current,
+    onChange: onChange,
+    onKeyDown: onKeyDown,
+    onKeyUp: onKeyUp,
+    onCompositionStart: onCompositionStart,
+    onCompositionEnd: onCompositionEnd,
+    onBlur: onBlur,
+    "aria-label": ariaLabel,
+    rows: 1,
+    autoSize: autoSize
+  }), enterIcon !== null ? cloneElement(enterIcon, {
+    className: `${prefixCls}-edit-content-confirm`
+  }) : null));
+};
+export default Editable;