mateu-vaadin 0.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index-keycloak.html +88 -0
- package/index.html +43 -0
- package/package.json +23 -0
- package/public/vite.svg +1 -0
- package/src/VaadinComponentRenderer.ts +13 -0
- package/src/assets/lit.svg +1 -0
- package/src/index.css +37 -0
- package/src/index.ts +5 -0
- package/src/lumo.js +31 -0
- package/src/vite-env.d.ts +1 -0
- package/tsconfig.json +52 -0
- package/vite.config.ts +52 -0
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
+
<title>AQUIELTITULODELAPAGINA</title>
|
|
8
|
+
<link rel="stylesheet" href="./src/index.css" />
|
|
9
|
+
<script type="module" src="./src/lumo.js"></script>
|
|
10
|
+
<script type="module" src="./src/index.ts"></script>
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
|
|
14
|
+
<!-- AQUIUI -->
|
|
15
|
+
<!--
|
|
16
|
+
<mateu-ui baseUrl="/fluent"
|
|
17
|
+
config='{"tenantId": "1111","profile": "dev"}'
|
|
18
|
+
>
|
|
19
|
+
</mateu-ui>
|
|
20
|
+
-->
|
|
21
|
+
<!-- HASTAAQUIUI -->
|
|
22
|
+
|
|
23
|
+
<script>
|
|
24
|
+
if (window.matchMedia) {
|
|
25
|
+
if(window.matchMedia('(prefers-color-scheme: dark)').matches){
|
|
26
|
+
document.documentElement.setAttribute('theme', 'dark')
|
|
27
|
+
} else {
|
|
28
|
+
document.documentElement.setAttribute('theme', 'light')
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
|
|
32
|
+
document.documentElement.setAttribute('theme', e.matches?'dark':'light')
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
</script>
|
|
36
|
+
|
|
37
|
+
<script type="module">
|
|
38
|
+
import Keycloak from 'keycloak-js';
|
|
39
|
+
|
|
40
|
+
const keycloak = new Keycloak({
|
|
41
|
+
url: 'https://lemur-11.cloud-iam.com/auth',
|
|
42
|
+
realm: 'mateu',
|
|
43
|
+
clientId: 'demo'
|
|
44
|
+
});
|
|
45
|
+
keycloak.onTokenExpired = function () {
|
|
46
|
+
console.log('token expired')
|
|
47
|
+
keycloak.updateToken(30)
|
|
48
|
+
.then(function (refreshed) {
|
|
49
|
+
if (refreshed) {
|
|
50
|
+
console.log('token refreshed');
|
|
51
|
+
// write any code you required here
|
|
52
|
+
localStorage.setItem('__mateu_auth_token', keycloak.token);
|
|
53
|
+
localStorage.setItem('__mateu_auth_subject', keycloak.subject);
|
|
54
|
+
} else {
|
|
55
|
+
console.log('token is still valid now');
|
|
56
|
+
}
|
|
57
|
+
}).catch(function (e) {
|
|
58
|
+
console.log('failed to refresh the token, or the session has expired', e);
|
|
59
|
+
});
|
|
60
|
+
}
|
|
61
|
+
keycloak.init({
|
|
62
|
+
onLoad: 'login-required',
|
|
63
|
+
}).then(function(authenticated) {
|
|
64
|
+
console.log(authenticated ? 'authenticated' : 'not authenticated');
|
|
65
|
+
if (authenticated) {
|
|
66
|
+
localStorage.setItem('__mateu_auth_token', keycloak.token);
|
|
67
|
+
localStorage.setItem('__mateu_auth_subject', keycloak.subject);
|
|
68
|
+
/*
|
|
69
|
+
const s = document.createElement('script');
|
|
70
|
+
s.setAttribute('type', 'module')
|
|
71
|
+
//s.setAttribute('src', 'https://unpkg.com/mateu-ui/dist/assets/mateu.js')
|
|
72
|
+
s.setAttribute('src', '${path}/dist/assets/mateu.js')
|
|
73
|
+
document.head.appendChild(s);
|
|
74
|
+
*/
|
|
75
|
+
|
|
76
|
+
const u = document.createElement('mateu-ui');
|
|
77
|
+
u.setAttribute('baseUrl', '/fluent')
|
|
78
|
+
document.body.appendChild(u);
|
|
79
|
+
|
|
80
|
+
}
|
|
81
|
+
}).catch(function(e) {
|
|
82
|
+
console.log('failed to initialize', e);
|
|
83
|
+
});
|
|
84
|
+
|
|
85
|
+
</script>
|
|
86
|
+
|
|
87
|
+
</body>
|
|
88
|
+
</html>
|
package/index.html
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
7
|
+
<title>AQUIELTITULODELAPAGINA</title>
|
|
8
|
+
<link rel="stylesheet" href="./src/index.css" />
|
|
9
|
+
<script type="module" src="./src/lumo.js"></script>
|
|
10
|
+
<script type="module" src="./src/index.ts"></script>
|
|
11
|
+
</head>
|
|
12
|
+
<body>
|
|
13
|
+
|
|
14
|
+
<!-- AQUIUI -->
|
|
15
|
+
<!--
|
|
16
|
+
baseUrl="https://demo.mateu.io/fluent"
|
|
17
|
+
baseUrl="/fluent"
|
|
18
|
+
baseUrl="/declarative"
|
|
19
|
+
baseUrl=""
|
|
20
|
+
-->
|
|
21
|
+
<mateu-ui baseUrl="/fluent"
|
|
22
|
+
config='{"tenantId": "1111","profile": "dev"}'
|
|
23
|
+
style="width: 100%; height: 100vh;"
|
|
24
|
+
>
|
|
25
|
+
</mateu-ui>
|
|
26
|
+
<!-- HASTAAQUIUI -->
|
|
27
|
+
|
|
28
|
+
<script>
|
|
29
|
+
if (window.matchMedia) {
|
|
30
|
+
if(window.matchMedia('(prefers-color-scheme: dark)').matches){
|
|
31
|
+
document.documentElement.setAttribute('theme', 'dark')
|
|
32
|
+
} else {
|
|
33
|
+
document.documentElement.setAttribute('theme', 'light')
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
|
|
37
|
+
document.documentElement.setAttribute('theme', e.matches?'dark':'light')
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
</script>
|
|
41
|
+
|
|
42
|
+
</body>
|
|
43
|
+
</html>
|
package/package.json
ADDED
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "mateu-vaadin",
|
|
3
|
+
"private": false,
|
|
4
|
+
"version": "0.0.1",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"scripts": {
|
|
8
|
+
"dev": "vite",
|
|
9
|
+
"build": "tsc && vite build",
|
|
10
|
+
"preview": "vite preview",
|
|
11
|
+
"copy": "tsc && vite build && mv dist/index.html dist/_index.html && cp -rf dist/* ../../../../../backend/shared/frontend/vaadin-lit/src/main/resources/META-INF/resources && cp -rf dist/* ../../../../../backend/shared/frontend/vaadin-lit/src/main/resources/static && cp -rf dist/assets/* ../../../../../demo/sites/vaadin/assets"
|
|
12
|
+
},
|
|
13
|
+
"dependencies": {
|
|
14
|
+
"lit": "^3.3.1",
|
|
15
|
+
"mateu": "*",
|
|
16
|
+
"minimatch": "10.0.3",
|
|
17
|
+
"keycloak-js": "26.2.0"
|
|
18
|
+
},
|
|
19
|
+
"devDependencies": {
|
|
20
|
+
"typescript": "~5.8.3",
|
|
21
|
+
"vite": "^7.1.2"
|
|
22
|
+
}
|
|
23
|
+
}
|
package/public/vite.svg
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { LitElement, type TemplateResult } from 'lit';
|
|
2
|
+
import { ComponentRenderer } from '@infra/ui/renderers/ComponentRenderer'
|
|
3
|
+
import { BasicComponentRenderer } from '@infra/ui/renderers/BasicComponentRenderer'
|
|
4
|
+
import ClientSideComponent from "@mateu/shared/apiClients/dtos/ClientSideComponent"
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
export class VaadinComponentRenderer extends BasicComponentRenderer implements ComponentRenderer {
|
|
8
|
+
|
|
9
|
+
renderClientSideComponent(container: LitElement, component: ClientSideComponent | undefined, baseUrl: string | undefined, state: any, data: any, appState: any, appData: any, labelAlreadyRendered: boolean | undefined): TemplateResult {
|
|
10
|
+
return super.renderClientSideComponent(container, component, baseUrl, state, data, appState, appData, labelAlreadyRendered)
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="25.6" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 320"><path fill="#00E8FF" d="m64 192l25.926-44.727l38.233-19.114l63.974 63.974l10.833 61.754L192 320l-64-64l-38.074-25.615z"></path><path fill="#283198" d="M128 256V128l64-64v128l-64 64ZM0 256l64 64l9.202-60.602L64 192l-37.542 23.71L0 256Z"></path><path fill="#324FFF" d="M64 192V64l64-64v128l-64 64Zm128 128V192l64-64v128l-64 64ZM0 256V128l64 64l-64 64Z"></path><path fill="#0FF" d="M64 320V192l64 64z"></path></svg>
|
package/src/index.css
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
line-height: 1.5;
|
|
4
|
+
font-weight: 400;
|
|
5
|
+
|
|
6
|
+
color-scheme: light dark;
|
|
7
|
+
color: rgba(255, 255, 255, 0.87);
|
|
8
|
+
background-color: #242424;
|
|
9
|
+
|
|
10
|
+
font-synthesis: none;
|
|
11
|
+
text-rendering: optimizeLegibility;
|
|
12
|
+
-webkit-font-smoothing: antialiased;
|
|
13
|
+
-moz-osx-font-smoothing: grayscale;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
a {
|
|
17
|
+
font-weight: 500;
|
|
18
|
+
color: #646cff;
|
|
19
|
+
text-decoration: inherit;
|
|
20
|
+
}
|
|
21
|
+
a:hover {
|
|
22
|
+
color: #535bf2;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
body {
|
|
26
|
+
margin: 0;
|
|
27
|
+
display: flex;
|
|
28
|
+
min-width: 320px;
|
|
29
|
+
min-height: 100vh;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
@media (prefers-color-scheme: light) {
|
|
33
|
+
:root {
|
|
34
|
+
color: #213547;
|
|
35
|
+
background-color: #ffffff;
|
|
36
|
+
}
|
|
37
|
+
}
|
package/src/index.ts
ADDED
package/src/lumo.js
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import {fieldButton} from '@vaadin/vaadin-lumo-styles/mixins/field-button.js';
|
|
2
|
+
import {menuOverlay} from '@vaadin/vaadin-lumo-styles/mixins/menu-overlay.js';
|
|
3
|
+
import {overlay} from '@vaadin/vaadin-lumo-styles/mixins/overlay.js';
|
|
4
|
+
import {requiredField} from '@vaadin/vaadin-lumo-styles/mixins/required-field.js';
|
|
5
|
+
import {badge} from '@vaadin/vaadin-lumo-styles/badge.js';
|
|
6
|
+
import {color} from '@vaadin/vaadin-lumo-styles/color.js';
|
|
7
|
+
import '@vaadin/vaadin-lumo-styles/font-icons.js';
|
|
8
|
+
import {sizing} from '@vaadin/vaadin-lumo-styles/sizing.js';
|
|
9
|
+
import {spacing} from '@vaadin/vaadin-lumo-styles/spacing.js';
|
|
10
|
+
import {style} from '@vaadin/vaadin-lumo-styles/style.js';
|
|
11
|
+
import {typography} from '@vaadin/vaadin-lumo-styles/typography.js';
|
|
12
|
+
import {userColors} from '@vaadin/vaadin-lumo-styles/user-colors.js';
|
|
13
|
+
import {utility} from '@vaadin/vaadin-lumo-styles/utility.js';
|
|
14
|
+
import '@vaadin/icons/vaadin-iconset.js';
|
|
15
|
+
|
|
16
|
+
const sheet = document.createElement('style')
|
|
17
|
+
sheet.innerHTML = `
|
|
18
|
+
${fieldButton.cssText}
|
|
19
|
+
${menuOverlay.cssText}
|
|
20
|
+
${overlay.cssText}
|
|
21
|
+
${requiredField.cssText}
|
|
22
|
+
${badge.cssText}
|
|
23
|
+
${color.cssText}
|
|
24
|
+
${sizing.cssText}
|
|
25
|
+
${spacing.cssText}
|
|
26
|
+
${style.cssText}
|
|
27
|
+
${typography.cssText}
|
|
28
|
+
${userColors.cssText}
|
|
29
|
+
${utility.cssText}
|
|
30
|
+
`;
|
|
31
|
+
document.body.appendChild(sheet);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/// <reference types="vite/client" />
|
package/tsconfig.json
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
{
|
|
2
|
+
"compilerOptions": {
|
|
3
|
+
"target": "ES2022",
|
|
4
|
+
"experimentalDecorators": true,
|
|
5
|
+
"useDefineForClassFields": false,
|
|
6
|
+
"module": "ESNext",
|
|
7
|
+
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
|
8
|
+
"skipLibCheck": true,
|
|
9
|
+
|
|
10
|
+
/* Bundler mode */
|
|
11
|
+
"moduleResolution": "bundler",
|
|
12
|
+
"allowImportingTsExtensions": true,
|
|
13
|
+
"verbatimModuleSyntax": false,
|
|
14
|
+
"moduleDetection": "force",
|
|
15
|
+
"noEmit": true,
|
|
16
|
+
|
|
17
|
+
/* Linting */
|
|
18
|
+
"strict": true,
|
|
19
|
+
"noUnusedLocals": true,
|
|
20
|
+
"noUnusedParameters": true,
|
|
21
|
+
"erasableSyntaxOnly": false,
|
|
22
|
+
"noFallthroughCasesInSwitch": true,
|
|
23
|
+
"noUncheckedSideEffectImports": true,
|
|
24
|
+
|
|
25
|
+
"paths": {
|
|
26
|
+
"@*": [
|
|
27
|
+
"./src*"
|
|
28
|
+
],
|
|
29
|
+
"@assets*": [
|
|
30
|
+
"./src/assets*"
|
|
31
|
+
],
|
|
32
|
+
"@components*": [
|
|
33
|
+
"../../libs/mateu/src/mateu/ui/infra/ui*"
|
|
34
|
+
],
|
|
35
|
+
"@mateu*": [
|
|
36
|
+
"../../libs/mateu/src/mateu*"
|
|
37
|
+
],
|
|
38
|
+
"@application*": [
|
|
39
|
+
"../../libs/mateu/src/mateu/ui/application*"
|
|
40
|
+
],
|
|
41
|
+
"@domain*": [
|
|
42
|
+
"../../libs/mateu/src/mateu/ui/domain*"
|
|
43
|
+
],
|
|
44
|
+
"@infra*": [
|
|
45
|
+
"../../libs/mateu/src/mateu/ui/infra*"
|
|
46
|
+
]
|
|
47
|
+
},
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
},
|
|
51
|
+
"include": ["src"]
|
|
52
|
+
}
|
package/vite.config.ts
ADDED
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { defineConfig } from 'vite'
|
|
2
|
+
import { resolve } from 'path'
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
// https://vitejs.dev/config/
|
|
6
|
+
export default defineConfig({
|
|
7
|
+
resolve: {
|
|
8
|
+
// preserveSymlinks: true,
|
|
9
|
+
alias: {
|
|
10
|
+
'@': resolve(__dirname, './src'),
|
|
11
|
+
'@assets': resolve(__dirname, './src/assets'),
|
|
12
|
+
'@components': resolve(__dirname, '../../libs/mateu/src/mateu/ui/infra/ui'),
|
|
13
|
+
'@mateu': resolve(__dirname, '../../libs/mateu/src/mateu'),
|
|
14
|
+
'@application': resolve(__dirname, '../../libs/mateu/src/mateu/ui/application'),
|
|
15
|
+
'@domain': resolve(__dirname, '../../libs/mateu/src/mateu/ui/domain'),
|
|
16
|
+
'@infra': resolve(__dirname, '../../libs/mateu/src/mateu/ui/infra'),
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
build: {
|
|
20
|
+
// lib: {
|
|
21
|
+
// entry: 'src/mateu/spikes/starter/mateu-ui.ts',
|
|
22
|
+
// formats: ['es'],
|
|
23
|
+
// },
|
|
24
|
+
rollupOptions: {
|
|
25
|
+
//external: /^lit/,
|
|
26
|
+
output: {
|
|
27
|
+
entryFileNames: `assets/mateu-vaadin.js`,
|
|
28
|
+
chunkFileNames: `assets/[name].js`,
|
|
29
|
+
assetFileNames: `assets/[name].[ext]`
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
},
|
|
33
|
+
server: {
|
|
34
|
+
proxy: {
|
|
35
|
+
// string shorthand: http://localhost:5173/foo -> http://localhost:4567/foo
|
|
36
|
+
'/fluent/mateu': 'http://localhost:8091',
|
|
37
|
+
'/declarative/mateu': 'http://localhost:8091',
|
|
38
|
+
'/counter/mateu': 'http://localhost:8091',
|
|
39
|
+
'/anothercounter/mateu': 'http://localhost:8091',
|
|
40
|
+
'/mateu': 'http://localhost:8091',
|
|
41
|
+
'/images': 'http://localhost:8091',
|
|
42
|
+
'/myassets': 'http://localhost:8091',
|
|
43
|
+
'/sse': 'http://localhost:8091',
|
|
44
|
+
'/upload': 'http://localhost:8091',
|
|
45
|
+
'/master-data': 'http://localhost:8091',
|
|
46
|
+
'/product': 'http://localhost:8091',
|
|
47
|
+
'/call-center': 'http://localhost:8091',
|
|
48
|
+
'/crm': 'http://localhost:8091',
|
|
49
|
+
'/financial': 'http://localhost:8091',
|
|
50
|
+
},
|
|
51
|
+
},
|
|
52
|
+
})
|