@web-atoms/web-controls 2.5.64 → 2.6.3

package/dist-esm/tests/html-editor/HtmlEditorTest.js

@@ -0,0 +1,76 @@
+import { __decorate } from "tslib";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import AddImage from "../../html-editor/commands/AddImage.js";
+import AddLink from "../../html-editor/commands/AddLink.js";
+import Align from "../../html-editor/commands/Align.js";
+import Bold from "../../html-editor/commands/Bold.js";
+import ChangeColor from "../../html-editor/commands/ChangeColor.js";
+import ChangeFont from "../../html-editor/commands/ChangeFont.js";
+import ChangeFontSize from "../../html-editor/commands/ChangeFontSize.js";
+import Headings from "../../html-editor/commands/Headings.js";
+import HorizontalRule from "../../html-editor/commands/HorizontalRule.js";
+import IndentLess from "../../html-editor/commands/IndentLess.js";
+import IndentMore from "../../html-editor/commands/IndentMore.js";
+import Italic from "../../html-editor/commands/Italic.js";
+import NumberedList from "../../html-editor/commands/NumberedList.js";
+import RemoveFormat from "../../html-editor/commands/RemoveFormat.js";
+import Separator from "../../html-editor/commands/Separator.js";
+import Source from "../../html-editor/commands/Source.js";
+import StrikeThrough from "../../html-editor/commands/StrikeThrough.js";
+import Underline from "../../html-editor/commands/Underline.js";
+import Unlink from "../../html-editor/commands/Unlink.js";
+import UnorderedList from "../../html-editor/commands/UnorderedList.js";
+import AtomHtmlEditor, { Toolbar } from "../../html-editor/AtomHtmlEditor.js";
+import AttachFile from "../../html-editor/commands/AttachFile.js";
+const sample = `
+<div>
+    <p>Hi <span contenteditable="off" data-prompt="[Name]">[Name]</span></p>
+    <p>Link <a
+        contenteditable="off"
+        data-prompt="[Link]"
+        data-replace="textContent,href"
+        data-href-template="https://webatoms.in/[Link]">[Link]</a>
+    </a>
+</div>
+`;
+let HtmlEditorTest = class HtmlEditorTest extends AtomControl {
+    create() {
+        this.render(XNode.create("div", null,
+            XNode.create(AtomHtmlEditor, { eventDocumentCreated: (ce) => ce.detail.innerHTML = sample },
+                XNode.create(Toolbar, null,
+                    XNode.create(Bold, null),
+                    XNode.create(Italic, null),
+                    XNode.create(Underline, null),
+                    XNode.create(StrikeThrough, null),
+                    XNode.create(Align, null),
+                    XNode.create(Separator, null),
+                    XNode.create(Headings, null),
+                    XNode.create(ChangeColor, null),
+                    XNode.create(HorizontalRule, null),
+                    XNode.create(Separator, null),
+                    XNode.create(ChangeFont, null),
+                    XNode.create(ChangeFontSize, null),
+                    XNode.create(Separator, null),
+                    XNode.create(NumberedList, null),
+                    XNode.create(UnorderedList, null),
+                    XNode.create(IndentLess, null),
+                    XNode.create(IndentMore, null),
+                    XNode.create(Separator, null)),
+                XNode.create(Toolbar, null,
+                    XNode.create(AddImage, null),
+                    XNode.create(AttachFile, null),
+                    XNode.create(Separator, null),
+                    XNode.create(AddLink, null),
+                    XNode.create(Unlink, null),
+                    XNode.create(RemoveFormat, null),
+                    XNode.create(Separator, null),
+                    XNode.create(Source, null)))));
+    }
+};
+HtmlEditorTest = __decorate([
+    Pack
+], HtmlEditorTest);
+export default HtmlEditorTest;
+//# sourceMappingURL=HtmlEditorTest.js.map

