@web-atoms/core 2.4.57 → 2.4.60

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/build.jsx ADDED
@@ -0,0 +1,25 @@
1
+ import { Batch, ProcessFiles, Run } from "@neurospeech/jex";
2
+ import path from "node:path";
3
+
4
+ const postCssPath = path.resolve("node_modules/postcss-cli/index.js");
5
+
6
+ export default <Batch>
7
+ <ProcessFiles
8
+ src="src/**/*.css"
9
+ base="src"
10
+ dest="dist"
11
+ command={( { file, dest}) =>
12
+ <Batch>
13
+ <Run
14
+ cmd={process.execPath}
15
+ args={[
16
+ postCssPath,
17
+ file.path,
18
+ "-o", dest.path,
19
+ "--map"
20
+ ]}
21
+ />
22
+ </Batch>
23
+ }
24
+ />
25
+ </Batch>;
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@web-atoms/core",
3
- "version": "2.4.57",
3
+ "version": "2.4.60",
4
4
  "description": "Web Atoms Core",
5
5
  "main": "index.js",
6
6
  "scripts": {
7
7
  "test1": "node ./node_modules/@web-atoms/unit-test/index.js ./dist/tests",
8
8
  "test": "istanbul cover ./node_modules/@web-atoms/unit-test/index.js ./dist/tests",
9
- "build-css": "npx postcss \"./src/**/*.css\" --base ./src --dir ./dist --map --verbose",
10
- "build-css-watch": "npx postcss \"./src/**/*.css\" --base src --dir dist --map -w",
9
+ "build-css": "npx jex ./build.jsx",
10
+ "build-css-watch": "npx jex ./build.jsx --watch",
11
11
  "posttest": "remap-istanbul -i ./coverage/coverage.json -t html -o ./html-report",
12
12
  "postversion": "git push --follow-tags"
13
13
  },
@@ -27,7 +27,7 @@
27
27
  },
28
28
  "homepage": "https://github.com/neurospeech/web-atoms-core#readme",
