jpf 5.0.3 → 5.0.7

package/dist/controls/html/Select/Select.js

@@ -1,111 +1,110 @@
-import { unwrap, isSubscribable } from "knockout";
-import { View, registerView } from "../../../framework/View";
-import { ViewModel, extendProperties } from "../../../framework/ViewModel";
-import { isObservableProperty } from "../../../framework/observable";
-export class SelectView extends View {
-    constructor(properties) {
-        super({
-            tagName: "select",
-            properties: extendProperties({
-                viewType: "Select"
-            }, properties)
-        });
-    }
-    build() {
-        super.build();
-        const select = this.element;
-        const viewModel = this.properties;
-        this.setItems(unwrap(viewModel.items));
-        if (isSubscribable(viewModel.items)) {
-            this.subscriptions.push(viewModel.items.subscribe((items) => {
-                this.setItems(items);
-            }));
-        }
-        this.setSelectedValue(unwrap(viewModel.value));
-        if (isSubscribable(viewModel.value)) {
-            this.subscriptions.push(viewModel.value.subscribe((value) => {
-                this.setSelectedValue(value);
-            }));
-        }
-        this.element.addEventListener("change", async (event) => {
-            let selectedValue = select.value;
-            let selectedItem = null;
-            if (selectedValue + "" === "") {
-                selectedValue = null;
-            }
-            else {
-                selectedItem = this.itemDictionary[selectedValue.toString()];
-                selectedValue = this.properties.valueFunction(selectedItem);
-            }
-            if (viewModel.inputValidator) {
-                if (!await viewModel.inputValidator(event, viewModel, selectedValue)) {
-                    select.value = unwrap(viewModel.value);
-                    return;
-                }
-                ;
-            }
-            if (isObservableProperty(viewModel.value)) {
-                if (viewModel.setFunction) {
-                    const setValue = viewModel.setFunction(selectedItem);
-                    viewModel.value.set(setValue);
-                }
-                else {
-                    viewModel.value.set(selectedValue);
-                }
-            }
-        });
-    }
-    itemDictionary;
-    setItems(items) {
-        if (this.element) {
-            this.itemDictionary = {};
-            if (items) {
-                const select = this.element;
-                select.innerHTML = null;
-                if (this.properties.emptyItemText) {
-                    const emptyOption = document.createElement("option");
-                    emptyOption.value = "";
-                    emptyOption.text = this.properties.emptyItemText;
-                    select.options.add(emptyOption);
-                }
-                items.forEach((item) => {
-                    const value = this.properties.valueFunction(item).toString();
-                    this.itemDictionary[value] = item;
-                    var option = document.createElement("option");
-                    option.value = value;
-                    option.text = this.properties.textFunction(item);
-                    select.options.add(option);
-                });
-            }
-        }
-    }
-    setSelectedValue(value) {
-        if (this.element) {
-            const select = this.element;
-            if (value === null || value === undefined) {
-                select.value = "";
-            }
-            else {
-                select.value = value.toString();
-            }
-        }
-    }
-}
-export function selectView(properties) {
-    return new SelectView(properties);
-}
-export class SelectViewModel extends ViewModel {
-    constructor(properties) {
-        super();
-        this.setProperties(this, properties);
-    }
-    value;
-    items;
-    textFunction;
-    valueFunction;
-    setFunction;
-    inputValidator;
-    emptyItemText;
-}
-registerView(SelectViewModel, SelectView);
+import { Element, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+import { unwrap, isSubscribable, isObservableValue } from "../../../framework/observable";
+export class SelectElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "select",
+            properties: extendProperties(properties, {
+                elementType: "Select"
+            })
+        });
+    }
+    build() {
+        super.build();
+        const select = this.element;
+        const properties = this.properties;
+        this.setItems(unwrap(properties.items));
+        if (isSubscribable(properties.items)) {
+            this.disposers.push(properties.items.subscribe((items) => {
+                this.setItems(items);
+            }));
+        }
+        this.setSelectedValue(unwrap(properties.value));
+        if (isSubscribable(properties.value)) {
+            this.disposers.push(properties.value.subscribe((value) => {
+                this.setSelectedValue(value);
+            }));
+        }
+        this.element.addEventListener("change", async (event) => {
+            let selectedValue = select.value;
+            let selectedItem = null;
+            if (selectedValue + "" === "") {
+                selectedValue = null;
+            }
+            else {
+                selectedItem = this.itemDictionary[selectedValue.toString()];
+                selectedValue = this.properties.valueFunction(selectedItem);
+            }
+            if (properties.inputValidator) {
+                if (!await properties.inputValidator(event, properties, selectedValue)) {
+                    select.value = unwrap(properties.value);
+                    return;
+                }
+                ;
+            }
+            if (isObservableValue(properties.value)) {
+                if (properties.setFunction) {
+                    const setValue = properties.setFunction(selectedItem);
+                    properties.value.setValueInAction(setValue);
+                }
+                else {
+                    properties.value.setValueInAction(selectedValue);
+                }
+            }
+        });
+    }
+    itemDictionary;
+    setItems(items) {
+        if (this.element) {
+            this.itemDictionary = {};
+            if (items) {
+                const select = this.element;
+                select.innerHTML = null;
+                if (this.properties.emptyItemText) {
+                    const emptyOption = document.createElement("option");
+                    emptyOption.value = "";
+                    emptyOption.text = this.properties.emptyItemText;
+                    select.options.add(emptyOption);
+                }
+                items.forEach((item) => {
+                    const value = this.properties.valueFunction(item).toString();
+                    this.itemDictionary[value] = item;
+                    var option = document.createElement("option");
+                    option.value = value;
+                    option.text = this.properties.textFunction(item);
+                    select.options.add(option);
+                });
+            }
+        }
+    }
+    setSelectedValue(value) {
+        if (this.element) {
+            const select = this.element;
+            if (value === null || value === undefined) {
+                select.value = "";
+            }
+            else {
+                select.value = value.toString();
+            }
+        }
+    }
+}
+export function createSelect(properties) {
+    return new SelectElement(properties);
+}
+export class SelectProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    value;
+    items;
+    textFunction;
+    valueFunction;
+    setFunction;
+    inputValidator;
+    emptyItemText;
+}
+registerElement(SelectProperties.prototype.constructor, SelectElement);
 //# sourceMappingURL=Select.js.map

