neo.mjs 6.9.12 → 6.10.0

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 (53) hide show
  1. package/BACKERS.md +0 -30
  2. package/apps/ServiceWorker.mjs +2 -2
  3. package/apps/learnneo/index.html +8 -4
  4. package/apps/learnneo/view/LivePreview.mjs +171 -0
  5. package/apps/learnneo/view/home/ContentTreeList.mjs +91 -8
  6. package/apps/learnneo/view/home/MainContainerController.mjs +5 -20
  7. package/examples/ServiceWorker.mjs +2 -2
  8. package/examples/button/base/neo-config.json +1 -2
  9. package/package.json +4 -8
  10. package/resources/data/deck/learnneo/p/2023-10-01T18-29-19-158Z.md +14 -16
  11. package/resources/data/deck/learnneo/p/2023-10-07T19-18-28-517Z.md +9 -17
  12. package/resources/data/deck/learnneo/p/2023-10-08T20-20-07-934Z.md +7 -5
  13. package/resources/data/deck/learnneo/p/2023-10-14T19-25-08-153Z.md +18 -22
  14. package/resources/data/deck/learnneo/p/2023-10-31T13-59-37-550Z.md +31 -0
  15. package/resources/data/deck/learnneo/p/MainThreadAddonExample.md +15 -0
  16. package/resources/data/deck/learnneo/p/MainThreadAddonIntro.md +46 -0
  17. package/resources/data/deck/learnneo/p/TestLivePreview.md +10 -0
  18. package/resources/data/deck/learnneo/p/stylesheet.md +3 -7
  19. package/resources/data/deck/learnneo/t.json +126 -56
  20. package/resources/images/logos/Github-logo-black.svg +1 -0
  21. package/resources/images/logos/Slack-logo-black.svg +17 -0
  22. package/resources/scss/src/apps/learnneo/home/ContentView.scss +6 -0
  23. package/resources/scss/src/list/Base.scss +5 -1
  24. package/resources/scss/theme-neo-light/Global.scss +7 -5
  25. package/resources/scss/theme-neo-light/button/Base.scss +46 -45
  26. package/resources/scss/theme-neo-light/design-tokens/Component.scss +4 -0
  27. package/resources/scss/theme-neo-light/design-tokens/Core.scss +23 -22
  28. package/resources/scss/theme-neo-light/design-tokens/Semantic.scss +5 -2
  29. package/resources/scss/theme-neo-light/list/Base.scss +2 -4
  30. package/resources/scss/theme-neo-light/tab/header/Button.scss +1 -1
  31. package/src/DefaultConfig.mjs +2 -2
  32. package/src/component/StatusBadge.mjs +194 -246
  33. package/src/component/Video.mjs +19 -25
  34. package/src/controller/Base.mjs +3 -4
  35. package/src/core/Base.mjs +2 -2
  36. package/src/form/field/Text.mjs +2 -2
  37. package/src/form/field/TextArea.mjs +3 -3
  38. package/src/main/DomAccess.mjs +64 -70
  39. package/src/main/DomEvents.mjs +1 -1
  40. package/src/main/addon/HighlightJS.mjs +16 -1
  41. package/src/main/addon/Mwc.mjs +6 -1
  42. package/src/worker/Manager.mjs +8 -3
  43. package/apps/learnneo/view/home/ContentComponent.mjs +0 -24
  44. package/examples/container/dialog/MainContainer.mjs +0 -68
  45. package/examples/container/dialog/MainContainerController.mjs +0 -84
  46. package/examples/container/dialog/app.mjs +0 -6
  47. package/examples/container/dialog/index.html +0 -11
  48. package/examples/container/dialog/neo-config.json +0 -7
  49. package/resources/scss/src/apps/learnneo/home/ContentComponent.scss +0 -61
  50. package/resources/scss/src/apps/newwebsite/MainContainer.css +0 -33
  51. package/resources/scss/theme-neo-light/design-tokens/Components.scss +0 -3
  52. package/src/container/Dialog.mjs +0 -205
  53. package/src/main/addon/Dialog.mjs +0 -68
@@ -180,11 +180,16 @@ class Manager extends Base {
180
180
  // pass the initial hash value as Neo.configs
181
181
  if (hash) {
182
182
  config.hash = {
183
- hash : DomEvents.parseHash(hash.substr(1)),
184
- hashString: hash.substr(1)
185
- };
183
+ hash : DomEvents.parseHash(hash.substring(1)),
184
+ hashString: hash.substring(1)
185
+ }
186
186
  }