29
29
  "devDependencies": {
30
- "@neurospeech/jex": "^1.0.112",
30
+ "@neurospeech/jex": "^1.0.116",
31
31
  "@web-atoms/module-loader": "^2.1.89",
32
32
  "@web-atoms/pack": "1.0.111",
33
33
  "@web-atoms/postcss-styled-js": "^1.0.10",
@@ -1,12 +0,0 @@
1
- .web-atoms-notification-popup {
2
- padding: 5px;
3
- font-size: larger;
4
- & .error {
5
- color: red;
6
- border-color: red;
7
- }
8
- & .warning {
9
- background-color: lightyellow;
10
- }
11
- }
12
- /*# sourceMappingURL=NotifcationPopup.global.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/web/services/NotifcationPopup.global.css"],"names":[],"mappings":"AAAA","file":"NotifcationPopup.global.css","sourcesContent":[".web-atoms-notification-popup {\n padding: 5px;\n font-size: larger;\n & .error {\n color: red;\n border-color: red;\n }\n & .warning {\n background-color: lightyellow;\n }\n}"]}
@@ -1,92 +0,0 @@
1
-
2
- [data-force-contain=none] {
3
- contain: none !important;
4
- }
5
-
6
- *[data-inline-popup=left] {
7
- position: relative;
8
- height: 0px;
9
- width: 0px;
10
- left: 0px;
11
-
12
- & > * {
13
- position: absolute;
14
- left: 0px;
15
- top: 0px;
16
- padding: 5px;
17
- max-height: 300px;
18
- overflow: auto;
19
- border-radius: 5px;
20
- background-color: #ffffff;
21
- z-index: 200;
22
- box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;
23
- border: solid 1px rgba(0, 0, 0, 0.05);
24
- }
25
- }
26
-
27
- *[data-inline-popup=right] {
28
- position: absolute;
29
- height: 0px;
30
- width: 0px;
31
- right: 0px;
32
-
33
-
34
- & > * {
35
- position: absolute;
36
- right: 0px;
37
- top: 0px;
38
- padding: 5px;
39
- max-height: 300px;
40
- overflow: auto;
41
- border-radius: 5px;
42
- background-color: #ffffff;
43
- z-index: 200;
44
- box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;
45
- border: solid 1px rgba(0, 0, 0, 0.05);
46
- }
47
- }
48
-
49
- *[data-inline-popup=inline-left] {
50
- position: relative;
51
- height: 0px;
52
- width: 0px;
53
- left: 0px;
54
-
55
- & > * {
56
- position: absolute;
57
- left: 0px;
58
- top: 0px;
59
- padding: 5px;
60
- max-height: 300px;
61
- overflow: auto;
62
- border-radius: 5px;
63
- background-color: #ffffff;
64
- z-index: 200;
65
- box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;
66
- border: solid 1px rgba(0, 0, 0, 0.05);
67
- }
68
- }
69
-
70
- *[data-center-popup] {
71
- position: fixed;
72
- left: 50%;
73
- top: 50%;
74
- transform: translate(-50%, -50%);
75
- z-index: 10000;
76
- padding: 5px;
77
- background-color: #ffffff;
78
- border: solid 1px lightgray;
79
- border-radius: 5px;
80
- box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;;
81
- display: inline-block;
82
- }
83
-
84
- .web-atoms-popup-local {
85
- padding: 5px;
86
- background-color: #ffffff;
87
- border: solid 1px lightgray;
88
- border-radius: 5px;
89
- box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;;
90
- display: inline-block;
91
- }
92
- /*# sourceMappingURL=PopupService.global.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/web/services/PopupService.global.css"],"names":[],"mappings":"AAAA","file":"PopupService.global.css","sourcesContent":["\n[data-force-contain=none] {\n contain: none !important; \n}\n\n*[data-inline-popup=left] {\n position: relative;\n height: 0px;\n width: 0px;\n left: 0px; \n \n & > * {\n position: absolute;\n left: 0px;\n top: 0px;\n padding: 5px;\n max-height: 300px;\n overflow: auto;\n border-radius: 5px;\n background-color: #ffffff;\n z-index: 200;\n box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;\n border: solid 1px rgba(0, 0, 0, 0.05); \n }\n}\n\n*[data-inline-popup=right] {\n position: absolute;\n height: 0px;\n width: 0px;\n right: 0px; \n\n\n & > * {\n position: absolute;\n right: 0px;\n top: 0px;\n padding: 5px;\n max-height: 300px;\n overflow: auto;\n border-radius: 5px;\n background-color: #ffffff;\n z-index: 200;\n box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;\n border: solid 1px rgba(0, 0, 0, 0.05); \n }\n}\n\n*[data-inline-popup=inline-left] {\n position: relative;\n height: 0px;\n width: 0px;\n left: 0px; \n\n & > * {\n position: absolute;\n left: 0px;\n top: 0px;\n padding: 5px;\n max-height: 300px;\n overflow: auto;\n border-radius: 5px;\n background-color: #ffffff;\n z-index: 200;\n box-shadow: rgba(50, 50, 105, 0.07) 0px 2px 5px 0px, rgba(0, 0, 0, 0.03) 0px 1px 1px 0px;;\n border: solid 1px rgba(0, 0, 0, 0.05); \n }\n}\n\n*[data-center-popup] {\n position: fixed;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n z-index: 10000;\n padding: 5px;\n background-color: #ffffff;\n border: solid 1px lightgray;\n border-radius: 5px;\n box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;;\n display: inline-block; \n} \n\n.web-atoms-popup-local {\n padding: 5px;\n background-color: #ffffff;\n border: solid 1px lightgray;\n border-radius: 5px;\n box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;;\n display: inline-block;\n}"]}
@@ -1,158 +0,0 @@
1
- [data-popup-window=popup-window] {
2
- position: absolute;
3
- border: solid 1px lightgray;
4
- border-radius: 5px;
5
- background-color: canvas;
6
- color: canvastext;
7
- top: 50%;
8
- left: 50%;
9
- transform: translate(-50%, -50%);
10
- box-shadow: 0 0 20px 1px rgba(0 0 0 / 75%);
11
-
12
- display: grid;
13
- align-items: stretch;
14
- justify-items: stretch;
15
- grid-template-rows: auto auto 1fr auto;
16
- grid-template-columns: auto 1fr auto;
17
- opacity: 0;
18
- transition: opacity 0.3s cubic-bezier(0.55, 0.09, 0.97, 0.32) ;
19
- overflow: hidden;
20
-
21
- [data-window-modal-background=background] {
22
- position: absolute;
23
- top: 0;
24
- left: 0;
25
- bottom: 0;
26
- right: 0;
27
- }
28
-
29
- &[data-no-width=true] {
30
- max-width: 95%;
31
- min-width: 300px;
32
- }
33
- &[data-no-height=true] {
34
- max-height: 95%;
35
- min-height: 100px;
36
- }
37
-
38
- &[data-maximize=true] {
39
- width: 90%;
40
- height: 90%;
41
- }
42
-
43
- &[data-ready=true] {
44
- opacity: 1;
45
- }
46
- &[data-dragging=true] {
47
- opacity: 0.5;
48
- }
49
- & > [data-window-element=icon] {
50
- grid-row: 1;
51
- grid-column: 1;
52
- z-index: 2;
53
- }
54
- & > [data-window-element=title] {
55
- grid-row: 1;
56
- grid-column: 2;
57
- font-size: medium;
58
- overflow: hidden;
59
- white-space: nowrap;
60
- text-overflow: ellipsis;
61
- cursor: move;
62
- padding: var(--spacing, 5px);
63
- color: var(--accent-text-color, #424242);
64
- z-index: 2;
65
- }
66
- & > [data-window-element=close] {
67
- grid-row: 1;
68
- grid-column: 3;
69
- color: white;
70
- background-color: red;
71
- border-radius: 9999px;
72
- border: none;
73
- outline: none;
74
- /* padding: 5px; */
75
- font-family: monospace;
76
- height: 20px;
77
- width: 20px;
78
- margin: 5px;
79
- cursor: pointer;
80
- text-transform: capitalize;
81
- z-index: 2;
82
- }
83
- & > [data-window-element=action-bar] {
84
- grid-row: 1;
85
- grid-column: 1 / span 3;
86
- align-self: stretch;
87
- justify-self: stretch;
88
- background-color: var(--accent-color, rgba(211, 211, 211, 0.2));
89
- border-top-left-radius: 5px;
90
- border-top-right-radius: 5px;
91
- z-index: 1;
92
- }
93
- & > [data-window-element=header] {
94
- margin-top: 5px;
95
- grid-row: 2;
96
- grid-column: 1 / span 3;
97
- }
98
- & > [data-window-element=content] {
99
- margin-top: 5px;
100
- grid-row: 3;
101
- grid-column: 1 / span 3;
102
- position: relative;
103
- overflow: auto;
104
- padding: var(--spacing-medium, 7px);
105
- &[data-maximize=true] {
106
- width: 90vw;
107
- height: 90vh;
108
- }
109
- }
110
- & > [data-window-element=footer] {
111
- margin-top: 5px;
112
- grid-row: 4;
113
- grid-column: 1 / span 3;
114
- padding-top: 5px;
115
- padding-bottom: 5px;
116
- background-color: var(--command-bar-color, #80808025);
117
-
118
- & > button, & > * > button {
119
- border-radius: 9999px;
120
- padding: 5px;
121
- padding-left: 20px;
122
- padding-right: 20px;
123
- border-width: 1px;
124
- border-color: transparent;
125
- margin: 5px;
126
- margin-left: 10px;
127
- }
128
- }
129
- }
130
-
131
- body > div[data-popup-window=popup-window], body > div[data-window-modal-background] {
132
- position: fixed;
133
- }
134
-
135
- [data-confirm-popup=confirm-popup] {
136
- & >[data-window-element=content] > [data-element=details] {
137
- margin-top: 5px;
138
- overflow: auto;
139
- max-width: 80vw;
140
- max-height: 50vh;
141
- }
142
- & > [data-window-element=footer] {
143
-
144
- & > .yes {
145
- background-color: #01af01;
146
- color: white;
147
- }
148
- & > .no {
149
- background-color: red;
150
- color: white;
151
- }
152
- & > .cancel {
153
- background-color: gray;
154
- color: white;
155
- }
156
- }
157
- }
158
- /*# sourceMappingURL=PopupWindow.global.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../../src/web/services/PopupWindow.global.css"],"names":[],"mappings":"AAAA","file":"PopupWindow.global.css","sourcesContent":["[data-popup-window=popup-window] {\n position: absolute;\n border: solid 1px lightgray;\n border-radius: 5px;\n background-color: canvas;\n color: canvastext;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n box-shadow: 0 0 20px 1px rgba(0 0 0 / 75%);\n\n display: grid;\n align-items: stretch;\n justify-items: stretch;\n grid-template-rows: auto auto 1fr auto;\n grid-template-columns: auto 1fr auto;\n opacity: 0;\n transition: opacity 0.3s cubic-bezier(0.55, 0.09, 0.97, 0.32) ;\n overflow: hidden;\n\n [data-window-modal-background=background] {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n }\n\n &[data-no-width=true] {\n max-width: 95%;\n min-width: 300px;\n }\n &[data-no-height=true] {\n max-height: 95%;\n min-height: 100px;\n }\n\n &[data-maximize=true] {\n width: 90%;\n height: 90%;\n }\n\n &[data-ready=true] {\n opacity: 1;\n }\n &[data-dragging=true] {\n opacity: 0.5;\n }\n & > [data-window-element=icon] {\n grid-row: 1;\n grid-column: 1;\n z-index: 2;\n }\n & > [data-window-element=title] {\n grid-row: 1;\n grid-column: 2;\n font-size: medium;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n cursor: move;\n padding: var(--spacing, 5px);\n color: var(--accent-text-color, #424242);\n z-index: 2;\n }\n & > [data-window-element=close] {\n grid-row: 1;\n grid-column: 3;\n color: white;\n background-color: red;\n border-radius: 9999px;\n border: none;\n outline: none;\n /* padding: 5px; */\n font-family: monospace;\n height: 20px;\n width: 20px;\n margin: 5px;\n cursor: pointer;\n text-transform: capitalize;\n z-index: 2;\n }\n & > [data-window-element=action-bar] {\n grid-row: 1;\n grid-column: 1 / span 3;\n align-self: stretch;\n justify-self: stretch;\n background-color: var(--accent-color, rgba(211, 211, 211, 0.2));\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n z-index: 1;\n }\n & > [data-window-element=header] {\n margin-top: 5px;\n grid-row: 2;\n grid-column: 1 / span 3;\n }\n & > [data-window-element=content] {\n margin-top: 5px;\n grid-row: 3;\n grid-column: 1 / span 3;\n position: relative;\n overflow: auto;\n padding: var(--spacing-medium, 7px);\n &[data-maximize=true] {\n width: 90vw;\n height: 90vh;\n }\n }\n & > [data-window-element=footer] {\n margin-top: 5px;\n grid-row: 4;\n grid-column: 1 / span 3;\n padding-top: 5px;\n padding-bottom: 5px;\n background-color: var(--command-bar-color, #80808025);\n\n & > button, & > * > button {\n border-radius: 9999px;\n padding: 5px;\n padding-left: 20px;\n padding-right: 20px;\n border-width: 1px;\n border-color: transparent;\n margin: 5px;\n margin-left: 10px;\n } \n } \n}\n\nbody > div[data-popup-window=popup-window], body > div[data-window-modal-background] {\n position: fixed;\n}\n\n[data-confirm-popup=confirm-popup] {\n & >[data-window-element=content] > [data-element=details] {\n margin-top: 5px;\n overflow: auto;\n max-width: 80vw;\n max-height: 50vh;\n }\n & > [data-window-element=footer] {\n\n & > .yes {\n background-color: #01af01;\n color: white;\n }\n & > .no {\n background-color: red;\n color: white;\n }\n & > .cancel {\n background-color: gray;\n color: white;\n }\n }\n}"]}