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