Merge pull request #276 from umbraco/feature/element-mode

feature/element mode

src/Umbraco.Web.UI.Client/e2e/installer.spec.ts

@@ -1,8 +1,8 @@
 import { rest } from 'msw';
 
-import { expect, test } from '../test';
 import { umbracoPath } from '@umbraco-cms/utils';
 import { ProblemDetails, RuntimeLevel, ServerStatus } from '@umbraco-cms/backend-api';
+import { expect, test } from './test';
 
 test.describe('installer tests', () => {
 	test.beforeEach(async ({ page, worker }) => {

src/Umbraco.Web.UI.Client/e2e/login.spec.ts

@@ -1,4 +1,4 @@
-import { expect, test } from '../test';
+import { expect, test } from './test';
 
 test('login', async ({ page }) => {
 	// Go to /login

src/Umbraco.Web.UI.Client/e2e/package.json

@@ -0,0 +1,4 @@
+{
+	"name": "backoffice-e2e",
+	"type": "commonjs"
+}

src/Umbraco.Web.UI.Client/e2e/test.ts

@@ -2,7 +2,7 @@ import { expect, test as base } from '@playwright/test';
 import { createWorkerFixture } from 'playwright-msw';
 import type { MockServiceWorker } from 'playwright-msw';
 
-import { handlers } from './src/core/mocks/e2e-handlers';
+import { handlers } from '../src/core/mocks/e2e-handlers';
 
 const test = base.extend<{
 	worker: MockServiceWorker;

src/Umbraco.Web.UI.Client/e2e/upgrader.spec.ts

@@ -1,7 +1,7 @@
 import { rest } from 'msw';
-import { expect, test } from '../test';
 import { umbracoPath } from '@umbraco-cms/utils';
 import { ProblemDetails, RuntimeLevel, ServerStatus } from '@umbraco-cms/backend-api';
+import { expect, test } from './test';
 
 test.describe('upgrader tests', () => {
 	test.beforeEach(async ({ page, worker }) => {

src/Umbraco.Web.UI.Client/package.json

@@ -3,6 +3,16 @@
 	"license": "MIT",
 	"private": true,
 	"version": "0.0.0",
+	"type": "module",
+	"main": "dist/main.js",
+	"exports": {
+		".": "./dist/main.js"
+	},
+	"types": "types/src/app.d.ts",
+	"files": [
+		"dist",
+		"types"
+	],
 	"repository": {
 		"url": "https://github.com/umbraco/Umbraco.CMS.Backoffice",
 		"type": "git"
@@ -18,7 +28,8 @@
 	"scripts": {
 		"dev": "vite",
 		"build": "tsc && vite build --mode staging",
-		"build:production": "tsc && vite build",
+		"build:for:static": "tsc && vite build",
+		"build:for:backoffice": "tsc && vite build -c vite.element.config.ts",
 		"preview": "vite preview --open",
 		"test": "web-test-runner --coverage",
 		"test:watch": "web-test-runner --watch",

src/Umbraco.Web.UI.Client/src/app.ts

@@ -4,6 +4,7 @@ import '@umbraco-ui/uui-modal-container';
 import '@umbraco-ui/uui-modal-dialog';
 import '@umbraco-ui/uui-modal-sidebar';
 import 'router-slot';
+import 'element-internals-polyfill';
 
 // TODO: remove these imports when they are part of UUI
 import type { Guard, IRoute } from 'router-slot/model';

src/Umbraco.Web.UI.Client/src/index.ts

@@ -1,5 +1,3 @@
-import 'element-internals-polyfill';
-
 import { startMockServiceWorker } from './core/mocks/browser';
 
 if (import.meta.env.VITE_UMBRACO_USE_MSW === 'on') {

src/Umbraco.Web.UI.Client/tsconfig.json

@@ -1,47 +1,40 @@
 {
-  "compilerOptions": {
-    "target": "es2017",
-    "module": "esnext",
-    "lib": [
-      "es2017",
-      "dom",
-      "dom.iterable"
-    ],
-    "declaration": true,
-    "emitDeclarationOnly": true,
-    "noEmitOnError": true,
-    "outDir": "./types",
-    "strict": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-    "moduleResolution": "node",
-    "isolatedModules": true,
-    "allowSyntheticDefaultImports": true,
-    "experimentalDecorators": true,
-    "forceConsistentCasingInFileNames": true,
-    "useDefineForClassFields": false,
-    "skipLibCheck": true,
-    "resolveJsonModule": true,
-    "baseUrl": ".",
-    "paths": {
-      "@umbraco-cms/models": ["src/core/models"],
-      "@umbraco-cms/backend-api": ["src/core/backend-api"],
-      "@umbraco-cms/context-api": ["src/core/context-api"],
-      "@umbraco-cms/extensions-api": ["src/core/extensions-api"],
-      "@umbraco-cms/extensions-registry": ["src/core/extensions-registry"],
-      "@umbraco-cms/observable-api": ["src/core/observable-api"],
-      "@umbraco-cms/utils": ["src/core/utils"],
-      "@umbraco-cms/test-utils": ["src/core/test-utils"],
-      "@umbraco-cms/services": ["src/core/services"]
-    },
-  },
-  "include": [
-    "src/**/*.ts",
-		"e2e/**/*.ts",
-  ],
-  "references": [
-    {
-      "path": "./tsconfig.node.json"
-    }
-  ]
+	"compilerOptions": {
+		"module": "esnext",
+		"target": "esnext",
+		"lib": ["es2020", "dom", "dom.iterable"],
+		"declaration": true,
+		"emitDeclarationOnly": true,
+		"noEmitOnError": true,
+		"outDir": "./types",
+		"strict": true,
+		"noImplicitReturns": true,
+		"noFallthroughCasesInSwitch": true,
+		"moduleResolution": "node",
+		"isolatedModules": true,
+		"allowSyntheticDefaultImports": true,
+		"experimentalDecorators": true,
+		"forceConsistentCasingInFileNames": true,
+		"useDefineForClassFields": false,
+		"skipLibCheck": true,
+		"resolveJsonModule": true,
+		"baseUrl": ".",
+		"paths": {
+			"@umbraco-cms/models": ["src/core/models"],
+			"@umbraco-cms/backend-api": ["src/core/backend-api"],
+			"@umbraco-cms/context-api": ["src/core/context-api"],
+			"@umbraco-cms/extensions-api": ["src/core/extensions-api"],
+			"@umbraco-cms/extensions-registry": ["src/core/extensions-registry"],
+			"@umbraco-cms/observable-api": ["src/core/observable-api"],
+			"@umbraco-cms/utils": ["src/core/utils"],
+			"@umbraco-cms/test-utils": ["src/core/test-utils"],
+			"@umbraco-cms/services": ["src/core/services"]
+		}
+	},
+	"include": ["src/**/*.ts", "e2e/**/*.ts"],
+	"references": [
+		{
+			"path": "./tsconfig.node.json"
+		}
+	]
 }

src/Umbraco.Web.UI.Client/tsconfig.node.json

@@ -1,8 +1,9 @@
 {
-  "compilerOptions": {
-    "composite": true,
-    "module": "esnext",
-    "moduleResolution": "node"
-  },
-  "include": ["vite.config.ts"]
+	"compilerOptions": {
+		"composite": true,
+		"module": "esnext",
+		"moduleResolution": "node",
+		"allowSyntheticDefaultImports": true
+	},
+	"include": ["vite.config.ts"]
 }

src/Umbraco.Web.UI.Client/vite.element.config.ts

@@ -0,0 +1,15 @@
+import { defineConfig } from 'vite';
+
+import config from './vite.config';
+
+export default defineConfig({
+	...config,
+	build: {
+		lib: {
+			entry: 'src/app.ts',
+			formats: ['es'],
+			fileName: 'main',
+		},
+		sourcemap: true,
+	},
+});