package/dist/controls/html/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/controls/html/Select/Select.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/controls/html/Select/Select.ts"],"names":[],"mappings":"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"}

package/dist/controls/html/Span/Span.d.ts

@@ -1,11 +1,11 @@
-import { View } from "../../../framework/View";
-import { ViewModel, Properties } from "../../../framework/ViewModel";
-export interface SpanProperties extends Properties {
-}
-export declare class SpanView extends View<SpanProperties> {
-    constructor(properties: SpanProperties);
-}
-export declare function spanView(properties: SpanProperties): SpanView;
-export declare class SpanViewModel extends ViewModel implements SpanProperties {
-    constructor(properties: SpanProperties);
-}
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+export interface ISpanProperties extends IProperties {
+}
+export declare class SpanElement extends Element<ISpanProperties> {
+    constructor(properties: ISpanProperties);
+}
+export declare function createSpan(properties: ISpanProperties): SpanElement;
+export declare class SpanProperties extends Properties implements ISpanProperties {
+    constructor(properties: SpanProperties);
+}

package/dist/controls/html/Span/Span.js

@@ -1,23 +1,23 @@
-import { View, registerView } from "../../../framework/View";
-import { ViewModel, extendProperties } from "../../../framework/ViewModel";
-export class SpanView extends View {
-    constructor(properties) {
-        super({
-            tagName: "span",
-            properties: extendProperties({
-                viewType: "Span"
-            }, properties)
-        });
-    }
-}
-export function spanView(properties) {
-    return new SpanView(properties);
-}
-export class SpanViewModel extends ViewModel {
-    constructor(properties) {
-        super();
-        this.setProperties(this, properties);
-    }
-}
-registerView(SpanViewModel, SpanView);
+import { Element, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+export class SpanElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "span",
+            properties: extendProperties(properties, {
+                elementType: "Span"
+            })
+        });
+    }
+}
+export function createSpan(properties) {
+    return new SpanElement(properties);
+}
+export class SpanProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+}
+registerElement(SpanProperties.prototype.constructor, SpanElement);
 //# sourceMappingURL=Span.js.map

