neo.mjs 7.0.3 → 7.0.5

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.
@@ -0,0 +1,24 @@
1
+ name: Close inactive issues
2
+ on:
3
+ schedule:
4
+ - cron: '30 1 * * *'
5
+
6
+ jobs:
7
+ close-issues:
8
+ runs-on: ubuntu-latest
9
+ permissions:
10
+ issues: write
11
+ pull-requests: write
12
+ steps:
13
+ - uses: actions/stale@v9
14
+ with:
15
+ operations-per-run: 500
16
+ days-before-issue-stale: 90
17
+ days-before-issue-close: 14
18
+ exempt-issue-labels: 'no auto close'
19
+ stale-issue-label: 'stale'
20
+ stale-issue-message: 'This issue is stale because it has been open for 90 days with no activity.'
21
+ close-issue-message: 'This issue was closed because it has been inactive for 14 days since being marked as stale.'
22
+ days-before-pr-stale: -1
23
+ days-before-pr-close: -1
24
+ repo-token: ${{ secrets.GITHUB_TOKEN }}
package/README.md CHANGED
@@ -12,22 +12,24 @@
12
12
  </p>
13
13
 
14
14
  # Modern Enterprise-Ready JavaScript Framework
15
+ Neo.mjs provides a new approach for building feature-rich web applications. Increase productivity by leveraging a vast
16
+ component library and harness the power of multi-threading for extreme real-time performance.
17
+
18
+ Neo.mjs is the first frontend framework which can run a JavaScript module based dev mode
19
+ without compilations. This makes debugging easier and reduces development costs.
20
+
21
+ In case you care about scalability, extensibility or solid architectures, congratulations,
22
+ you have found the right spot.
15
23
 
16
24
  ## Content
17
25
  1. <a href="#introduction">Introduction</a>
18
- 2. <a href="#slack-channel">Slack Channel for questions & feedback</a>
19
- 3. <a href="#architectures">Scalable frontend architectures</a>
26
+ 2. <a href="#use-cases">Potential Use Cases</a>
27
+ 3. <a href="#slack-channel">Slack Channel for questions & feedback</a>
20
28
  4. <a href="#getting-started">Getting Started</a>
21
29
  5. <a href="#cli">Command-Line Interface</a>
22
30
  6. <a href="#blog">Blog</a>
23
31
 
24
- </br></br>
25
- <h2 id="introduction">1. Introduction</h2>
26
- Neo.mjs is **not** intended for rather simple & static websites.
27
-
28
- The Framework does not focus primarily on a fast first rendering experience for new users,
29
- but instead on a super-fast update & navigation experience for returning users.
30
-
32
+ </br><h2 id="introduction">1. Introduction</h2>
31
33
  Neo.mjs drives the OMT (off the main thread) paradigm into perfection,
32
34
  which is intended to move expensive tasks into Workers.
33
35
 
@@ -46,48 +48,38 @@ Neo.mjs also provides sharing state across multiple Browser-Windows.
46
48
  So far, it is the only Framework which enables us to build complex multi-Window Apps
47
49
  without the need for a native shell.
48
50
 
49
- <img src="https://raw.githubusercontent.com/neomjs/pages/main/resources_pub/images/workers-setup-v4.png">
51
+ <img src="./resources/images/workers-focus.svg">
52
+
53
+
54
+ Neo.mjs is **not** intended for rather simple & static websites.
55
+
56
+ The Framework does not focus primarily on a fast first rendering experience for new users,
57
+ but instead on a super-fast update & navigation experience for returning users.
58
+
50
59
 
51
- Potential Use-Cases:
60
+ </br><h2 id="use-cases">2. Potential Use-Cases</h2>
52
61
  1. Finance (Banking & Trading Apps)
53
62
  2. Data Science
54
63
  3. Web-based IDEs
55
64
  4. Multi-Window Data Visualisation
65
+ 5. Complex dynamic Forms
66
+ 6. "Desktop-like" Apps
67
+ 7. Enterprise Apps in general (e.g. Admin Dashboards)
56
68
 
57
- </br></br>
58
- <h2 id="slack-channel">2. Slack Channel for questions, ideas & feedback</h2>
69
+ </br><h2 id="slack-channel">3. Slack Channel for questions, ideas & feedback</h2>
59
70
  Join our community:</br>