187
187
 
188
+ config.url = {
189
+ href : location.href,
190
+ search: location.search
191
+ };
192
+
188
193
  for ([key, value] of Object.entries(me.workers)) {
189
194
  if (key === 'canvas' && !config.useCanvasWorker ||
190
195
  key === 'vdom' && !config.useVdomWorker
@@ -1,24 +0,0 @@
1
- import Base from '../../../../src/component/Base.mjs';
2
-
3
- /**
4
- * @class LearnNeo.view.home.ContentComponent
5
- * @extends Neo.component.Base
6
- */
7
- class ContentComponent extends Base {
8
- static config = {
9
- /**
10
- * @member {String} className='LearnNeo.view.home.ContentComponent'
11
- * @protected
12
- */
13
- className: 'LearnNeo.view.home.ContentComponent',
14
- /**
15
- * @member {String[]} baseCls=['learn-content']
16
- * @protected
17
- */
18
- baseCls: ['learn-content']
19
- }
20
- }
21
-
22
- Neo.applyClassConfig(ContentComponent);
23
-
24
- export default ContentComponent;
@@ -1,68 +0,0 @@
1
- import Button from '../../../src/button/Base.mjs';
2
- import ConfigurationViewport from '../../ConfigurationViewport.mjs';
3
- import MainContainerController from './MainContainerController.mjs';
4
- import NumberField from '../../../src/form/field/Number.mjs';
5
- import TextField from '../../../src/form/field/Text.mjs';
6
-
7
- /**
8
- * @class Neo.examples.container.dialog.MainContainer
9
- * @extends Neo.examples.ConfigurationViewport
10
- */
11
- class MainContainer extends ConfigurationViewport {
12
- static config = {
13
- className : 'Neo.examples.container.dialog.MainContainer',
14
- configItemLabelWidth: 160,
15
- configItemWidth : 280,
16
- controller : MainContainerController,
17
- layout : {ntype: 'hbox', align: 'stretch'}
18
- }
19
-
20
- createConfigurationComponents() {
21
- let me = this;
22
-
23
- return [{
24
- module : TextField,
25
- clearable : true,
26
- labelText : 'title',
27
- listeners : {change: me.controller.onConfigChange.bind(me.controller, 'title')},
28
- style : {marginTop: '10px'},
29
- value : 'example dialog'
30
- }, {
31
- module : NumberField,
32
- clearable : true,
33
- labelText : 'height',
34
- listeners : {change: me.controller.onConfigChange.bind(me.controller, 'height')},
35
- maxValue : 1000,
36
- minValue : 100,
37
- stepSize : 10,
38
- style : {marginTop: '10px'},
39
- value : 300
40
- }, {
41
- module : NumberField,
42
- clearable : true,
43
- labelText : 'width',
44
- listeners : {change: me.controller.onConfigChange.bind(me.controller, 'width')},
45
- maxValue : 2000,
46
- minValue : 100,
47
- stepSize : 10,
48
- style : {marginTop: '10px'},
49
- value : 500
50
- }];
51
- }
52
-
53
- createExampleComponent() {
54
- let controller = this.getController();
55
- return Neo.create({
56
- module : Button,
57
- height : 50,
58
- text : 'show Dialog',
59
- ui : 'primary',
60
- width : 150,
61
- handler : controller.onButtonClick.bind(controller)
62
- });
63
- }
64
- }
65
-
66
- Neo.applyClassConfig(MainContainer);
67
-
68
- export default MainContainer;
@@ -1,84 +0,0 @@
1
- import Component from '../../../src/controller/Component.mjs';
2
- import SelectField from '../../../src/form/field/Select.mjs';
3
-
4
- /**
5
- * @class Neo.examples.container.dialog.MainContainerController
6
- * @extends Neo.controller.Component
7
- */
8
- class MainContainerController extends Component {
9
- static config = {
10
- /**
11
- * @member {String} className='Neo.examples.container.dialog.MainContainerController'
12
- * @protected
13
- */
14
- className: 'Neo.examples.container.dialog.MainContainerController'
15
- }
16
-
17
- dialog = null
18
- title = 'example dialog'
19
- height = 300
20
- width = 500
21
-
22
- /**
23
- *
24
- * @param {Object} data
25
- */
26
- async onButtonClick(data) {
27
- if (!this.dialog) {
28
- let module = await import ('../../../src/container/Dialog.mjs');
29
- this.dialog = Neo.create({
30
- module: module.default,
31
- appName: this.component.appName,
32
- autoMount: true,
33
- autoRender: true,
34
- title: this.title,
35
- height: this.height,
36
- width: this.width,
37
- iconCls: ['fa', 'fa-home'],
38
-
39
- headerConfig: {
40
- items: [{
41
- ntype: 'button',
42
- text: 'foo'
43
- }],
44
- style: {borderBottom: 'solid 1px #bdbdbd'}
45
- },
46
-
47
- items: [{
48
- ntype: 'container',
49
- html: 'text'
50
- }, {
51
- module : SelectField,
52
- labelText: 'Select',
53
-
54
- store: {
55
- data: [{
56
- id : 0,
57
- name: 'Option 1'
58
- }]
59
- }
60
- }]
61
- })
62
- }
63
-
64
- this.dialog.show();
65
-
66
- console.log(data, this);
67
- }
68
-
69
- /**
70
- * @param {String} config
71
- * @param {Object} opts
72
- */
73
- onConfigChange(config, opts) {
74
- if (this.dialog) {
75
- this.dialog[config] = opts.value;
76
- } else {
77
- this[config] = opts.value;
78
- }
79
- }
80
- }
81
-
82
- Neo.applyClassConfig(MainContainerController);
83
-
84
- export default MainContainerController;
@@ -1,6 +0,0 @@
1
- import MainContainer from './MainContainer.mjs';
2
-
3
- export const onStart = () => Neo.app({
4
- mainView: MainContainer,
5
- name : 'Neo.examples.container.dialog'
6
- });
@@ -1,11 +0,0 @@
1
- <!DOCTYPE HTML>
2
- <html>
3
- <head>
4
- <meta name="viewport" content="width=device-width, initial-scale=1">
5
- <meta charset="UTF-8">
6
- <title>Neo Dialog</title>
7
- </head>
8
- <body>
9
- <script src="../../../src/MicroLoader.mjs" type="module"></script>
10
- </body>
11
- </html>
@@ -1,7 +0,0 @@
1
- {
2
- "appPath" : "examples/container/dialog/app.mjs",
3
- "basePath" : "../../../",
4
- "environment": "development",
5
- "mainPath" : "./Main.mjs",
6
- "mainThreadAddons": ["DragDrop", "Stylesheet", "Dialog"]
7
- }
@@ -1,61 +0,0 @@
1
- .learn-content {
2
- font-family : 'Open Sans';
3
- font-size : 13pt;
4
- letter-spacing: 1px;
5
- overflow : scroll;
6
- padding : 1em;
7
-
8
- em,
9
- i {
10
- font-family: Palatino, "Times New Roman", serif;
11
- font-size : 1.07em;
12
- }
13
-
14
- p {
15
- margin: 0.5em 0em 0.7em 0em;
16
- }
17
-
18
- mark {
19
- background-color: #B8FCE3;
20
- color : black;
21
- padding : 0.1em 0.2em;
22
- }
23
-
24
- details summary {
25
- cursor: pointer;
26
- transition: margin 300ms ease-out;
27
- }
28
-
29
- details[open] {
30
- margin-bottom: 2em;
31
- }
32
-
33
- details summary {
34
- list-style: none;
35
- color: #555;
36
- display: flex;
37
- /* also removes the list marker */
38
- align-items: center;
39
- font-weight: bold;
40
- }
41
-
42
- details summary::before {
43
- content: "\f055";
44
- }
45
-
46
- details[open] summary::before {
47
- content: "\f056";
48
- }
49
-
50
- details summary::before {
51
- color : #c4c4c4;
52
- font-family: var(--fa-style-family, "Font Awesome 6 Free");
53
- font-size : 1.3em;
54
- font-weight: var(--fa-style, 900);
55
- margin : 0.4em 0.4em 0.4em 0;
56
- }
57
-
58
- summary::-webkit-details-marker {
59
- display: none;
60
- }
61
- }
@@ -1,33 +0,0 @@
1
-
2
- .newwebsite-main-container {
3
- display: flex !important;
4
- align-items: center !important;
5
- justify-content: center !important;
6
- gap: 48px;
7
- padding: 10% 15% 15% 15%;
8
- }
9
-
10
- .button-group {
11
- display: flex !important;
12
- flex-direction: row-reverse !important;
13
- gap: 8px !important;
14
- }
15
-
16
- .neo-h1 {
17
- font-size: 48px;
18
- font-weight: 600;
19
- text-align: center;
20
- }
21
-
22
- .vector {
23
- background-image: url("../../../../images/Neo_Vector.svg");
24
- background-repeat: no-repeat;
25
- background-size: contain;
26
- background-position: center center;
27
- width: 100%;
28
- height: 150px;
29
- }
30
-
31
- .get-started-button {
32
- cursor: not-allowed !important;
33
- }
@@ -1,3 +0,0 @@
1
- :root .neo-theme-neo-light {
2
- --cmp-button-bg : blue;
3
- }
@@ -1,205 +0,0 @@
1
- import Base from '../container/Panel.mjs';
2
- import NeoArray from '../util/Array.mjs';
3
- import HeaderToolbar from '../dialog/header/Toolbar.mjs';
4
-
5
- /**
6
- * Lightweight implementation using the dialog tag.
7
- * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
8
- * @class Neo.container.Dialog
9
- * @extends Neo.container.Panel
10
- */
11
- class Dialog extends Base {
12
- static config = {
13
- /**
14
- * @member {String} className='Neo.container.Dialog'
15
- * @protected
16
- */
17
- className: 'Neo.container.Dialog',
18
- /**
19
- * @member {String} ntype='container-dialog'
20
- * @protected
21
- */
22
- ntype: 'container-dialog',
23
- /**
24
- * @member {Boolean} autoMount=true
25
- */
26
- autoMount: true,
27
- /**
28
- * @member {Boolean} autoRender=true
29
- */
30
- autoRender: true,
31
- /**
32
- * @member {String[]} baseCls=['neo-container-dialog', 'neo-panel', 'neo-container']
33
- * @protected
34
- */
35
- baseCls: ['neo-container-dialog', 'neo-panel', 'neo-container'],
36
- /**
37
- * @member {Object} headerConfig=null
38
- */
39
- headerConfig: null,
40
- /**
41
- * @member {Neo.toolbar.Base|null} headerToolbar=null
42
- */
43
- headerToolbar: null,
44
- /**
45
- * The CSS class to use for an icon, e.g. ['fa', 'fa-home']
46
- * @member {String[]} [iconCls_=null]
47
- */
48
- iconCls_: null,
49
- /**
50
- * @member {Object} itemDefaults
51
- */
52
- itemDefaults: {
53
- baseCls: ['neo-dialog-content']
54
- },
55
- /**
56
- * @member {Object[]} items
57
- */
58
- items: [],
59
- /**
60
- * @member {String} title=null
61
- */
62
- title_: null,
63
- /**
64
- * @member {Object} _vdom={tag: 'dialog', cn: []}
65
- */
66
- _vdom:
67
- {tag: 'dialog', cn: []}
68
- }
69
-
70
- /**
71
- * @param {Object} config
72
- */
73
- construct(config) {
74
- super.construct(config);
75
- this.createHeader();
76
- }
77
-
78
- /**
79
- * Triggered after the iconCls config got changed
80
- * @param {String} value
81
- * @param {String} oldValue
82
- * @protected
83
- */
84
- afterSetIconCls(value, oldValue) {
85
- if (!this.headers) { return }
86
- let iconNode = this.headers.down({flag: 'dialog-header-icon'}),
87
- iconNodeCls = [...iconNode.cls];
88
-
89
- NeoArray.remove(iconNodeCls, oldValue);
90
- NeoArray.add( iconNodeCls, value);
91
-
92
- iconNode.cls = iconNodeCls;
93
-
94
- iconNode.removeDom = !value || value === '';
95
- this.update();
96
- }
97
-
98
- /**
99
- * Triggered after the title config got changed
100
- * @param {String} value
101
- * @param {String} oldValue
102
- * @protected
103
- */
104
- afterSetTitle(value, oldValue) {
105
- this.headerToolbar?.down({flag: 'panel-header-title'}).set({
106
- text: value
107
- })
108
- }
109
-
110
- /**
111
- * close the dialog in main thread
112
- */
113
- close() {
114
- let me = this;
115
-
116
- Neo.main.addon.Dialog.close({
117
- appName: me.appName,
118
- id : me.id
119
- })
120
- }
121
-
122
- /**
123
- * @protected
124
- */
125
- createHeader() {
126
- let me = this,
127
- cls = ['neo-header-toolbar', 'neo-toolbar'],
128
- headers = me.headers || [],
129
- headerConfigCopy = {...me.headerConfig};
130
- delete headerConfigCopy.items;
131
-
132
- me.headerToolbar = Neo.create({
133
- module : HeaderToolbar,
134
- actions : [{action: 'close', iconCls: 'fa-solid fa-xmark'}],
135
- appName : me.appName,
136
- cls,
137
- dock : 'top',
138
- flex : 'none',
139
- id : me.getHeaderToolbarId(),
140
- listeners: {headerAction: me.executeHeaderAction, scope: me},
141
- items : [{
142
- ntype: '',
143
- cls : ['neo-dialog-header-icon', ...me.iconCls],
144
- flag : 'dialog-header-icon',
145
- }, {
146
- ntype : 'label',
147
- cls : ['neo-panel-header-text', 'neo-label'],
148
- flag : 'panel-header-title',
149
- hidden: !me.title,
150
- text : me.title
151
- }, ...me.headerConfig.items || []],
152
-
153
- ...headerConfigCopy
154
- });
155
-
156
- headers.unshift(me.headerToolbar);
157
-
158
- me.headers = headers;
159
- }
160
-
161
- /**
162
- * {Object} data
163
- */
164
- executeHeaderAction(data) {
165
- let me = this,
166
-
167
- map = {
168
- close: me.close
169
- };
170
-
171
- map[data.action]?.call(me, data);
172
-
173
- me.fire('headerAction', {
174
- dialog: me,
175
- ...data
176
- })
177
- }
178
-
179
- /**
180
- * Returns the id of the header toolbar
181
- * @returns {String}
182
- */
183
- getHeaderToolbarId() {
184
- return this.id + '-header-toolbar';
185
- }
186
-
187
- /**
188
- * Shows the dialog (with / without Modal) in main thread
189
- * @param {Boolean} modal
190
- */
191
- async show(modal = true) {
192
- let me = this;
193
-
194
- await me.timeout(20);
195
-
196
- Neo.main.addon.Dialog[modal ? 'showModal': 'show']({
197
- appName: me.appName,
198
- id : me.id
199
- });
200
- }
201
- }
202
-
203
- Neo.applyClassConfig(Dialog);
204
-
205
- export default Dialog;
@@ -1,68 +0,0 @@
1
- import Base from '../../core/Base.mjs';
2
- import DomAccess from '../DomAccess.mjs'
3
- /**
4
- * Addon for component.Dialog
5
- * @class Neo.main.addon.Dialog
6
- * @extends Neo.core.Base
7
- * @singleton
8
- */
9
- class Dialog extends Base {
10
- static config = {
11
- /**
12
- * @member {String} className='Neo.main.addon.Dialog'
13
- * @protected
14
- */
15
- className: 'Neo.main.addon.Dialog',
16
- /**
17
- * Remote method access for other workers
18
- * @member {Object} remote={app: [//...]}
19
- * @protected
20
- */
21
- remote: {
22
- app: [
23
- 'close',
24
- 'show',
25
- 'showModal'
26
- ]
27
- },
28
- /**
29
- * @member {Boolean} singleton=true
30
- * @protected
31
- */
32
- singleton: true
33
- }
34
-
35
- /**
36
- * @param {Object} data
37
- * @param {String} data.id
38
- * @returns {Boolean}
39
- */
40
- close(data) {
41
- DomAccess.getElement(data.id).close()
42
- return true;
43
- }
44
-
45
- /**
46
- * @param {Object} data
47
- * @param {String} data.id
48
- * @returns {Boolean}
49
- */
50
- show(data) {
51
- DomAccess.getElement(data.id).show()
52
- return true;
53
- }
54
-
55
- /**
56
- * @param {Object} data
57
- * @param {String} data.id
58
- * @returns {Boolean}
59
- */
60
- showModal(data) {
61
- DomAccess.getElement(data.id).showModal()
62
- return true;
63
- }
64
- }
65
-
66
- let instance = Neo.applyClassConfig(Dialog);
67
-
68
- export default instance;