@omnia/tooling-vue 8.0.27-vnext → 8.0.28-dev

package/internal-do-not-import-from-here/tasks/vendor.js

@@ -186,13 +186,17 @@ $.webpack({
             'dayjs/plugin/duration',
             'dayjs/plugin/relativeTime',
             "dayjs/locale/da.js",
-            "dayjs/locale/pl.js",
-            "dayjs/locale/fr.js",
             "dayjs/locale/de.js",
             "dayjs/locale/et.js",
-            "dayjs/locale/lv.js",
+            "dayjs/locale/fr.js",
             "dayjs/locale/lt.js",
+            "dayjs/locale/lv.js",
+            "dayjs/locale/pl.js",
             "dayjs/locale/sv.js",
+            "dayjs/locale/nb.js",
+            "dayjs/locale/fi.js",
+            "dayjs/locale/es.js",
+            "dayjs/locale/nl.js",
             "./wwwroot/scripts/zepto.extras.js",
             // "@material/material-color-utilities"
         ]

package/internal-do-not-import-from-here/variables.d.ts

@@ -5,6 +5,7 @@ import * as composers from "@omnia/tooling-composers";
 import * as enums from "../composers/models/Enums";
 import * as composer from '../composers/task';
 import { core, utils } from '@omnia/tooling';
+import { isExtensionEnv } from "./shared";
 import merge from 'webpack-merge';
 import webpack from 'webpack';
 declare var tooling: {
@@ -16,5 +17,4 @@ declare var tooling: {
     LogTypes: typeof utils.LogTypes;
 };
 declare var basePathProcess: string;
-declare var isExtensionEnv: boolean;
 export { omniaWebpackPlugins, basePathProcess, isExtensionEnv, tooling, webpack, chalk, timestamp, path, fs, extend, merge, del, md5File, composers, enums };

package/internal-do-not-import-from-here/variables.js

@@ -28,6 +28,8 @@ const enums = tslib_1.__importStar(require("@omnia/tooling-composers/internal-do
 exports.enums = enums;
 const composer = tslib_1.__importStar(require("@omnia/tooling-composers/internal-do-not-import-from-here/task"));
 const tooling_1 = require("@omnia/tooling");
+const shared_1 = require("./shared");
+Object.defineProperty(exports, "isExtensionEnv", { enumerable: true, get: function () { return shared_1.isExtensionEnv; } });
 const webpack_merge_1 = tslib_1.__importDefault(require("webpack-merge"));
 exports.merge = webpack_merge_1.default;
 const webpack_1 = tslib_1.__importDefault(require("webpack"));
@@ -36,5 +38,3 @@ var tooling = { composer, core: tooling_1.core, utils: tooling_1.utils, log: too
 exports.tooling = tooling;
 var basePathProcess = process.cwd();
 exports.basePathProcess = basePathProcess;
-var isExtensionEnv = fs.existsSync(basePathProcess + "/node_modules/@omnia/tooling-vue/package.json");
-exports.isExtensionEnv = isExtensionEnv;

package/internal-do-not-import-from-here/vite/hmr/graph.js

@@ -10,6 +10,8 @@ const utils_1 = require("./utils");
 const manifest_1 = require("./manifest");
 const vueJsx_1 = require("./vueJsx");
 const $ = tslib_1.__importStar(require("../../variables"));
+const shared_1 = require("../../shared");
+const doc_1 = require("../../tasks/doc");
 let fileGraphs = {};
 let manifests = {};
 const initialManifests = [
@@ -18,7 +20,7 @@ const initialManifests = [
     fx_models_1.OmniaResourceManifests.FxWorkers.toString()
 ];
 const esbuildTransformOptions = {
-    target: 'es2022',
+    target: 'es2020',
     jsx: 'preserve',
     sourcemap: false,
     legalComments: 'inline'
@@ -151,6 +153,7 @@ async function buildFileGraph(unknownId, code) {
         return { fileGraph, code };
     }
     fileGraph.js.scanned = true;
+    code = (0, shared_1.modifyComponent)(code, fileGraph.id);
     const esbuildTransformResult = await (0, vite_1.transformWithEsbuild)(code, id, esbuildTransformOptions);
     code = esbuildTransformResult.code;
     // d.ts or interface only
@@ -163,6 +166,7 @@ async function buildFileGraph(unknownId, code) {
     }
     fileGraph.js.metadata = utils_1.moduleAnalysis.analyze(code, id);
     ensureDependencies(id, fileGraph.js.metadata);
+    code = (0, doc_1.importSnippetCode)(code, fileGraph.id);
     return { fileGraph, code, esbuildTransformResult };
 }
 exports.buildFileGraph = buildFileGraph;

package/internal-do-not-import-from-here/vite/hmr/manifest.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getPreBundleInfo = exports.validatePreBundles = exports.getManifest = exports.clearManifestCollection = exports.getManifestCollection = exports.entriesResolver = void 0;
 const tslib_1 = require("tslib");
 const path_1 = tslib_1.__importDefault(require("path"));
-const globby_1 = tslib_1.__importDefault(require("globby"));
+const globby_1 = require("globby");
 const $ = tslib_1.__importStar(require("../../variables"));
 const fx_models_1 = require("@omnia/fx-models");
 const utils_1 = require("./utils");
@@ -61,7 +61,7 @@ exports.entriesResolver = new ManifestBuildEntriesResolver();
 let _manifestCollection;
 function getManifestCollection() {
     if (!_manifestCollection) {
-        _manifestCollection = $.tooling.composer.getManifestData();
+        _manifestCollection = $.tooling.composer.getManifestsJson();
     }
     return _manifestCollection;
 }
@@ -84,9 +84,9 @@ function getManifest(resourceId) {
 exports.getManifest = getManifest;
 async function validatePreBundles(fileNames) {
     const preBundleDir = utils_1.envUtils.getBundleOutputDirPath();
-    const filePaths = fileNames.map(fileName => path_1.default.join(preBundleDir, fileName));
+    const filePaths = fileNames.map(fileName => path_1.default.join(preBundleDir, fileName).replace(/\\/g, '/'));
     return new Promise((resolve, reject) => {
-        (0, globby_1.default)(filePaths).then(result => {
+        (0, globby_1.globby)(filePaths).then(result => {
             resolve(result);
         }).catch(reject);
     });
@@ -95,7 +95,7 @@ exports.validatePreBundles = validatePreBundles;
 function getPreBundleInfo() {
     return exports.entriesResolver.getPreBundleEntries().then(entries => {
         const serviceId = $.tooling.composer.getServiceId();
-        const manifests = $.tooling.composer.getManifestData();
+        const manifests = $.tooling.composer.getManifestsJson();
         return Object.keys(entries).reduce((array, fileName) => {
             const resourceId = utils_1.manifestUtils.getResourceIdFromEntryKey(fileName);
             const filePaths = entries[fileName];

package/internal-do-not-import-from-here/vite/hmr/runtime.js

@@ -43,9 +43,9 @@ function setupHmrPlugin(options, config) {
     };
     _runtimeContext = runtimeContext;
     const resolvers = config.resolvers.filter(item => !!item);
-    const omniaPackagesPathPattern = (0, vite_1.normalizePath)(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'node_modules/@omnia/*/*'));
-    const omniaPackagesDeepImports = (0, globby_1.sync)(omniaPackagesPathPattern).map(p => p.replace((0, vite_1.normalizePath)(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'node_modules/')), ''));
-    const { dependencies, devDependencies } = require(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'package.json'));
+    const omniaPackagesPathPattern = (0, vite_1.normalizePath)(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'node_modules/@omnia/*/*').replace(/\\/g, '/'));
+    const omniaPackagesDeepImports = (0, globby_1.globbySync)(omniaPackagesPathPattern).map(p => p.replace((0, vite_1.normalizePath)(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'node_modules/')), ''));
+    const dep = require(path_1.default.join(utils_1.envUtils.getRootDirPath(), 'package.json'));
     clearCacheAssets();
     // Manifests changed
     // entriesResolver.registerManifestEventHandler(() => {
@@ -55,8 +55,8 @@ function setupHmrPlugin(options, config) {
         config: () => ({
             optimizeDeps: {
                 exclude: [
-                    ...Object.keys(dependencies),
-                    ...Object.keys(devDependencies),
+                    ...Object.keys(dep.dependencies || {}),
+                    ...Object.keys(dep.devDependencies || {}),
                     ...omniaPackagesDeepImports
                 ]
             },

package/internal-do-not-import-from-here/vite/hmr/utils/manifest.js

@@ -15,8 +15,8 @@ const vendors = [
 ];
 let internalManifestReferences;
 const externalManifestReferences = (function () {
-    const externalManifestRefPathPattern = (0, vite_1.normalizePath)(path_1.default.join(envUtils.getRootDirPath(), 'node_modules/@omnia/*/internal-do-not-import-from-here/manifests/*.json'));
-    const manifestFilePaths = (0, globby_1.sync)(externalManifestRefPathPattern);
+    const externalManifestRefPathPattern = (0, vite_1.normalizePath)(path_1.default.join(envUtils.getRootDirPath(), 'node_modules/@omnia/*/internal-do-not-import-from-here/manifests/*.json').replace(/\\/g, '/'));
+    const manifestFilePaths = (0, globby_1.globbySync)(externalManifestRefPathPattern);
     if (manifestFilePaths.length == 0) {
         return [];
     }
@@ -73,6 +73,6 @@ function getEntryKeyFromManifest(manifest) {
     if (!!manifest.resourceName) {
         return `${manifest.resourceName}_${manifest.resourceId}`;
     }
-    return manifest.resourceId;
+    return manifest.resourceId.toString();
 }
 exports.getEntryKeyFromManifest = getEntryKeyFromManifest;

package/internal-do-not-import-from-here/vite/hmr/utils/path.js

@@ -143,21 +143,22 @@ function modify(value) {
 exports.modify = modify;
 function resolveModulePath(modulePath, external) {
     let pattern = null;
+    const path = modulePath.replace(/\\/g, '/');
     if (external) {
-        pattern = [modulePath + '.js', modulePath + '/index.js', modulePath + '.ts', modulePath + '.tsx', modulePath + '/index.ts'];
+        pattern = [path + '.js', path + '/index.js', path + '.ts', path + '.tsx', path + '/index.ts'];
     }
-    else if (modulePath.endsWith('.css')) {
-        pattern = [modulePath + '.ts', modulePath];
+    else if (path.endsWith('.css')) {
+        pattern = [path + '.ts', path];
     }
     else {
-        pattern = [modulePath + '.ts', modulePath + '.tsx', modulePath + '/index.ts'];
+        pattern = [path + '.ts', path + '.tsx', path + '/index.ts'];
     }
-    const result = (0, globby_1.sync)(pattern);
+    const result = (0, globby_1.globbySync)(pattern);
     if (result.length == 1) {
         return result[0];
     }
     if (result.length > 1) {
-        if (modulePath.endsWith('.css')) {
+        if (path.endsWith('.css')) {
             // priority typestyle
             let filePath = result.find(p => p.endsWith('.css.ts'));
             // then raw css

package/internal-do-not-import-from-here/vite/hmr/utils/webpack.js

@@ -10,7 +10,7 @@ function createWebpackConfig(entries, option) {
     let bundleOptions = bundler.getBuildOption().bundleOptions;
     let outputDir = envUtils.getBundleOutputDirPath().replace(envUtils.getRootDirPath(), '');
     if (bundleOptions && bundleOptions.commonsChunk) {
-        let config = bundler.createVueWebpackConfig(null, entries, outputDir, false, option);
+        let config = bundler.createVueWebpackConfig(null, entries, outputDir, option);
         config.stats = {
             entrypoints: false,
             chunks: false,
@@ -26,7 +26,7 @@ function createWebpackConfig(entries, option) {
         configs = Object.keys(entries).map(key => {
             var entry = {};
             entry[key] = entries[key];
-            let config = bundler.createVueWebpackConfig(entry, entries, outputDir, false, option);
+            let config = bundler.createVueWebpackConfig(entry, entries, outputDir, option);
             config.stats = 'errors-only';
             config.watchOptions = {
                 aggregateTimeout: 200

package/internal-do-not-import-from-here/vite/middlewares/HmrMiddleware.js

@@ -292,12 +292,7 @@ const manifestResolvePromise = new Promise(function (resolve) {
     resolveManifest = resolve;
 });
 
-omniaLoader['${serviceId}']['${resourceId}'] = function (preBundle) {
-    if (preBundle && !preBundleLoader) {
-        preBundleLoader = preBundle;
-        return;
-    }
-
+omniaLoader['${serviceId}']['${resourceId}'] = function () {
     if (triggered) {
         return manifestResolvePromise;
     }
@@ -325,8 +320,8 @@ omniaLoader['${serviceId}']['${resourceId}'] = function (preBundle) {
 
     // pre-bundle exports
     let preBundleWebpackRequire;
-    if (preBundleLoader) {
-        preBundleLoader();
+    if (typeof hmrPreBundle === "function") {
+        hmrPreBundle();
     }
 
     function require(moduleId) {
@@ -344,7 +339,7 @@ omniaLoader['${serviceId}']['${resourceId}'] = function (preBundle) {
     }
 
     ${fromWorker ?
-        `const { href } = new URL('${host}${utils_1.pathUtils.HMR_ESM_REQUEST}/${resourceId}${fromWorker ? `?${utils_1.pathUtils.WORKER_IDENTIFIER}` : ''}', location.href);
+        `const { href } = new URL('${host}${utils_1.pathUtils.HMR_ESM_REQUEST}/${resourceId}?${utils_1.pathUtils.WORKER_IDENTIFIER}', location.href);
     __shimport__.load(href).then(function () {
         if (omniaWebpackJsonp['${serviceId}']['${resourceId}']) {
             preBundleWebpackRequire = omniaWebpackJsonp['${serviceId}']['${resourceId}'];
@@ -353,7 +348,7 @@ omniaLoader['${serviceId}']['${resourceId}'] = function (preBundle) {
         omniaWebpackJsonp['${serviceId}']['${resourceId}'] = require;
         resolveManifest();
     });` :
-        `import('${host}${utils_1.pathUtils.HMR_ESM_REQUEST}/${resourceId}${fromWorker ? `?${utils_1.pathUtils.WORKER_IDENTIFIER}` : ''}').then(function () {
+        `import('${utils_1.pathUtils.HMR_ESM_REQUEST}/${resourceId}').then(function () {
         if (omniaWebpackJsonp['${serviceId}']['${resourceId}']) {
             preBundleWebpackRequire = omniaWebpackJsonp['${serviceId}']['${resourceId}'];
         }
@@ -364,9 +359,7 @@ omniaLoader['${serviceId}']['${resourceId}'] = function (preBundle) {
 
     return manifestResolvePromise;
 }
-
 ${preBundleContent}
-
 ${forGroupManifest ? 'return manifestResolvePromise;' : `${$.composers.LoadableManifestRegistry.isDefineWithNoDependency(resourceId) ? `omniaLoader['${serviceId}']['${resourceId}']();` : ''}`}
 `;
     return template.trim();

package/internal-do-not-import-from-here/vite/middlewares/OmniaMiddleware.js

@@ -3,11 +3,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.registerOmniaMiddleware = exports.ManifestChangedMessage = exports.resolvableManifest = void 0;
 const tslib_1 = require("tslib");
 const chokidar_1 = tslib_1.__importDefault(require("chokidar"));
+const url_1 = tslib_1.__importDefault(require("url"));
 const tooling_1 = require("@omnia/tooling");
 const tooling_2 = require("@omnia/tooling");
 const $ = tslib_1.__importStar(require("../../variables"));
-let _manifestJsonObject = null;
-let _app = null;
+const fx_models_1 = require("@omnia/fx-models");
+const fsExtra = tslib_1.__importStar(require("fs-extra"));
+let _middlewares = null;
+let _server = null;
 class ImplementManifestChangedMessage {
     constructor() {
         this._subcribers = [];
@@ -22,7 +25,8 @@ class ImplementManifestChangedMessage {
 exports.resolvableManifest = null;
 exports.ManifestChangedMessage = new ImplementManifestChangedMessage();
 function registerOmniaMiddleware(server, hmr) {
-    _app = server.middlewares;
+    _server = server;
+    _middlewares = server.middlewares;
     server.middlewares.use('/omnia', function (req, res, next) {
         ensureLoadManifest();
         exports.resolvableManifest.promise.then(() => {
@@ -33,12 +37,9 @@ function registerOmniaMiddleware(server, hmr) {
         res.setHeader('Content-Type', 'application/json');
         res.end(JSON.stringify({ id: $.composers.ServiceManifestRegistry.getServiceInfo().id, hmr: hmr }));
     });
-    server.middlewares.use('/omnia/localhost/service/manifests.json', function (req, res, next) {
-        let manifestJson = JSON.parse(JSON.stringify($.tooling.composer.getManifestData()));
-        // remove group manifest in hmr mode
-        //if (server.config.server.hmr) {
-        //    manifestJson.groupedResouresAndComponents = [];
-        //}
+    server.middlewares.use('/omnia/manifest.json', function (req, res, next) {
+        const target = url_1.default.parse(req.url, true).query.target;
+        let manifestJson = JSON.parse(JSON.stringify($.tooling.composer.getManifestJsonByTarget(target)));
         res.setHeader('Cache-Control', 'no-cache');
         res.setHeader('Content-Type', 'application/json');
         res.end(JSON.stringify({
@@ -46,6 +47,13 @@ function registerOmniaMiddleware(server, hmr) {
             manifest: manifestJson
         }));
     });
+    server.middlewares.use('/omnia/localization', function (req, res, next) {
+        const target = url_1.default.parse(req.url, true).query.target;
+        let localizeObject = $.composers.getLocalizations();
+        res.setHeader('Cache-Control', 'no-cache');
+        res.setHeader('Content-Type', 'application/json');
+        res.end(JSON.stringify(localizeObject[target] || ""));
+    });
     let watchManifests = chokidar_1.default.watch(["**/*.manifest.ts", "omnia.service.ts"], {
         ignored: [/[\/\\]\./, '**/node_modules/**'],
         persistent: true
@@ -53,12 +61,24 @@ function registerOmniaMiddleware(server, hmr) {
     watchManifests.on('ready', function () {
         watchManifests
             .on('add', path => {
-            $.tooling.utils.log(`Found manifest added -> ${path}`);
-            rebuildManifests();
+            if (isLocalizeManifestFile(path)) {
+                $.tooling.utils.log(`Found localize manifest file added -> ${path}`);
+                rebuildLocalization(path);
+            }
+            else {
+                $.tooling.utils.log(`Found manifest added -> ${path}`);
+                rebuildManifests();
+            }
         })
             .on('change', path => {
-            $.tooling.utils.log(`Found manifest changed -> ${path}`);
-            rebuildManifests();
+            if (isLocalizeManifestFile(path)) {
+                $.tooling.utils.log(`Found localize manifest file changed -> ${path}`);
+                rebuildLocalization(path);
+            }
+            else {
+                $.tooling.utils.log(`Found manifest changed -> ${path}`);
+                rebuildManifests();
+            }
         })
             .on('unlink', path => {
             $.tooling.utils.log(`Found manifest removed -> ${path}`);
@@ -70,6 +90,24 @@ function registerOmniaMiddleware(server, hmr) {
     // setTimeout(ensureLoadManifest, 100);
 }
 exports.registerOmniaMiddleware = registerOmniaMiddleware;
+function isLocalizeManifestFile(filePath) {
+    const content = fsExtra.readFileSync(filePath, 'utf8');
+    return content.indexOf(".registerLocalization") > -1;
+}
+function rebuildLocalization(filePath) {
+    try {
+        $.tooling.composer.processManifests([filePath]);
+        let localizeObject = $.composers.getLocalizations();
+        const payLoad = {
+            type: fx_models_1.LocalServingMessageType.LocalizeChanged,
+            data: localizeObject
+        };
+        _server.ws.send(payLoad);
+    }
+    catch (ex) {
+        // ignore ex because that already log error inside $.tooling.composer.processManifests
+    }
+}
 function rebuildManifests() {
     tooling_1.utils.timeWatch("omniamiddleware_watchmanifest", () => {
         if (exports.resolvableManifest) {
@@ -91,14 +129,14 @@ function rebuildManifests() {
                 tooling_1.utils.log(e, tooling_2.LogTypes.Error);
             }
         }
-    }, 1000);
+    }, 100);
 }
 function ensureLoadManifest() {
-    if (_app && !exports.resolvableManifest) {
+    if (_middlewares && !exports.resolvableManifest) {
         exports.resolvableManifest = new tooling_2.ResolvablePromise();
-        exports.ManifestChangedMessage.publish();
+        // ManifestChangedMessage.publish();
         var tasks = tooling_1.core.getRegisteredServeTasks().filter(function (task) { return task.stage === tooling_1.core.TaskStage.AfterCreateServer; }).sort(sortTask) || [];
-        executeTasks(tasks, _app, () => {
+        executeTasks(tasks, _middlewares, () => {
             exports.resolvableManifest.resolve();
         }, err => {
             exports.resolvableManifest.resolve();

package/internal-do-not-import-from-here/vite/middlewares/StaticFileMiddleware.js

@@ -48,15 +48,16 @@ function registerStaticFileMiddleware(server) {
                     res.setHeader('content-type', 'application/x-javascript');
                     let localizeObject = $.composers.getLocalizations();
                     res.end(`                       
-                        var OmniaContext = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["a1602121-3070-4304-b4d8-0859e50c482b"]("5326a8ef-4e3c-49d6-b415-1ddf7fdcc830").OmniaContext;
-                        var container = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["` + fx_models_1.OmniaResourceManifests.FxCore.toString() + `"]("97786ea9-4861-48bd-8a57-eae9bbdb4892").ServiceContainer;
-                        var omniaCtx = container.createInstance(OmniaContext);
-                        var localizationStore = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["` + fx_models_1.OmniaResourceManifests.Fx.toString() + `"]("5e618f4d-d014-414e-a681-89e34cbeda0f").LocalizationStore;
-                        var currentCulture = omniaCtx.language.toLowerCase();
-                        var loc = JSON.parse('${JSON.stringify(localizeObject).replace(/'/g, "\\'").replace(/\\"/g, "\\\\\"")}');            
+                        const OmniaContext = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["a1602121-3070-4304-b4d8-0859e50c482b"]("5326a8ef-4e3c-49d6-b415-1ddf7fdcc830").OmniaContext;
+                        const container = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["` + fx_models_1.OmniaResourceManifests.FxCore.toString() + `"]("97786ea9-4861-48bd-8a57-eae9bbdb4892").ServiceContainer;
+                        const omniaCtx = container.createInstance(OmniaContext);
+                        const useLocalizationStore = omniaWebpackJsonp["bb000000-0000-bbbb-0000-0000000000bb"]["` + fx_models_1.OmniaResourceManifests.Fx.toString() + `"]("5e618f4d-d014-414e-a681-89e34cbeda0f").useLocalizationStore;
+                        const localizeStore = container.createInstance(useLocalizationStore);
+                        const currentCulture = omniaCtx.language.toLowerCase();
+                        const loc = JSON.parse('${JSON.stringify(localizeObject).replace(/'/g, "\\'").replace(/\\"/g, "\\\\\"")}');            
             
-                        localizationStore.instance.mutations.merge.commit(loc['en-us'] || {}); // add default english
-                        localizationStore.instance.mutations.merge.commit(loc[currentCulture] || {});        
+                        localizeStore.actions.merge(loc['en-us'] || {}); // add default english
+                        localizeStore.actions.merge(loc[currentCulture] || {});        
                     `);
                 }
                 else {

package/internal-do-not-import-from-here/vite/middlewares/WebpackMiddleware.js

@@ -94,7 +94,7 @@ function registerWebpackMiddleWareBundle(entries) {
                         if (manifestId) {
                             let manifest = $.tooling.composer.getManifestById(manifestId);
                             if (manifest) {
-                                let manifestsData = $.tooling.composer.getManifestData();
+                                let manifestsData = $.tooling.composer.getManifestsJson();
                                 let bundleType = path_1.default.extname(filePath).replace('.', '');
                                 manifest.version = manifest.version || {};
                                 manifest.version[bundleType] = $.tooling.utils.generateGuid().replace(/-/g, '');

package/internal-do-not-import-from-here/vite/plugins/OmniaPlugin.js

@@ -20,7 +20,7 @@ function omniaPlugin(options) {
             'vue': 'vue/dist/vue.runtime.esm-bundler.js',
             // 'vue-class-component': 'vue-class-component/dist/vue-class-component.esm.js',
             // 'vue-property-decorator': 'vue-property-decorator/lib/vue-property-decorator.js',
-            'vue-virtual-scroller': 'vue-virtual-scroller/dist/vue-virtual-scroller.esm.js',
+            // 'vue-virtual-scroller': 'vue-virtual-scroller/dist/vue-virtual-scroller.esm.js',
             'typestyle': 'typestyle/lib.es2015/index.js',
             'dayjs': 'dayjs/dayjs.min.js',
             // '@tiptap/core': '@tiptap/core/dist/index.js',
@@ -67,7 +67,15 @@ function omniaPlugin(options) {
             server.middlewares.use(async (req, res, next) => {
                 res.setHeader('Access-Control-Allow-Origin', req.headers['origin'] || '*');
                 res.setHeader('Access-Control-Allow-Credentials', 'true');
+                res.setHeader('Access-Control-Request-Private-Network', 'true');
+                res.setHeader('Access-Control-Request-Method', '*');
                 res.setHeader('Access-Control-Allow-Headers', '*');
+                if (req.method === "OPTIONS") {
+                    res.setHeader('Access-Control-Max-Age', 31536000);
+                    // res.setHeader('Cache-Control', 'public, max-age=31536000');
+                    res.end("OK");
+                    return;
+                }
                 next();
             });
             (0, middlewares_1.registerOmniaMiddleware)(server, hosting.hmr);

package/internal-do-not-import-from-here/webpack-loaders/doc-loader.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const path_1 = tslib_1.__importDefault(require("path"));
+const doc_1 = require("../tasks/doc");
+function default_1(content, context) {
+    const filePath = "./" + path_1.default.relative(process.cwd(), this.resourcePath).replace(/\\/g, "/");
+    content = (0, doc_1.importSnippetCode)(content, filePath);
+    return content;
+}
+exports.default = default_1;

package/internal-do-not-import-from-here/webpack-loaders/ts-loader.d.ts

@@ -1,13 +1,20 @@
 export default function (): {
     test: RegExp;
     use: ({
-        loader: any;
-        options?: undefined;
-    } | {
         loader: string;
         options: {
             loader: string;
             target: string;
+            tsconfigRaw: {
+                compilerOptions: {
+                    jsx: string;
+                    target: string;
+                    useDefineForClassFields: boolean;
+                };
+            };
         };
+    } | {
+        loader: any;
+        options?: undefined;
     })[];
 }[];

package/internal-do-not-import-from-here/webpack-loaders/ts-loader.js

@@ -7,15 +7,22 @@ function default_1() {
     return [{
             test: /\.ts$/,
             use: [
-                {
-                    loader: path.resolve(__dirname, $.isExtensionEnv ? './esbuild-custom-loader.js' : './esbuild-custom-loader.ts'),
-                },
                 {
                     loader: 'esbuild-loader',
                     options: {
                         loader: 'ts',
-                        target: 'es2022'
+                        target: 'es2020',
+                        tsconfigRaw: {
+                            compilerOptions: {
+                                jsx: "preserve",
+                                target: "es2020",
+                                useDefineForClassFields: false
+                            }
+                        }
                     },
+                },
+                {
+                    loader: path.resolve(__dirname, $.isExtensionEnv ? './doc-loader.js' : './doc-loader.ts'),
                 }
             ]
         }];

package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.d.ts

@@ -14,6 +14,16 @@ export default function (): {
             loader: string;
             target: string;
             jsx: string;
+            tsconfigRaw: {
+                compilerOptions: {
+                    jsx: string;
+                    target: string;
+                    useDefineForClassFields: boolean;
+                };
+            };
         };
+    } | {
+        loader: any;
+        options?: undefined;
     })[];
 }[];

package/internal-do-not-import-from-here/webpack-loaders/tsx-loader.js

@@ -51,9 +51,19 @@ function default_1() {
             loader: 'esbuild-loader',
             options: {
                 loader: 'tsx',
-                target: 'es2022',
-                jsx: 'preserve'
+                target: 'es2020',
+                jsx: 'preserve',
+                tsconfigRaw: {
+                    compilerOptions: {
+                        jsx: "preserve",
+                        target: "es2020",
+                        useDefineForClassFields: false
+                    }
+                }
             },
+        },
+        {
+            loader: path.resolve(__dirname, $.isExtensionEnv ? './wc-loader.js' : './wc-loader.ts'),
         }
     ];
     return [

package/internal-do-not-import-from-here/webpack-loaders/wc-loader.d.ts

@@ -0,0 +1 @@
+export default function (content: any, context: any): any;

package/internal-do-not-import-from-here/webpack-loaders/wc-loader.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const path_1 = tslib_1.__importDefault(require("path"));
+const shared_1 = require("../shared");
+function default_1(content, context) {
+    const filePath = "./" + path_1.default.relative(process.cwd(), this.resourcePath).replace(/\\/g, "/");
+    content = (0, shared_1.modifyComponent)(content, filePath);
+    return content;
+}
+exports.default = default_1;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@omnia/tooling-vue",
   "license": "MIT",
-  "version": "8.0.27-vnext",
+  "version": "8.0.28-dev",
   "description": "Used to bundle and serve manifests web component that build on Vue framework.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -19,8 +19,8 @@
   ],
   "author": "Precio Fishbone",
   "dependencies": {
-    "@omnia/fx-models": "8.0.27-vnext",
-    "@omnia/tooling-composers": "8.0.27-vnext",
+    "@omnia/fx-models": "8.0.28-dev",
+    "@omnia/tooling-composers": "8.0.28-dev",
     "@types/mousetrap": "1.5.34",
     "@types/quill": "1.3.6",
     "@types/zepto": "1.0.29",
@@ -32,6 +32,7 @@
     "console-timestamp": "0.3.0",
     "css-loader": "5.0.1",
     "file-loader": "6.2.0",
+    "json-parse-better-errors": "1.0.2",
     "null-loader": "4.0.1",
     "terser": "5.17.1",
     "less-loader": "10.2.0",
@@ -56,10 +57,11 @@
     "es6-promise": "4.2.4",
     "hash-sum": "1.0.2",
     "lodash": "4.17.21",
-    "vite": "4.3.4",
-    "vite-plugin-inspect": "0.7.23",
+    "vite": "4.4.1",
+    "vite-plugin-inspect": "0.7.32",
     "appdata-path": "1.0.0",
-    "json-parse-better-errors": "1.0.2"
+    "json-parse-better-errors": "1.0.2",
+    "url": "0.11.0"
   },
   "bugs": {
     "url": "https://github.com/preciofishbone/OmniaFx/issues"