neo.mjs 6.9.11 → 6.9.12

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.
Files changed (38) hide show
  1. package/apps/ServiceWorker.mjs +2 -2
  2. package/apps/learnneo/index.html +4 -3
  3. package/apps/learnneo/neo-config.json +1 -4
  4. package/apps/learnneo/view/Viewport.mjs +11 -4
  5. package/apps/learnneo/view/ViewportController.mjs +2 -2
  6. package/apps/learnneo/view/home/ContentComponent.mjs +24 -0
  7. package/apps/learnneo/view/home/ContentTreeList.mjs +16 -11
  8. package/apps/learnneo/view/home/MainContainer.mjs +16 -16
  9. package/apps/learnneo/view/home/MainContainerModel.mjs +3 -5
  10. package/apps/newwebsite/index.html +3 -0
  11. package/buildScripts/convertDesignTokens.mjs +173 -0
  12. package/examples/ServiceWorker.mjs +2 -2
  13. package/examples/button/base/neo-config.json +2 -1
  14. package/package.json +2 -1
  15. package/resources/data/deck/learnneo/p/2023-10-08T20-20-37-336Z.md +17 -10
  16. package/resources/data/deck/learnneo/p/stylesheet.md +26 -8
  17. package/resources/data/deck/training/p/2023-01-10T02-21-54-303Z.md +1 -1
  18. package/resources/data/deck/training/t.json +1276 -1
  19. package/resources/design-tokens/json/component.json +288 -0
  20. package/resources/design-tokens/json/core.json +352 -0
  21. package/resources/design-tokens/json/semantic.json +231 -0
  22. package/resources/scss/src/apps/learnneo/Viewport.scss +3 -0
  23. package/resources/scss/src/apps/learnneo/home/ContentComponent.scss +61 -0
  24. package/resources/scss/src/apps/learnneo/home/ContentTreeList.scss +60 -13
  25. package/resources/scss/src/apps/learnneo/home/ContentView.scss +5 -2
  26. package/resources/scss/src/apps/newwebsite/MainContainer.css +33 -0
  27. package/resources/scss/src/apps/newwebsite/MainContainer.scss +14 -15
  28. package/resources/scss/src/list/Base.scss +1 -1
  29. package/resources/scss/theme-neo-light/Global.scss +33 -15
  30. package/resources/scss/theme-neo-light/design-tokens/Component.scss +62 -1
  31. package/resources/scss/theme-neo-light/design-tokens/Components.scss +3 -0
  32. package/resources/scss/theme-neo-light/design-tokens/Core.scss +65 -5
  33. package/resources/scss/theme-neo-light/design-tokens/Semantic.scss +61 -0
  34. package/resources/scss/theme-neo-light/list/Base.scss +29 -6
  35. package/src/DefaultConfig.mjs +2 -2
  36. package/src/controller/Base.mjs +31 -23
  37. package/src/data/connection/Xhr.mjs +1 -1
  38. package/src/form/field/Text.mjs +2 -2