package/dist-esm/tests/html-editor/HtmlEditorTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HtmlEditorTest.js","sourceRoot":"","sources":["../../../src/tests/html-editor/HtmlEditorTest.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,IAAI,MAAM,8BAA8B,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAC/E,OAAO,QAAQ,MAAM,wCAAwC,CAAC;AAC9D,OAAO,OAAO,MAAM,uCAAuC,CAAC;AAC5D,OAAO,KAAK,MAAM,qCAAqC,CAAC;AACxD,OAAO,IAAI,MAAM,oCAAoC,CAAC;AACtD,OAAO,WAAW,MAAM,2CAA2C,CAAC;AACpE,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,cAAc,MAAM,8CAA8C,CAAC;AAC1E,OAAO,QAAQ,MAAM,wCAAwC,CAAC;AAC9D,OAAO,cAAc,MAAM,8CAA8C,CAAC;AAC1E,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,YAAY,MAAM,4CAA4C,CAAC;AACtE,OAAO,YAAY,MAAM,4CAA4C,CAAC;AACtE,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAChE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,aAAa,MAAM,6CAA6C,CAAC;AACxE,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAChE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,aAAa,MAAM,6CAA6C,CAAC;AACxE,OAAO,cAAc,EAAE,EAAE,OAAO,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAElE,MAAM,MAAM,GAAG;;;;;;;;;;CAUd,CAAC;AAGa,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAW;IAEzC,MAAM;QACZ,IAAI,CAAC,MAAM,CAAC;YACR,aAAC,cAAc,IAAC,oBAAoB,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,MAAM,CAAC,SAAS,GAAG,MAAM;gBACtE,aAAC,OAAO;oBACJ,aAAC,IAAI,OAAE;oBACP,aAAC,MAAM,OAAE;oBACT,aAAC,SAAS,OAAE;oBACZ,aAAC,aAAa,OAAE;oBAChB,aAAC,KAAK,OAAE;oBACR,aAAC,SAAS,OAAE;oBACZ,aAAC,QAAQ,OAAE;oBACX,aAAC,WAAW,OAAE;oBACd,aAAC,cAAc,OAAE;oBACjB,aAAC,SAAS,OAAE;oBACZ,aAAC,UAAU,OAAE;oBACb,aAAC,cAAc,OAAE;oBACjB,aAAC,SAAS,OAAE;oBACZ,aAAC,YAAY,OAAE;oBACf,aAAC,aAAa,OAAE;oBAChB,aAAC,UAAU,OAAE;oBACb,aAAC,UAAU,OAAE;oBACb,aAAC,SAAS,OAAE,CACN;gBACV,aAAC,OAAO;oBACJ,aAAC,QAAQ,OAAE;oBACX,aAAC,UAAU,OAAE;oBACb,aAAC,SAAS,OAAE;oBACZ,aAAC,OAAO,OAAE;oBACV,aAAC,MAAM,OAAE;oBACT,aAAC,YAAY,OAAE;oBACf,aAAC,SAAS,OAAE;oBACZ,aAAC,MAAM,OAAE,CACH,CACG,CACf,CAAC,CAAC;IACZ,CAAC;CACJ,CAAA;AAtCoB,cAAc;IADlC,IAAI;GACgB,cAAc,CAsClC;eAtCoB,cAAc"}

package/dist-esm/tests/html-editor/InlineHtmlEdiorTest.d.ts

@@ -0,0 +1,5 @@
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+export default class InlineHtmlEditorTest extends AtomControl {
+    protected create(): void;
+}
+//# sourceMappingURL=InlineHtmlEdiorTest.d.ts.map

package/dist-esm/tests/html-editor/InlineHtmlEdiorTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineHtmlEdiorTest.d.ts","sourceRoot":"","sources":["../../../src/tests/html-editor/InlineHtmlEdiorTest.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAuC/E,MAAM,CAAC,OAAO,OAAO,oBAAqB,SAAQ,WAAW;IAEzD,SAAS,CAAC,MAAM,IAAI,IAAI;CA0C3B"}

package/dist-esm/tests/html-editor/InlineHtmlEdiorTest.js

