neo.mjs 6.9.11 → 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 (64) hide show
  1. package/BACKERS.md +0 -30
  2. package/apps/ServiceWorker.mjs +2 -2
  3. package/apps/learnneo/index.html +7 -2
  4. package/apps/learnneo/neo-config.json +1 -4
  5. package/apps/learnneo/view/LivePreview.mjs +171 -0
  6. package/apps/learnneo/view/Viewport.mjs +11 -4
  7. package/apps/learnneo/view/ViewportController.mjs +2 -2
  8. package/apps/learnneo/view/home/ContentTreeList.mjs +93 -5
  9. package/apps/learnneo/view/home/MainContainer.mjs +16 -16
  10. package/apps/learnneo/view/home/MainContainerController.mjs +5 -20
  11. package/apps/learnneo/view/home/MainContainerModel.mjs +3 -5
  12. package/apps/newwebsite/index.html +3 -0
  13. package/buildScripts/convertDesignTokens.mjs +173 -0
  14. package/examples/ServiceWorker.mjs +2 -2
  15. package/package.json +5 -8
  16. package/resources/data/deck/learnneo/p/2023-10-01T18-29-19-158Z.md +14 -16
  17. package/resources/data/deck/learnneo/p/2023-10-07T19-18-28-517Z.md +9 -17
  18. package/resources/data/deck/learnneo/p/2023-10-08T20-20-07-934Z.md +7 -5
  19. package/resources/data/deck/learnneo/p/2023-10-08T20-20-37-336Z.md +17 -10
  20. package/resources/data/deck/learnneo/p/2023-10-14T19-25-08-153Z.md +18 -22
  21. package/resources/data/deck/learnneo/p/2023-10-31T13-59-37-550Z.md +31 -0
  22. package/resources/data/deck/learnneo/p/MainThreadAddonExample.md +15 -0
  23. package/resources/data/deck/learnneo/p/MainThreadAddonIntro.md +46 -0
  24. package/resources/data/deck/learnneo/p/TestLivePreview.md +10 -0
  25. package/resources/data/deck/learnneo/p/stylesheet.md +22 -8
  26. package/resources/data/deck/learnneo/t.json +126 -56
  27. package/resources/data/deck/training/p/2023-01-10T02-21-54-303Z.md +1 -1
  28. package/resources/data/deck/training/t.json +1276 -1
  29. package/resources/design-tokens/json/component.json +288 -0
  30. package/resources/design-tokens/json/core.json +352 -0
  31. package/resources/design-tokens/json/semantic.json +231 -0
  32. package/resources/images/logos/Github-logo-black.svg +1 -0
  33. package/resources/images/logos/Slack-logo-black.svg +17 -0
  34. package/resources/scss/src/apps/learnneo/Viewport.scss +3 -0
  35. package/resources/scss/src/apps/learnneo/home/ContentTreeList.scss +60 -13
  36. package/resources/scss/src/apps/learnneo/home/ContentView.scss +11 -2
  37. package/resources/scss/src/apps/newwebsite/MainContainer.scss +14 -15
  38. package/resources/scss/src/list/Base.scss +4 -0
  39. package/resources/scss/theme-neo-light/Global.scss +36 -16
  40. package/resources/scss/theme-neo-light/button/Base.scss +46 -45
  41. package/resources/scss/theme-neo-light/design-tokens/Component.scss +66 -1
  42. package/resources/scss/theme-neo-light/design-tokens/Core.scss +66 -5
  43. package/resources/scss/theme-neo-light/design-tokens/Semantic.scss +64 -0
  44. package/resources/scss/theme-neo-light/list/Base.scss +27 -6
  45. package/resources/scss/theme-neo-light/tab/header/Button.scss +1 -1
  46. package/src/DefaultConfig.mjs +2 -2
  47. package/src/component/StatusBadge.mjs +194 -246
  48. package/src/component/Video.mjs +19 -25
  49. package/src/controller/Base.mjs +33 -26
  50. package/src/core/Base.mjs +2 -2
  51. package/src/data/connection/Xhr.mjs +1 -1
  52. package/src/form/field/TextArea.mjs +3 -3
  53. package/src/main/DomAccess.mjs +64 -70
  54. package/src/main/DomEvents.mjs +1 -1
  55. package/src/main/addon/HighlightJS.mjs +16 -1
  56. package/src/main/addon/Mwc.mjs +6 -1
  57. package/src/worker/Manager.mjs +8 -3
  58. package/examples/container/dialog/MainContainer.mjs +0 -68
  59. package/examples/container/dialog/MainContainerController.mjs +0 -84
  60. package/examples/container/dialog/app.mjs +0 -6
  61. package/examples/container/dialog/index.html +0 -11
  62. package/examples/container/dialog/neo-config.json +0 -7
  63. package/src/container/Dialog.mjs +0 -205
  64. package/src/main/addon/Dialog.mjs +0 -68
