@uiw/react-textarea-code-editor
Advanced tools
Comparing version 1.4.5 to 1.4.6
@@ -12,28 +12,19 @@ import _extends from "@babel/runtime/helpers/esm/extends"; | ||
export * from './SelectionText'; | ||
export default /*#__PURE__*/React.forwardRef(function (props, ref) { | ||
var _props$prefixCls = props.prefixCls, | ||
prefixCls = _props$prefixCls === void 0 ? 'w-tc-editor' : _props$prefixCls, | ||
_ = props.value, | ||
_props$padding = props.padding, | ||
padding = _props$padding === void 0 ? 10 : _props$padding, | ||
_props$minHeight = props.minHeight, | ||
minHeight = _props$minHeight === void 0 ? 16 : _props$minHeight, | ||
placeholder = props.placeholder, | ||
language = props.language, | ||
className = props.className, | ||
style = props.style, | ||
_onChange = props.onChange, | ||
export default /*#__PURE__*/React.forwardRef((props, ref) => { | ||
var { | ||
prefixCls = 'w-tc-editor', | ||
padding = 10, | ||
minHeight = 16, | ||
placeholder, | ||
language, | ||
className, | ||
style, | ||
onChange: _onChange | ||
} = props, | ||
other = _objectWithoutPropertiesLoose(props, _excluded); | ||
var _useState = useState(props.value || ''), | ||
value = _useState[0], | ||
setValue = _useState[1]; | ||
useEffect(function () { | ||
return setValue(props.value || ''); | ||
}, [props.value]); | ||
var [value, setValue] = useState(props.value || ''); | ||
useEffect(() => setValue(props.value || ''), [props.value]); | ||
var textRef = useRef(null); | ||
useImperativeHandle(ref, function () { | ||
return textRef.current; | ||
}); | ||
useImperativeHandle(ref, () => textRef.current); | ||
var contentStyle = { | ||
@@ -45,16 +36,12 @@ paddingTop: padding, | ||
}; | ||
var htmlStr = useMemo(function () { | ||
return processHtml("<pre aria-hidden=true><code " + (language ? "class=\"language-" + language + "\"" : '') + " >" + htmlEncode(String(value || '')) + "</code><br /></pre>"); | ||
}, [value, language]); | ||
var preView = useMemo(function () { | ||
return /*#__PURE__*/_jsx("div", { | ||
style: _extends({}, styles.editor, contentStyle, { | ||
minHeight: minHeight | ||
}), | ||
className: prefixCls + "-preview " + (language ? "language-" + language : ''), | ||
dangerouslySetInnerHTML: { | ||
__html: htmlStr | ||
} | ||
}); | ||
}, // eslint-disable-next-line react-hooks/exhaustive-deps | ||
var htmlStr = useMemo(() => processHtml("<pre aria-hidden=true><code " + (language ? "class=\"language-" + language + "\"" : '') + " >" + htmlEncode(String(value || '')) + "</code><br /></pre>"), [value, language]); | ||
var preView = useMemo(() => /*#__PURE__*/_jsx("div", { | ||
style: _extends({}, styles.editor, contentStyle, { | ||
minHeight | ||
}), | ||
className: prefixCls + "-preview " + (language ? "language-" + language : ''), | ||
dangerouslySetInnerHTML: { | ||
__html: htmlStr | ||
} | ||
}), // eslint-disable-next-line react-hooks/exhaustive-deps | ||
[prefixCls, language, htmlStr]); | ||
@@ -71,3 +58,3 @@ return /*#__PURE__*/_jsxs("div", { | ||
placeholder: placeholder, | ||
onKeyDown: function onKeyDown(evn) { | ||
onKeyDown: evn => { | ||
shortcuts(evn); | ||
@@ -77,3 +64,3 @@ other.onKeyDown && other.onKeyDown(evn); | ||
style: _extends({}, styles.editor, styles.textarea, contentStyle, { | ||
minHeight: minHeight | ||
minHeight | ||
}, placeholder && !value ? { | ||
@@ -83,3 +70,3 @@ WebkitTextFillColor: 'inherit' | ||
ref: textRef, | ||
onChange: function onChange(evn) { | ||
onChange: evn => { | ||
setValue(evn.target.value); | ||
@@ -86,0 +73,0 @@ _onChange && _onChange(evn); |
@@ -1,3 +0,3 @@ | ||
export var SelectionText = /*#__PURE__*/function () { | ||
function SelectionText(elm) { | ||
export class SelectionText { | ||
constructor(elm) { | ||
this.elm = void 0; | ||
@@ -7,4 +7,6 @@ this.start = void 0; | ||
this.value = void 0; | ||
var selectionStart = elm.selectionStart, | ||
selectionEnd = elm.selectionEnd; | ||
var { | ||
selectionStart, | ||
selectionEnd | ||
} = elm; | ||
this.elm = elm; | ||
@@ -16,8 +18,7 @@ this.start = selectionStart; | ||
var _proto = SelectionText.prototype; | ||
_proto.position = function position(start, end) { | ||
var _this$elm = this.elm, | ||
selectionStart = _this$elm.selectionStart, | ||
selectionEnd = _this$elm.selectionEnd; | ||
position(start, end) { | ||
var { | ||
selectionStart, | ||
selectionEnd | ||
} = this.elm; | ||
this.start = typeof start === 'number' && !isNaN(start) ? start : selectionStart; | ||
@@ -28,5 +29,5 @@ this.end = typeof end === 'number' && !isNaN(end) ? end : selectionEnd; | ||
return this; | ||
}; | ||
} | ||
_proto.insertText = function insertText(text) { | ||
insertText(text) { | ||
// Most of the used APIs only work with the field selected | ||
@@ -38,12 +39,13 @@ this.elm.focus(); | ||
return this; | ||
}; | ||
} | ||
_proto.getSelectedValue = function getSelectedValue(start, end) { | ||
var _this$elm2 = this.elm, | ||
selectionStart = _this$elm2.selectionStart, | ||
selectionEnd = _this$elm2.selectionEnd; | ||
getSelectedValue(start, end) { | ||
var { | ||
selectionStart, | ||
selectionEnd | ||
} = this.elm; | ||
return this.value.slice(typeof start === 'number' && !isNaN(start) ? start : selectionStart, typeof end === 'number' && !isNaN(end) ? start : selectionEnd); | ||
}; | ||
} | ||
_proto.getLineStartNumber = function getLineStartNumber() { | ||
getLineStartNumber() { | ||
var start = this.start; | ||
@@ -63,15 +65,13 @@ | ||
/** Indent on new lines */ | ||
; | ||
_proto.getIndentText = function getIndentText() { | ||
getIndentText() { | ||
var start = this.getLineStartNumber(); | ||
var str = this.getSelectedValue(start); | ||
var indent = ''; | ||
str.replace(/(^(\s)+)/, function (str, old) { | ||
return indent = old; | ||
}); | ||
str.replace(/(^(\s)+)/, (str, old) => indent = old); | ||
return indent; | ||
}; | ||
} | ||
_proto.lineStarInstert = function lineStarInstert(text) { | ||
lineStarInstert(text) { | ||
if (text) { | ||
@@ -81,11 +81,9 @@ var oldStart = this.start; | ||
var str = this.getSelectedValue(start); | ||
this.position(start, this.end).insertText(str.split('\n').map(function (txt) { | ||
return text + txt; | ||
}).join('\n')).position(oldStart + text.length, this.end); | ||
this.position(start, this.end).insertText(str.split('\n').map(txt => text + txt).join('\n')).position(oldStart + text.length, this.end); | ||
} | ||
return this; | ||
}; | ||
} | ||
_proto.lineStarRemove = function lineStarRemove(text) { | ||
lineStarRemove(text) { | ||
if (text) { | ||
@@ -102,11 +100,9 @@ var oldStart = this.start; | ||
this.position(start, this.end).insertText(str.split('\n').map(function (txt) { | ||
return txt.replace(reg, ''); | ||
}).join('\n')).position(newStart, this.end); | ||
this.position(start, this.end).insertText(str.split('\n').map(txt => txt.replace(reg, '')).join('\n')).position(newStart, this.end); | ||
} | ||
} | ||
/** Notify any possible listeners of the change */ | ||
; | ||
_proto.notifyChange = function notifyChange() { | ||
notifyChange() { | ||
var event = new Event('input', { | ||
@@ -117,6 +113,5 @@ bubbles: true, | ||
this.elm.dispatchEvent(event); | ||
}; | ||
} | ||
return SelectionText; | ||
}(); | ||
} | ||
//# sourceMappingURL=SelectionText.js.map |
import { rehype } from 'rehype'; // @ts-ignore | ||
import rehypePrism from '@mapbox/rehype-prism'; | ||
export var processHtml = function processHtml(html) { | ||
export var processHtml = html => { | ||
return rehype().data('settings', { | ||
@@ -18,10 +18,8 @@ fragment: true | ||
export function htmlEncode(sHtml) { | ||
return sHtml.replace(/[<>&"]/g, function (c) { | ||
return { | ||
'<': '<', | ||
'>': '>', | ||
'&': '&', | ||
'"': '"' | ||
}[c]; | ||
}); | ||
return sHtml.replace(/[<>&"]/g, c => ({ | ||
'<': '<', | ||
'>': '>', | ||
'&': '&', | ||
'"': '"' | ||
})[c]); | ||
} | ||
@@ -28,0 +26,0 @@ export function stopPropagation(e) { |
{ | ||
"name": "@uiw/react-textarea-code-editor", | ||
"version": "1.4.5", | ||
"version": "1.4.6", | ||
"description": "A simple code editor with syntax highlighting.", | ||
@@ -98,3 +98,3 @@ "homepage": "https://uiwjs.github.io/react-textarea-code-editor/", | ||
"rehype-attr": "1.4.2", | ||
"tsbb": "3.0.1" | ||
"tsbb": "3.0.2" | ||
}, | ||
@@ -101,0 +101,0 @@ "eslintConfig": { |
@@ -7,5 +7,4 @@ { | ||
"outDir": "../cjs", | ||
"emitDeclarationOnly": true, | ||
"noEmit": false | ||
} | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
115089
1730