60
71
  <a href="https://join.slack.com/t/neomjs/shared_invite/zt-6c50ueeu-3E1~M4T9xkNnb~M_prEEOA"><img src="https://img.shields.io/badge/Slack-neo.mjs-brightgreen.svg?logo=slack&style=for-the-badge" alt="Join the Slack channel"></a>
61
72
 
62
- </br></br>
63
- <h2 id="getting-started">4. Getting Started</h2>
64
- Take a look at the <a href="./.github/GETTING_STARTED.md">Getting Started Guide</a>
65
- </br></br>
66
- There are 2 options:
67
-
68
- 1. In case you want to create a Neo.mjs App (workspace), use
69
- > npx neo-app@latest
70
-
71
- 2. In case you want to work on the Framework and your App in parallel, you can fork this repository and use
72
- > npm run create-app
73
-
74
- inside of it.
73
+ </br><h2 id="getting-started">4. Getting Started</h2>
74
+ * Take a look at the <a href="./.github/GETTING_STARTED.md">Getting Started Guide</a>
75
+ * Make sure to dive into the <a href="https://neomjs.com/dist/production/apps/portal/#/learn/Setup">Learning Section</a>
76
+ * The most advanced tutorial to help you with getting up to speed is this one:</br>
77
+ <a href="https://neomjs.com/dist/production/apps/portal/#/learn/Earthquakes">Earthquakes Tutorial</a>
75
78
 
76
-
77
- * You can easily move your app from the framework to a workspace or vice versa.
78
- * The CLI inside the framework and inside a workspace works the same.
79
-
80
- Make sure to take a look into the <a href="https://neomjs.com/dist/production/apps/portal/#/learn/Setup">Learning Section</a>
81
-
82
- The most advanced tutorial to help you with getting up to speed is this one:</br>
83
- <a href="https://neomjs.com/dist/production/apps/portal/#/learn/Earthquakes">Earthquakes Tutorial</a>
84
-
85
- </br></br>
86
- <h2 id="cli">5. Command-Line Interface</h2>
79
+ </br><h2 id="cli">5. Command-Line Interface</h2>
87
80
  You can find an in-depth description here: <a href="./buildScripts/README.md">Neo.mjs CLI</a>
88
81
 
89
- </br></br>
90
- <h2 id="blog">6. Blog</h2>
82
+ </br><h2 id="blog">6. Blog</h2>
91
83
  All Blog Posts are listed here: <a href="https://neomjs.com/dist/production/apps/portal/#/blog">Neo.mjs Blog</a>
92
84
 
93
85
  </br></br>
@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
20
20
  */
21
21
  singleton: true,
22
22
  /**
23
- * @member {String} version='7.0.3'
23
+ * @member {String} version='7.0.5'
24
24
  */
25
- version: '7.0.3'
25
+ version: '7.0.5'
26
26
  }
27
27
 
