feat: support monaco editor offline usage and most fabric fonts offline display

Composer/packages/adaptive-flow/demo/src/index.js

@@ -11,7 +11,7 @@ import { EventsEditorDemo } from './stories/EventsEditorDemo';
 import { VisualSDKDemo } from './stories/VisualSDKDemo';
 import './index.css';
 
-initializeIcons(undefined, { disableWarnings: true });
+initializeIcons('/fonts/', { disableWarnings: true });
 
 EditorConfig.features.showEvents = true;
 

Composer/packages/client/scripts/build.js

@@ -1,5 +1,5 @@
 'use strict';
-
+const path = require('path');
 // Do this as the first thing so that any code reading it knows the right env.
 process.env.BABEL_ENV = 'production';
 process.env.NODE_ENV = 'production';
@@ -35,6 +35,16 @@ const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
 
 const isInteractive = process.stdout.isTTY;
 
+//copy monaco editor resouce to public folder to support offline usage
+const monacoEditor = path.resolve(__dirname, '../../../node_modules/monaco-editor/min');
+const monacoEditorInPublicFolder = path.resolve(__dirname, '../public/min');
+fs.copySync(monacoEditor, monacoEditorInPublicFolder);
+
+//copy fabric fonts to public folder to support offline usage
+const fabricFonts = path.resolve(__dirname, '../../../node_modules/@uifabric/icons/fonts');
+const fabricFontsInPublicFolder = path.resolve(__dirname, '../public/fonts');
+fs.copySync(fabricFonts, fabricFontsInPublicFolder);
+
 // Warn and crash if required files are missing
 if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
   process.exit(1);

Composer/packages/client/src/App.tsx

@@ -13,7 +13,7 @@ import { loadLocale } from './utils/fileUtil';
 import { dispatcherState } from './recoilModel/DispatcherWrapper';
 import { useInitializeLogger } from './telemetry/useInitializeLogger';
 
-initializeIcons(undefined, { disableWarnings: true });
+initializeIcons('/fonts/', { disableWarnings: true });
 
 const Logger = () => {
   useInitializeLogger();

Composer/packages/client/src/plugin-host-preload.ts

@@ -10,7 +10,7 @@ import { syncStore, Shell } from '@bfc/extension-client';
 
 import './index.css';
 
-Fabric.initializeIcons(undefined, { disableWarnings: true });
+Fabric.initializeIcons('/fonts/', { disableWarnings: true });
 
 if (!document.head.title) {
   const title = document.createElement('title');

Composer/packages/lib/code-editor/src/index.ts

@@ -3,6 +3,12 @@
 
 import { monaco } from '@monaco-editor/react';
 
+monaco.config({
+  urls: {
+    monacoLoader: '/min/vs/loader.js',
+    monacoBase: '/min/vs',
+  },
+});
 // initialize moanco api as early as possible
 monaco.init();