@benev/web 0.1.2 → 0.1.4
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/package.json +9 -9
- package/s/css/parts/common.csstext.ts +12 -0
- package/s/css/parts/vars.csstext.ts +1 -0
- package/s/dom/loader/loader.ts +11 -2
- package/x/css/parts/common.csstext.js +12 -0
- package/x/css/parts/common.csstext.js.map +1 -1
- package/x/css/parts/vars.csstext.js +1 -0
- package/x/css/parts/vars.csstext.js.map +1 -1
- package/x/dom/loader/loader.d.ts +1 -1
- package/x/dom/loader/loader.js +10 -3
- package/x/dom/loader/loader.js.map +1 -1
- package/x/index.html +14 -1
- package/x/main.bundle.min.js +73 -55
- package/x/main.bundle.min.js.map +4 -4
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@benev/web",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.4",
|
|
4
4
|
"description": "✨ benev web sdk",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -28,16 +28,16 @@
|
|
|
28
28
|
"lit": "^3.3.3"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@e280/authlocal": "^0.3.
|
|
32
|
-
"@e280/kv": "^0.2.
|
|
33
|
-
"@e280/renraku": "
|
|
34
|
-
"@e280/stz": "^0.
|
|
31
|
+
"@e280/authlocal": "^0.3.10",
|
|
32
|
+
"@e280/kv": "^0.2.5",
|
|
33
|
+
"@e280/renraku": "0.6.0-12",
|
|
34
|
+
"@e280/stz": "^0.4.14"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@e280/hottie": "^0.1.
|
|
38
|
-
"@e280/octo": "^0.1.
|
|
39
|
-
"@e280/science": "^0.1.
|
|
40
|
-
"@e280/scute": "^0.5.
|
|
37
|
+
"@e280/hottie": "^0.1.7",
|
|
38
|
+
"@e280/octo": "^0.1.7",
|
|
39
|
+
"@e280/science": "^0.1.14",
|
|
40
|
+
"@e280/scute": "^0.5.5",
|
|
41
41
|
"typescript": "^7.0.2"
|
|
42
42
|
},
|
|
43
43
|
"author": "Chase Moskal <chasemoskal@gmail.com>",
|
|
@@ -117,6 +117,18 @@ benev-header {
|
|
|
117
117
|
}
|
|
118
118
|
}
|
|
119
119
|
|
|
120
|
+
benev-loader {
|
|
121
|
+
[benev-error] {
|
|
122
|
+
position: absolute;
|
|
123
|
+
display: flex;
|
|
124
|
+
width: 100%;
|
|
125
|
+
height: 100%;
|
|
126
|
+
justify-content: center;
|
|
127
|
+
align-items: center;
|
|
128
|
+
color: var(--benev-angry);
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
|
|
120
132
|
benev-footer {
|
|
121
133
|
width: 100%;
|
|
122
134
|
max-width: var(--benev-site-width);
|
package/s/dom/loader/loader.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
|
|
2
|
-
import {
|
|
2
|
+
import {html} from "lit"
|
|
3
3
|
import {Content, dom} from "@e280/sly"
|
|
4
|
+
import {errorString, nap} from "@e280/stz"
|
|
4
5
|
import {bconfig} from "../../bconfig.js"
|
|
5
6
|
|
|
6
7
|
export class Loader {
|
|
@@ -43,18 +44,26 @@ export class Loader {
|
|
|
43
44
|
async load(
|
|
44
45
|
getLoading: () => Content,
|
|
45
46
|
getContent: () => Promise<Content>,
|
|
47
|
+
getError?: (error: unknown) => Content,
|
|
46
48
|
) {
|
|
47
49
|
|
|
48
50
|
this.#operation += 1
|
|
49
51
|
const operation = this.#operation
|
|
50
52
|
const isLatest = () => (this.#operation === operation)
|
|
53
|
+
|
|
51
54
|
this.element.inert = true
|
|
52
55
|
this.element.toggleAttribute("loading", true)
|
|
53
56
|
dom.render(this.#loading, getLoading())
|
|
54
57
|
|
|
55
58
|
try {
|
|
56
59
|
const [content] = await Promise.all([
|
|
57
|
-
getContent()
|
|
60
|
+
getContent()
|
|
61
|
+
.catch(error => {
|
|
62
|
+
console.error(error)
|
|
63
|
+
return getError?.(error) ?? html`
|
|
64
|
+
<div benev-error>${errorString(error, "an error occurred")}</div>
|
|
65
|
+
`
|
|
66
|
+
}),
|
|
58
67
|
nap(this.anim * 2),
|
|
59
68
|
])
|
|
60
69
|
|
|
@@ -116,6 +116,18 @@ benev-header {
|
|
|
116
116
|
}
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
+
benev-loader {
|
|
120
|
+
[benev-error] {
|
|
121
|
+
position: absolute;
|
|
122
|
+
display: flex;
|
|
123
|
+
width: 100%;
|
|
124
|
+
height: 100%;
|
|
125
|
+
justify-content: center;
|
|
126
|
+
align-items: center;
|
|
127
|
+
color: var(--benev-angry);
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
|
|
119
131
|
benev-footer {
|
|
120
132
|
width: 100%;
|
|
121
133
|
max-width: var(--benev-site-width);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/common.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,eAAe,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"common.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/common.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0NjB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vars.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/vars.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,OAAO,EAAC,OAAO,EAAC,MAAM,kBAAkB,CAAA;AACxC,eAAe,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"vars.csstext.js","sourceRoot":"","sources":["../../../s/css/parts/vars.csstext.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,IAAI,GAAG,EAAC,MAAM,WAAW,CAAA;AAC/C,OAAO,EAAC,OAAO,EAAC,MAAM,kBAAkB,CAAA;AACxC,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;gBA4BF,OAAO,CAAC,IAAI;;;;;;;;CAQ3B,CAAA"}
|
package/x/dom/loader/loader.d.ts
CHANGED
|
@@ -6,5 +6,5 @@ export declare class Loader {
|
|
|
6
6
|
original: HTMLTemplateElement;
|
|
7
7
|
constructor(element: HTMLElement, anim?: number);
|
|
8
8
|
reset(getLoading: () => Content): Promise<void>;
|
|
9
|
-
load(getLoading: () => Content, getContent: () => Promise<Content
|
|
9
|
+
load(getLoading: () => Content, getContent: () => Promise<Content>, getError?: (error: unknown) => Content): Promise<void>;
|
|
10
10
|
}
|
package/x/dom/loader/loader.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { html } from "lit";
|
|
2
2
|
import { dom } from "@e280/sly";
|
|
3
|
+
import { errorString, nap } from "@e280/stz";
|
|
3
4
|
import { bconfig } from "../../bconfig.js";
|
|
4
5
|
export class Loader {
|
|
5
6
|
element;
|
|
@@ -25,7 +26,7 @@ export class Loader {
|
|
|
25
26
|
async reset(getLoading) {
|
|
26
27
|
return this.load(getLoading, async () => Array.from(this.original.content.cloneNode(true).childNodes));
|
|
27
28
|
}
|
|
28
|
-
async load(getLoading, getContent) {
|
|
29
|
+
async load(getLoading, getContent, getError) {
|
|
29
30
|
this.#operation += 1;
|
|
30
31
|
const operation = this.#operation;
|
|
31
32
|
const isLatest = () => (this.#operation === operation);
|
|
@@ -34,7 +35,13 @@ export class Loader {
|
|
|
34
35
|
dom.render(this.#loading, getLoading());
|
|
35
36
|
try {
|
|
36
37
|
const [content] = await Promise.all([
|
|
37
|
-
getContent()
|
|
38
|
+
getContent()
|
|
39
|
+
.catch(error => {
|
|
40
|
+
console.error(error);
|
|
41
|
+
return getError?.(error) ?? html `
|
|
42
|
+
<div benev-error>${errorString(error, "an error occurred")}</div>
|
|
43
|
+
`;
|
|
44
|
+
}),
|
|
38
45
|
nap(this.anim * 2),
|
|
39
46
|
]);
|
|
40
47
|
if (isLatest()) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loader.js","sourceRoot":"","sources":["../../../s/dom/loader/loader.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"loader.js","sourceRoot":"","sources":["../../../s/dom/loader/loader.ts"],"names":[],"mappings":"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"}
|
package/x/index.html
CHANGED
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
<title>@benev/web</title>
|
|
9
9
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='0.9em' font-size='90'>😇</text></svg>"/>
|
|
10
|
-
<script type="module" src="main.bundle.min.js?v=
|
|
10
|
+
<script type="module" src="main.bundle.min.js?v=ca969564106b"></script>
|
|
11
11
|
<style>
|
|
12
12
|
@layer benev, demo;
|
|
13
13
|
|
|
@@ -37,6 +37,7 @@ benev.page;
|
|
|
37
37
|
--benev-b-size: 1.5em;
|
|
38
38
|
--benev-code: #0f0;
|
|
39
39
|
|
|
40
|
+
--benev-angry: #f40;
|
|
40
41
|
--benev-select-bg: #f60;
|
|
41
42
|
--benev-select-color: #ff8;
|
|
42
43
|
|
|
@@ -236,6 +237,18 @@ a {
|
|
|
236
237
|
}
|
|
237
238
|
}
|
|
238
239
|
|
|
240
|
+
benev-loader {
|
|
241
|
+
[benev-error] {
|
|
242
|
+
position: absolute;
|
|
243
|
+
display: flex;
|
|
244
|
+
width: 100%;
|
|
245
|
+
height: 100%;
|
|
246
|
+
justify-content: center;
|
|
247
|
+
align-items: center;
|
|
248
|
+
color: var(--benev-angry);
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
|
|
239
252
|
benev-footer {
|
|
240
253
|
width: 100%;
|
|
241
254
|
max-width: var(--benev-site-width);
|