Fix release

.github/workflows/check_build.yml

@@ -9,11 +9,11 @@ jobs:
     name: Lint commits
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           # we actually need "github.event.pull_request.commits + 1" commit
           fetch-depth: 0
-      - uses: actions/setup-node@v3
+      - uses: actions/setup-node@v4
       - run: npm ci
       - run: npx commitlint --from ${{ github.event.pull_request.head.sha }}~${{ github.event.pull_request.commits }} --to ${{ github.event.pull_request.head.sha }} --verbose
   check:
@@ -22,11 +22,11 @@ jobs:
 
     steps:
     - name: Checkout
-      uses: actions/checkout@v3
+      uses: actions/checkout@v4
       with:
         fetch-depth: 0
     - name: Setup Node.js
-      uses: actions/setup-node@v3
+      uses: actions/setup-node@v4
       with:
         node-version: 20.10.0
     - name: Install dependencies

.github/workflows/release.yml

@@ -9,9 +9,9 @@ jobs:
 
     steps:
     - name: Checkout
-      uses: actions/checkout@v3
+      uses: actions/checkout@v4
     - name: Setup Node.js
-      uses: actions/setup-node@v3
+      uses: actions/setup-node@v4
       with:
         node-version: 20.10.0
     - name: Install dependencies

commitlint.config.js

@@ -1,3 +1,3 @@
-module.exports = {
+export default {
     extends: ['@codingame/commitlint-config-codingame']
 };

package.json

@@ -2,6 +2,10 @@
   "name": "@codingame/monaco-editor-react",
   "version": "0.0.0-semantic-release",
   "description": "Monaco Editor React component",
+  "type": "module",
+  "release": {
+    "extends": "@codingame/semantic-release-config-github"
+  },
   "scripts": {
     "build": "npm run lint && npm run compile",
     "compile": "tsc",
@@ -35,28 +39,28 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@codingame/monaco-editor-wrapper": "^5.1.0",
+    "@codingame/monaco-editor-wrapper": "^5.2.0",
     "deep-equal": "^2.2.3",
     "lodash.debounce": "^4.0.8",
-    "monaco-editor": "npm:@codingame/monaco-vscode-editor-api@^2.1.1",
+    "monaco-editor": "npm:@codingame/monaco-vscode-editor-api@^2.1.3",
     "react-dom": "^18.2.0",
     "uuid": "^9.0.1",
-    "vscode": "npm:@codingame/monaco-vscode-api@^2.1.1"
+    "vscode": "npm:@codingame/monaco-vscode-api@^2.1.3"
   },
   "devDependencies": {
-    "@codingame/commitlint-config-codingame": "^1.0.7",
+    "@codingame/commitlint-config-codingame": "^1.0.10",
     "@codingame/eslint-config": "^1.1.10",
     "@codingame/eslint-config-react": "^1.0.2",
-    "@codingame/semantic-release-config": "^1.3.5",
+    "@codingame/semantic-release-config-github": "^1.0.0",
     "@codingame/tsconfig": "^1.1.1",
-    "@commitlint/cli": "^18.6.0",
+    "@commitlint/cli": "^18.6.1",
     "@types/deep-equal": "^1.0.4",
     "@types/lodash.debounce": "^4.0.9",
     "@types/react": "18.2.55",
     "@types/react-dom": "^18.2.19",
     "@types/vscode": "^1.86.0",
-    "@typescript-eslint/eslint-plugin": "6.21.0",
-    "@typescript-eslint/parser": "6.21.0",
+    "@typescript-eslint/eslint-plugin": "7.0.1",
+    "@typescript-eslint/parser": "7.0.1",
     "conventional-changelog-conventionalcommits": "^7.0.2",
     "eslint": "8.56.0",
     "eslint-config-standard": "17.1.0",
@@ -71,6 +75,9 @@
   "peerDependencies": {
     "react": ">=16.0.0"
   },
+  "overrides": {
+    "@typescript-eslint/eslint-plugin": "$@typescript-eslint/eslint-plugin"
+  },
   "volta": {
     "node": "20.10.0",
     "npm": "10.4.0"

src/vscodeParts.tsx

@@ -1,6 +1,6 @@
 import React, { Fragment, ReactNode, useEffect, useRef, useState } from 'react'
 import * as monaco from 'monaco-editor'
-import { renderSidebarPart, renderActivitybarPar, renderEditorPart, renderPanelPart, renderStatusBarPart, registerCustomView, ViewContainerLocation, CustomViewOption } from '@codingame/monaco-vscode-views-service-override/views'
+import { attachPart, Parts, onPartVisibilityChange, registerCustomView, ViewContainerLocation, CustomViewOption, isPartVisibile } from '@codingame/monaco-vscode-views-service-override/views'
 import { createPortal } from 'react-dom'
 import { initializePromise } from '@codingame/monaco-editor-wrapper'
 import { DisposableStore } from 'vscode/monaco'
@@ -12,19 +12,19 @@ interface CustomView extends Omit<CustomViewOption, 'renderBody' | 'location' |
   })[]
 }
 
-interface VscodePartRendererProps {
+export interface VscodePartRendererProps {
   views?: CustomView[]
   className?: string
   style?: React.CSSProperties
 }
 
-function createPart (location: ViewContainerLocation | null, renderPart: (container: HTMLElement) => monaco.IDisposable) {
+function createPart (part: Parts, location: ViewContainerLocation | null) {
   const element = document.createElement('div')
   element.style.flex = '1'
   element.style.minWidth = '0'
 
   initializePromise.then(() => {
-    renderPart(element)
+    attachPart(part, element)
   }, console.error)
 
   let counter = 0
@@ -46,6 +46,15 @@ function createPart (location: ViewContainerLocation | null, renderPart: (contai
 
     const [portalComponents, setPortalComponents] = useState({} as Record<string, HTMLElement>)
 
+    const [visible, setVisible] = useState(isPartVisibile(part))
+
+    useEffect(() => {
+      const disposable = onPartVisibilityChange(part, setVisible)
+      return () => {
+        disposable.dispose()
+      }
+    }, [])
+
     useEffect(() => {
       if (location == null) {
         return
@@ -126,7 +135,7 @@ function createPart (location: ViewContainerLocation | null, renderPart: (contai
         })}
         <div
           ref={ref} className={className} style={{
-            display: 'flex',
+            display: visible ? 'flex' : 'none',
             alignItems: 'stretch',
             justifyContent: 'stretch',
             ...style
@@ -137,10 +146,11 @@ function createPart (location: ViewContainerLocation | null, renderPart: (contai
   }
 }
 
-export const SidebarPart = createPart(ViewContainerLocation.Sidebar, renderSidebarPart)
-export const ActivitybarPart = createPart(null, renderActivitybarPar)
-export const EditorPart = createPart(null, renderEditorPart)
-export const StatusBarPart = createPart(null, renderStatusBarPart)
-export const PanelPart = createPart(ViewContainerLocation.Panel, renderPanelPart)
+export const SidebarPart = createPart(Parts.SIDEBAR_PART, ViewContainerLocation.Sidebar)
+export const ActivitybarPart = createPart(Parts.ACTIVITYBAR_PART, null)
+export const EditorPart = createPart(Parts.EDITOR_PART, null)
+export const StatusBarPart = createPart(Parts.STATUSBAR_PART, null)
+export const PanelPart = createPart(Parts.PANEL_PART, ViewContainerLocation.Panel)
+export const AuxiliaryPart = createPart(Parts.AUXILIARYBAR_PART, ViewContainerLocation.AuxiliaryBar)
 
 export type { CustomView }