298.207f8b96.chunk.js.download

(this["webpackJsonp@builder.io/app"]=this["webpackJsonp@builder.io/app"]||[]).push([[298],{5837:function(module,exports,__webpack_require__){module.exports=__webpack_require__.p+"static/media/json.77a5d724.svg"},6332:function(module,__webpack_exports__,__webpack_require__){"use strict";__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,"JSONEditor",function(){return JSONEditor});var _emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__(0),_builder_io_react__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__(19),mobx_react__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__(90),lodash__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__(6),lodash__WEBPACK_IMPORTED_MODULE_3___default=__webpack_require__.n(lodash__WEBPACK_IMPORTED_MODULE_3__),_functions_async_component_function__WEBPACK_IMPORTED_MODULE_4__=__webpack_require__(27),_material_ui_core__WEBPACK_IMPORTED_MODULE_5__=__webpack_require__(105),_material_ui_core__WEBPACK_IMPORTED_MODULE_5___default=__webpack_require__.n(_material_ui_core__WEBPACK_IMPORTED_MODULE_5__),_assets_json_svg__WEBPACK_IMPORTED_MODULE_6__=__webpack_require__(5837),_assets_json_svg__WEBPACK_IMPORTED_MODULE_6___default=__webpack_require__.n(_assets_json_svg__WEBPACK_IMPORTED_MODULE_6__);const AsyncMonacoEditor=Object(_functions_async_component_function__WEBPACK_IMPORTED_MODULE_4__.a)(async()=>(await Promise.all([__webpack_require__.e(0),__webpack_require__.e(8)]).then(__webpack_require__.t.bind(null,2625,7))).default),JSONEditor=props=>{const state=Object(mobx_react__WEBPACK_IMPORTED_MODULE_2__.f)(()=>({showError:!1,stringValue:JSON.stringify(props.value,null,2)}));return Object(mobx_react__WEBPACK_IMPORTED_MODULE_2__.g)(()=>Object(_emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.c)(_emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.a,{children:[Object(_emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.b)("div",Object.assign({className:"dark-mode-invert",css:{minHeight:300,height:"50vh",padding:20,marginTop:20,overflow:"hidden"}},{children:Object(_emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.b)(AsyncMonacoEditor,{language:"json",theme:"vs-dark",options:{lineNumbers:"off",minimap:{enabled:!1},renderLineHighlight:"none",scrollBeyondLastLine:!1,scrollbar:{horizontal:"hidden",vertical:"hidden"}},defaultValue:state.stringValue,onChange:Object(lodash__WEBPACK_IMPORTED_MODULE_3__.debounce)(val=>{try{const parsed=JSON.parse(val);props.onChange(parsed),state.showError=!1}catch(err){state.showError=!0,console.warn("Could not parse and apply edited JSON",err)}},300)})})),state.showError&&Object(_emotion_react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.b)(_material_ui_core__WEBPACK_IMPORTED_MODULE_5___default.a,Object.assign({variant:"caption",css:{color:"var(--red)",padding:"10px 0"}},{children:"Invalid JSON value"}))]}))};_builder_io_react__WEBPACK_IMPORTED_MODULE_1__.Builder.registerEditor({name:"json",description:"Free-form JSON",icon:_assets_json_svg__WEBPACK_IMPORTED_MODULE_6___default.a,component:JSONEditor,hideFromTargeting:!0})}}]);