@@ -0,0 +1,78 @@
+import { __decorate } from "tslib";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import AddLink from "../../html-editor/commands/AddLink.js";
+import Align from "../../html-editor/commands/Align.js";
+import Bold from "../../html-editor/commands/Bold.js";
+import ChangeColor from "../../html-editor/commands/ChangeColor.js";
+import ChangeFont from "../../html-editor/commands/ChangeFont.js";
+import ChangeFontSize from "../../html-editor/commands/ChangeFontSize.js";
+import Headings from "../../html-editor/commands/Headings.js";
+import HorizontalRule from "../../html-editor/commands/HorizontalRule.js";
+import IndentLess from "../../html-editor/commands/IndentLess.js";
+import IndentMore from "../../html-editor/commands/IndentMore.js";
+import Italic from "../../html-editor/commands/Italic.js";
+import NumberedList from "../../html-editor/commands/NumberedList.js";
+import RemoveFormat from "../../html-editor/commands/RemoveFormat.js";
+import Separator from "../../html-editor/commands/Separator.js";
+import Source from "../../html-editor/commands/Source.js";
+import StrikeThrough from "../../html-editor/commands/StrikeThrough.js";
+import Underline from "../../html-editor/commands/Underline.js";
+import Unlink from "../../html-editor/commands/Unlink.js";
+import UnorderedList from "../../html-editor/commands/UnorderedList.js";
+import { Toolbar } from "../../html-editor/AtomHtmlEditor.js";
+import AttachFile from "../../html-editor/commands/AttachFile.js";
+import InlineHtmlEditor from "../../html-editor/InlineHtmlEditor.js";
+import AttachImage from "../../html-editor/commands/AttachImage.js";
+const sample = `
+<div>
+    <p>Hi <span contenteditable="off" data-prompt="[Name]">[Name]</span></p>
+    <p>Link <a
+        contenteditable="off"
+        data-prompt="[Link]"
+        data-replace="textContent,href"
+        data-href-template="https://webatoms.in/[Link]">[Link]</a>
+    </a>
+</div>
+`;
+let InlineHtmlEditorTest = class InlineHtmlEditorTest extends AtomControl {
+    create() {
+        const toolbar = () => XNode.create("div", null,
+            XNode.create(Toolbar, null,
+                XNode.create(Bold, null),
+                XNode.create(Italic, null),
+                XNode.create(Underline, null),
+                XNode.create(StrikeThrough, null),
+                XNode.create(Align, null),
+                XNode.create(Separator, null),
+                XNode.create(Headings, null),
+                XNode.create(ChangeColor, null),
+                XNode.create(HorizontalRule, null),
+                XNode.create(Separator, null),
+                XNode.create(ChangeFont, null),
+                XNode.create(ChangeFontSize, null),
+                XNode.create(Separator, null),
+                XNode.create(NumberedList, null),
+                XNode.create(UnorderedList, null),
+                XNode.create(IndentLess, null),
+                XNode.create(IndentMore, null),
+                XNode.create(Separator, null)),
+            XNode.create(Toolbar, null,
+                XNode.create(AttachImage, null),
+                XNode.create(AttachFile, null),
+                XNode.create(Separator, null),
+                XNode.create(AddLink, null),
+                XNode.create(Unlink, null),
+                XNode.create(RemoveFormat, null),
+                XNode.create(Separator, null),
+                XNode.create(Source, null)));
+        this.render(XNode.create("div", null,
+            XNode.create(InlineHtmlEditor, { content: sample, toolbar: toolbar })));
+    }
+};
+InlineHtmlEditorTest = __decorate([
+    Pack
+], InlineHtmlEditorTest);
+export default InlineHtmlEditorTest;
+//# sourceMappingURL=InlineHtmlEdiorTest.js.map

package/dist-esm/tests/html-editor/InlineHtmlEdiorTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineHtmlEdiorTest.js","sourceRoot":"","sources":["../../../src/tests/html-editor/InlineHtmlEdiorTest.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,IAAI,MAAM,8BAA8B,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAE/E,OAAO,OAAO,MAAM,uCAAuC,CAAC;AAC5D,OAAO,KAAK,MAAM,qCAAqC,CAAC;AACxD,OAAO,IAAI,MAAM,oCAAoC,CAAC;AACtD,OAAO,WAAW,MAAM,2CAA2C,CAAC;AACpE,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,cAAc,MAAM,8CAA8C,CAAC;AAC1E,OAAO,QAAQ,MAAM,wCAAwC,CAAC;AAC9D,OAAO,cAAc,MAAM,8CAA8C,CAAC;AAC1E,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,YAAY,MAAM,4CAA4C,CAAC;AACtE,OAAO,YAAY,MAAM,4CAA4C,CAAC;AACtE,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAChE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,aAAa,MAAM,6CAA6C,CAAC;AACxE,OAAO,SAAS,MAAM,yCAAyC,CAAC;AAChE,OAAO,MAAM,MAAM,sCAAsC,CAAC;AAC1D,OAAO,aAAa,MAAM,6CAA6C,CAAC;AACxE,OAAuB,EAAE,OAAO,EAAE,MAAM,qCAAqC,CAAC;AAC9E,OAAO,UAAU,MAAM,0CAA0C,CAAC;AAClE,OAAO,gBAAgB,MAAM,uCAAuC,CAAC;AACrE,OAAO,WAAW,MAAM,2CAA2C,CAAC;AAEpE,MAAM,MAAM,GAAG;;;;;;;;;;CAUd,CAAC;AAGa,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,WAAW;IAE/C,MAAM;QAEZ,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC;YAClB,aAAC,OAAO;gBACJ,aAAC,IAAI,OAAE;gBACP,aAAC,MAAM,OAAE;gBACT,aAAC,SAAS,OAAE;gBACZ,aAAC,aAAa,OAAE;gBAChB,aAAC,KAAK,OAAE;gBACR,aAAC,SAAS,OAAE;gBACZ,aAAC,QAAQ,OAAE;gBACX,aAAC,WAAW,OAAE;gBACd,aAAC,cAAc,OAAE;gBACjB,aAAC,SAAS,OAAE;gBACZ,aAAC,UAAU,OAAE;gBACb,aAAC,cAAc,OAAE;gBACjB,aAAC,SAAS,OAAE;gBACZ,aAAC,YAAY,OAAE;gBACf,aAAC,aAAa,OAAE;gBAChB,aAAC,UAAU,OAAE;gBACb,aAAC,UAAU,OAAE;gBACb,aAAC,SAAS,OAAE,CACN;YACV,aAAC,OAAO;gBACJ,aAAC,WAAW,OAAE;gBACd,aAAC,UAAU,OAAE;gBACb,aAAC,SAAS,OAAE;gBACZ,aAAC,OAAO,OAAE;gBACV,aAAC,MAAM,OAAE;gBACT,aAAC,YAAY,OAAE;gBACf,aAAC,SAAS,OAAE;gBACZ,aAAC,MAAM,OAAE,CACH,CACR,CAAC;QAEP,IAAI,CAAC,MAAM,CAAC;YACR,aAAC,gBAAgB,IACb,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,OAAO,GACD,CACjB,CAAC,CAAC;IACZ,CAAC;CACJ,CAAA;AA5CoB,oBAAoB;IADxC,IAAI;GACgB,oBAAoB,CA4CxC;eA5CoB,oBAAoB"}