28
28
  /**
@@ -16,7 +16,7 @@
16
16
  "@type": "Organization",
17
17
  "name": "Neo.mjs"
18
18
  },
19
- "datePublished": "2024-08-27",
19
+ "datePublished": "2024-08-30",
20
20
  "publisher": {
21
21
  "@type": "Organization",
22
22
  "name": "Neo.mjs"
@@ -111,7 +111,7 @@ class FooterContainer extends Container {
111
111
  }, {
112
112
  module: Component,
113
113
  cls : ['neo-version'],
114
- html : 'v7.0.3'
114
+ html : 'v7.0.5'
115
115
  }]
116
116
  }],
117
117
  /**
@@ -242,10 +242,11 @@ Using the default options, this will generate the following 4 files:
242
242
  neo
243
243
  | - apps
244
244
  | | - myapp
245
+ | | | - view
246
+ | | | | - MainContainer.mjs
245
247
  | | | - app.mjs
246
248
  | | | - index.html
247
249
  | | | - neo-config.json
248
- | | | - MainContainer.mjs
249
250
  ```
250
251
 
251
252
  The program will also add the App config into buildScripts/webpack/json/myApps.json.
@@ -172,8 +172,6 @@ if (programOpts.info) {
172
172
  `;
173
173
  fs.writeFileSync(path.join(folder, 'index.html'), indexContent);
174
174
 
175
-
176
-
177
175
  let neoConfig = {
178
176
  appPath: `${insideNeo ? '' : '../../'}${appPath}app.mjs`,
179
177
  basePath: '../../',
@@ -97,9 +97,9 @@ function createMainContainer(classFolder, componentPath, componentChunk, name) {
97
97
  const template = [];
98
98
 
99
99
  template.push(
100
- "import ConfigurationViewport from '../../ConfigurationViewport.mjs';",
101
- "import NumberField from '../../../src/form/field/Number.mjs';",
102
- `import ${name} from '../../../src/${componentPath}.mjs';`,
100
+ "import ConfigurationViewport from '../../ConfigurationViewport.mjs';",
101
+ "import NumberField from '../../../src/form/field/Number.mjs';",
102
+ `import ${name} from '../../../src/${componentPath}.mjs';`,
103
103
  "",
104
104
  "/**",
105
105
  ` * @class Neo.examples.${componentChunk.toLowerCase()}.MainContainer`,
@@ -150,9 +150,7 @@ function createMainContainer(classFolder, componentPath, componentChunk, name) {
150
150
  " }",
151
151
  "}",
152
152
  "",
153
- "Neo.setupClass(MainContainer);",
154
- "",
155
- "export default MainContainer;"
153
+ "export default Neo.setupClass(MainContainer);"
156
154
  );
157
155
  const file = `${classFolder}/MainContainer.mjs`;
158
156
  fs.writeFileSync(file, `${template.join(os.EOL)}${os.EOL}`);
@@ -20,9 +20,9 @@ class ServiceWorker extends ServiceBase {
20
20
  */
21
21
  singleton: true,
22
22
  /**
23
- * @member {String} version='7.0.3'
23
+ * @member {String} version='7.0.5'
24
24
  */
25
- version: '7.0.3'
25
+ version: '7.0.5'
26
26
  }
27
27
 
