${msg}`) }
+ this.logCallback = (msg) => { this.call('terminal', 'logHtml', yo`${msg}`) }
this.filePanel = filePanel
this.compilersArtefacts = compilersArtefacts
this.networkModule = networkModule
diff --git a/apps/remix-ide/src/framingService.js b/apps/remix-ide/src/framingService.js
deleted file mode 100644
index ed029b7a65c..00000000000
--- a/apps/remix-ide/src/framingService.js
+++ /dev/null
@@ -1,34 +0,0 @@
-export class FramingService {
- constructor (sidePanel, verticalIcons, mainView, resizeFeature) {
- this.sidePanel = sidePanel
- this.verticalIcons = verticalIcons
- this.mainPanel = mainView.getAppPanel()
- this.mainView = mainView
- this.resizeFeature = resizeFeature
- }
-
- start (params) {
- this.verticalIcons.select('filePanel')
-
- document.addEventListener('keypress', (e) => {
- if (e.shiftKey && e.ctrlKey) {
- if (e.code === 'KeyF') { // Ctrl+Shift+F
- this.verticalIcons.select('filePanel')
- } else if (e.code === 'KeyA') { // Ctrl+Shift+A
- this.verticalIcons.select('pluginManager')
- } else if (e.code === 'KeyS') { // Ctrl+Shift+S
- this.verticalIcons.select('settings')
- }
- e.preventDefault()
- }
- })
-
- if (params.minimizeterminal) this.mainView.minimizeTerminal()
- if (params.minimizesidepanel) this.resizeFeature.hidePanel()
- }
-
- embed () {
- this.mainView.minimizeTerminal()
- this.resizeFeature.hidePanel()
- }
-}
diff --git a/apps/remix-ide/src/lib/panels-resize.js b/apps/remix-ide/src/lib/panels-resize.js
deleted file mode 100644
index 157535a8695..00000000000
--- a/apps/remix-ide/src/lib/panels-resize.js
+++ /dev/null
@@ -1,88 +0,0 @@
-const yo = require('yo-yo')
-const csjs = require('csjs-inject')
-
-const css = csjs`
- .dragbar {
- width : 2px;
- height : 100%;
- cursor : col-resize;
- z-index : 999;
- }
- .ghostbar {
- width : 3px;
- background-color : var(--primary);
- opacity : 0.5;
- position : absolute;
- cursor : col-resize;
- z-index : 9999;
- top : 0;
- bottom : 0;
- }
-`
-
-export default class PanelsResize {
- constructor (panel) {
- this.panel = panel
- const string = panel.style.minWidth
- this.minWidth = string.length > 2 ? parseInt(string.substring(0, string.length - 2)) : 0
- }
-
- render () {
- this.ghostbar = yo``
-
- const mousedown = (event) => {
- event.preventDefault()
- if (event.which === 1) {
- moveGhostbar(event)
- document.body.appendChild(this.ghostbar)
- document.addEventListener('mousemove', moveGhostbar)
- document.addEventListener('mouseup', removeGhostbar)
- document.addEventListener('keydown', cancelGhostbar)
- }
- }
-
- const cancelGhostbar = (event) => {
- if (event.keyCode === 27) {
- document.body.removeChild(this.ghostbar)
- document.removeEventListener('mousemove', moveGhostbar)
- document.removeEventListener('mouseup', removeGhostbar)
- document.removeEventListener('keydown', cancelGhostbar)
- }
- }
-
- const moveGhostbar = (event) => {
- this.ghostbar.style.left = event.x + 'px'
- }
-
- const removeGhostbar = (event) => {
- document.body.removeChild(this.ghostbar)
- document.removeEventListener('mousemove', moveGhostbar)
- document.removeEventListener('mouseup', removeGhostbar)
- document.removeEventListener('keydown', cancelGhostbar)
- this.setPosition(event)
- }
-
- return yo``
- }
-
- calculatePanelWidth (event) {
- return event.x - this.panel.offsetLeft
- }
-
- setPosition (event) {
- const panelWidth = this.calculatePanelWidth(event)
- // close the panel if the width is less than a minWidth
- if (panelWidth > this.minWidth - 10 || this.panel.style.display === 'none') {
- this.panel.style.width = panelWidth + 'px'
- this.showPanel()
- } else this.hidePanel()
- }
-
- hidePanel () {
- this.panel.style.display = 'none'
- }
-
- showPanel () {
- this.panel.style.display = 'flex'
- }
-}
diff --git a/apps/remix-ide/src/remixAppManager.js b/apps/remix-ide/src/remixAppManager.js
index 74410cadf0a..5f5fa2f8eb6 100644
--- a/apps/remix-ide/src/remixAppManager.js
+++ b/apps/remix-ide/src/remixAppManager.js
@@ -1,20 +1,20 @@
/* global localStorage, fetch */
import { PluginManager } from '@remixproject/engine'
-import { IframePlugin } from '@remixproject/engine-web'
import { EventEmitter } from 'events'
import QueryParams from './lib/query-params'
import { PermissionHandler } from './app/ui/persmission-handler'
+import { IframePlugin } from '@remixproject/engine-web'
const _paq = window._paq = window._paq || []
const requiredModules = [ // services + layout views + system views
'manager', 'config', 'compilerArtefacts', 'compilerMetadata', 'contextualListener', 'editor', 'offsetToLineColumnConverter', 'network', 'theme',
'fileManager', 'contentImport', 'blockchain', 'web3Provider', 'scriptRunner', 'fetchAndCompile', 'mainPanel', 'hiddenPanel', 'sidePanel', 'menuicons',
- 'filePanel', 'terminal', 'settings', 'pluginManager', 'tabs', 'udapp', 'dGitProvider', 'solidity-logic', 'gistHandler']
+ 'filePanel', 'terminal', 'settings', 'pluginManager', 'tabs', 'udapp', 'dGitProvider', 'solidity-logic', 'gistHandler', 'layout', 'modal']
const dependentModules = ['git', 'hardhat', 'slither'] // module which shouldn't be manually activated (e.g git is activated by remixd)
export function isNative (name) {
- const nativePlugins = ['vyper', 'workshops', 'debugger', 'remixd', 'menuicons', 'solidity', 'hardhat-provider', 'solidityStaticAnalysis', 'solidityUnitTesting']
+ const nativePlugins = ['vyper', 'workshops', 'debugger', 'remixd', 'menuicons', 'solidity', 'hardhat-provider', 'solidityStaticAnalysis', 'solidityUnitTesting', 'layout', 'modal']
return nativePlugins.includes(name) || requiredModules.includes(name)
}
@@ -78,6 +78,7 @@ export class RemixAppManager extends PluginManager {
onPluginActivated (plugin) {
this.pluginLoader.set(plugin, this.actives)
this.event.emit('activate', plugin)
+ this.emit('activate', plugin)
if (!requiredModules.includes(plugin.name)) _paq.push(['trackEvent', 'pluginManager', 'activate', plugin.name])
}
@@ -131,6 +132,7 @@ export class RemixAppManager extends PluginManager {
}
return plugins.map(plugin => {
return new IframePlugin(plugin)
+ // return new IframeReactPlugin(plugin)
})
}
diff --git a/apps/remix-ide/tsconfig.json b/apps/remix-ide/tsconfig.json
index 052537730e5..04d219a926b 100644
--- a/apps/remix-ide/tsconfig.json
+++ b/apps/remix-ide/tsconfig.json
@@ -4,6 +4,7 @@
"jsx": "react",
"allowJs": true,
"esModuleInterop": true,
+ "resolveJsonModule": true,
"allowSyntheticDefaultImports": true,
"types": ["node", "jest"],
"module": "es6",
diff --git a/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.css b/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.css
index a423dd6605b..1330c1179c0 100644
--- a/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.css
+++ b/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.css
@@ -1,26 +1,27 @@
/* dragbar UI */
-.dragbar {
- display : block;
- height : 100%;
- position : absolute;
- left: 0px;
- top: 0px;
- width: 0.3em;
- z-index: 9999;
- }
-
- .overlay {
- position: absolute;
- left: 0;
- top: 0;
- width: 100vw;
- height: 100vh;
- display: block;
- z-index: 9998;
- }
-
- .dragbar:hover, .dragbar.ondrag{
- background-color: var(--secondary);
- cursor:col-resize;
- }
\ No newline at end of file
+.dragbar {
+ display: block;
+ height: 100%;
+ position: absolute;
+ left: 0px;
+ top: 0px;
+ width: 0.3em;
+ z-index: 9999;
+}
+
+.overlay {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100vw;
+ height: 100vh;
+ display: block;
+ z-index: 9998;
+}
+
+.dragbar:hover,
+.dragbar.ondrag {
+ background-color: var(--secondary);
+ cursor: col-resize;
+}
diff --git a/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx b/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx
index 29c4eeda6bc..429e49f6388 100644
--- a/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx
+++ b/libs/remix-ui/app/src/lib/remix-app/components/dragbar/dragbar.tsx
@@ -15,18 +15,23 @@ const DragBar = (props: IRemixDragBarUi) => {
const [offset, setOffSet] = useState