package/dist/controls/html/Span/Span.js.map

@@ -1 +1 @@
-{"version":3,"file":"Span.js","sourceRoot":"","sources":["../../../../src/controls/html/Span/Span.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAc,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAMvF,MAAM,OAAO,QAAS,SAAQ,IAAoB;IAC9C,YAAY,UAA0B;QAClC,KAAK,CACD;YACI,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,gBAAgB,CACxB;gBACI,QAAQ,EAAE,MAAM;aACnB,EACD,UAAU,CACb;SACJ,CACJ,CAAC;IACN,CAAC;CACJ;AAED,MAAM,UAAU,QAAQ,CAAC,UAA0B;IAC/C,OAAO,IAAI,QAAQ,CAAC,UAAU,CAAC,CAAC;AACpC,CAAC;AAED,MAAM,OAAO,aAAc,SAAQ,SAAS;IACxC,YAAY,UAA0B;QAClC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;CACJ;AAED,YAAY,CACR,aAAa,EACb,QAAQ,CACX,CAAC"}
+{"version":3,"file":"Span.js","sourceRoot":"","sources":["../../../../src/controls/html/Span/Span.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAM1F,MAAM,OAAO,WAAY,SAAQ,OAAwB;IACrD,YAAY,UAA2B;QACnC,KAAK,CACD;YACI,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,MAAM;aACtB,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;CACJ;AAED,MAAM,UAAU,UAAU,CAAC,UAA2B;IAClD,OAAO,IAAI,WAAW,CAAC,UAAU,CAAC,CAAC;AACvC,CAAC;AAED,MAAM,OAAO,cAAe,SAAQ,UAAU;IAC1C,YAAY,UAA0B;QAClC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;CACJ;AAED,eAAe,CACX,cAAc,CAAC,SAAS,CAAC,WAAW,EACpC,WAAW,CACd,CAAC"}

package/dist/controls/html/index.d.ts

@@ -1,6 +1,6 @@
-export * from "./Button/Button";
-export * from "./Div/Div";
-export * from "./Image/Image";
-export * from "./Input/Input";
-export * from "./Select/Select";
-export * from "./Span/Span";
+export * from "./Button/Button";
+export * from "./Div/Div";
+export * from "./Image/Image";
+export * from "./Input/Input";
+export * from "./Select/Select";
+export * from "./Span/Span";

package/dist/controls/html/index.js

@@ -1,7 +1,7 @@
-export * from "./Button/Button";
-export * from "./Div/Div";
-export * from "./Image/Image";
-export * from "./Input/Input";
-export * from "./Select/Select";
-export * from "./Span/Span";
+export * from "./Button/Button";
+export * from "./Div/Div";
+export * from "./Image/Image";
+export * from "./Input/Input";
+export * from "./Select/Select";
+export * from "./Span/Span";
 //# sourceMappingURL=index.js.map

package/dist/controls/index.d.ts

@@ -1,14 +1,14 @@
-import * as codeMirror from "./codeMirror/index";
-import * as custom from "./custom/index";
-import * as html from "./html/index";
-import * as jsonViewAwesome from "./jsonViewAwesome/index";
-import * as kendo from "./kendo/index";
-import * as leaflet from "./leaflet/index";
-import * as svg from "./svg/index";
-export { codeMirror };
-export { custom };
-export { html };
-export { jsonViewAwesome };
-export { kendo };
-export { leaflet };
-export { svg };
+import * as codeMirror from "./codeMirror/index";
+import * as custom from "./custom/index";
+import * as html from "./html/index";
+import * as jsonViewerAwesome from "./jsonViewerAwesome/index";
+import * as kendo from "./kendo/index";
+import * as leaflet from "./leaflet/index";
+import * as svg from "./svg/index";
+export { codeMirror };
+export { custom };
+export { html };
+export { jsonViewerAwesome };
+export { kendo };
+export { leaflet };
+export { svg };

package/dist/controls/index.js

@@ -1,15 +1,15 @@
-import * as codeMirror from "./codeMirror/index";
-import * as custom from "./custom/index";
-import * as html from "./html/index";
-import * as jsonViewAwesome from "./jsonViewAwesome/index";
-import * as kendo from "./kendo/index";
-import * as leaflet from "./leaflet/index";
-import * as svg from "./svg/index";
-export { codeMirror };
-export { custom };
-export { html };
-export { jsonViewAwesome };
-export { kendo };
-export { leaflet };
-export { svg };
+import * as codeMirror from "./codeMirror/index";
+import * as custom from "./custom/index";
+import * as html from "./html/index";
+import * as jsonViewerAwesome from "./jsonViewerAwesome/index";
+import * as kendo from "./kendo/index";
+import * as leaflet from "./leaflet/index";
+import * as svg from "./svg/index";
+export { codeMirror };
+export { custom };
+export { html };
+export { jsonViewerAwesome };
+export { kendo };
+export { leaflet };
+export { svg };
 //# sourceMappingURL=index.js.map

package/dist/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,UAAU,MAAM,oBAAoB,CAAC;AACjD,OAAO,KAAK,MAAM,MAAM,gBAAgB,CAAC;AACzC,OAAO,KAAK,IAAI,MAAM,cAAc,CAAC;AACrC,OAAO,KAAK,eAAe,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,eAAe,CAAC;AACvC,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAC;AAC3C,OAAO,KAAK,GAAG,MAAM,aAAa,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,OAAO,EAAE,eAAe,EAAE,CAAC;AAC3B,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,OAAO,EAAE,OAAO,EAAE,CAAC;AACnB,OAAO,EAAE,GAAG,EAAE,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,UAAU,MAAM,oBAAoB,CAAC;AACjD,OAAO,KAAK,MAAM,MAAM,gBAAgB,CAAC;AACzC,OAAO,KAAK,IAAI,MAAM,cAAc,CAAC;AACrC,OAAO,KAAK,iBAAiB,MAAM,2BAA2B,CAAC;AAC/D,OAAO,KAAK,KAAK,MAAM,eAAe,CAAC;AACvC,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAC;AAC3C,OAAO,KAAK,GAAG,MAAM,aAAa,CAAC;AAEnC,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,MAAM,EAAE,CAAC;AAClB,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAC7B,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,OAAO,EAAE,OAAO,EAAE,CAAC;AACnB,OAAO,EAAE,GAAG,EAAE,CAAC"}

package/dist/controls/{jsonViewAwesome → jsonViewerAwesome}/index.d.ts

@@ -1 +1 @@
-export * from "./jsonFormatter/JsonFormatter";
+export * from "./jsonFormatter/JsonFormatter";

package/dist/controls/{jsonViewAwesome → jsonViewerAwesome}/index.js

@@ -1,2 +1,2 @@
-export * from "./jsonFormatter/JsonFormatter";
+export * from "./jsonFormatter/JsonFormatter";
 //# sourceMappingURL=index.js.map

package/dist/controls/jsonViewerAwesome/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/controls/jsonViewerAwesome/index.ts"],"names":[],"mappings":"AAAA,cAAe,+BAA+B,CAAC"}

package/dist/controls/jsonViewerAwesome/jsonFormatter/JsonFormatter.d.ts

@@ -0,0 +1,28 @@
+import { Element } from "../../../framework/element";
+import { Properties, IProperties } from "../../../framework/properties";
+import { ISubscribable } from "../../../framework/observable";
+export interface IJsonFormatterProperties extends IProperties {
+    json: object | ISubscribable<object>;
+    showArrayIndex?: boolean;
+    quotesOnKeys?: boolean;
+    displayDataTypes?: boolean;
+    displayObjectSize?: boolean;
+    sortKeys?: boolean;
+    collapsed?: boolean;
+}
+export declare class JsonFormatterElement extends Element<IJsonFormatterProperties> {
+    constructor(properties: IJsonFormatterProperties);
+    build(): void;
+    private setJson;
+}
+export declare function createJsonFormatter(properties: IJsonFormatterProperties): JsonFormatterElement;
+export declare class JsonFormatterProperties extends Properties implements IJsonFormatterProperties {
+    constructor(properties: IJsonFormatterProperties);
+    json: object | ISubscribable<object>;
+    showArrayIndex?: boolean;
+    quotesOnKeys?: boolean;
+    displayDataTypes?: boolean;
+    displayObjectSize?: boolean;
+    sortKeys?: boolean;
+    collapsed?: boolean;
+}

package/dist/controls/{jsonViewAwesome → jsonViewerAwesome}/jsonFormatter/JsonFormatter.js

@@ -1,66 +1,66 @@
-import { View, registerView } from "../../../framework/View";
-import { ViewModel, extendProperties } from "../../../framework/ViewModel";
-import { unwrap, isObservable } from "knockout";
-import { JSONFormatter } from "json-viewer-awesome/lib/json-formatter";
-export class JsonFormatterView extends View {
-    constructor(properties) {
-        super({
-            tagName: "div",
-            properties: extendProperties({
-                viewType: "JsonFormatter"
-            }, properties)
-        });
-    }
-    build() {
-        super.build();
-        const viewModel = this.properties;
-        this.setJson(unwrap(viewModel.json));
-        if (isObservable(viewModel.json)) {
-            this.subscriptions.push(viewModel.json.subscribe((json) => {
-                this.setJson(json);
-            }));
-        }
-    }
-    setJson(json) {
-        if (json) {
-            if (typeof json === "object") {
-                const jsonFormatter = new JSONFormatter({
-                    showArrayIndex: this.properties.showArrayIndex,
-                    quotesOnKeys: this.properties.quotesOnKeys,
-                    displayDataTypes: this.properties.displayDataTypes,
-                    displayObjectSize: this.properties.displayObjectSize,
-                    sortKeys: false,
-                    collapsed: true,
-                    iconStyle: 0,
-                    theme: undefined,
-                    src: json
-                });
-                this.element.replaceChildren(jsonFormatter.render());
-            }
-            else {
-                this.element.innerHTML = json.toString();
-            }
-        }
-        else {
-            this.empty();
-        }
-    }
-}
-export function jsonFormatterView(properties) {
-    return new JsonFormatterView(properties);
-}
-export class JsonFormatterViewModel extends ViewModel {
-    constructor(properties) {
-        super();
-        this.setProperties(this, properties);
-    }
-    json;
-    showArrayIndex;
-    quotesOnKeys;
-    displayDataTypes;
-    displayObjectSize;
-    sortKeys;
-    collapsed;
-}
-registerView(JsonFormatterViewModel, JsonFormatterView);
+import { Element, registerElement } from "../../../framework/element";
+import { Properties, extendProperties } from "../../../framework/properties";
+import { unwrap, isSubscribable } from "../../../framework/observable";
+import { JSONFormatter } from "json-viewer-awesome/lib/json-formatter";
+export class JsonFormatterElement extends Element {
+    constructor(properties) {
+        super({
+            tagName: "div",
+            properties: extendProperties(properties, {
+                elementType: "JsonFormatter"
+            })
+        });
+    }
+    build() {
+        super.build();
+        const properties = this.properties;
+        this.setJson(unwrap(properties.json));
+        if (isSubscribable(properties.json)) {
+            this.disposers.push(properties.json.subscribe((json) => {
+                this.setJson(json);
+            }));
+        }
+    }
+    setJson(json) {
+        if (json) {
+            if (typeof json === "object") {
+                const jsonFormatter = new JSONFormatter({
+                    showArrayIndex: this.properties.showArrayIndex,
+                    quotesOnKeys: this.properties.quotesOnKeys,
+                    displayDataTypes: this.properties.displayDataTypes,
+                    displayObjectSize: this.properties.displayObjectSize,
+                    sortKeys: false,
+                    collapsed: true,
+                    iconStyle: 0,
+                    theme: undefined,
+                    src: json
+                });
+                this.element.replaceChildren(jsonFormatter.render());
+            }
+            else {
+                this.element.innerHTML = json.toString();
+            }
+        }
+        else {
+            this.empty();
+        }
+    }
+}
+export function createJsonFormatter(properties) {
+    return new JsonFormatterElement(properties);
+}
+export class JsonFormatterProperties extends Properties {
+    constructor(properties) {
+        super();
+        this.setProperties(this, properties);
+    }
+    json;
+    showArrayIndex;
+    quotesOnKeys;
+    displayDataTypes;
+    displayObjectSize;
+    sortKeys;
+    collapsed;
+}
+registerElement(JsonFormatterProperties.prototype.constructor, JsonFormatterElement);
 //# sourceMappingURL=JsonFormatter.js.map

package/dist/controls/jsonViewerAwesome/jsonFormatter/JsonFormatter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"JsonFormatter.js","sourceRoot":"","sources":["../../../../src/controls/jsonViewerAwesome/jsonFormatter/JsonFormatter.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,EAAE,UAAU,EAAe,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAC1F,OAAO,EAAiB,MAAM,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AACtF,OAAO,EAAE,aAAa,EAAE,MAAM,wCAAwC,CAAC;AAYvE,MAAM,OAAO,oBAAqB,SAAQ,OAAiC;IACvE,YAAY,UAAoC;QAC5C,KAAK,CACD;YACI,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,gBAAgB,CACxB,UAAU,EACV;gBACI,WAAW,EAAE,eAAe;aAC/B,CACJ;SACJ,CACJ,CAAC;IACN,CAAC;IAED,KAAK;QACD,KAAK,CAAC,KAAK,EAAE,CAAC;QAEd,MAAM,UAAU,GAAG,IAAI,CAAC,UAAU,CAAC;QACnC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC;QACtC,IAAI,cAAc,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC;YAClC,IAAI,CAAC,SAAS,CAAC,IAAI,CACf,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,IAAI,EAAC,EAAE;gBAC5B,IAAI,CAAC,OAAO,CAAC,IAAqB,CAAC,CAAC;YAC1C,CAAC,CAAC,CACL,CAAC;QACN,CAAC;IACL,CAAC;IAEO,OAAO,CAAC,IAAY;QACxB,IAAI,IAAI,EAAE,CAAC;YACP,IAAI,OAAO,IAAI,KAAK,QAAQ,EAAE,CAAC;gBAC3B,MAAM,aAAa,GAAG,IAAI,aAAa,CAAC;oBACpC,cAAc,EAAE,IAAI,CAAC,UAAU,CAAC,cAAc;oBAC9C,YAAY,EAAE,IAAI,CAAC,UAAU,CAAC,YAAY;oBAC1C,gBAAgB,EAAE,IAAI,CAAC,UAAU,CAAC,gBAAgB;oBAClD,iBAAiB,EAAE,IAAI,CAAC,UAAU,CAAC,iBAAiB;oBACpD,QAAQ,EAAE,KAAK;oBACf,SAAS,EAAE,IAAI;oBACf,SAAS,EAAE,CAAC;oBACZ,KAAK,EAAE,SAAS;oBAChB,GAAG,EAAE,IAAI;iBACZ,CAAC,CAAC;gBAEH,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,aAAa,CAAC,MAAM,EAAE,CAAC,CAAC;YACzD,CAAC;iBAAM,CAAC;gBACJ,IAAI,CAAC,OAAO,CAAC,SAAS,GAAI,IAAY,CAAC,QAAQ,EAAE,CAAC;YACtD,CAAC;QACL,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,KAAK,EAAE,CAAC;QACjB,CAAC;IACL,CAAC;CACJ;AAED,MAAM,UAAU,mBAAmB,CAAC,UAAoC;IACpE,OAAO,IAAI,oBAAoB,CAAC,UAAU,CAAC,CAAC;AAChD,CAAC;AAED,MAAM,OAAO,uBAAwB,SAAQ,UAAU;IACnD,YAAY,UAAoC;QAC5C,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;IACzC,CAAC;IACD,IAAI,CAAiC;IACrC,cAAc,CAAW;IACzB,YAAY,CAAW;IACvB,gBAAgB,CAAW;IAC3B,iBAAiB,CAAW;IAC5B,QAAQ,CAAW;IACnB,SAAS,CAAW;CACvB;AAED,eAAe,CACX,uBAAuB,CAAC,SAAS,CAAC,WAAW,EAC7C,oBAAoB,CACvB,CAAC"}