@@ -1,3 +1,68 @@
1
1
  :root .neo-theme-neo-light {
2
- --cmp-button-bg : blue;
2
+ --cmp-breadcrumb-arrow : var(--sem-color-fg-neutral-default);
3
+ --cmp-breadcrumb-currentpage : var(--sem-color-fg-primary-base);
4
+ --cmp-breadcrumb-gap : var(--sem-spacing-xxsmall);
5
+ --cmp-breadcrumb-pagelevel : var(--sem-color-fg-neutral-default);
6
+
7
+ --cmp-button-borderradius : var(--sem-borderradius-large);
8
+ --cmp-button-borderwidth : 1px;
9
+ --cmp-button-gap : var(--sem-spacing-xxsmall);
10
+ --cmp-button-ghost-bg-active : var(--sem-color-bg-neutral-active);
11
+ --cmp-button-ghost-bg-default : transparent;
12
+ --cmp-button-ghost-bg-disabled : var(--sem-color-bg-neutral-disabled);
13
+ --cmp-button-ghost-bg-hover : var(--sem-color-bg-neutral-hover);
14
+ --cmp-button-ghost-bg-loading : var(--sem-color-bg-neutral-hover);
15
+ --cmp-button-ghost-fg-default : var(--sem-color-fg-neutral-contrast);
16
+ --cmp-button-ghost-fg-disabled : var(--sem-color-fg-neutral-disabled);
17
+ --cmp-button-height : var(--height-48);
18
+ --cmp-button-spacinghorizontal : var(--sem-spacing-medium);
19
+
20
+ --cmp-button-primary-bg-active : var(--sem-color-bg-primary-active);
21
+ --cmp-button-primary-bg-default : var(--sem-color-bg-primary-default);
22
+ --cmp-button-primary-bg-disabled : var(--sem-color-bg-primary-disabled);
23
+ --cmp-button-primary-bg-hover : var(--sem-color-bg-primary-hover);
24
+ --cmp-button-primary-bg-loading : var(--sem-color-bg-primary-background);
25
+ --cmp-button-primary-fg-default : var(--sem-color-fg-neutral-contrast);
26
+ --cmp-button-primary-fg-disabled : var(--sem-color-fg-neutral-disabled);
27
+
28
+ --cmp-button-secondary-bg-active : var(--sem-color-bg-neutral-active);
29
+ --cmp-button-secondary-bg-default : transparent;
30
+ --cmp-button-secondary-bg-disabled : transparent;
31
+ --cmp-button-secondary-bg-hover : var(--sem-color-bg-neutral-hover);
32
+ --cmp-button-secondary-bg-loading : var(--sem-color-bg-neutral-default);
33
+ --cmp-button-secondary-border-default-color : var(--sem-color-border-default);
34
+ --cmp-button-secondary-border-default-style : solid;
35
+ --cmp-button-secondary-border-default-width : 1px;
36
+ --cmp-button-secondary-border-disabled-color: var(--sem-color-border-subtle);
37
+ --cmp-button-secondary-border-disabled-style: solid;
38
+ --cmp-button-secondary-border-disabled-width: 1px;
39
+ --cmp-button-secondary-text-default : var(--sem-color-fg-neutral-default);
40
+ --cmp-button-secondary-text-disabled : var(--sem-color-fg-neutral-disabled);
41
+ --cmp-button-spacinghorizontal : var(--sem-spacing-medium);
42
+ --cmp-button-tertiary-default : var(--sem-color-fg-neutral-contrast);
43
+ --cmp-button-tertiary-disabled : var(--sem-color-fg-neutral-disabled);
44
+ --cmp-sidenav-borderradius : var(--sem-borderradius-large);
45
+ --cmp-sidenav-chapter-bg-active : var(--sem-color-bg-neutral-active);
46
+ --cmp-sidenav-chapter-bg-default : transparent;
47
+ --cmp-sidenav-chapter-bg-hover : var(--sem-color-bg-neutral-hover);
48
+ --cmp-sidenav-chapter-bg-selected : var(--sem-color-bg-primary-background);
49
+ --cmp-sidenav-chapter-fg-default : var(--sem-color-fg-neutral-default);
50
+ --cmp-sidenav-chapter-fg-disabled : var(--sem-color-fg-neutral-disabled);
51
+ --cmp-sidenav-chapter-gap : var(--sem-spacing-small);
52
+ --cmp-sidenav-chapter-height : var(--sem-height-xlarge);
53
+ --cmp-sidenav-gap : var(--sem-spacing-xsmall);
54
+ --cmp-sidenav-item-bg-default : transparent;
55
+ --cmp-sidenav-item-bg-hover : var(--sem-color-bg-neutral-hover);
56
+ --cmp-sidenav-item-bg-pressed : var(--sem-color-bg-neutral-active);
57
+ --cmp-sidenav-item-bg-selected : var(--sem-color-bg-primary-background);
58
+ --cmp-sidenav-item-borderradius : var(--sem-borderradius-large);
59
+ --cmp-sidenav-item-fg-default : var(--sem-color-fg-neutral-default);
60
+ --cmp-sidenav-item-fg-disabled : var(--sem-color-fg-neutral-disabled);
61
+ --cmp-sidenav-item-gap : var(--sem-spacing-small);
62
+ --cmp-sidenav-item-height : var(--sem-height-xlarge);
63
+ --cmp-sidenav-item-spacex : var(--sem-spacing-medium);
64
+ --cmp-sidenav-spacex : var(--sem-spacing-medium);
65
+ --cmp-sidenav-spacey : var(--sem-spacing-xsmall);
66
+ --cmp-tab-foreground-default : var(--sem-color-fg-neutral-default);
67
+ --cmp-tab-height : var(--sem-height-xlarge);
3
68
  }