28
28
  /**
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "neo.mjs",
3
- "version": "7.0.3",
3
+ "version": "7.0.5",
4
4
  "description": "The webworkers driven UI framework",
5
5
  "type": "module",
6
6
  "repository": {
@@ -20,7 +20,7 @@ class MainViewController extends Controller {
20
20
  className: 'GS.references1.MainViewController'
21
21
  }
22
22
  onDisableButtonClick(data) {
23
- data.component.disabled = true;
23
+ data.component.disabled = true
24
24
  }
25
25
  }
26
26
  MainViewController = Neo.setupClass(MainViewController);
@@ -0,0 +1,6 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background-color: #000;" version="1.1" width="100%" height="100%" viewBox="-10 -10 700 500"><style>
4
+ font, span {transition: opacity .5s ease-out;}
5
+ path, rect {transition: fill-opacity .5s ease-out, stroke-opacity .5s ease-out;}
6
+ </style><defs><linearGradient x1="0%" y1="100%" x2="0%" y2="0%" id="mx-gradient-3e63dd-1-6c83dd-1-s-0"><stop offset="0%" style="stop-color: rgb(108, 131, 221); stop-opacity: 1;"/><stop offset="100%" style="stop-color: rgb(62, 99, 221); stop-opacity: 1;"/></linearGradient><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffcc99-1-fbc593-1-s-0"><stop offset="0%" style="stop-color: rgb(255, 204, 153); stop-opacity: 1;"/><stop offset="100%" style="stop-color: rgb(251, 197, 147); stop-opacity: 1;"/></linearGradient><linearGradient x1="0%" y1="100%" x2="0%" y2="0%" id="mx-gradient-008a00-1-00cc00-1-s-0"><stop offset="0%" style="stop-color: rgb(0, 204, 0); stop-opacity: 1;"/><stop offset="100%" style="stop-color: rgb(0, 138, 0); stop-opacity: 1;"/></linearGradient></defs><g><g data-cell-id="0"><g data-cell-id="1"><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-1"><g><path d="M 486.37 240 L 553.63 240" fill="none" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 481.12 240 L 488.12 236.5 L 486.37 240 L 488.12 243.5 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/><path d="M 558.88 240 L 551.88 243.5 L 553.63 240 L 551.88 236.5 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-2"><g><path d="M 240.04 320 L 240 440 L 206.37 440" fill="none" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 201.12 440 L 208.12 436.5 L 206.37 440 L 208.12 443.5 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-3"><g><rect x="200" y="160" width="280" height="160" rx="24" ry="24" fill="url(#mx-gradient-3e63dd-1-6c83dd-1-s-0)" stroke="#8ba6ff" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 278px; height: 1px; padding-top: 240px; margin-left: 201px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 16px;">App Worker</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-4"><g><rect x="360" y="280" width="120" height="40" rx="6" ry="6" fill="#cce5ff" stroke="#36393d" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 300px; margin-left: 361px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;" color="#000000">Your App(s)</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-5"><g><rect x="200" y="160" width="120" height="40" rx="6" ry="6" fill="#cce5ff" stroke="#36393d" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 180px; margin-left: 201px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;" color="#000000">Framework</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-6"><g><rect x="0" y="200" width="120" height="80" rx="12" ry="12" fill-opacity="var(--fill-opacity)" fill="url(#mx-gradient-3e63dd-1-6c83dd-1-s-0)" stroke="#8ba6ff" stroke-opacity="var(--stroke-opacity)" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left; opacity: var(--fill-opacity);"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 240px; margin-left: 1px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><span style="font-size: 13px;">Service Worker<br />(optional)</span></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-7"><g><path d="M 126.37 260 L 193.63 260" fill="none" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 121.12 260 L 128.12 256.5 L 126.37 260 L 128.12 263.5 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/><path d="M 198.88 260 L 191.88 263.5 L 193.63 260 L 191.88 256.5 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-8"><g><path d="M 486.37 40 L 553.63 40" fill="none" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 481.12 40 L 488.12 36.5 L 486.37 40 L 488.12 43.5 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/><path d="M 558.88 40 L 551.88 43.5 L 553.63 40 L 551.88 36.5 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-9"><g><rect x="320" y="0" width="160" height="80" rx="12" ry="12" fill="url(#mx-gradient-3e63dd-1-6c83dd-1-s-0)" stroke="#8ba6ff" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 40px; margin-left: 321px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 15px;">Data Worker</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-10"><g><path d="M 400 153.63 L 400 86.37" fill="none" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 400 158.88 L 396.5 151.88 L 400 153.63 L 403.5 151.88 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/><path d="M 400 81.12 L 403.5 88.12 L 400 86.37 L 396.5 88.12 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-11"><g><rect x="560" y="0" width="120" height="80" rx="12" ry="12" fill="#647687" stroke="#314354" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 40px; margin-left: 561px;"><div data-drawio-colors="color: #ffffff; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(255, 255, 255); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 14px;">Backend</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-12"><g><path d="M 620 286.37 L 620 340 L 620 393.63" fill="none" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 620 281.12 L 623.5 288.12 L 620 286.37 L 616.5 288.12 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/><path d="M 620 398.88 L 616.5 391.88 L 620 393.63 L 623.5 391.88 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-13"><g><rect x="560" y="200" width="120" height="80" rx="12" ry="12" fill-opacity="var(--fill-opacity)" fill="url(#mx-gradient-ffcc99-1-fbc593-1-s-0)" stroke="#994c00" stroke-opacity="var(--stroke-opacity)" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left; opacity: var(--fill-opacity);"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 240px; margin-left: 561px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;" color="#000000">Canvas Worker<br />(optional)</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-14"><g><rect x="280" y="400" width="400" height="80" rx="12" ry="12" fill="url(#mx-gradient-008a00-1-00cc00-1-s-0)" stroke="#005700" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 398px; height: 1px; padding-top: 440px; margin-left: 281px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;">Main Thread<br />(Browser Window)</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-15"><g><path d="M 200 460 L 273.63 460" fill="none" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 278.88 460 L 271.88 463.5 L 273.63 460 L 271.88 456.5 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-16"><g><rect x="0" y="400" width="200" height="80" rx="12" ry="12" fill="url(#mx-gradient-3e63dd-1-6c83dd-1-s-0)" stroke="#8ba6ff" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 440px; margin-left: 1px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;">VDom Worker<br />(optional)</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-17"><g><rect x="280" y="440" width="120" height="40" rx="6" ry="6" fill="url(#mx-gradient-ffcc99-1-fbc593-1-s-0)" stroke="#994c00" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 460px; margin-left: 281px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;" color="#000000">DOM Operations</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-18"><g><rect x="560" y="400" width="120" height="40" rx="6" ry="6" fill-opacity="var(--fill-opacity)" fill="url(#mx-gradient-ffcc99-1-fbc593-1-s-0)" stroke="#994c00" stroke-opacity="var(--stroke-opacity)" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left; opacity: var(--fill-opacity);"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 118px; height: 1px; padding-top: 420px; margin-left: 561px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 13px;" color="#000000">Canvas</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-19"><g><path d="M 340 326.37 L 340 393.63" fill="none" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 340 321.12 L 343.5 328.12 L 340 326.37 L 336.5 328.12 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/><path d="M 340 398.88 L 336.5 391.88 L 340 393.63 L 343.5 391.88 Z" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-miterlimit="10" pointer-events="all"/></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-20"><g><rect x="80" y="0" width="160" height="80" rx="12" ry="12" fill-opacity="var(--fill-opacity)" fill="url(#mx-gradient-3e63dd-1-6c83dd-1-s-0)" stroke="#8ba6ff" stroke-opacity="var(--stroke-opacity)" pointer-events="all"/></g><g><g transform="translate(-0.5 -0.5)"><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left; opacity: var(--fill-opacity);"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 40px; margin-left: 81px;"><div data-drawio-colors="color: rgb(240, 240, 240); " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(240, 240, 240); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;"><font style="font-size: 14px;">Task Worker<br />(optional)</font></div></div></div></foreignObject></g></g></g><g data-cell-id="TvLHVO9ugg6I3p-DXBA7-21"><g><path d="M 160 86.37 L 160 240 L 193.63 240" fill="none" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 160 81.12 L 163.5 88.12 L 160 86.37 L 156.5 88.12 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/><path d="M 198.88 240 L 191.88 243.5 L 193.63 240 L 191.88 236.5 Z" fill-opacity="var(--fill-opacity)" fill="rgb(240, 240, 240)" stroke="rgb(240, 240, 240)" stroke-opacity="var(--stroke-opacity)" stroke-miterlimit="10" pointer-events="all"/></g></g></g></g></g></svg>
@@ -262,12 +262,12 @@ const DefaultConfig = {
262
262
  useVdomWorker: true,
263
263
  /**
264
264
  * buildScripts/injectPackageVersion.mjs will update this value
265
- * @default '7.0.3'
265
+ * @default '7.0.5'
266
266
  * @memberOf! module:Neo
267
267
  * @name config.version
268
268
  * @type String
269
269
  */