package/dist-esm/tests/mask/MaskedInputTest.d.ts

@@ -0,0 +1,6 @@
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+export default class MaskedInputTest extends AtomControl {
+    phone: string;
+    protected create(): void;
+}
+//# sourceMappingURL=MaskedInputTest.d.ts.map

package/dist-esm/tests/mask/MaskedInputTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInputTest.d.ts","sourceRoot":"","sources":["../../../src/tests/mask/MaskedInputTest.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAI/E,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,WAAW;IAE7C,KAAK,EAAE,MAAM,CAAC;IAErB,SAAS,CAAC,MAAM,IAAI,IAAI;CAY3B"}

package/dist-esm/tests/mask/MaskedInputTest.js

@@ -0,0 +1,20 @@
+import { __decorate } from "tslib";
+import Bind from "@web-atoms/core/dist/core/Bind.js";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import MaskedInput from "../../basic/MaskedInput.js";
+let MaskedInputTest = class MaskedInputTest extends AtomControl {
+    create() {
+        this.phone = "";
+        this.render(XNode.create("div", null,
+            XNode.create(MaskedInput, { mask: "###.###.####", value: Bind.twoWaysImmediate(() => this.phone) }),
+            XNode.create("br", null),
+            XNode.create("div", { text: Bind.oneWay(() => this.phone) })));
+    }
+};
+MaskedInputTest = __decorate([
+    Pack
+], MaskedInputTest);
+export default MaskedInputTest;
+//# sourceMappingURL=MaskedInputTest.js.map

package/dist-esm/tests/mask/MaskedInputTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaskedInputTest.js","sourceRoot":"","sources":["../../../src/tests/mask/MaskedInputTest.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,mCAAmC,CAAC;AACrD,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,IAAI,MAAM,8BAA8B,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAC/E,OAAO,WAAW,MAAM,4BAA4B,CAAC;AAGtC,IAAM,eAAe,GAArB,MAAM,eAAgB,SAAQ,WAAW;IAI1C,MAAM;QACZ,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;QAChB,IAAI,CAAC,MAAM,CAAC;YACR,aAAC,WAAW,IACR,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,IAAI,CAAC,gBAAgB,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,GAC5C;YACN,wBAAK;YACL,sBAAK,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CACzC,CAAC,CAAC;IACZ,CAAC;CAEJ,CAAA;AAhBoB,eAAe;IADnC,IAAI;GACgB,eAAe,CAgBnC;eAhBoB,eAAe"}

package/dist-esm/tests/mobile-app/DesktopAppTest.d.ts

@@ -0,0 +1,5 @@
+import MobileDesktopApp from "../../desktop-app/MobileDesktopApp.js";
+export default class DesktopAppTest extends MobileDesktopApp {
+    init(): Promise<void>;
+}
+//# sourceMappingURL=DesktopAppTest.d.ts.map

package/dist-esm/tests/mobile-app/DesktopAppTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DesktopAppTest.d.ts","sourceRoot":"","sources":["../../../src/tests/mobile-app/DesktopAppTest.tsx"],"names":[],"mappings":"AAIA,OAAO,gBAAgB,MAAM,uCAAuC,CAAC;AAGrE,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,gBAAgB;IAElD,IAAI;CAKb"}

package/dist-esm/tests/mobile-app/DesktopAppTest.js

@@ -0,0 +1,16 @@
+import { __decorate } from "tslib";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { DrawerMenu, Home } from "./MobileAppTest.js";
+import PageNavigator from "../../PageNavigator.js";
+import MobileDesktopApp from "../../desktop-app/MobileDesktopApp.js";
+let DesktopAppTest = class DesktopAppTest extends MobileDesktopApp {
+    async init() {
+        this.drawerMenu = DrawerMenu;
+        PageNavigator.openPage(Home, { title: "Home" });
+    }
+};
+DesktopAppTest = __decorate([
+    Pack
+], DesktopAppTest);
+export default DesktopAppTest;
+//# sourceMappingURL=DesktopAppTest.js.map