@@ -1,7 +1,68 @@
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 : 4px;
5
+ --borderradius-8 : 8px;
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 : 16px;
10
+ --core-fontsize-label : 1rem;
11
+ --core-fontsize-h1 : 2.5rem;
12
+ --core-fontsize-h2 : 1.75rem;
13
+ --core-fontweight-bold : 700;
14
+ --core-fontweight-regular : 400;
15
+ --core-fontweight-semibold : 600;
16
+ --core-lineheight-headline : 1.2;
17
+ --core-lineheight-paragraph : 1.5;
18
+ --gray-100 : #F0F2F0;
19
+ --gray-200 : #D3D7D2;
20
+ --gray-300 : #B6BDB4;
21
+ --gray-400 : #99A295;
22
+ --gray-50 : #fafafa;
23
+ --gray-500 : #7C8877;
24
+ --gray-600 : #606A5D;
25
+ --gray-700 : #454B42;
26
+ --gray-800 : #292D28;
27
+ --gray-900 : #0E0F0D;
28
+ --green-50 : #DFFEF2;
29
+ --green-100 : #BFFCE6;
30
+ --green-200 : #94FAD5;
31
+ --green-300 : #54F7BB;
32
+ --green-400 : #3FF6B3;
33
+ --green-500 : #29F5AA;
34
+ --green-600 : #0EF49F;
35
+ --green-700 : #0ADB8E;
36
+ --green-800 : #08A46A;
37
+ --green-900 : #056D47;
38
+ --height-16 : 16px;
39
+ --height-2 : 2px;
40
+ --height-32 : 32px;
41
+ --height-4 : 4px;
42
+ --height-48 : 48px;
43
+ --height-8 : 8px;
44
+ --purple-100 : #efe3ff;
45
+ --purple-200 : #d0aaff;
46
+ --purple-300 : #b071ff;
47
+ --purple-400 : #9039ff;
48
+ --purple-500 : #7100ff;
49
+ --purple-600 : #5800c6;
50
+ --purple-700 : #3f008e;
51
+ --purple-800 : #260055;
52
+ --purple-900 : #0d001c;
53
+ --spacing-12 : 12px;
54
+ --spacing-16 : 16px;
55
+ --spacing-2 : 2px;
56
+ --spacing-20 : 20px;
57
+ --spacing-24 : 24px;
58
+ --spacing-32 : 32px;
59
+ --spacing-4 : 4px;
60
+ --spacing-40 : 40px;
61
+ --spacing-48 : 48px;
62
+ --spacing-64 : 64px;
63
+ --spacing-8 : 8px;
64
+ --spacing-80 : 80px;
65
+ --spacing-96 : 96px;
66
+ --Transparent : rgba(255,255,255,0);
67
+ --white : #FFFFFF;
7
68
  }
