@luck-design-biz/luckda 1.0.2-5 → 1.0.2-6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/lowcode/painter/panel-section/JSEditor.js +7 -3
- package/es/lowcode/painter/panel-section/JSEditor.js.map +1 -1
- package/es/lowcode/view/ErrorBoundary.js +15 -14
- package/es/lowcode/view/ErrorBoundary.js.map +1 -1
- package/es/lowcode/view/lc-components/JSX/RuntimeComp.js +5 -7
- package/es/lowcode/view/lc-components/JSX/RuntimeComp.js.map +1 -1
- package/lib/lowcode/painter/panel-section/JSEditor.js +7 -3
- package/lib/lowcode/painter/panel-section/JSEditor.js.map +1 -1
- package/lib/lowcode/view/ErrorBoundary.js +15 -14
- package/lib/lowcode/view/ErrorBoundary.js.map +1 -1
- package/lib/lowcode/view/lc-components/JSX/RuntimeComp.js +6 -6
- package/lib/lowcode/view/lc-components/JSX/RuntimeComp.js.map +1 -1
- package/package.json +1 -1
|
@@ -40,7 +40,11 @@ var _JSEditor = function _JSEditor(_ref) {
|
|
|
40
40
|
return /*#__PURE__*/React.createElement(React.Fragment, null, children || /*#__PURE__*/React.createElement(Button, {
|
|
41
41
|
block: true,
|
|
42
42
|
size: "small",
|
|
43
|
-
onClick: show
|
|
43
|
+
onClick: show,
|
|
44
|
+
style: {
|
|
45
|
+
margin: '0 8px',
|
|
46
|
+
width: 'calc(100% - 16px)'
|
|
47
|
+
}
|
|
44
48
|
}, formatMessage({
|
|
45
49
|
id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',
|
|
46
50
|
label: '源码编辑'
|
|
@@ -59,10 +63,10 @@ var _JSEditor = function _JSEditor(_ref) {
|
|
|
59
63
|
onClose: hidden
|
|
60
64
|
}, /*#__PURE__*/React.createElement(SplitPane, {
|
|
61
65
|
split: "vertical"
|
|
62
|
-
}, /*#__PURE__*/React.createElement(JSEditor, {
|
|
66
|
+
}, /*#__PURE__*/React.createElement(SplitPane.Pane, null, /*#__PURE__*/React.createElement(JSEditor, {
|
|
63
67
|
ref: editorRef,
|
|
64
68
|
onChange: run
|
|
65
|
-
}, defaultValue || defaultCode), /*#__PURE__*/React.createElement(SplitPane.Pane, {
|
|
69
|
+
}, defaultValue || defaultCode)), /*#__PURE__*/React.createElement(SplitPane.Pane, {
|
|
66
70
|
minSize: "400px"
|
|
67
71
|
}, /*#__PURE__*/React.createElement(RuntimeComp, {
|
|
68
72
|
onErrorCatch: handleErrorCatch
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","useRef","useState","useBoolean","useDebounceFn","useMemoizedFn","Button","LuckModal","SplitPane","formatMessage","RuntimeComp","JSEditor","_JSEditor","_ref","defaultValue","defaultCode","onChange","children","editorRef","_useState","_useState2","_slicedToArray","code","setCode","_useDebounceFn","_code","wait","run","_useBoolean","_useBoolean2","visible","_useBoolean2$","show","setTrue","hidden","setFalse","_useBoolean3","_useBoolean4","hasError","_useBoolean4$","hasErrorOn","hasErrorOff","handleErrorCatch","error","console","log","createElement","Fragment","block","size","onClick","id","label","title","
|
|
1
|
+
{"version":3,"names":["React","useRef","useState","useBoolean","useDebounceFn","useMemoizedFn","Button","LuckModal","SplitPane","formatMessage","RuntimeComp","JSEditor","_JSEditor","_ref","defaultValue","defaultCode","onChange","children","editorRef","_useState","_useState2","_slicedToArray","code","setCode","_useDebounceFn","_code","wait","run","_useBoolean","_useBoolean2","visible","_useBoolean2$","show","setTrue","hidden","setFalse","_useBoolean3","_useBoolean4","hasError","_useBoolean4$","hasErrorOn","hasErrorOff","handleErrorCatch","error","console","log","createElement","Fragment","block","size","onClick","style","margin","width","id","label","title","height","fullScreen","mask","maskClosable","closable","onClose","split","Pane","ref","minSize","onErrorCatch"],"sources":["../../../../luckda/lowcode/painter/panel-section/JSEditor.jsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { useBoolean, useDebounceFn, useMemoizedFn } from 'ahooks';\nimport { Button } from 'luck-design/antd';\nimport { LuckModal, SplitPane } from 'luck-design';\nimport { formatMessage } from '@luck-design-biz/base/utils';\nimport RuntimeComp from '../../view/lc-components/JSX/RuntimeComp';\nimport JSEditor from '../components/code-editor/JSEditor';\n\nconst _JSEditor = ({ defaultValue, defaultCode, onChange, children }) => {\n const editorRef = useRef();\n const [code, setCode] = useState(defaultValue || defaultCode);\n const { run } = useDebounceFn(\n (_code) => {\n setCode(_code);\n },\n { wait: 500 },\n );\n const [visible, { setTrue: show, setFalse: hidden }] = useBoolean(false);\n const [hasError, { setTrue: hasErrorOn, setFalse: hasErrorOff }] = useBoolean(false);\n\n const handleErrorCatch = useMemoizedFn((error) => {\n console.log(12121212, error);\n });\n\n return (\n <>\n {children || (\n <Button\n block\n size=\"small\"\n onClick={show}\n style={{ margin: '0 8px', width: 'calc(100% - 16px)' }}\n >\n {formatMessage({\n id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',\n label: '源码编辑',\n })}\n </Button>\n )}\n <LuckModal\n title={formatMessage({\n id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',\n label: '源码编辑',\n })}\n width=\"80vw\"\n height=\"80vh\"\n fullScreen\n mask={false}\n maskClosable={false}\n closable={false}\n visible={visible}\n onClose={hidden}\n >\n <SplitPane split=\"vertical\">\n <SplitPane.Pane>\n <JSEditor ref={editorRef} onChange={run}>\n {defaultValue || defaultCode}\n </JSEditor>\n </SplitPane.Pane>\n <SplitPane.Pane minSize=\"400px\">\n <RuntimeComp onErrorCatch={handleErrorCatch}>{code}</RuntimeComp>\n </SplitPane.Pane>\n </SplitPane>\n </LuckModal>\n </>\n );\n};\n\nexport default _JSEditor;\n"],"mappings":"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"}
|
|
@@ -7,7 +7,15 @@ import styled from 'styled-components';
|
|
|
7
7
|
var Wrapper = styled.div.withConfig({
|
|
8
8
|
displayName: "Wrapper",
|
|
9
9
|
componentId: "luckda-6530__sc-1ge5tx6-0"
|
|
10
|
-
})(["width:100%;height:100%;
|
|
10
|
+
})(["width:100%;height:100%;overflow:auto;"]);
|
|
11
|
+
var Title = styled.h3.withConfig({
|
|
12
|
+
displayName: "Title",
|
|
13
|
+
componentId: "luckda-6530__sc-1ge5tx6-1"
|
|
14
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);fontSize:1.5rem;"]);
|
|
15
|
+
var Content = styled.p.withConfig({
|
|
16
|
+
displayName: "Content",
|
|
17
|
+
componentId: "luckda-6530__sc-1ge5tx6-2"
|
|
18
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);"]);
|
|
11
19
|
var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
12
20
|
_inherits(ErrorBoundary, _PureComponent);
|
|
13
21
|
var _super = _createSuper(ErrorBoundary);
|
|
@@ -26,7 +34,9 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
26
34
|
key: "componentDidUpdate",
|
|
27
35
|
value: function componentDidUpdate(prevProps) {
|
|
28
36
|
if (this.props.children !== prevProps.children && this.state.hasError) {
|
|
37
|
+
var _this$props$onErrorCa, _this$props;
|
|
29
38
|
// 重置 hasError 为 false 以便重新渲染子组件
|
|
39
|
+
(_this$props$onErrorCa = (_this$props = this.props).onErrorCatch) === null || _this$props$onErrorCa === void 0 || _this$props$onErrorCa.call(_this$props);
|
|
30
40
|
this.setState({
|
|
31
41
|
hasError: false,
|
|
32
42
|
error: '',
|
|
@@ -37,10 +47,10 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
37
47
|
}, {
|
|
38
48
|
key: "componentDidCatch",
|
|
39
49
|
value: function componentDidCatch(error, errorInfo) {
|
|
40
|
-
var _this$props$
|
|
50
|
+
var _this$props$onErrorCa2, _this$props2;
|
|
41
51
|
// 在此处记录错误信息
|
|
42
52
|
console.error(error);
|
|
43
|
-
(_this$props$
|
|
53
|
+
(_this$props$onErrorCa2 = (_this$props2 = this.props).onErrorCatch) === null || _this$props$onErrorCa2 === void 0 || _this$props$onErrorCa2.call(_this$props2, error, errorInfo);
|
|
44
54
|
this.setState({
|
|
45
55
|
hasError: true,
|
|
46
56
|
error: error,
|
|
@@ -52,20 +62,11 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
52
62
|
value: function render() {
|
|
53
63
|
if (this.state.hasError) {
|
|
54
64
|
// 如果有错误,显示备用 UI
|
|
55
|
-
return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(
|
|
56
|
-
style: {
|
|
57
|
-
whiteSpace: 'pre-line',
|
|
58
|
-
color: 'var(--luck-color-danger)',
|
|
59
|
-
fontSize: '1.5rem'
|
|
60
|
-
},
|
|
65
|
+
return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Title, {
|
|
61
66
|
dangerouslySetInnerHTML: {
|
|
62
67
|
__html: this.state.error
|
|
63
68
|
}
|
|
64
|
-
}), /*#__PURE__*/React.createElement(
|
|
65
|
-
style: {
|
|
66
|
-
whiteSpace: 'pre-line',
|
|
67
|
-
color: 'var(--luck-color-danger)'
|
|
68
|
-
},
|
|
69
|
+
}), /*#__PURE__*/React.createElement(Content, {
|
|
69
70
|
dangerouslySetInnerHTML: {
|
|
70
71
|
__html: this.state.errorInfo
|
|
71
72
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","PureComponent","styled","Wrapper","div","withConfig","displayName","componentId","ErrorBoundary","_PureComponent","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","state","hasError","error","errorInfo","_createClass","key","value","componentDidUpdate","prevProps","children","
|
|
1
|
+
{"version":3,"names":["React","PureComponent","styled","Wrapper","div","withConfig","displayName","componentId","Title","h3","Content","p","ErrorBoundary","_PureComponent","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","state","hasError","error","errorInfo","_createClass","key","value","componentDidUpdate","prevProps","children","_this$props$onErrorCa","_this$props","onErrorCatch","setState","componentDidCatch","_this$props$onErrorCa2","_this$props2","console","componentStack","render","createElement","dangerouslySetInnerHTML","__html"],"sources":["../../../luckda/lowcode/view/ErrorBoundary.jsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport styled from 'styled-components';\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n overflow: auto;\n`;\nconst Title = styled.h3`\n white-space: pre-line;\n color: var(--luck-color-danger);\n fontSize: 1.5rem;\n`;\nconst Content = styled.p`\n white-space: pre-line;\n color: var(--luck-color-danger);\n`;\n\nclass ErrorBoundary extends PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n hasError: false,\n error: '',\n errorInfo: '',\n };\n }\n\n componentDidUpdate(prevProps) {\n if (this.props.children !== prevProps.children && this.state.hasError) {\n // 重置 hasError 为 false 以便重新渲染子组件\n this.props.onErrorCatch?.();\n this.setState({ hasError: false, error: '', errorInfo: '' });\n }\n }\n\n componentDidCatch(error, errorInfo) {\n // 在此处记录错误信息\n console.error(error);\n this.props.onErrorCatch?.(error, errorInfo);\n this.setState({ hasError: true, error, errorInfo: errorInfo?.componentStack });\n }\n\n render() {\n if (this.state.hasError) {\n // 如果有错误,显示备用 UI\n return (\n <Wrapper>\n <Title dangerouslySetInnerHTML={{ __html: this.state.error }} />\n <Content dangerouslySetInnerHTML={{ __html: this.state.errorInfo }} />\n </Wrapper>\n );\n }\n\n return this.props.children;\n }\n}\n\nexport default ErrorBoundary;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,OAAOC,MAAM,MAAM,mBAAmB;AAEtC,IAAMC,OAAO,GAAGD,MAAM,CAACE,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6CAIzB;AACD,IAAMC,KAAK,GAAGN,MAAM,CAACO,EAAE,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4EAItB;AACD,IAAMG,OAAO,GAAGR,MAAM,CAACS,CAAC,CAAAN,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4DAGvB;AAAC,IAEIK,aAAa,0BAAAC,cAAA;EAAAC,SAAA,CAAAF,aAAA,EAAAC,cAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,aAAA;EACjB,SAAAA,cAAYK,KAAK,EAAE;IAAA,IAAAC,KAAA;IAAAC,eAAA,OAAAP,aAAA;IACjBM,KAAA,GAAAH,MAAA,CAAAK,IAAA,OAAMH,KAAK;IACXC,KAAA,CAAKG,KAAK,GAAG;MACXC,QAAQ,EAAE,KAAK;MACfC,KAAK,EAAE,EAAE;MACTC,SAAS,EAAE;IACb,CAAC;IAAC,OAAAN,KAAA;EACJ;EAACO,YAAA,CAAAb,aAAA;IAAAc,GAAA;IAAAC,KAAA,EAED,SAAAC,mBAAmBC,SAAS,EAAE;MAC5B,IAAI,IAAI,CAACZ,KAAK,CAACa,QAAQ,KAAKD,SAAS,CAACC,QAAQ,IAAI,IAAI,CAACT,KAAK,CAACC,QAAQ,EAAE;QAAA,IAAAS,qBAAA,EAAAC,WAAA;QACrE;QACA,CAAAD,qBAAA,IAAAC,WAAA,OAAI,CAACf,KAAK,EAACgB,YAAY,cAAAF,qBAAA,eAAvBA,qBAAA,CAAAX,IAAA,CAAAY,WAA0B,CAAC;QAC3B,IAAI,CAACE,QAAQ,CAAC;UAAEZ,QAAQ,EAAE,KAAK;UAAEC,KAAK,EAAE,EAAE;UAAEC,SAAS,EAAE;QAAG,CAAC,CAAC;MAC9D;IACF;EAAC;IAAAE,GAAA;IAAAC,KAAA,EAED,SAAAQ,kBAAkBZ,KAAK,EAAEC,SAAS,EAAE;MAAA,IAAAY,sBAAA,EAAAC,YAAA;MAClC;MACAC,OAAO,CAACf,KAAK,CAACA,KAAK,CAAC;MACpB,CAAAa,sBAAA,IAAAC,YAAA,OAAI,CAACpB,KAAK,EAACgB,YAAY,cAAAG,sBAAA,eAAvBA,sBAAA,CAAAhB,IAAA,CAAAiB,YAAA,EAA0Bd,KAAK,EAAEC,SAAS,CAAC;MAC3C,IAAI,CAACU,QAAQ,CAAC;QAAEZ,QAAQ,EAAE,IAAI;QAAEC,KAAK,EAALA,KAAK;QAAEC,SAAS,EAAEA,SAAS,aAATA,SAAS,uBAATA,SAAS,CAAEe;MAAe,CAAC,CAAC;IAChF;EAAC;IAAAb,GAAA;IAAAC,KAAA,EAED,SAAAa,OAAA,EAAS;MACP,IAAI,IAAI,CAACnB,KAAK,CAACC,QAAQ,EAAE;QACvB;QACA,oBACEtB,KAAA,CAAAyC,aAAA,CAACtC,OAAO,qBACNH,KAAA,CAAAyC,aAAA,CAACjC,KAAK;UAACkC,uBAAuB,EAAE;YAAEC,MAAM,EAAE,IAAI,CAACtB,KAAK,CAACE;UAAM;QAAE,CAAE,CAAC,eAChEvB,KAAA,CAAAyC,aAAA,CAAC/B,OAAO;UAACgC,uBAAuB,EAAE;YAAEC,MAAM,EAAE,IAAI,CAACtB,KAAK,CAACG;UAAU;QAAE,CAAE,CAC9D,CAAC;MAEd;MAEA,OAAO,IAAI,CAACP,KAAK,CAACa,QAAQ;IAC5B;EAAC;EAAA,OAAAlB,aAAA;AAAA,EArCyBX,aAAa;AAwCzC,eAAeW,aAAa"}
|
|
@@ -12,8 +12,10 @@ import { keys } from 'lodash';
|
|
|
12
12
|
import { useContext } from "../../../engine/provider/ContextProvider";
|
|
13
13
|
import { executeCode } from "../../../engine/tools/helper";
|
|
14
14
|
import ErrorBoundary from "../../ErrorBoundary";
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
var ErrorContent = styled.p.withConfig({
|
|
16
|
+
displayName: "ErrorContent",
|
|
17
|
+
componentId: "luckda-6530__sc-1gmzk6q-0"
|
|
18
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);"]);
|
|
17
19
|
|
|
18
20
|
/**
|
|
19
21
|
* 实时代码渲染组件
|
|
@@ -45,11 +47,7 @@ var RuntimeCom = function RuntimeCom(_ref) {
|
|
|
45
47
|
return Fragment;
|
|
46
48
|
} catch (e) {
|
|
47
49
|
return function () {
|
|
48
|
-
return /*#__PURE__*/React.createElement(
|
|
49
|
-
style: {
|
|
50
|
-
color: 'red'
|
|
51
|
-
}
|
|
52
|
-
}, e.message);
|
|
50
|
+
return /*#__PURE__*/React.createElement(ErrorContent, null, e.message);
|
|
53
51
|
};
|
|
54
52
|
}
|
|
55
53
|
}, [children]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Fragment","Babel","LuckAntd","LuckDesign","AHooks","styled","keys","useContext","executeCode","ErrorBoundary","
|
|
1
|
+
{"version":3,"names":["React","Fragment","Babel","LuckAntd","LuckDesign","AHooks","styled","keys","useContext","executeCode","ErrorBoundary","ErrorContent","p","withConfig","displayName","componentId","RuntimeCom","_ref","children","onErrorCatch","rest","_objectWithoutProperties","_excluded","ctx","Component","useCreation","code","Children","toArray","join","trim","transformedCode","transform","presets","functionNameMatch","match","length","functionName","argsName","_args","map","n","apply","concat","_toConsumableArray","_objectSpread","e","createElement","message"],"sources":["../../../../../luckda/lowcode/view/lc-components/JSX/RuntimeComp.jsx"],"sourcesContent":["import React, { Fragment } from 'react';\nimport * as Babel from '@babel/standalone';\nimport * as LuckAntd from 'luck-design/antd';\nimport * as LuckDesign from 'luck-design';\nimport * as AHooks from 'ahooks';\nimport styled from 'styled-components';\nimport { keys } from 'lodash';\nimport { useContext } from '../../../engine/provider/ContextProvider';\nimport { executeCode } from '../../../engine/tools/helper';\nimport ErrorBoundary from '../../ErrorBoundary';\n\nconst ErrorContent = styled.p`\n white-space: pre-line;\n color: var(--luck-color-danger);\n`;\n\n/**\n * 实时代码渲染组件\n * todo：沙箱上下文的集成\n * todo：Loading效果的优化\n */\nconst RuntimeCom = ({ children, onErrorCatch, ...rest }) => {\n const ctx = useContext();\n\n const Component = AHooks.useCreation(() => {\n const code = React.Children.toArray(children).join('').trim();\n if (!code) return Fragment;\n\n try {\n // 使用Babel转换代码\n const transformedCode = Babel.transform(code, {\n presets: ['react'],\n }).code;\n const functionNameMatch = transformedCode.match(/function\\s+([^\\s(]+)/);\n if (functionNameMatch && functionNameMatch.length > 1) {\n const functionName = functionNameMatch[1];\n const argsName = keys(rest);\n const _args = argsName.map((n) => rest[n]);\n return executeCode(\n ctx,\n `function() {${transformedCode}; return ${functionName};}`,\n ['React', 'Antd', 'Luckd', 'styled', 'libs', ...argsName],\n React,\n LuckAntd,\n LuckDesign,\n styled,\n { ...AHooks },\n ..._args,\n );\n }\n return Fragment;\n } catch (e) {\n return () => <ErrorContent>{e.message}</ErrorContent>;\n }\n }, [children]);\n\n return (\n <ErrorBoundary onErrorCatch={onErrorCatch}>\n <Component />\n </ErrorBoundary>\n );\n};\n\nexport default RuntimeCom;\n"],"mappings":";;;;AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,OAAO,KAAKC,KAAK,MAAM,mBAAmB;AAC1C,OAAO,KAAKC,QAAQ,MAAM,kBAAkB;AAC5C,OAAO,KAAKC,UAAU,MAAM,aAAa;AACzC,OAAO,KAAKC,MAAM,MAAM,QAAQ;AAChC,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,UAAU;AACnB,SAASC,WAAW;AACpB,OAAOC,aAAa;AAEpB,IAAMC,YAAY,GAAGL,MAAM,CAACM,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4DAG5B;;AAED;AACA;AACA;AACA;AACA;AACA,IAAMC,UAAU,GAAG,SAAbA,UAAUA,CAAAC,IAAA,EAA4C;EAAA,IAAtCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,YAAY,GAAAF,IAAA,CAAZE,YAAY;IAAKC,IAAI,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EACnD,IAAMC,GAAG,GAAGf,UAAU,CAAC,CAAC;EAExB,IAAMgB,SAAS,GAAGnB,MAAM,CAACoB,WAAW,CAAC,YAAM;IACzC,IAAMC,IAAI,GAAG1B,KAAK,CAAC2B,QAAQ,CAACC,OAAO,CAACV,QAAQ,CAAC,CAACW,IAAI,CAAC,EAAE,CAAC,CAACC,IAAI,CAAC,CAAC;IAC7D,IAAI,CAACJ,IAAI,EAAE,OAAOzB,QAAQ;IAE1B,IAAI;MACF;MACA,IAAM8B,eAAe,GAAG7B,KAAK,CAAC8B,SAAS,CAACN,IAAI,EAAE;QAC5CO,OAAO,EAAE,CAAC,OAAO;MACnB,CAAC,CAAC,CAACP,IAAI;MACP,IAAMQ,iBAAiB,GAAGH,eAAe,CAACI,KAAK,CAAC,sBAAsB,CAAC;MACvE,IAAID,iBAAiB,IAAIA,iBAAiB,CAACE,MAAM,GAAG,CAAC,EAAE;QACrD,IAAMC,YAAY,GAAGH,iBAAiB,CAAC,CAAC,CAAC;QACzC,IAAMI,QAAQ,GAAG/B,IAAI,CAACa,IAAI,CAAC;QAC3B,IAAMmB,KAAK,GAAGD,QAAQ,CAACE,GAAG,CAAC,UAACC,CAAC;UAAA,OAAKrB,IAAI,CAACqB,CAAC,CAAC;QAAA,EAAC;QAC1C,OAAOhC,WAAW,CAAAiC,KAAA,UAChBnB,GAAG,iBAAAoB,MAAA,CACYZ,eAAe,eAAAY,MAAA,CAAYN,YAAY,UACrD,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAAM,MAAA,CAAAC,kBAAA,CAAKN,QAAQ,IACxDtC,KAAK,EACLG,QAAQ,EACRC,UAAU,EACVE,MAAM,EAAAuC,aAAA,KACDxC,MAAM,GAAAsC,MAAA,CAAAC,kBAAA,CACRL,KAAK,EACV,CAAC;MACH;MACA,OAAOtC,QAAQ;IACjB,CAAC,CAAC,OAAO6C,CAAC,EAAE;MACV,OAAO;QAAA,oBAAM9C,KAAA,CAAA+C,aAAA,CAACpC,YAAY,QAAEmC,CAAC,CAACE,OAAsB,CAAC;MAAA;IACvD;EACF,CAAC,EAAE,CAAC9B,QAAQ,CAAC,CAAC;EAEd,oBACElB,KAAA,CAAA+C,aAAA,CAACrC,aAAa;IAACS,YAAY,EAAEA;EAAa,gBACxCnB,KAAA,CAAA+C,aAAA,CAACvB,SAAS,MAAE,CACC,CAAC;AAEpB,CAAC;AAED,eAAeR,UAAU"}
|
|
@@ -48,7 +48,11 @@ var _JSEditor = function _JSEditor(_ref) {
|
|
|
48
48
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, children || /*#__PURE__*/_react.default.createElement(_antd.Button, {
|
|
49
49
|
block: true,
|
|
50
50
|
size: "small",
|
|
51
|
-
onClick: show
|
|
51
|
+
onClick: show,
|
|
52
|
+
style: {
|
|
53
|
+
margin: '0 8px',
|
|
54
|
+
width: 'calc(100% - 16px)'
|
|
55
|
+
}
|
|
52
56
|
}, (0, _utils.formatMessage)({
|
|
53
57
|
id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',
|
|
54
58
|
label: '源码编辑'
|
|
@@ -67,10 +71,10 @@ var _JSEditor = function _JSEditor(_ref) {
|
|
|
67
71
|
onClose: hidden
|
|
68
72
|
}, /*#__PURE__*/_react.default.createElement(_luckDesign.SplitPane, {
|
|
69
73
|
split: "vertical"
|
|
70
|
-
}, /*#__PURE__*/_react.default.createElement(_JSEditor2.default, {
|
|
74
|
+
}, /*#__PURE__*/_react.default.createElement(_luckDesign.SplitPane.Pane, null, /*#__PURE__*/_react.default.createElement(_JSEditor2.default, {
|
|
71
75
|
ref: editorRef,
|
|
72
76
|
onChange: run
|
|
73
|
-
}, defaultValue || defaultCode), /*#__PURE__*/_react.default.createElement(_luckDesign.SplitPane.Pane, {
|
|
77
|
+
}, defaultValue || defaultCode)), /*#__PURE__*/_react.default.createElement(_luckDesign.SplitPane.Pane, {
|
|
74
78
|
minSize: "400px"
|
|
75
79
|
}, /*#__PURE__*/_react.default.createElement(_RuntimeComp.default, {
|
|
76
80
|
onErrorCatch: handleErrorCatch
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_ahooks","_antd","_luckDesign","_utils","_RuntimeComp","_interopRequireDefault","_JSEditor2","_JSEditor","_ref","defaultValue","defaultCode","onChange","children","editorRef","useRef","_useState","useState","_useState2","_slicedToArray2","default","code","setCode","_useDebounceFn","useDebounceFn","_code","wait","run","_useBoolean","useBoolean","_useBoolean2","visible","_useBoolean2$","show","setTrue","hidden","setFalse","_useBoolean3","_useBoolean4","hasError","_useBoolean4$","hasErrorOn","hasErrorOff","handleErrorCatch","useMemoizedFn","error","console","log","createElement","Fragment","Button","block","size","onClick","formatMessage","id","label","LuckModal","title","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_ahooks","_antd","_luckDesign","_utils","_RuntimeComp","_interopRequireDefault","_JSEditor2","_JSEditor","_ref","defaultValue","defaultCode","onChange","children","editorRef","useRef","_useState","useState","_useState2","_slicedToArray2","default","code","setCode","_useDebounceFn","useDebounceFn","_code","wait","run","_useBoolean","useBoolean","_useBoolean2","visible","_useBoolean2$","show","setTrue","hidden","setFalse","_useBoolean3","_useBoolean4","hasError","_useBoolean4$","hasErrorOn","hasErrorOff","handleErrorCatch","useMemoizedFn","error","console","log","createElement","Fragment","Button","block","size","onClick","style","margin","width","formatMessage","id","label","LuckModal","title","height","fullScreen","mask","maskClosable","closable","onClose","SplitPane","split","Pane","ref","minSize","onErrorCatch","_default","exports"],"sources":["../../../../luckda/lowcode/painter/panel-section/JSEditor.jsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\nimport { useBoolean, useDebounceFn, useMemoizedFn } from 'ahooks';\nimport { Button } from 'luck-design/antd';\nimport { LuckModal, SplitPane } from 'luck-design';\nimport { formatMessage } from '@luck-design-biz/base/utils';\nimport RuntimeComp from '../../view/lc-components/JSX/RuntimeComp';\nimport JSEditor from '../components/code-editor/JSEditor';\n\nconst _JSEditor = ({ defaultValue, defaultCode, onChange, children }) => {\n const editorRef = useRef();\n const [code, setCode] = useState(defaultValue || defaultCode);\n const { run } = useDebounceFn(\n (_code) => {\n setCode(_code);\n },\n { wait: 500 },\n );\n const [visible, { setTrue: show, setFalse: hidden }] = useBoolean(false);\n const [hasError, { setTrue: hasErrorOn, setFalse: hasErrorOff }] = useBoolean(false);\n\n const handleErrorCatch = useMemoizedFn((error) => {\n console.log(12121212, error);\n });\n\n return (\n <>\n {children || (\n <Button\n block\n size=\"small\"\n onClick={show}\n style={{ margin: '0 8px', width: 'calc(100% - 16px)' }}\n >\n {formatMessage({\n id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',\n label: '源码编辑',\n })}\n </Button>\n )}\n <LuckModal\n title={formatMessage({\n id: 'luckda.lowcode.painter.panel-section.style-panel.sourceedit',\n label: '源码编辑',\n })}\n width=\"80vw\"\n height=\"80vh\"\n fullScreen\n mask={false}\n maskClosable={false}\n closable={false}\n visible={visible}\n onClose={hidden}\n >\n <SplitPane split=\"vertical\">\n <SplitPane.Pane>\n <JSEditor ref={editorRef} onChange={run}>\n {defaultValue || defaultCode}\n </JSEditor>\n </SplitPane.Pane>\n <SplitPane.Pane minSize=\"400px\">\n <RuntimeComp onErrorCatch={handleErrorCatch}>{code}</RuntimeComp>\n </SplitPane.Pane>\n </SplitPane>\n </LuckModal>\n </>\n );\n};\n\nexport default _JSEditor;\n"],"mappings":"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"}
|
|
@@ -15,7 +15,15 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
15
15
|
var Wrapper = _styledComponents.default.div.withConfig({
|
|
16
16
|
displayName: "Wrapper",
|
|
17
17
|
componentId: "luckda-6530__sc-1ge5tx6-0"
|
|
18
|
-
})(["width:100%;height:100%;
|
|
18
|
+
})(["width:100%;height:100%;overflow:auto;"]);
|
|
19
|
+
var Title = _styledComponents.default.h3.withConfig({
|
|
20
|
+
displayName: "Title",
|
|
21
|
+
componentId: "luckda-6530__sc-1ge5tx6-1"
|
|
22
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);fontSize:1.5rem;"]);
|
|
23
|
+
var Content = _styledComponents.default.p.withConfig({
|
|
24
|
+
displayName: "Content",
|
|
25
|
+
componentId: "luckda-6530__sc-1ge5tx6-2"
|
|
26
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);"]);
|
|
19
27
|
var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
20
28
|
(0, _inherits2.default)(ErrorBoundary, _PureComponent);
|
|
21
29
|
var _super = (0, _createSuper2.default)(ErrorBoundary);
|
|
@@ -34,7 +42,9 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
34
42
|
key: "componentDidUpdate",
|
|
35
43
|
value: function componentDidUpdate(prevProps) {
|
|
36
44
|
if (this.props.children !== prevProps.children && this.state.hasError) {
|
|
45
|
+
var _this$props$onErrorCa, _this$props;
|
|
37
46
|
// 重置 hasError 为 false 以便重新渲染子组件
|
|
47
|
+
(_this$props$onErrorCa = (_this$props = this.props).onErrorCatch) === null || _this$props$onErrorCa === void 0 || _this$props$onErrorCa.call(_this$props);
|
|
38
48
|
this.setState({
|
|
39
49
|
hasError: false,
|
|
40
50
|
error: '',
|
|
@@ -45,10 +55,10 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
45
55
|
}, {
|
|
46
56
|
key: "componentDidCatch",
|
|
47
57
|
value: function componentDidCatch(error, errorInfo) {
|
|
48
|
-
var _this$props$
|
|
58
|
+
var _this$props$onErrorCa2, _this$props2;
|
|
49
59
|
// 在此处记录错误信息
|
|
50
60
|
console.error(error);
|
|
51
|
-
(_this$props$
|
|
61
|
+
(_this$props$onErrorCa2 = (_this$props2 = this.props).onErrorCatch) === null || _this$props$onErrorCa2 === void 0 || _this$props$onErrorCa2.call(_this$props2, error, errorInfo);
|
|
52
62
|
this.setState({
|
|
53
63
|
hasError: true,
|
|
54
64
|
error: error,
|
|
@@ -60,20 +70,11 @@ var ErrorBoundary = /*#__PURE__*/function (_PureComponent) {
|
|
|
60
70
|
value: function render() {
|
|
61
71
|
if (this.state.hasError) {
|
|
62
72
|
// 如果有错误,显示备用 UI
|
|
63
|
-
return /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(
|
|
64
|
-
style: {
|
|
65
|
-
whiteSpace: 'pre-line',
|
|
66
|
-
color: 'var(--luck-color-danger)',
|
|
67
|
-
fontSize: '1.5rem'
|
|
68
|
-
},
|
|
73
|
+
return /*#__PURE__*/_react.default.createElement(Wrapper, null, /*#__PURE__*/_react.default.createElement(Title, {
|
|
69
74
|
dangerouslySetInnerHTML: {
|
|
70
75
|
__html: this.state.error
|
|
71
76
|
}
|
|
72
|
-
}), /*#__PURE__*/_react.default.createElement(
|
|
73
|
-
style: {
|
|
74
|
-
whiteSpace: 'pre-line',
|
|
75
|
-
color: 'var(--luck-color-danger)'
|
|
76
|
-
},
|
|
77
|
+
}), /*#__PURE__*/_react.default.createElement(Content, {
|
|
77
78
|
dangerouslySetInnerHTML: {
|
|
78
79
|
__html: this.state.errorInfo
|
|
79
80
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","Wrapper","styled","div","withConfig","displayName","componentId","ErrorBoundary","_PureComponent","_inherits2","default","_super","_createSuper2","props","_this","_classCallCheck2","call","state","hasError","error","errorInfo","_createClass2","key","value","componentDidUpdate","prevProps","children","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","Wrapper","styled","div","withConfig","displayName","componentId","Title","h3","Content","p","ErrorBoundary","_PureComponent","_inherits2","default","_super","_createSuper2","props","_this","_classCallCheck2","call","state","hasError","error","errorInfo","_createClass2","key","value","componentDidUpdate","prevProps","children","_this$props$onErrorCa","_this$props","onErrorCatch","setState","componentDidCatch","_this$props$onErrorCa2","_this$props2","console","componentStack","render","createElement","dangerouslySetInnerHTML","__html","PureComponent","_default","exports"],"sources":["../../../luckda/lowcode/view/ErrorBoundary.jsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport styled from 'styled-components';\n\nconst Wrapper = styled.div`\n width: 100%;\n height: 100%;\n overflow: auto;\n`;\nconst Title = styled.h3`\n white-space: pre-line;\n color: var(--luck-color-danger);\n fontSize: 1.5rem;\n`;\nconst Content = styled.p`\n white-space: pre-line;\n color: var(--luck-color-danger);\n`;\n\nclass ErrorBoundary extends PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n hasError: false,\n error: '',\n errorInfo: '',\n };\n }\n\n componentDidUpdate(prevProps) {\n if (this.props.children !== prevProps.children && this.state.hasError) {\n // 重置 hasError 为 false 以便重新渲染子组件\n this.props.onErrorCatch?.();\n this.setState({ hasError: false, error: '', errorInfo: '' });\n }\n }\n\n componentDidCatch(error, errorInfo) {\n // 在此处记录错误信息\n console.error(error);\n this.props.onErrorCatch?.(error, errorInfo);\n this.setState({ hasError: true, error, errorInfo: errorInfo?.componentStack });\n }\n\n render() {\n if (this.state.hasError) {\n // 如果有错误,显示备用 UI\n return (\n <Wrapper>\n <Title dangerouslySetInnerHTML={{ __html: this.state.error }} />\n <Content dangerouslySetInnerHTML={{ __html: this.state.errorInfo }} />\n </Wrapper>\n );\n }\n\n return this.props.children;\n }\n}\n\nexport default ErrorBoundary;\n"],"mappings":"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"}
|
|
@@ -19,8 +19,12 @@ var _lodash = require("lodash");
|
|
|
19
19
|
var _ContextProvider = require("../../../engine/provider/ContextProvider");
|
|
20
20
|
var _helper = require("../../../engine/tools/helper");
|
|
21
21
|
var _ErrorBoundary = _interopRequireDefault(require("../../ErrorBoundary"));
|
|
22
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
23
22
|
var _excluded = ["children", "onErrorCatch"];
|
|
23
|
+
var ErrorContent = _styledComponents.default.p.withConfig({
|
|
24
|
+
displayName: "ErrorContent",
|
|
25
|
+
componentId: "luckda-6530__sc-1gmzk6q-0"
|
|
26
|
+
})(["white-space:pre-line;color:var(--luck-color-danger);"]);
|
|
27
|
+
|
|
24
28
|
/**
|
|
25
29
|
* 实时代码渲染组件
|
|
26
30
|
* todo：沙箱上下文的集成
|
|
@@ -51,11 +55,7 @@ var RuntimeCom = function RuntimeCom(_ref) {
|
|
|
51
55
|
return _react.Fragment;
|
|
52
56
|
} catch (e) {
|
|
53
57
|
return function () {
|
|
54
|
-
return /*#__PURE__*/_react.default.createElement(
|
|
55
|
-
style: {
|
|
56
|
-
color: 'red'
|
|
57
|
-
}
|
|
58
|
-
}, e.message);
|
|
58
|
+
return /*#__PURE__*/_react.default.createElement(ErrorContent, null, e.message);
|
|
59
59
|
};
|
|
60
60
|
}
|
|
61
61
|
}, [children]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","Babel","LuckAntd","LuckDesign","AHooks","_styledComponents","_interopRequireDefault","_lodash","_ContextProvider","_helper","_ErrorBoundary","
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","Babel","LuckAntd","LuckDesign","AHooks","_styledComponents","_interopRequireDefault","_lodash","_ContextProvider","_helper","_ErrorBoundary","_excluded","ErrorContent","styled","p","withConfig","displayName","componentId","RuntimeCom","_ref","children","onErrorCatch","rest","_objectWithoutProperties2","default","ctx","useContext","Component","useCreation","code","React","Children","toArray","join","trim","Fragment","transformedCode","transform","presets","functionNameMatch","match","length","functionName","argsName","keys","_args","map","n","executeCode","apply","concat","_toConsumableArray2","_objectSpread2","e","createElement","message","_default","exports"],"sources":["../../../../../luckda/lowcode/view/lc-components/JSX/RuntimeComp.jsx"],"sourcesContent":["import React, { Fragment } from 'react';\nimport * as Babel from '@babel/standalone';\nimport * as LuckAntd from 'luck-design/antd';\nimport * as LuckDesign from 'luck-design';\nimport * as AHooks from 'ahooks';\nimport styled from 'styled-components';\nimport { keys } from 'lodash';\nimport { useContext } from '../../../engine/provider/ContextProvider';\nimport { executeCode } from '../../../engine/tools/helper';\nimport ErrorBoundary from '../../ErrorBoundary';\n\nconst ErrorContent = styled.p`\n white-space: pre-line;\n color: var(--luck-color-danger);\n`;\n\n/**\n * 实时代码渲染组件\n * todo：沙箱上下文的集成\n * todo：Loading效果的优化\n */\nconst RuntimeCom = ({ children, onErrorCatch, ...rest }) => {\n const ctx = useContext();\n\n const Component = AHooks.useCreation(() => {\n const code = React.Children.toArray(children).join('').trim();\n if (!code) return Fragment;\n\n try {\n // 使用Babel转换代码\n const transformedCode = Babel.transform(code, {\n presets: ['react'],\n }).code;\n const functionNameMatch = transformedCode.match(/function\\s+([^\\s(]+)/);\n if (functionNameMatch && functionNameMatch.length > 1) {\n const functionName = functionNameMatch[1];\n const argsName = keys(rest);\n const _args = argsName.map((n) => rest[n]);\n return executeCode(\n ctx,\n `function() {${transformedCode}; return ${functionName};}`,\n ['React', 'Antd', 'Luckd', 'styled', 'libs', ...argsName],\n React,\n LuckAntd,\n LuckDesign,\n styled,\n { ...AHooks },\n ..._args,\n );\n }\n return Fragment;\n } catch (e) {\n return () => <ErrorContent>{e.message}</ErrorContent>;\n }\n }, [children]);\n\n return (\n <ErrorBoundary onErrorCatch={onErrorCatch}>\n <Component />\n </ErrorBoundary>\n );\n};\n\nexport default RuntimeCom;\n"],"mappings":"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"}
|