UNPKG

jamis

Version:

一种支持通过JSON配置方式生成页面的组件库

2 lines (1 loc) 7.11 kB
import{R as a,D as v,v as h,w as m,I as W,B as I}from"../sdk.js";const w="data:application/javascript;base64,LyotLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0KICogIENvcHlyaWdodCAoYykgTWljcm9zb2Z0IENvcnBvcmF0aW9uLiBBbGwgcmlnaHRzIHJlc2VydmVkLgogKiAgTGljZW5zZWQgdW5kZXIgdGhlIE1JVCBMaWNlbnNlLiBTZWUgTGljZW5zZS50eHQgaW4gdGhlIHByb2plY3Qgcm9vdCBmb3IgbGljZW5zZSBpbmZvcm1hdGlvbi4KICotLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLSovCmltcG9ydCB7IFNpbXBsZVdvcmtlclNlcnZlciB9IGZyb20gJy4uL2Jhc2UvY29tbW9uL3dvcmtlci9zaW1wbGVXb3JrZXIuanMnOwppbXBvcnQgeyBFZGl0b3JTaW1wbGVXb3JrZXIgfSBmcm9tICcuL2NvbW1vbi9zZXJ2aWNlcy9lZGl0b3JTaW1wbGVXb3JrZXIuanMnOwpsZXQgaW5pdGlhbGl6ZWQgPSBmYWxzZTsKZXhwb3J0IGZ1bmN0aW9uIGluaXRpYWxpemUoZm9yZWlnbk1vZHVsZSkgewogICAgaWYgKGluaXRpYWxpemVkKSB7CiAgICAgICAgcmV0dXJuOwogICAgfQogICAgaW5pdGlhbGl6ZWQgPSB0cnVlOwogICAgY29uc3Qgc2ltcGxlV29ya2VyID0gbmV3IFNpbXBsZVdvcmtlclNlcnZlcigobXNnKSA9PiB7CiAgICAgICAgc2VsZi5wb3N0TWVzc2FnZShtc2cpOwogICAgfSwgKGhvc3QpID0+IG5ldyBFZGl0b3JTaW1wbGVXb3JrZXIoaG9zdCwgZm9yZWlnbk1vZHVsZSkpOwogICAgc2VsZi5vbm1lc3NhZ2UgPSAoZSkgPT4gewogICAgICAgIHNpbXBsZVdvcmtlci5vbm1lc3NhZ2UoZS5kYXRhKTsKICAgIH07Cn0Kc2VsZi5vbm1lc3NhZ2UgPSAoZSkgPT4gewogICAgLy8gSWdub3JlIGZpcnN0IG1lc3NhZ2UgaW4gdGhpcyBjYXNlIGFuZCBpbml0aWFsaXplIGlmIG5vdCB5ZXQgaW5pdGlhbGl6ZWQKICAgIGlmICghaW5pdGlhbGl6ZWQpIHsKICAgICAgICBpbml0aWFsaXplKG51bGwpOwogICAgfQp9Owo=",Z="//static.cdn.tencent.com/cjit/jamis/13.0.4/sdk/assets/json.worker.c171a23f.js",L="//static.cdn.tencent.com/cjit/jamis/13.0.4/sdk/assets/css.worker.ef56f469.js",g="//static.cdn.tencent.com/cjit/jamis/13.0.4/sdk/assets/html.worker.046f55f9.js",f="//static.cdn.tencent.com/cjit/jamis/13.0.4/sdk/assets/ts.worker.fb690228.js";var C=Object.defineProperty,y=Object.getOwnPropertyDescriptor,G=(r,t,e,o)=>{for(var s=o>1?void 0:o?y(t,e):t,i=r.length-1,n;i>=0;i--)(n=r[i])&&(s=(o?n(t,e,s):n(s))||s);return o&&s&&C(t,e,s),s};self.MonacoEnvironment||(self.MonacoEnvironment=function(r){return{globalAPI:!1,getWorkerUrl:function(t,e){const o=r[e];if(/^((http:)|(https:)|(file:)|(\/\/))/.test(o)){const s=String(window.location),i=s.substr(0,s.length-window.location.hash.length-window.location.search.length-window.location.pathname.length);if(o.substring(0,i.length)!==i){const n="/*"+e+'*/importScripts("'+o+'");',l=new Blob([n],{type:"application/javascript"});return URL.createObjectURL(l)}}return o}}}({editorWorkerService:w,css:L,html:g,json:Z,typescript:f,javascript:f,scss:L,handlebars:g,razor:g}));function j(r,t,e){return t.editor.create(r,{autoIndent:!0,formatOnType:!0,formatOnPaste:!0,selectOnLineNumbers:!0,scrollBeyondLastLine:!1,folding:!0,minimap:{enabled:!1},scrollbar:{alwaysConsumeMouseWheel:!1},"bracketPairColorization.enabled":!0,...e})}class b extends a.Component{constructor(t){super(t),this.state={isFullscreen:!1,innerWidth:"auto",innerHeight:"auto"},this.disposes=[],this.wrapperRef=this.wrapperRef.bind(this),this.currentValue=t.value}componentDidUpdate(t){var e,o;if(this.props.value!==this.currentValue&&this.editor&&!this.props.isDiffEditor){let s=String(this.props.value);if(this.props.language==="json")try{s=JSON.stringify(JSON.parse(s),null,2)}catch{}this.preventTriggerChangeEvent=!0;const i=this.editor.getModifiedEditor?this.editor.getModifiedEditor():this.editor,n=i.getModel();i.pushUndoStop(),n.pushEditOperations([],[{range:n.getFullModelRange(),text:s}]),i.pushUndoStop(),this.preventTriggerChangeEvent=!1}this.props.options.readOnly!==t.options.readOnly&&this.editor&&((o=(e=this.editor).updateOptions)==null||o.call(e,this.props.options))}componentWillUnmount(){var t;if(this.editor){const o=(this.props.context||window).monaco||window.monaco,s=this.props.editorWillUnmount;s&&s(this.editor,o)}this.disposes.forEach(({dispose:e})=>e()),this.disposes=[],(t=this.editor)==null||t.dispose()}wrapperRef(t){if(this.container=t,t)this.loadMonaco();else try{this.disposes.forEach(({dispose:e})=>e()),this.disposes=[],this.editor&&(this.editor.getModel().dispose(),this.editor.dispose()),this.editor=null}catch{}}loadMonaco(){v(()=>import("./editor.main.844e42d1.js").then(t=>t.e),["chunks/editor.main.844e42d1.js","sdk.js","assets/sdk.css","assets/editor.c9c04ba9.css"]).then(t=>this.initMonaco(t))}initMonaco(t){var c,d;let e=this.props.value!==null?this.props.value:this.props.defaultValue;const{language:o,editorTheme:s,options:i,editorFactory:n}=this.props,l=this.container;if(!l)return;if(this.editorWillMount(t),this.props.language==="json")try{e=JSON.stringify(typeof e=="string"?JSON.parse(e):e,null,2)}catch{}const p=n||j;this.editor=p(l,t,{...i,automaticLayout:!0,value:e,language:o,editorTheme:s,theme:s}),(d=t.languages.json)==null||d.jsonDefaults.setDiagnosticsOptions({enableSchemaRequest:!0,validate:!0,allowComments:!0,...(c=t.languages.json)==null?void 0:c.jsonDefaults.diagnosticsOptions}),this.editorDidMount(this.editor,t)}editorWillMount(t){const{editorWillMount:e}=this.props;e&&e(t)}editorDidMount(t,e){var c,d;const{editorDidMount:o,onChange:s,onFocus:i,onBlur:n}=this.props;o&&o(t,e),t.onDidChangeModelContent&&this.disposes.push(t.onDidChangeModelContent(u=>{const S=t.getValue();this.currentValue=S,!this.preventTriggerChangeEvent&&s&&s(S,u)})),i&&t.onDidFocusEditorWidget&&this.disposes.push(t.onDidFocusEditorWidget(i)),n&&t.onDidBlurEditorWidget&&this.disposes.push(t.onDidBlurEditorWidget(n));const{width:l="auto",height:p="auto"}=((d=(c=this==null?void 0:this.editor)==null?void 0:c._configuration)==null?void 0:d._elementSizeObserver)??{};this.setState({innerHeight:p,innerWidth:l})}handleFullscreenModeChange(){this.setState({isFullscreen:!this.state.isFullscreen},()=>!this.state.isFullscreen&&this.editor.layout({width:this.state.innerWidth,height:this.state.innerHeight}))}render(){const{className:t,width:e,height:o,placeholder:s,value:i}=this.props,n={...this.props.style||{}};return n.width=e,n.height=o,a.createElement("section",{className:h("MonacoEditor","relative flex flex-col-reverse",this.state.isFullscreen&&["is-fullscreen","f:fixed inset-0 z-999","f:m-0 w-auto"],t),ref:this.wrapperRef,style:n},this.editor&&this.props.allowFullscreen?a.createElement("div",{className:h("MonacoEditor-header","absolute inset-0","text-right","h-8 px-3 leading-8","bg-gray-100")},a.createElement("a",{className:h("MonacoEditor-fullscreen","cursor-pointer","no-underline","text-center","align-middle","hover:text-dark"),"data-tooltip":this.state.isFullscreen?m("Editor.exitFullscreen"):m("Editor.fullscreen"),"data-position":"left",onClick:this.handleFullscreenModeChange},a.createElement(W,{icon:this.state.isFullscreen?"compress-alt":"expand-alt",className:"icon"}))):null,this.editor&&s&&!i?a.createElement("span",{className:h("MonacoEditor-placeholder","absolute top-8 left-16 right-4","text-gray-400 pointer-events-none")},s):null)}}b.defaultProps={language:"javascript",editorTheme:"vs",width:"100%",height:"100%",allowFullscreen:!1,options:{}};G([I],b.prototype,"handleFullscreenModeChange",1);export{b as Editor,b as default,j as monacoFactory};