package/resources/scss/theme-neo-light/design-tokens/Core.scss CHANGED
@@ -1,7 +1,67 @@
1
1
  :root .neo-theme-neo-light {
2
- --core-fontsize-h1 : 2.5rem;
3
- --core-fontsize-h2 : 1.75rem;
4
- --core-fontweight-semibold : 600;
5
- --core-fontfamily-sans : Source Code Pro, sans;
6
- --core-lineheight-headline : 1.2;
2
+ --black : #000000;
3
+ --borderradius-0 : 0;
4
+ --borderradius-4 : 4;
5
+ --borderradius-8 : 8;
6
+ --core-fontfamily-mono : 'Source Code Pro', monospace;
7
+ --core-fontfamily-sans : 'Source Sans 3', sans-serif;
8
+ --core-fontfamily-serif : 'Source Serif 4', serif;
9
+ --core-fontsize-body : 18px;
10
+ --core-fontsize-h1 : 2.5rem;
11
+ --core-fontsize-h2 : 1.75rem;
12
+ --core-fontweight-bold : 700;
13
+ --core-fontweight-regular : 400;
14
+ --core-fontweight-semibold : 600;
15
+ --core-lineheight-headline : 1.2;
16
+ --core-lineheight-paragraph : 1.5;
17
+ --gray-100 : #F0F2F0;
18
+ --gray-200 : #D3D7D2;
19
+ --gray-300 : #B6BDB4;
20
+ --gray-400 : #99A295;
21
+ --gray-50 : #fafafa;
22
+ --gray-500 : #7C8877;
23
+ --gray-600 : #606A5D;
24
+ --gray-700 : #454B42;
25
+ --gray-800 : #292D28;
26
+ --gray-900 : #0E0F0D;
27
+ --green-50 : #DFFEF2;
28
+ --green-100 : #BFFCE6;
29
+ --green-200 : #94FAD5;
30
+ --green-300 : #54F7BB;
31
+ --green-400 : #3FF6B3;
32
+ --green-500 : #29F5AA;
33
+ --green-600 : #0EF49F;
34
+ --green-700 : #0ADB8E;
35
+ --green-800 : #08A46A;
36
+ --green-900 : #056D47;
37
+ --height-16 : 16;
38
+ --height-2 : 2;
39
+ --height-32 : 32;
40
+ --height-4 : 4;
41
+ --height-48 : 48;
42
+ --height-8 : 8;
43
+ --purple-100 : #efe3ff;
44
+ --purple-200 : #d0aaff;
45
+ --purple-300 : #b071ff;
46
+ --purple-400 : #9039ff;
47
+ --purple-500 : #7100ff;
48
+ --purple-600 : #5800c6;
49
+ --purple-700 : #3f008e;
50
+ --purple-800 : #260055;
51
+ --purple-900 : #0d001c;
52
+ --spacing-12 : 12;
53
+ --spacing-16 : 16;
54
+ --spacing-2 : 2;
55
+ --spacing-20 : 20;
56
+ --spacing-24 : 24;
57
+ --spacing-32 : 32;
58
+ --spacing-4 : 4;
59
+ --spacing-40 : 40;
60
+ --spacing-48 : 48;
61
+ --spacing-64 : 64;
62
+ --spacing-8 : 8;
63
+ --spacing-80 : 80;
64
+ --spacing-96 : 96;
65
+ --Transparent : rgba(255,255,255,0);
66
+ --white : #FFFFFF;
7
67
  }
package/resources/scss/theme-neo-light/design-tokens/Semantic.scss CHANGED
@@ -0,0 +1,61 @@
1
+ :root .neo-theme-neo-light {
2
+ --sem-borderradius-large : var(--borderradius-8);
3
+ --sem-borderradius-medium : var(--borderradius-4);
4
+ --sem-borderradius-none : var(--borderradius-0);
5
+
6
+ --sem-color-bg-neutral-active : var(--gray-300);
7
+ --sem-color-bg-neutral-default : var(--gray-50);
8
+ --sem-color-bg-neutral-disabled : var(--gray-200);
9
+ --sem-color-bg-neutral-highlighted : var(--white);
10
+ --sem-color-bg-neutral-hover : var(--gray-200);
11
+
12
+ --sem-color-bg-primary-active : var(--green-600);
13
+ --sem-color-bg-primary-background : var(--green-50);
14
+ --sem-color-bg-primary-default : var(--green-400);
15
+ --sem-color-bg-primary-disabled : var(--gray-200);
16
+ --sem-color-bg-primary-hover : var(--green-500);
17
+
18
+ --sem-color-border-contrast : var(--black);
19
+ --sem-color-border-default : var(--gray-200);
20
+ --sem-color-border-subtle : var(--gray-100);
21
+ --sem-color-fg-neutral-contrast : var(--black);
22
+ --sem-color-fg-neutral-default : var(--gray-900);
23
+ --sem-color-fg-neutral-disabled : var(--gray-300);
24
+ --sem-color-fg-neutral-subdued : var(--gray-700);
25
+ --sem-color-fg-primary-base : var(--green-500);
26
+ --sem-color-fg-primary-faded : var(--green-600);
27
+ --sem-color-fg-primary-highlighted : var(--green-400);
28
+ --sem-height-large : var(--height-32);
29
+ --sem-height-medium : var(--height-16);
30
+ --sem-height-small : var(--height-8);
31
+ --sem-height-xlarge : var(--height-48);
32
+ --sem-height-xsmall : var(--height-4);
33
+ --sem-height-xxsmall : var(--height-2);
34
+ --sem-spacing-large : var(--spacing-20);
35
+ --sem-spacing-medium : var(--spacing-16);
36
+ --sem-spacing-small : var(--spacing-12);
37
+ --sem-spacing-xlarge : var(--spacing-24);
38
+ --sem-spacing-xsmall : var(--spacing-8);
39
+ --sem-spacing-xxlarge : var(--spacing-32);
40
+ --sem-spacing-xxsmall : var(--spacing-4);
41
+ --sem-spacing-xxxlarge : var(--spacing-40);
42
+ --sem-spacing-xxxsmall : var(--spacing-2);
43
+ --sem-typo-body-fontFamily : var(--core-fontfamily-sans);
44
+ --sem-typo-body-fontSize : var(--core-fontsize-body);
45
+ --sem-typo-body-fontWeight : var(--core-fontweight-regular);
46
+ --sem-typo-body-letterSpacing : 0;
47
+ --sem-typo-body-lineHeight : var(--core-lineheight-paragraph);
48
+ --sem-typo-body-paragraphIndent : 0;
49
+ --sem-typo-body-paragraphSpacing : 0;
50
+ --sem-typo-body-textDecoration : none;
51
+ --sem-typo-h1-fontFamily : var(--core-fontfamily-sans);
52
+ --sem-typo-h1-fontSize : var(--core-fontsize-h1);
53
+ --sem-typo-h1-fontWeight : var(--core-fontweight-bold);
54
+ --sem-typo-h1-letterSpacing : -0.02em;
55
+ --sem-typo-h1-lineHeight : var(--core-lineheight-headline);
56
+ --sem-typo-h1-textDecoration : none;
57
+ --sem-typo-h2-fontFamily : var(--core-fontfamily-sans);
58
+ --sem-typo-h2-fontSize : var(--core-fontsize-h2);
59
+ --sem-typo-h2-fontWeight : var(--core-fontweight-semibold);
60
+ --sem-typo-h2-lineHeight : var(--core-lineheight-headline);
61
+ }
package/resources/scss/theme-neo-light/list/Base.scss CHANGED
@@ -1,12 +1,35 @@
1
1
  :root .neo-theme-neo-light { // .neo-list-container
2
2
  --list-container-background-color : #fff;
3
3
  --list-container-border : 0;
4
- --list-container-list-color : #{lighten(#33343d, 20%)};
5
- --list-item-background-color : #fff;
6
- --list-item-background-color-hover : #{lighten(#33343d, 70%)};
7
- --list-item-background-color-selected: #{lighten(#64B5F6, 22%)};
8
- --list-item-color-selected : #2b2b2b;
9
- --list-item-glyph-color : #{lighten(#33343d, 20%)};
4
+ --list-container-list-color : var(--sem-color-fg-neutral-contrast);
5
+ --list-item-background-color : transparent;
6
+ --list-item-background-color-hover : var(--sem-color-bg-neutral-hover);
7
+ --list-item-background-color-selected: var(--sem-color-bg-primary-background);
8
+ --list-item-color-selected : var(--sem-color-fg-neutral-contrast);
9
+ --list-item-glyph-color : var(--sem-color-fg-neutral-default);
10
10
  --list-item-highlight-search-color : red;
11
11
  --list-item-padding : 5px;
12
12
  }
