@e280/sly 0.0.0-6 → 0.0.0-7
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/README.md +73 -1
- package/package.json +1 -1
- package/s/demo/demo.bundle.ts +5 -0
- package/s/demo/views/counter.ts +8 -4
- package/s/demo/views/demo.ts +1 -1
- package/s/features/dom/dollar.ts +2 -0
- package/s/features/views/types.ts +7 -0
- package/s/features/views/use.ts +3 -2
- package/s/features/views/view.ts +33 -8
- package/s/index.html.ts +1 -0
- package/x/demo/demo.bundle.js +4 -0
- package/x/demo/demo.bundle.js.map +1 -1
- package/x/demo/demo.bundle.min.js +19 -15
- package/x/demo/demo.bundle.min.js.map +3 -3
- package/x/demo/views/counter.d.ts +1 -1
- package/x/demo/views/counter.js +8 -4
- package/x/demo/views/counter.js.map +1 -1
- package/x/demo/views/demo.js +1 -1
- package/x/demo/views/demo.js.map +1 -1
- package/x/features/dom/dollar.d.ts +1 -0
- package/x/features/dom/dollar.js +2 -0
- package/x/features/dom/dollar.js.map +1 -1
- package/x/features/views/types.d.ts +6 -0
- package/x/features/views/use.d.ts +1 -1
- package/x/features/views/use.js +2 -1
- package/x/features/views/use.js.map +1 -1
- package/x/features/views/view.d.ts +3 -1
- package/x/features/views/view.js +27 -8
- package/x/features/views/view.js.map +1 -1
- package/x/index.html +3 -2
- package/x/index.html.js +1 -0
- package/x/index.html.js.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const CounterView: import("../../index.js").View<[]>;
|
|
1
|
+
export declare const CounterView: import("../../index.js").View<[initial: number]>;
|
package/x/demo/views/counter.js
CHANGED
|
@@ -2,7 +2,7 @@ import { css, html } from "lit";
|
|
|
2
2
|
import { repeat } from "@e280/stz";
|
|
3
3
|
import { view } from "../../features/views/view.js";
|
|
4
4
|
import { cssReset } from "../../features/views/css-reset.js";
|
|
5
|
-
export const CounterView = view(use => () => {
|
|
5
|
+
export const CounterView = view(use => (initial) => {
|
|
6
6
|
use.name("counter");
|
|
7
7
|
use.styles(cssReset, styles);
|
|
8
8
|
const start = use.once(() => Date.now());
|
|
@@ -11,9 +11,10 @@ export const CounterView = view(use => () => {
|
|
|
11
11
|
const since = Date.now() - start;
|
|
12
12
|
seconds(Math.floor(since / 1000));
|
|
13
13
|
}));
|
|
14
|
-
const count = use.signal(
|
|
14
|
+
const count = use.signal(initial);
|
|
15
15
|
const increment = () => count(count() + 1);
|
|
16
16
|
return html `
|
|
17
|
+
<slot></slot>
|
|
17
18
|
<div>
|
|
18
19
|
<span>${seconds()}</span>
|
|
19
20
|
</div>
|
|
@@ -26,9 +27,12 @@ export const CounterView = view(use => () => {
|
|
|
26
27
|
const styles = css `
|
|
27
28
|
:host {
|
|
28
29
|
display: flex;
|
|
29
|
-
flex-direction: column;
|
|
30
30
|
justify-content: center;
|
|
31
|
-
|
|
31
|
+
gap: 1em;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
button {
|
|
35
|
+
padding: 0.2em 0.5em;
|
|
32
36
|
}
|
|
33
37
|
`;
|
|
34
38
|
//# sourceMappingURL=counter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"counter.js","sourceRoot":"","sources":["../../../s/demo/views/counter.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAA;AAEhC,OAAO,EAAC,IAAI,EAAC,MAAM,8BAA8B,CAAA;AACjD,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAE1D,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,
|
|
1
|
+
{"version":3,"file":"counter.js","sourceRoot":"","sources":["../../../s/demo/views/counter.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,MAAM,EAAC,MAAM,WAAW,CAAA;AAEhC,OAAO,EAAC,IAAI,EAAC,MAAM,8BAA8B,CAAA;AACjD,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAE1D,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,OAAe,EAAE,EAAE;IAC1D,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;IACnB,GAAG,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;IAE5B,MAAM,KAAK,GAAG,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAA;IACxC,MAAM,OAAO,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;IAE7B,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,KAAK,IAAG,EAAE;QAChC,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,GAAG,KAAK,CAAA;QAChC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC,CAAA;IAClC,CAAC,CAAC,CAAC,CAAA;IAEH,MAAM,KAAK,GAAG,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;IACjC,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC,CAAA;IAE1C,OAAO,IAAI,CAAA;;;WAGD,OAAO,EAAE;;;WAGT,KAAK,EAAE;qBACG,SAAS;;EAE5B,CAAA;AACF,CAAC,CAAC,CAAA;AAEF,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;CAUjB,CAAA"}
|
package/x/demo/views/demo.js
CHANGED
package/x/demo/views/demo.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../../s/demo/views/demo.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,IAAI,EAAC,MAAM,8BAA8B,CAAA;AACjD,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAE1D,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE;IACxC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IAChB,GAAG,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;IAE5B,OAAO,IAAI,CAAA;IACR,WAAW,
|
|
1
|
+
{"version":3,"file":"demo.js","sourceRoot":"","sources":["../../../s/demo/views/demo.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AACxC,OAAO,EAAC,IAAI,EAAC,MAAM,8BAA8B,CAAA;AACjD,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAE1D,MAAM,CAAC,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE;IACxC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IAChB,GAAG,CAAC,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAA;IAE5B,OAAO,IAAI,CAAA;IACR,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAC/B,WAAW,EAAE;EACf,CAAA;AACF,CAAC,CAAC,CAAA;AAEF,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;CAMjB,CAAA"}
|
|
@@ -6,4 +6,5 @@ export declare namespace $ {
|
|
|
6
6
|
var maybe: <E extends HTMLElement = HTMLElement>(selector: string, context?: Queryable) => E | null;
|
|
7
7
|
var all: <E extends HTMLElement = HTMLElement>(selector: string, context?: Queryable) => E[];
|
|
8
8
|
var render: (container: Container, ...content: Content[]) => import("lit-html").RootPart;
|
|
9
|
+
var register: typeof import("./register.js").register;
|
|
9
10
|
}
|
package/x/features/dom/dollar.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { render } from "lit";
|
|
2
|
+
import { register } from "./register.js";
|
|
2
3
|
export function $(selector, context = document) {
|
|
3
4
|
const e = context.querySelector(selector);
|
|
4
5
|
if (!e)
|
|
@@ -13,4 +14,5 @@ $.maybe = (selector, context = document) => {
|
|
|
13
14
|
};
|
|
14
15
|
$.all = all;
|
|
15
16
|
$.render = (container, ...content) => render(content, container);
|
|
17
|
+
$.register = register;
|
|
16
18
|
//# sourceMappingURL=dollar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dollar.js","sourceRoot":"","sources":["../../../s/features/dom/dollar.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAC,MAAM,KAAK,CAAA;
|
|
1
|
+
{"version":3,"file":"dollar.js","sourceRoot":"","sources":["../../../s/features/dom/dollar.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAC,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAA;AAMtC,MAAM,UAAU,CAAC,CAAsC,QAAgB,EAAE,UAAqB,QAAQ;IACrG,MAAM,CAAC,GAAG,OAAO,CAAC,aAAa,CAAI,QAAQ,CAAC,CAAA;IAC5C,IAAI,CAAC,CAAC;QAAE,MAAM,IAAI,KAAK,CAAC,MAAM,QAAQ,YAAY,CAAC,CAAA;IACnD,OAAO,CAAC,CAAA;AACT,CAAC;AAED,SAAS,GAAG,CAAsC,QAAgB,EAAE,UAAqB,QAAQ;IAChG,OAAO,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAI,QAAQ,CAAC,CAAC,CAAA;AACzD,CAAC;AAED,CAAC,CAAC,KAAK,GAAG,CAAsC,QAAgB,EAAE,UAAqB,QAAQ,EAAE,EAAE;IAClG,OAAO,OAAO,CAAC,aAAa,CAAI,QAAQ,CAAC,CAAA;AAC1C,CAAC,CAAA;AAED,CAAC,CAAC,GAAG,GAAG,GAAG,CAAA;AAEX,CAAC,CAAC,MAAM,GAAG,CAAC,SAAoB,EAAE,GAAG,OAAkB,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;AACtF,CAAC,CAAC,QAAQ,GAAG,QAAQ,CAAA"}
|
|
@@ -1,8 +1,13 @@
|
|
|
1
|
+
import { Constructor } from "@e280/stz";
|
|
1
2
|
import { DirectiveResult } from "lit/directive.js";
|
|
2
3
|
import { CSSResultGroup, TemplateResult } from "lit";
|
|
3
4
|
import { Use } from "./use.js";
|
|
4
5
|
export type Content = TemplateResult | DirectiveResult | HTMLElement | string | null | undefined | void | Content[];
|
|
5
6
|
export type AttrValue = string | boolean | number | undefined | null | void;
|
|
7
|
+
export type Component<Props extends any[] = []> = {
|
|
8
|
+
render(...props: Props): void;
|
|
9
|
+
} & HTMLElement;
|
|
10
|
+
export type ComponentFn = (use: Use) => Content;
|
|
6
11
|
export type ViewFn<Props extends any[]> = (use: Use) => (...props: Props) => Content;
|
|
7
12
|
export type BasicView<Props extends any[]> = (...props: Props) => DirectiveResult<any>;
|
|
8
13
|
export type View<Props extends any[]> = BasicView<Props> & {
|
|
@@ -11,6 +16,7 @@ export type View<Props extends any[]> = BasicView<Props> & {
|
|
|
11
16
|
children: (...children: Content[]) => View<Props>;
|
|
12
17
|
attrs: (attrs: Record<string, AttrValue>) => View<Props>;
|
|
13
18
|
attr: (name: string, value: AttrValue) => View<Props>;
|
|
19
|
+
component: (...props: Props) => Constructor<Component>;
|
|
14
20
|
};
|
|
15
21
|
export type ViewSettings = ShadowRootInit & {
|
|
16
22
|
tag?: string;
|
|
@@ -8,7 +8,7 @@ export declare class Use {
|
|
|
8
8
|
element: HTMLElement;
|
|
9
9
|
shadow: ShadowRoot;
|
|
10
10
|
render: () => void;
|
|
11
|
-
[_wrap](fn: () =>
|
|
11
|
+
[_wrap]<R>(fn: () => R): R;
|
|
12
12
|
[_disconnect](): void;
|
|
13
13
|
[_reconnect](): void;
|
|
14
14
|
constructor(element: HTMLElement, shadow: ShadowRoot, render: () => void);
|
package/x/features/views/use.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use.js","sourceRoot":"","sources":["../../../s/features/views/use.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,KAAK,EAAE,IAAI,EAAC,MAAM,WAAW,CAAA;AACrC,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAA;AAE3C,OAAO,EAAC,EAAE,EAAC,MAAM,aAAa,CAAA;AAC9B,OAAO,EAAC,MAAM,EAAC,MAAM,mBAAmB,CAAA;AACxC,OAAO,EAAC,WAAW,EAAC,MAAM,yBAAyB,CAAA;AAEnD,MAAM,CAAC,MAAM,KAAK,GAAG,MAAM,EAAE,CAAA;AAC7B,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,EAAE,CAAA;AACnC,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,EAAE,CAAA;AAElC,MAAM,OAAO,GAAG;
|
|
1
|
+
{"version":3,"file":"use.js","sourceRoot":"","sources":["../../../s/features/views/use.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Constructor } from "@e280/stz";
|
|
2
|
+
import { Component, ComponentFn, View, ViewFn, ViewSettings } from "./types.js";
|
|
2
3
|
export declare const view: {
|
|
3
4
|
<Props extends any[]>(fn: ViewFn<Props>): View<Props>;
|
|
4
5
|
view: /*elided*/ any;
|
|
5
6
|
settings(settings2: Partial<ViewSettings>): /*elided*/ any;
|
|
7
|
+
component(fn: ComponentFn): Constructor<Component<[]>>;
|
|
6
8
|
};
|
|
7
9
|
export declare class SlyView extends HTMLElement {
|
|
8
10
|
}
|
package/x/features/views/view.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { render } from "lit";
|
|
2
|
-
import { debounce, MapG } from "@e280/stz";
|
|
3
2
|
import { tracker } from "@e280/strata/tracker";
|
|
3
|
+
import { debounce, MapG } from "@e280/stz";
|
|
4
4
|
import { AsyncDirective } from "lit/async-directive.js";
|
|
5
5
|
import { directive } from "lit/directive.js";
|
|
6
6
|
import { register } from "../dom/register.js";
|
|
@@ -13,8 +13,8 @@ export class SlyView extends HTMLElement {
|
|
|
13
13
|
register({ SlyView }, { soft: true, upgrade: true });
|
|
14
14
|
function setupView(settings) {
|
|
15
15
|
function view(fn) {
|
|
16
|
-
class ViewDirective extends AsyncDirective {
|
|
17
|
-
#element =
|
|
16
|
+
const make = (situation) => class ViewDirective extends AsyncDirective {
|
|
17
|
+
#element = situation.getElement();
|
|
18
18
|
#shadow = this.#element.attachShadow(settings);
|
|
19
19
|
#use = new Use(this.#element, this.#shadow, () => this.#render());
|
|
20
20
|
#fn = (() => {
|
|
@@ -43,14 +43,15 @@ function setupView(settings) {
|
|
|
43
43
|
for (const item of seen)
|
|
44
44
|
this.#tracking.guarantee(item, () => tracker.changed(item, async () => this.#renderDebounced()));
|
|
45
45
|
// inject content into light dom
|
|
46
|
-
|
|
46
|
+
if (!situation.isComponent)
|
|
47
|
+
render(w.children, this.#element);
|
|
47
48
|
});
|
|
48
49
|
}
|
|
49
50
|
#renderDebounced = debounce(0, () => this.#render());
|
|
50
51
|
render(w, props) {
|
|
51
52
|
this.#params = { with: w, props };
|
|
52
53
|
this.#render();
|
|
53
|
-
return this.#element;
|
|
54
|
+
return situation.isComponent ? null : this.#element;
|
|
54
55
|
}
|
|
55
56
|
disconnected() {
|
|
56
57
|
this.#use[_disconnect]();
|
|
@@ -61,10 +62,13 @@ function setupView(settings) {
|
|
|
61
62
|
reconnected() {
|
|
62
63
|
this.#use[_reconnect]();
|
|
63
64
|
}
|
|
64
|
-
}
|
|
65
|
+
};
|
|
66
|
+
const d = directive(make({
|
|
67
|
+
getElement: () => document.createElement(settings.tag ?? "sly-view"),
|
|
68
|
+
isComponent: false,
|
|
69
|
+
}));
|
|
65
70
|
function setupDirective(w) {
|
|
66
|
-
const
|
|
67
|
-
const rend = (...props) => r(w, props);
|
|
71
|
+
const rend = (...props) => d(w, props);
|
|
68
72
|
rend.props = rend;
|
|
69
73
|
rend.with = (w2) => setupDirective({ ...w, ...w2 });
|
|
70
74
|
rend.children = (...children) => setupDirective({ ...w, children });
|
|
@@ -73,6 +77,20 @@ function setupView(settings) {
|
|
|
73
77
|
...w,
|
|
74
78
|
attrs: { ...w.attrs, [name]: value },
|
|
75
79
|
});
|
|
80
|
+
rend.component = (...props) => class extends HTMLElement {
|
|
81
|
+
#directive = directive(make({
|
|
82
|
+
getElement: () => this,
|
|
83
|
+
isComponent: true,
|
|
84
|
+
}));
|
|
85
|
+
constructor() {
|
|
86
|
+
super();
|
|
87
|
+
this.render(...props);
|
|
88
|
+
}
|
|
89
|
+
render(...props) {
|
|
90
|
+
if (this.isConnected)
|
|
91
|
+
render(this.#directive(w, props), this);
|
|
92
|
+
}
|
|
93
|
+
};
|
|
76
94
|
return rend;
|
|
77
95
|
}
|
|
78
96
|
return setupDirective({
|
|
@@ -82,6 +100,7 @@ function setupView(settings) {
|
|
|
82
100
|
}
|
|
83
101
|
view.view = view;
|
|
84
102
|
view.settings = (settings2) => setupView({ ...settings, ...settings2 });
|
|
103
|
+
view.component = (fn) => view(use => () => fn(use)).component();
|
|
85
104
|
return view;
|
|
86
105
|
}
|
|
87
106
|
//# sourceMappingURL=view.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"view.js","sourceRoot":"","sources":["../../../s/features/views/view.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAC,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAC,
|
|
1
|
+
{"version":3,"file":"view.js","sourceRoot":"","sources":["../../../s/features/views/view.ts"],"names":[],"mappings":"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"}
|
package/x/index.html
CHANGED
|
@@ -111,7 +111,7 @@ body {
|
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
</style>
|
|
114
|
-
<script type=module src="demo/demo.bundle.min.js?v=
|
|
114
|
+
<script type=module src="demo/demo.bundle.min.js?v=bdb99b47c242"></script>
|
|
115
115
|
<link rel="icon" href="assets/favicon.png?v=4dc161ed79b3"/>
|
|
116
116
|
|
|
117
117
|
<meta name="theme-color" content="#95ff7b">
|
|
@@ -131,7 +131,8 @@ body {
|
|
|
131
131
|
<img class=icon alt="" src="/assets/favicon.png"/>
|
|
132
132
|
<h1>sly testing page</h1>
|
|
133
133
|
<p><a href="https://github.com/e280/sly">github.com/e280/sly</a></p>
|
|
134
|
-
<p class=lil>v0.0.0-
|
|
134
|
+
<p class=lil>v0.0.0-7</p>
|
|
135
|
+
<demo-counter>component</demo-counter>
|
|
135
136
|
<div class=demo></div>
|
|
136
137
|
|
|
137
138
|
</body>
|
package/x/index.html.js
CHANGED
|
@@ -24,6 +24,7 @@ export default ssg.page(import.meta.url, async (orb) => ({
|
|
|
24
24
|
<h1>sly testing page</h1>
|
|
25
25
|
<p><a href="https://github.com/e280/sly">github.com/e280/sly</a></p>
|
|
26
26
|
<p class=lil>v${orb.packageVersion()}</p>
|
|
27
|
+
<demo-counter>component</demo-counter>
|
|
27
28
|
<div class=demo></div>
|
|
28
29
|
`,
|
|
29
30
|
}));
|
package/x/index.html.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.html.js","sourceRoot":"","sources":["../s/index.html.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,aAAa,CAAA;AAErC,MAAM,KAAK,GAAG,KAAK,CAAA;AACnB,MAAM,WAAW,GAAG,0BAA0B,CAAA;AAC9C,MAAM,MAAM,GAAG,cAAc,CAAA;AAC7B,MAAM,OAAO,GAAG,qBAAqB,CAAA;AAErC,eAAe,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,KAAK,EAAC,GAAG,EAAC,EAAE,CAAC,CAAC;IACtD,KAAK;IACL,EAAE,EAAE,yBAAyB;IAC7B,GAAG,EAAE,eAAe;IACpB,OAAO;IACP,IAAI,EAAE,IAAI;IACV,UAAU,EAAE;QACX,UAAU,EAAE,SAAS;QACrB,KAAK;QACL,WAAW;QACX,QAAQ,EAAE,WAAW;QACrB,KAAK,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO;KACpC;IAED,IAAI,EAAE,IAAI,CAAA;;EAET;IAED,IAAI,EAAE,IAAI,CAAA;;;;kBAIO,GAAG,CAAC,cAAc,EAAE
|
|
1
|
+
{"version":3,"file":"index.html.js","sourceRoot":"","sources":["../s/index.html.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,aAAa,CAAA;AAErC,MAAM,KAAK,GAAG,KAAK,CAAA;AACnB,MAAM,WAAW,GAAG,0BAA0B,CAAA;AAC9C,MAAM,MAAM,GAAG,cAAc,CAAA;AAC7B,MAAM,OAAO,GAAG,qBAAqB,CAAA;AAErC,eAAe,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,EAAE,KAAK,EAAC,GAAG,EAAC,EAAE,CAAC,CAAC;IACtD,KAAK;IACL,EAAE,EAAE,yBAAyB;IAC7B,GAAG,EAAE,eAAe;IACpB,OAAO;IACP,IAAI,EAAE,IAAI;IACV,UAAU,EAAE;QACX,UAAU,EAAE,SAAS;QACrB,KAAK;QACL,WAAW;QACX,QAAQ,EAAE,WAAW;QACrB,KAAK,EAAE,UAAU,GAAG,MAAM,GAAG,OAAO;KACpC;IAED,IAAI,EAAE,IAAI,CAAA;;EAET;IAED,IAAI,EAAE,IAAI,CAAA;;;;kBAIO,GAAG,CAAC,cAAc,EAAE;;;EAGpC;CACD,CAAC,CAAC,CAAA"}
|