270
- version: '7.0.3'
270
+ version: '7.0.5'
271
271
  };
272
272
 
273
273
  Object.assign(DefaultConfig, {
@@ -92,7 +92,9 @@ class Base extends Component {
92
92
  */
93
93
  pressed_: false,
94
94
  /**
95
- * Change the browser hash value on click
95
+ * Change the browser hash value on click.
96
+ * Use route for internal navigation and url for external links. Do not use both on the same instance.
97
+ * Transforms the button tag into an a tag [optional]
96
98
  * @member {String|null} route_=null
97
99
  */
98
100
  route_: null,
@@ -297,6 +299,16 @@ class Base extends Component {
297
299
  this.cls = cls
298
300
  }
299
301
 
302
+ /**
303
+ * Triggered after the route config got changed
304
+ * @param {String|null} value
305
+ * @param {String|null} oldValue
306
+ * @protected
307
+ */
308
+ afterSetRoute(value, oldValue) {
309
+ !this.editRoute && this.updateTag()
310
+ }
311
+
300
312
  /**
301
313
  * Triggered after the theme config got changed
302
314
  * @param {String|null} value
@@ -338,22 +350,12 @@ class Base extends Component {
338
350
 
339
351
  /**
340
352
  * Triggered after the url config got changed
341
- * @param {String} value
342
- * @param {String} oldValue
353
+ * @param {String|null} value
354
+ * @param {String|null} oldValue
343
355
  * @protected
344
356
  */
345
357
  afterSetUrl(value, oldValue) {
346
- let vdomRoot = this.getVdomRoot();
347
-
348
- if (value) {
349
- vdomRoot.href = value;
350
- vdomRoot.tag = 'a'
351
- } else {
352
- delete vdomRoot.href;
353
- vdomRoot.tag = 'button'
354
- }
355
-
356
- this.update()
358
+ this.updateTag()
357
359
  }
358
360
 
359
361
  /**
@@ -458,14 +460,7 @@ class Base extends Component {
458
460
  * @protected
459
461
  */
460
462
  changeRoute() {
461
- let me = this,
462
- {windowId} = me;
463
-
464
- if (me.editRoute) {
465
- Neo.Main.editRoute(me.route)
466
- } else {
467
- Neo.Main.setRoute({value: me.route, windowId})
468
- }
463
+ this.editRoute && Neo.Main.editRoute(this.route)
469
464
  }
470
465
 
471
466
  /**
@@ -510,7 +505,7 @@ class Base extends Component {
510
505
  me.callback(me.handler, me.handlerScope || me, [data]);
511
506
 
512
507
  me.menu && me.toggleMenu();
513
- me.route && me.changeRoute();
508
+ me.route && me.changeRoute(); // only relevant for editRoute=true
514
509
  me.useRippleEffect && me.showRipple(data)
515
510
  }
516
511
 
@@ -567,6 +562,30 @@ class Base extends Component {
567
562
  await this.timeout(50)
568
563
  }
569
564
  }
565
+
566
+ /**
567
+ *
568
+ */
569
+ updateTag() {
570
+ let me = this,
571
+ {editRoute, route, url} = me,
572
+ link = !editRoute && route || url,
573
+ vdomRoot = me.getVdomRoot();
574
+
575
+ if (!editRoute && route?.startsWith('#') === false) {
576
+ link = '#' + link
577
+ }
578
+
579
+ if (link) {
580
+ vdomRoot.href = link;
581
+ vdomRoot.tag = 'a'
582
+ } else {
583
+ delete vdomRoot.href;
584
+ vdomRoot.tag = 'button'
585
+ }
586
+
587
+ me.update()
588
+ }
570
589
  }
571
590
 
572
591
  export default Neo.setupClass(Base);
@@ -170,6 +170,7 @@ class EventDragZone extends DragZone {
170
170
  appName : me.appName,
171
171
  moveInMainThread: me.moveInMainThread,
172
172
  parentId : me.proxyParentId,
173
+ windowId : me.windowId,
173
174
 
174
175
  ...me.dragProxyConfig,
175
176
 
@@ -609,9 +609,10 @@ class Base extends CoreBase {
609
609
  if (value && !me.dropZone) {
610
610
  import('../draggable/DropZone.mjs').then(module => {
611
611
  me.dropZone = Neo.create({
612
- module : module.default,
613
- appName: me.appName,
614
- owner : me,
612
+ module : module.default,
613
+ appName : me.appName,
614
+ owner : me,
615
+ windowId: me.windowId,
615
616
  ...me.dropZoneConfig
616
617
  })
617
618
  })
@@ -663,6 +663,7 @@ class Circle extends Component {
663
663
  dragProxyConfig: {vdom: me.getProxyVdom()},
664
664
  owner : me,
665
665
  useProxyWrapper: false,
666
+ windowId : me.windowId,
666
667
  ...me.dragZoneConfig
667
668
  })
668
669
  }
@@ -502,16 +502,16 @@ class Base extends Panel {
502
502
  *
503
503
  */
504
504
  createHeader() {
505
- let me = this,
506
- {windowId} = me,
507
- cls = ['neo-header-toolbar', 'neo-toolbar'],
508
- headers = me.headers || [];
505
+ let me = this,
506
+ {appName, windowId} = me,
507
+ cls = ['neo-header-toolbar', 'neo-toolbar'],
508
+ headers = me.headers || [];
509
509
 
510
510
  me.draggable && cls.push('neo-draggable');
511
511
 
512
512
  me.headerToolbar = Neo.create({
513
513
  module : Toolbar,
514
- appName : me.appName,
514
+ appName,
515
515
  cls,
516
516
  dock : 'top',
517
517
  flex : 'none',
@@ -685,9 +685,9 @@ class Base extends Panel {
685
685
  * @param data
686
686
  */
687
687
  onDragStart(data) {
688
- let me = this,
689
- {windowId} = me,
690
- style = me.style || {};
688
+ let me = this,
689
+ {appName, id, windowId} = me,
690
+ style = me.style || {};
691
691
 
692
692
  if (!me.maximized) {
693
693
  me.isDragging = true;
@@ -697,7 +697,7 @@ class Base extends Panel {
697
697
  if (!me.dragZone) {
698
698
  me.dragZone = Neo.create({
699
699
  module : DragZone,
700
- appName : me.appName,
700
+ appName,
701
701
  bodyCursorStyle : 'move !important',
702
702
  boundaryContainerId: me.boundaryContainerId,
703
703
  dragElement : me.vdom,
@@ -708,10 +708,7 @@ class Base extends Panel {
708
708
  ...me.dragZoneConfig
709
709
  });
710
710
 
711
- me.fire('dragZoneCreated', {
712
- dragZone: me.dragZone,
713
- id : me.id
714
- })
711
+ me.fire('dragZoneCreated', {dragZone: me.dragZone, id})
715
712
  } else {
716
713
  me.dragZone.boundaryContainerId = me.boundaryContainerId
717
714
  }
@@ -198,6 +198,7 @@ class DragZone extends Base {
198
198
  appName : me.appName,
199
199
  moveInMainThread: me.moveInMainThread,
200
200
  parentId : me.proxyParentId,
201
+ windowId : me.windowId,
201
202
 
202
203
  ...me.dragProxyConfig,
203
204
 
@@ -154,6 +154,7 @@ class Picker extends Text {
154
154
  maxHeight: me.pickerMaxHeight,
155
155
  theme : me.theme,
156
156
  width : pickerWidth,
157
+ windowId : me.windowId,
157
158
  ...me.pickerConfig,
158
159
 
159
160
  // scoped to the field instance
package/src/list/Base.mjs CHANGED
@@ -201,8 +201,9 @@ class Base extends Component {
201
201
  plugins = me.plugins || [];
202
202
 
203
203
  plugins.push({
204
- module : module.default,
205
- appName: me.appName,
204
+ module : module.default,
205
+ appName : me.appName,
206
+ windowId: me.windowId,
206
207
  ...me.pluginAnimateConfig
207
208
  });
208
209
 
@@ -233,9 +234,10 @@ class Base extends Component {
233
234
  if (value && !me.dragZone) {
234
235
  import('../draggable/list/DragZone.mjs').then(module => {
235
236
  me.dragZone = Neo.create({
236
- module : module.default,
237
- appName: me.appName,
238
- owner : me,
237
+ module : module.default,
238
+ appName : me.appName,
239
+ owner : me,
240
+ windowId: me.windowId,
239
241
  ...me.dragZoneConfig
240
242
  })
241
243
  })
@@ -37,11 +37,14 @@ class Toolbar extends BaseToolbar {
37
37
 
38
38
  if (value && !me.sortZone) {
39
39
  import('../../draggable/tab/header/toolbar/SortZone.mjs').then(module => {
40
+ let {appName, id, windowId} = me;
41
+
40
42
  me.sortZone = Neo.create({
41
43
  module : module.default,
42
- appName : me.appName,
43
- boundaryContainerId: me.id,
44
+ appName,
45
+ boundaryContainerId: id,
44
46
  owner : me,
47
+ windowId,
45
48
  ...me.sortZoneConfig
46
49
  })
47
50
  })
package/src/tree/List.mjs CHANGED
@@ -81,9 +81,10 @@ class Tree extends Base {
81
81
  } else if (!me.dragZone) {
82
82
  import('../draggable/tree/DragZone.mjs').then(module => {
83
83
  me.dragZone = Neo.create({
84
- module : module.default,
85
- appName: me.appName,
86
- owner : me,
84
+ module : module.default,
85
+ appName : me.appName,
86
+ owner : me,
87
+ windowId: me.windowId,
87
88
  ...me.dragZoneConfig
88
89
  })
89
90
  })
@@ -110,6 +111,7 @@ class Tree extends Base {
110
111
  appName : me.appName,
111
112
  boundaryContainerId: me.id,
112
113
  owner : me,
114
+ windowId : me.windowId,
113
115
  ...me.sortZoneConfig
114
116
  })
115
117
  })