13
+
14
+
15
+
16
+
17
+
18
+
19
+
20
+
21
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder.neo-folder-open .neo-list-item-content:before {
22
+ content: unset !important;
23
+ }
24
+
25
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder .neo-list-item-content:before {
26
+ content: unset !important;
27
+ }
28
+
29
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder .neo-list-item-content:before {
30
+ content: unset !important;
31
+ }
32
+
33
+ .neo-tree-list .neo-list-item .neo-list-item-content:before {
34
+ content: unset !important;
35
+ }
package/src/DefaultConfig.mjs CHANGED
@@ -236,12 +236,12 @@ const DefaultConfig = {
236
236
  useVdomWorker: true,
237
237
  /**
238
238
  * buildScripts/injectPackageVersion.mjs will update this value
239
- * @default '6.9.11'
239
+ * @default '6.9.12'
240
240
  * @memberOf! module:Neo
241
241
  * @name config.version
242
242
  * @type String
243
243
  */
244
- version: '6.9.11'
244
+ version: '6.9.12'
245
245
  };
246
246
 
247
247
  Object.assign(DefaultConfig, {
package/src/controller/Base.mjs CHANGED
@@ -51,7 +51,7 @@ class Base extends CoreBase {
51
51
  HashHistory.on('change', this.onHashChange, this)
52
52
  }
53
53
 
54
- /**
54
+ /**
55
55
  * Triggered after the routes config got changed
56
56
  * @param {Object} value
57
57
  * @param {Object} oldValue
@@ -100,58 +100,66 @@ class Base extends CoreBase {
100
100
  * @param {Object} value
101
101
  * @param {Object} oldValue
102
102
  */
103
- onHashChange(value, oldValue) {
103
+ async onHashChange(value, oldValue) {
104
104
  let me = this,
105
+ counter = 0,
105
106
  hasRouteBeenFound = false,
106
107
  handleRoutes = me.handleRoutes,
107
108
  routeKeys = Object.keys(handleRoutes),
109
+ routeKeysLength = routeKeys.length,
108
110
  routes = me.routes,
109
- handler, preHandler, responsePreHandler, result, route;
111
+ handler, key, paramObject, preHandler, responsePreHandler, result, route;
110
112
 
111
- routeKeys.forEach(key => {
113
+ while (routeKeysLength > 0 && counter < routeKeysLength && !hasRouteBeenFound) {
114
+ key = routeKeys[counter];
112
115
  handler = null;
113
116
  preHandler = null;
114
117
  responsePreHandler = null;
115
-
116
- result = value.hashString.match(handleRoutes[key]);
118
+ paramObject = {};
119
+ result = value.hashString.match(handleRoutes[key]);
117
120
 
118
121
  if (result) {
119
122
  const
120
123
  arrayParamIds = key.match(routeParamRegex),
121
- arrayParamValues = result.splice(1, result.length - 1),
122
- paramObject = {};
124
+ arrayParamValues = result.splice(1, result.length - 1);
123
125
 
124
126
  if (arrayParamIds && arrayParamIds.length !== arrayParamValues.length) {
125
- throw 'Number of IDs and number of Values do not match';
127
+ throw 'Number of IDs and number of Values do not match'
126
128
  }
127
129
 
128
130
  for (let i = 0; arrayParamIds && i < arrayParamIds.length; i++) {
129
- paramObject[arrayParamIds[i].substring(1, arrayParamIds[i].length - 1)] = arrayParamValues[i];
131
+ paramObject[arrayParamIds[i].substring(1, arrayParamIds[i].length - 1)] = arrayParamValues[i]
130
132
  }
131
133
 
132
134
  route = routes[key];
133
135
 
134
136
  if (Neo.isString(route)) {
135
137
  handler = route;
136
- responsePreHandler = true;
138
+ responsePreHandler = true
137
139
  } else if (Neo.isObject(route)) {
138
140
  handler = route.handler;
139
- preHandler = route.preHandler;
140
-
141
- if (preHandler) {
142
- responsePreHandler = me[preHandler]?.call(me, paramObject, value, oldValue);
143
- } else {
144
- responsePreHandler = true;
145
- }
141
+ preHandler = route.preHandler
146
142
  }
147
143
 
148
- hasRouteBeenFound = true;
144
+ hasRouteBeenFound = true
149
145
 
150
- if (responsePreHandler) {
151
- me[handler]?.call(me, paramObject, value, oldValue)
152
- }
153
146
  }
154
- });
147
+
148
+ counter++
149
+ }
150
+
151
+ // execute
152
+ if (hasRouteBeenFound) {
153
+ if (preHandler) {
154
+ responsePreHandler = await me[preHandler]?.call(me, paramObject, value, oldValue)
155
+ } else {
156
+ responsePreHandler = true
157
+ }
158
+
159
+ if (responsePreHandler) {
160
+ await me[handler]?.call(me, paramObject, value, oldValue)
161
+ }
162
+ }
155
163
 
156
164
  if (routeKeys.length > 0 && !hasRouteBeenFound) {
157
165
  if (me.defaultRoute) {
package/src/data/connection/Xhr.mjs CHANGED
@@ -169,7 +169,7 @@ class Xhr extends Base {
169
169
  if (!opts.url) {
170
170
  console.error('Neo.Xhr.request without a given url' + JSON.stringify(opts));
171
171
  } else {
172
- if (!opts.insideNeo && location.href.includes('/node_modules/neo.mjs/') && !location.href.startsWith('https://neomjs.github.io/')) {
172
+ if (!opts.insideNeo && location.href.includes('/node_modules/neo.mjs/') && !location.href.startsWith('https://neomjs.com/')) {
173
173
  if (opts.url.startsWith('./') || opts.url.startsWith('../')) {
174
174
  opts.url = '../../' + opts.url;
175
175
  }
package/src/form/field/Text.mjs CHANGED
@@ -1307,7 +1307,7 @@ class Text extends Base {
1307
1307
  onInputValueChange(data) {
1308
1308
  let me = this,
1309
1309
  oldValue = me.value,
1310
- value = data.value,
1310
+ value = data.value ? data.value.toString().trim() : me.emptyValue,
1311
1311
  vnode = VNodeUtil.findChildVnode(me.vnode, {nodeName: 'input'});
1312
1312
 
1313
1313
  if (vnode) {
@@ -1510,7 +1510,7 @@ class Text extends Base {
1510
1510
  minLength = me.minLength,
1511
1511
  required = me.required,
1512
1512
  returnValue = true,
1513
- value = me.value,
1513
+ value = me.value ? me.value.toString().trim() : me.emptyValue,
1514
1514
  valueLength = value?.toString().length,
1515
1515
  inputPattern = me.inputPattern,
1516
1516
  isEmpty = value !== 0 && (!value || valueLength < 1),