package/dist-esm/tests/mobile-app/DesktopAppTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DesktopAppTest.js","sourceRoot":"","sources":["../../../src/tests/mobile-app/DesktopAppTest.tsx"],"names":[],"mappings":";AACA,OAAO,IAAI,MAAM,8BAA8B,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,aAAa,MAAM,wBAAwB,CAAC;AACnD,OAAO,gBAAgB,MAAM,uCAAuC,CAAC;AAGtD,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,gBAAgB;IAExD,KAAK,CAAC,IAAI;QACN,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC;QAC7B,aAAa,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAAC;IACpD,CAAC;CAEJ,CAAA;AAPoB,cAAc;IADlC,IAAI;GACgB,cAAc,CAOlC;eAPoB,cAAc"}

package/dist-esm/tests/mobile-app/MobileAppTest.d.ts

@@ -0,0 +1,12 @@
+import MobileApp, { ContentPage, Drawer } from "../../mobile-app/MobileApp.js";
+export declare class DrawerMenu extends Drawer {
+    protected create(): void;
+    protected openList(): void;
+}
+export declare class Home extends ContentPage {
+    protected create(): void;
+}
+export default class MobileAppTest extends MobileApp {
+    protected create(): void;
+}
+//# sourceMappingURL=MobileAppTest.d.ts.map

package/dist-esm/tests/mobile-app/MobileAppTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileAppTest.d.ts","sourceRoot":"","sources":["../../../src/tests/mobile-app/MobileAppTest.tsx"],"names":[],"mappings":"AAMA,OAAO,SAAS,EAAE,EAAE,WAAW,EAAE,MAAM,EAAkB,MAAM,+BAA+B,CAAC;AA+B/F,qBAAa,UAAW,SAAQ,MAAM;IAElC,SAAS,CAAC,MAAM,IAAI,IAAI;IAOxB,SAAS,CAAC,QAAQ;CAIrB;AAED,qBAAa,IAAK,SAAQ,WAAW;IAEjC,SAAS,CAAC,MAAM,IAAI,IAAI;CAc3B;AAeD,MAAM,CAAC,OAAO,OAAO,aAAc,SAAQ,SAAS;IAEhD,SAAS,CAAC,MAAM,IAAI,IAAI;CAW3B"}

package/dist-esm/tests/mobile-app/MobileAppTest.js

@@ -0,0 +1,74 @@
+import { __decorate } from "tslib";
+import sleep from "@web-atoms/core/dist/core/sleep.js";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { MenuItem } from "../../basic/PopupButton.js";
+import BottomPopup from "../../mobile-app/BottomPopup.js";
+import MobileApp, { ContentPage, Drawer, PullToRefresh } from "../../mobile-app/MobileApp.js";
+import PageNavigator from "../../PageNavigator.js";
+class Detail extends ContentPage {
+    create() {
+        this.render(XNode.create("div", null, "This is the detail page"));
+    }
+}
+class List extends ContentPage {
+    create() {
+        this.pullToRefreshRenderer = PullToRefresh;
+        const items = [];
+        for (let index = 0; index < 100; index++) {
+            items.push(XNode.create("div", { "event-click": () => this.openDetail() },
+                "Line Item ",
+                index.toString()));
+        }
+        this.render(XNode.create("div", null,
+            "A big list page...",
+            XNode.create("button", { "event-click": () => this.openDetail() }, "Open Detail"),
+            ...items));
+    }
+    openDetail() {
+        void PageNavigator.openPage(Detail, { title: "Detail" });
+    }
+}
+export class DrawerMenu extends Drawer {
+    create() {
+        this.render(XNode.create("div", null,
+            XNode.create("header", null, "Some Icon"),
+            XNode.create("button", { "event-click": () => this.openList() }, "List")));
+    }
+    openList() {
+        void PageNavigator.openPage(List, { title: "List" });
+    }
+}
+export class Home extends ContentPage {
+    create() {
+        this.actionRenderer = () => XNode.create("i", { class: "fad fa-search", "event-click": () => PopupMenu.show() });
+        this.pullToRefreshRenderer = PullToRefresh;
+        this.title = "App";
+        this.render(XNode.create("div", null, "Home"));
+        this.bindEvent(this.element, "reloadPage", () => sleep(2000));
+    }
+}
+class PopupMenu extends BottomPopup {
+    create() {
+        this.titleRenderer = () => XNode.create("span", { text: "Choose" });
+        this.closeRenderer = () => XNode.create("i", { class: "fas fa-times" });
+        this.render(XNode.create("div", null,
+            XNode.create(MenuItem, { label: "One" }),
+            XNode.create(MenuItem, { label: "Two" })));
+    }
+}
+let MobileAppTest = class MobileAppTest extends MobileApp {
+    create() {
+        this.drawer = DrawerMenu;
+        PageNavigator.openPage(Home, { title: "Home" });
+        this.app.runAsync(async () => {
+            await sleep(1);
+            PageNavigator.pushPage(Detail);
+        });
+    }
+};
+MobileAppTest = __decorate([
+    Pack
+], MobileAppTest);
+export default MobileAppTest;
+//# sourceMappingURL=MobileAppTest.js.map