@@ -0,0 +1,64 @@
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
+
7
+ --sem-color-bg-neutral-default : var(--gray-50);
8
+ --sem-color-bg-neutral-hover : var(--gray-100);
9
+ --sem-color-bg-neutral-active : var(--gray-200);
10
+ --sem-color-bg-neutral-disabled : var(--gray-200);
11
+ --sem-color-bg-neutral-highlighted : var(--white);
12
+
13
+
14
+ --sem-color-bg-primary-active : var(--green-600);
15
+ --sem-color-bg-primary-background : var(--green-50);
16
+ --sem-color-bg-primary-default : var(--green-400);
17
+ --sem-color-bg-primary-disabled : var(--gray-200);
18
+ --sem-color-bg-primary-hover : var(--green-500);
19
+
20
+ --sem-color-border-contrast : var(--black);
21
+ --sem-color-border-default : var(--gray-200);
22
+ --sem-color-border-subtle : var(--gray-100);
23
+
24
+ --sem-color-fg-neutral-contrast : var(--black);
25
+ --sem-color-fg-neutral-default : var(--gray-900);
26
+ --sem-color-fg-neutral-disabled : var(--gray-300);
27
+ --sem-color-fg-neutral-subdued : var(--gray-700);
28
+ --sem-color-fg-primary-base : var(--green-500);
29
+ --sem-color-fg-primary-faded : var(--green-600);
30
+ --sem-color-fg-primary-highlighted : var(--green-400);
31
+ --sem-height-large : var(--height-32);
32
+ --sem-height-medium : var(--height-16);
33
+ --sem-height-small : var(--height-8);
34
+ --sem-height-xlarge : var(--height-48);
35
+ --sem-height-xsmall : var(--height-4);
36
+ --sem-height-xxsmall : var(--height-2);
37
+ --sem-spacing-large : var(--spacing-20);
38
+ --sem-spacing-medium : var(--spacing-16);
39
+ --sem-spacing-small : var(--spacing-12);
40
+ --sem-spacing-xlarge : var(--spacing-24);
41
+ --sem-spacing-xsmall : var(--spacing-8);
42
+ --sem-spacing-xxlarge : var(--spacing-32);
43
+ --sem-spacing-xxsmall : var(--spacing-4);
44
+ --sem-spacing-xxxlarge : var(--spacing-40);
45
+ --sem-spacing-xxxsmall : var(--spacing-2);
46
+ --sem-typo-body-fontFamily : var(--core-fontfamily-sans);
47
+ --sem-typo-body-fontSize : var(--core-fontsize-body);
48
+ --sem-typo-body-fontWeight : var(--core-fontweight-regular);
49
+ --sem-typo-body-letterSpacing : 0;
50
+ --sem-typo-body-lineHeight : var(--core-lineheight-paragraph);
51
+ --sem-typo-body-paragraphIndent : 0;
52
+ --sem-typo-body-paragraphSpacing : 0;
53
+ --sem-typo-body-textDecoration : none;
54
+ --sem-typo-h1-fontFamily : var(--core-fontfamily-sans);
55
+ --sem-typo-h1-fontSize : var(--core-fontsize-h1);
56
+ --sem-typo-h1-fontWeight : var(--core-fontweight-bold);
57
+ --sem-typo-h1-letterSpacing : -0.02em;
58
+ --sem-typo-h1-lineHeight : var(--core-lineheight-headline);
59
+ --sem-typo-h1-textDecoration : none;
60
+ --sem-typo-h2-fontFamily : var(--core-fontfamily-sans);
61
+ --sem-typo-h2-fontSize : var(--core-fontsize-h2);
62
+ --sem-typo-h2-fontWeight : var(--core-fontweight-semibold);
63
+ --sem-typo-h2-lineHeight : var(--core-lineheight-headline);
64
+ }
@@ -1,12 +1,33 @@
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 : white;
6
+ --list-item-background-color-hover : var(--sem-color-bg-neutral-hover);
7
+ --list-item-background-color-active : var(--sem-color-bg-neutral-active);
8
+ --list-item-background-color-selected: var(--sem-color-bg-primary-background);
9
+ --list-item-color-selected : var(--sem-color-fg-neutral-contrast);
10
+ --list-item-glyph-color : var(--sem-color-fg-neutral-default);
10
11
  --list-item-highlight-search-color : red;
11
12
  --list-item-padding : 5px;
12
13
  }
14
+
15
+
16
+
17
+
18
+
19
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder.neo-folder-open .neo-list-item-content:before {
20
+ content: unset !important;
21
+ }
22
+
23
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder .neo-list-item-content:before {
24
+ content: unset !important;
25
+ }
26
+
27
+ .topics-tree.neo-tree-list .neo-list-container .neo-list-item.neo-list-folder .neo-list-item-content:before {
28
+ content: unset !important;
29
+ }
30
+
31
+ .neo-tree-list .neo-list-item .neo-list-item-content:before {
32
+ content: unset !important;
33
+ }
@@ -1,5 +1,5 @@
1
1
  :root .neo-theme-neo-light { // .neo-tab-header-button
2
- --tab-button-background-color : #fff;
2
+ --tab-button-background-color : green;
3
3
  --tab-button-background-color-active : #ddd;
4
4
  --tab-button-background-color-disabled : #fff;
5
5
  --tab-button-background-color-hover : #fff;
@@ -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.10.0'
240
240
  * @memberOf! module:Neo
241
241
  * @name config.version
242
242
  * @type String
243
243
  */
244
- version: '6.9.11'
244
+ version: '6.10.0'
245
245
  };
246
246
 
247
247
  Object.assign(DefaultConfig, {