package/dist-esm/tests/mobile-app/MobileAppTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MobileAppTest.js","sourceRoot":"","sources":["../../../src/tests/mobile-app/MobileAppTest.tsx"],"names":[],"mappings":"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"}

package/dist-esm/tests/pop-over/PopOverTest.d.ts

@@ -0,0 +1,6 @@
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+export default class PopOverTest extends AtomControl {
+    constructor(app: any, e: any);
+    init(): void;
+}
+//# sourceMappingURL=PopOverTest.d.ts.map

package/dist-esm/tests/pop-over/PopOverTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopOverTest.d.ts","sourceRoot":"","sources":["../../../src/tests/pop-over/PopOverTest.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAK/E,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,WAAW;gBAEpC,GAAG,KAAA,EAAE,CAAC,KAAA;IAKlB,IAAI;CAmFP"}

package/dist-esm/tests/pop-over/PopOverTest.js

@@ -0,0 +1,82 @@
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import { MenuItem } from "../../basic/PopupButton.js";
+import PopupMenu from "../../basic/PopupMenu.js";
+export default class PopOverTest extends AtomControl {
+    constructor(app, e) {
+        super(app, e);
+        this.pushInit();
+    }
+    init() {
+        this.renderer = XNode.create("div", null,
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("div", { style: "position: relative" },
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create(PopupMenu, { "anchor-left": "parent-right", popup: () => XNode.create("div", null,
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" }),
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" }),
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" }),
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" }),
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" }),
+                        XNode.create(MenuItem, { label: "As Inline" }),
+                        XNode.create(MenuItem, { label: "As Attachment" })) }, "Forward"),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null),
+                XNode.create("br", null)),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null),
+            XNode.create("br", null));
+    }
+}
+//# sourceMappingURL=PopOverTest.js.map

package/dist-esm/tests/pop-over/PopOverTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopOverTest.js","sourceRoot":"","sources":["../../../src/tests/pop-over/PopOverTest.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAE/E,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,SAAS,MAAM,0BAA0B,CAAC;AAEjD,MAAM,CAAC,OAAO,OAAO,WAAY,SAAQ,WAAW;IAEhD,YAAY,GAAG,EAAE,CAAC;QACd,KAAK,CAAC,GAAG,EAAC,CAAC,CAAC,CAAC;QACb,IAAI,CAAC,QAAQ,EAAE,CAAC;IACpB,CAAC;IAED,IAAI;QACA,IAAI,CAAC,QAAQ,GAAG;YAEZ,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,sBAAK,KAAK,EAAC,oBAAoB;gBAC3B,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBAEL,aAAC,SAAS,mBACM,cAAc,EAC1B,KAAK,EAAE,GAAG,EAAE,CAAC;wBACT,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE;wBACjC,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE;wBACjC,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE;wBACjC,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE;wBACjC,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE;wBACjC,aAAC,QAAQ,IAAC,KAAK,EAAC,WAAW,GAAE;wBAC7B,aAAC,QAAQ,IAAC,KAAK,EAAC,eAAe,GAAE,CAC/B,cACc;gBAC5B,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK;gBACL,wBAAK,CAEC;YACN,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK;YACL,wBAAK,CAEH,CAAC;IACX,CAAC;CAGJ"}

package/dist-esm/tests/switch/SwitchTest.d.ts

@@ -0,0 +1,6 @@
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+export default class SwitchTest extends AtomControl {
+    ready: boolean;
+    create(): void;
+}
+//# sourceMappingURL=SwitchTest.d.ts.map

package/dist-esm/tests/switch/SwitchTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchTest.d.ts","sourceRoot":"","sources":["../../../src/tests/switch/SwitchTest.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAG/E,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,WAAW;IAExC,KAAK,EAAE,OAAO,CAAC;IAEf,MAAM;CAYhB"}

package/dist-esm/tests/switch/SwitchTest.js

@@ -0,0 +1,13 @@
+import Bind from "@web-atoms/core/dist/core/Bind.js";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import Switch from "../../basic/Switch.js";
+export default class SwitchTest extends AtomControl {
+    create() {
+        this.ready = false;
+        this.render(XNode.create("div", null,
+            XNode.create(Switch, { checked: Bind.twoWays(() => this.ready) }),
+            XNode.create("span", { text: Bind.oneWay(() => this.ready ? "On" : "Off") })));
+    }
+}
+//# sourceMappingURL=SwitchTest.js.map

package/dist-esm/tests/switch/SwitchTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchTest.js","sourceRoot":"","sources":["../../../src/tests/switch/SwitchTest.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,mCAAmC,CAAC;AACrD,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAC/E,OAAO,MAAM,MAAM,uBAAuB,CAAC;AAE3C,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,WAAW;IAIxC,MAAM;QAET,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QAEnB,IAAI,CAAC,MAAM,CAAC;YACR,aAAC,MAAM,IACH,OAAO,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,GACrC;YACN,uBAAM,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CACzD,CAAC,CAAC;IACZ,CAAC;CAEJ"}

package/dist-esm/tests/toggle-view/ToggleViewTest.d.ts

@@ -0,0 +1,6 @@
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import "./ToggleView.local.css";
+export default class ToggleViewTest extends AtomControl {
+    protected create(): void;
+}
+//# sourceMappingURL=ToggleViewTest.d.ts.map

package/dist-esm/tests/toggle-view/ToggleViewTest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleViewTest.d.ts","sourceRoot":"","sources":["../../../src/tests/toggle-view/ToggleViewTest.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAE/E,OAAO,wBAAwB,CAAC;AAKhC,MAAM,CAAC,OAAO,OAAO,cAAe,SAAQ,WAAW;IAEnD,SAAS,CAAC,MAAM,IAAI,IAAI;CA8B3B"}

package/dist-esm/tests/toggle-view/ToggleViewTest.js

@@ -0,0 +1,30 @@
+import { __decorate } from "tslib";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import Pack from "@web-atoms/core/dist/Pack.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import AtomToggleView, { ToggleView } from "../../toggle-view/AtomToggleView.js";
+import "./ToggleView.local.css";
+const css = "toggle-view-test";
+let ToggleViewTest = class ToggleViewTest extends AtomControl {
+    create() {
+        this.render(XNode.create("div", { class: css },
+            XNode.create(AtomToggleView, null,
+                XNode.create(ToggleView, { icon: "fad fa-plus", label: "First" },
+                    XNode.create("div", null,
+                        XNode.create("h3", null, "First View"),
+                        XNode.create("div", null, "First View Content"))),
+                XNode.create(ToggleView, { label: "Second" },
+                    XNode.create("div", null,
+                        XNode.create("h3", null, "Second View"),
+                        XNode.create("div", null, "Second View Content"))),
+                XNode.create(ToggleView, { label: "Third" },
+                    XNode.create("div", null,
+                        XNode.create("h3", null, "Third View"),
+                        XNode.create("div", null, "Third View Content"))))));
+    }
+};
+ToggleViewTest = __decorate([
+    Pack
+], ToggleViewTest);
+export default ToggleViewTest;
+//# sourceMappingURL=ToggleViewTest.js.map

package/dist-esm/tests/toggle-view/ToggleViewTest.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleViewTest.js","sourceRoot":"","sources":["../../../src/tests/toggle-view/ToggleViewTest.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,oCAAoC,CAAC;AACvD,OAAO,IAAI,MAAM,8BAA8B,CAAC;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAC;AAC/E,OAAO,cAAc,EAAE,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AACjF,OAAO,wBAAwB,CAAC;AAEhC,MAAM,GAAG,GAAG,kBAAkB,CAAC;AAGhB,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,WAAW;IAEzC,MAAM;QACZ,IAAI,CAAC,MAAM,CAAC,sBAAK,KAAK,EAAE,GAAG;YACvB,aAAC,cAAc;gBACX,aAAC,UAAU,IAAC,IAAI,EAAC,aAAa,EAAC,KAAK,EAAC,OAAO;oBACxC;wBACI,sCAAmB;wBACnB,+CAEM,CACJ,CACG;gBACb,aAAC,UAAU,IAAC,KAAK,EAAC,QAAQ;oBACtB;wBACI,uCAAoB;wBACpB,gDAEM,CACJ,CACG;gBACb,aAAC,UAAU,IAAC,KAAK,EAAC,OAAO;oBACrB;wBACI,sCAAmB;wBACnB,+CAEM,CACJ,CACG,CACA,CACf,CAAC,CAAC;IACZ,CAAC;CACJ,CAAA;AAhCoB,cAAc;IADlC,IAAI;GACgB,cAAc,CAgClC;eAhCoB,cAAc"}

package/dist-esm/toggle-view/AtomToggleView.d.ts

@@ -0,0 +1,13 @@
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import "../basic/styles/toggle-view.global.css";
+import IElement from "../basic/IElement.js";
+export interface IToggleView {
+    label?: string;
+    icon?: string;
+}
+export declare function ToggleView({ icon, label }: IToggleView, ...nodes: XNode[]): any;
+export interface IAtomToggleView extends IElement {
+    selectedIndex?: number;
+}
+export default function AtomToggleView({ selectedIndex, ...a }: IAtomToggleView, ...nodes: XNode[]): any;
+//# sourceMappingURL=AtomToggleView.d.ts.map

package/dist-esm/toggle-view/AtomToggleView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AtomToggleView.d.ts","sourceRoot":"","sources":["../../src/toggle-view/AtomToggleView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,oCAAoC,CAAC;AAGvD,OAAO,wCAAwC,CAAC;AAChD,OAAO,QAAQ,MAAM,sBAAsB,CAAC;AAI5C,MAAM,WAAW,WAAW;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,UAAU,CACtB,EACI,IAAI,EACJ,KAAK,EACR,EAAE,WAAW,EACd,GAAI,KAAK,EAAE,KAAK,EAAE,OAUrB;AAED,MAAM,WAAW,eAAgB,SAAQ,QAAQ;IAC7C,aAAa,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAE,EAAE,aAAa,EAAE,GAAI,CAAC,EAAE,EAAE,eAAe,EAAE,GAAI,KAAK,EAAE,KAAK,EAAE,OA4EpG"}

package/dist-esm/toggle-view/AtomToggleView.js

@@ -0,0 +1,81 @@
+import { __decorate, __metadata } from "tslib";
+import { BindableProperty } from "@web-atoms/core/dist/core/BindableProperty.js";
+import XNode from "@web-atoms/core/dist/core/XNode.js";
+import { AtomControl } from "@web-atoms/core/dist/web/controls/AtomControl.js";
+import "../basic/styles/toggle-view.global.css";
+import Action from "@web-atoms/core/dist/view-model/Action.js";
+export function ToggleView({ icon, label }, ...nodes) {
+    return XNode.create("div", null,
+        XNode.create("div", null,
+            XNode.create("i", { class: icon }),
+            XNode.create("label", { text: label })),
+        XNode.create("div", null, ...nodes));
+}
+export default function AtomToggleView({ selectedIndex, ...a }, ...nodes) {
+    const headers = [];
+    const views = [];
+    let n = 0;
+    for (const iterator of nodes) {
+        const i = n++;
+        const header = iterator.children[0];
+        const ha = (header.attributes ??= {});
+        ha["data-element"] = "header";
+        ha["data-click-event"] = "header-click";
+        ha["data-header-index"] = i.toString();
+        const view = iterator.children[1];
+        const a = (view.attributes ??= {});
+        a["data-element"] = "view";
+        a["data-left"] = i < selectedIndex;
+        a["data-right"] = i > selectedIndex;
+        a["data-selected"] = i === selectedIndex;
+        headers.push(header);
+        views.push(view);
+    }
+    class AtomToggleViewControl extends AtomControl {
+        onPropertyChanged(name) {
+            super.onPropertyChanged(name);
+            if (name === "selectedIndex") {
+                this.updateViews();
+            }
+        }
+        preCreate() {
+            this.selectedIndex = 0;
+            this.runAfterInit(() => this.updateViews());
+        }
+        onHeaderClick({ headerIndex }) {
+            this.selectedIndex = parseInt(headerIndex, 0);
+        }
+        updateViews() {
+            const pe = this.element.parentElement;
+            if (!pe) {
+                return;
+            }
+            let ai = 0;
+            for (const child of Array.from(pe.querySelectorAll(`[data-element="view"]`))) {
+                const i = ai++;
+                child.setAttribute("data-left", (i < this.selectedIndex).toString());
+                child.setAttribute("data-right", (i > this.selectedIndex).toString());
+                child.setAttribute("data-selected", (i === this.selectedIndex).toString());
+            }
+            ai = 0;
+            for (const child of Array.from(pe.querySelectorAll(`[data-element="header"]`))) {
+                const i = ai++;
+                child.setAttribute("data-selected", (i === this.selectedIndex).toString());
+            }
+        }
+    }
+    __decorate([
+        BindableProperty,
+        __metadata("design:type", Number)
+    ], AtomToggleViewControl.prototype, "selectedIndex", void 0);
+    __decorate([
+        Action({ onEvent: "header-click" }),
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", void 0)
+    ], AtomToggleViewControl.prototype, "onHeaderClick", null);
+    return XNode.create("div", { ...a, "data-wa-toggle-view": "wa-toggle-view" },
+        XNode.create(AtomToggleViewControl, { class: "toolbar" }, ...headers),
+        ...views);
+}
+//# sourceMappingURL=AtomToggleView.js.map