@hypericon/mico 0.4.2 → 0.5.1

package/dist/esm/components/markdown/index.js

@@ -1 +1,17 @@
-export * from "./Markdown";
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Markdown"), exports);

package/dist/esm/components/markdown-editor/MarkdownEditor.js

@@ -1,11 +1,37 @@
-import m, { redraw } from "mithril";
-import { Icon } from "../icon/Icon";
-import { Markdown } from "../markdown/Markdown";
-import { MenuButton, menuMgr } from "../menu";
-import { MarkdownEditorState } from "./markdown-editor.state";
-export const MarkdownEditor = {
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MarkdownEditor = void 0;
+const mithril_1 = __importStar(require("mithril"));
+const Icon_1 = require("../icon/Icon");
+const Markdown_1 = require("../markdown/Markdown");
+const menu_1 = require("../menu");
+const markdown_editor_state_1 = require("./markdown-editor.state");
+exports.MarkdownEditor = {
     oninit({ attrs }) {
-        this.state = new MarkdownEditorState(attrs.onEdit);
+        this.state = new markdown_editor_state_1.MarkdownEditorState(attrs.onEdit);
     },
     onremove() {
         this.state.destroy();
@@ -27,94 +53,94 @@ export const MarkdownEditor = {
             this.state.editValue = attrs.onEdit;
             this.state.setSelection(0, 0);
             setTimeout(() => {
-                redraw();
+                (0, mithril_1.redraw)();
             }, 1);
         }
         if (this.state.requestSelection && this.state.editorEl) {
             this.state.editorEl.setSelectionRange(this.state.requestSelection.start, this.state.requestSelection.end);
             this.state.requestSelection = undefined;
-            redraw();
+            (0, mithril_1.redraw)();
         }
         this.state.isEditingPrevious = this.state.isEditing;
     },
     view({ attrs }) {
-        return m(".mico-markdown-editor", {
+        return (0, mithril_1.default)(".mico-markdown-editor", {
             class: attrs.class,
             style: attrs.style,
         }, [
             (!this.state.isEditing) ? [
-                m(".render-container", {
+                (0, mithril_1.default)(".render-container", {
                     tabindex: 0,
                     onclick: () => {
                         this.state.isEditing = true;
                     },
                 }, [
-                    m(Markdown, {
+                    (0, mithril_1.default)(Markdown_1.Markdown, {
                         highlight: attrs.highlight,
                         markdown: attrs.markdown,
                     }),
                 ]),
             ] : [
-                m(".editor-container", [
+                (0, mithril_1.default)(".editor-container", [
                     // Editor buttons
-                    m(".editor-buttons", [
-                        m(".editor-button-group", [
-                            m("button", {
+                    (0, mithril_1.default)(".editor-buttons", [
+                        (0, mithril_1.default)(".editor-button-group", [
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+H",
                                 onclick: () => this.state.applyHeading(),
-                            }, m(Icon, { fas: "heading" })),
-                            m("button", {
-                                onclick: (ev) => menuMgr.show(ev, [
-                                    m(MenuButton, { label: "Heading 1", onclick: () => this.state.applyHeading(1) }),
-                                    m(MenuButton, { label: "Heading 2", onclick: () => this.state.applyHeading(2) }),
-                                    m(MenuButton, { label: "Heading 3", onclick: () => this.state.applyHeading(3) }),
-                                    m(MenuButton, { label: "Heading 4", onclick: () => this.state.applyHeading(4) }),
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "heading" })),
+                            (0, mithril_1.default)("button", {
+                                onclick: (ev) => menu_1.menuMgr.show(ev, [
+                                    (0, mithril_1.default)(menu_1.MenuButton, { label: "Heading 1", onclick: () => this.state.applyHeading(1) }),
+                                    (0, mithril_1.default)(menu_1.MenuButton, { label: "Heading 2", onclick: () => this.state.applyHeading(2) }),
+                                    (0, mithril_1.default)(menu_1.MenuButton, { label: "Heading 3", onclick: () => this.state.applyHeading(3) }),
+                                    (0, mithril_1.default)(menu_1.MenuButton, { label: "Heading 4", onclick: () => this.state.applyHeading(4) }),
                                 ], {
                                     noFlipH: true,
                                     noFlipV: true,
                                 }),
-                            }, m(Icon, { fas: "caret-down" })),
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "caret-down" })),
                         ]),
-                        m(".editor-button-group", [
-                            m("button", {
+                        (0, mithril_1.default)(".editor-button-group", [
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+B",
                                 onclick: () => this.state.applyBold(),
-                            }, m(Icon, { fas: "bold" })),
-                            m("button", {
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "bold" })),
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+I",
                                 onclick: () => this.state.applyItalic(),
-                            }, m(Icon, { fas: "italic" })),
-                            m("button", {
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "italic" })),
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+C",
                                 onclick: () => this.state.applyCode(),
-                            }, m(Icon, { fas: "code" })),
-                            m("button", {
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "code" })),
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+S",
                                 onclick: () => this.state.applyStrikethrough(),
-                            }, m(Icon, { fas: "strikethrough" })),
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "strikethrough" })),
                         ]),
-                        m(".editor-button-group", [
-                            m("button", {
+                        (0, mithril_1.default)(".editor-button-group", [
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+U",
                                 onclick: () => this.state.applyUnorderedList(),
-                            }, m(Icon, { fas: "list-ul" })),
-                            m("button", {
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "list-ul" })),
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+O",
                                 onclick: () => this.state.applyOrderedList(),
-                            }, m(Icon, { fas: "list-ol" })),
-                            m("button", {
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "list-ol" })),
+                            (0, mithril_1.default)("button", {
                                 title: "Ctrl+Shift+L",
                                 onclick: () => this.state.applyLink(),
-                            }, m(Icon, { fas: "link" })),
+                            }, (0, mithril_1.default)(Icon_1.Icon, { fas: "link" })),
                         ]),
-                        attrs.onHelp !== undefined ? m(".editor-button-group", [
-                            m("button", {
+                        attrs.onHelp !== undefined ? (0, mithril_1.default)(".editor-button-group", [
+                            (0, mithril_1.default)("button", {
                                 onclick: () => { var _a; return (_a = attrs.onHelp) === null || _a === void 0 ? void 0 : _a.call(attrs); },
-                            }, m(Icon, { far: "circle-question" })),
+                            }, (0, mithril_1.default)(Icon_1.Icon, { far: "circle-question" })),
                         ]) : [],
                     ]),
                     // Editor content
-                    m("textarea.editor-textarea", {
+                    (0, mithril_1.default)("textarea.editor-textarea", {
                         rows: this.state.editorValue.split("\n").length + 1,
                         value: this.state.editorValue,
                         oninput: (e) => {

package/dist/esm/components/markdown-editor/index.js

@@ -1 +1,17 @@
-export * from "./MarkdownEditor";
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./MarkdownEditor"), exports);

package/dist/esm/components/markdown-editor/markdown-editor.state.js

@@ -1,9 +1,12 @@
-import { Subscription } from "rxjs";
-import { mouseWithinElement } from "../../utils";
-import { redraw } from "mithril";
-export class MarkdownEditorState {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MarkdownEditorState = void 0;
+const rxjs_1 = require("rxjs");
+const utils_1 = require("../../utils");
+const mithril_1 = require("mithril");
+class MarkdownEditorState {
     constructor(editValue) {
-        this.subs = new Subscription();
+        this.subs = new rxjs_1.Subscription();
         this.isEditing = false;
         this.isEditingPrevious = false;
         this.editorValue = "";
@@ -14,9 +17,9 @@ export class MarkdownEditorState {
         this.editValue = editValue;
         const onclick = (ev) => {
             if (this.isEditing && this.editorContainerEl) {
-                if (!mouseWithinElement(ev, this.editorContainerEl)) {
+                if (!(0, utils_1.mouseWithinElement)(ev, this.editorContainerEl)) {
                     this.isEditing = false;
-                    redraw();
+                    (0, mithril_1.redraw)();
                 }
             }
         };
@@ -253,3 +256,4 @@ export class MarkdownEditorState {
         this.requestSelection = { start: newSelection, end: newSelection };
     }
 }
+exports.MarkdownEditorState = MarkdownEditorState;

package/dist/esm/components/menu/Menu.d.ts

@@ -4,6 +4,8 @@ export interface MenuOptions {
     noFlipH?: boolean;
     forceFlipV?: boolean;
     forceFlipH?: boolean;
+    /** Add the menu directly to the element which raised the event */
+    asChild?: boolean;
 }
 export declare const Menu: m.Component<{
     x: number | undefined;

package/dist/esm/components/menu/Menu.js

@@ -1,7 +1,13 @@
-import m from "mithril";
-import { MENU_CONSTANTS } from "./menu-constants";
-import { MENU_SETTINGS } from "./menu-settings";
-export const Menu = {
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Menu = void 0;
+const mithril_1 = __importDefault(require("mithril"));
+const menu_constants_1 = require("./menu-constants");
+const menu_settings_1 = require("./menu-settings");
+exports.Menu = {
     oninit() { },
     oncreate({ dom }) {
         if (dom) {
@@ -14,12 +20,12 @@ export const Menu = {
     },
     view({ attrs, children }) {
         var _a, _b, _c, _d, _e, _f;
-        const maxWidthPx = Math.min(window.innerWidth, MENU_CONSTANTS.MAX_WIDTH_PX);
+        const maxWidthPx = Math.min(window.innerWidth, menu_constants_1.MENU_CONSTANTS.MAX_WIDTH_PX);
         const maxHeightPx = window.innerHeight / 2;
         const xPx = (_a = attrs.x) !== null && _a !== void 0 ? _a : 0;
         const yPx = (_b = attrs.y) !== null && _b !== void 0 ? _b : 0;
-        let flipH = ((xPx + MENU_CONSTANTS.MIN_WIDTH_PX) > window.innerWidth);
-        let flipV = MENU_SETTINGS.ANCHOR === "page"
+        let flipH = ((xPx + menu_constants_1.MENU_CONSTANTS.MIN_WIDTH_PX) > window.innerWidth);
+        let flipV = menu_settings_1.MENU_SETTINGS.ANCHOR === "page"
             ? ((yPx + maxHeightPx - window.scrollY) > window.innerHeight)
             : ((yPx + maxHeightPx) > window.innerHeight);
         if (((_c = attrs.options) === null || _c === void 0 ? void 0 : _c.noFlipH) === true)
@@ -40,10 +46,10 @@ export const Menu = {
         // TODO: don't let the menu width actually touch the screen width; it will fall off the left hand side
         const posH = flipH ? `right: ${window.innerWidth - xPx}px;` : `left: ${xPx}px;`;
         const posV = flipV ? `bottom: ${window.innerHeight - yPx}px;` : `top: ${yPx}px;`;
-        return m("", {
+        return (0, mithril_1.default)("", {
             key: Date.now(),
-            class: `mico-menu ${MENU_SETTINGS.MENU_CLASS}`,
-            style: `position: absolute; overflow-y: auto; overflow-x: hidden; ${posH} ${posV} z-index: 100; min-width: ${MENU_CONSTANTS.MIN_WIDTH_PX}px; max-width: ${maxWidthPx}px; max-height: ${maxHeightPx}px;`,
+            class: `mico-menu ${menu_settings_1.MENU_SETTINGS.MENU_CLASS}`,
+            style: `position: absolute; overflow-y: auto; overflow-x: hidden; ${posH} ${posV} z-index: 100; min-width: ${menu_constants_1.MENU_CONSTANTS.MIN_WIDTH_PX}px; max-width: ${maxWidthPx}px; max-height: ${maxHeightPx}px;`,
             tabIndex: -1,
             onkeydown: (ev) => {
                 var _a, _b, _c, _d, _e, _f;

package/dist/esm/components/menu/MenuButton.js

@@ -1,55 +1,61 @@
-import m from "mithril";
-import { Icon } from "../icon";
-import { MENU_SETTINGS } from "./menu-settings";
-export const MenuButton = {
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuButton = void 0;
+const mithril_1 = __importDefault(require("mithril"));
+const icon_1 = require("../icon");
+const menu_settings_1 = require("./menu-settings");
+exports.MenuButton = {
     view({ attrs }) {
         var _a, _b, _c, _d;
         return (attrs.href !== undefined) ? [
-            m(m.route.Link, {
-                class: `mico-menu-button ${(_a = attrs.class) !== null && _a !== void 0 ? _a : ""} ${MENU_SETTINGS.MENU_BUTTON_CLASS}`,
+            (0, mithril_1.default)(mithril_1.default.route.Link, {
+                class: `mico-menu-button ${(_a = attrs.class) !== null && _a !== void 0 ? _a : ""} ${menu_settings_1.MENU_SETTINGS.MENU_BUTTON_CLASS}`,
                 style: `${(_b = attrs.style) !== null && _b !== void 0 ? _b : ""} width: 100%; height: 1.5rem; padding-right: 0.5rem; display: flex; align-items: center;`,
                 href: attrs.href,
                 disabled: attrs.disabled,
                 onclick: (ev) => {
                     var _a;
                     (_a = attrs.onclick) === null || _a === void 0 ? void 0 : _a.call(attrs, ev);
-                    m.redraw();
+                    mithril_1.default.redraw();
                 },
             }, [
-                m(ButtonIcon, { icon: attrs.icon }),
-                m(ButtonLabel, { label: attrs.label }),
-                m("", { style: "flex: 1 1 0%;" }),
-                m(ButtonHint, { hint: attrs.hint }),
+                (0, mithril_1.default)(ButtonIcon, { icon: attrs.icon }),
+                (0, mithril_1.default)(ButtonLabel, { label: attrs.label }),
+                (0, mithril_1.default)("", { style: "flex: 1 1 0%;" }),
+                (0, mithril_1.default)(ButtonHint, { hint: attrs.hint }),
             ]),
         ] : [
-            m("button", {
-                class: `mico-menu-button ${(_c = attrs.class) !== null && _c !== void 0 ? _c : ""} ${MENU_SETTINGS.MENU_BUTTON_CLASS}`,
+            (0, mithril_1.default)("button", {
+                class: `mico-menu-button ${(_c = attrs.class) !== null && _c !== void 0 ? _c : ""} ${menu_settings_1.MENU_SETTINGS.MENU_BUTTON_CLASS}`,
                 style: `${(_d = attrs.style) !== null && _d !== void 0 ? _d : ""} width: 100%; height: 1.5rem; padding-right: 0.5rem; display: flex; align-items: center;`,
                 disabled: attrs.disabled,
                 onclick: (ev) => {
                     var _a;
                     (_a = attrs.onclick) === null || _a === void 0 ? void 0 : _a.call(attrs, ev);
-                    m.redraw();
+                    mithril_1.default.redraw();
                 },
             }, [
-                m(ButtonIcon, { icon: attrs.icon }),
-                m(ButtonLabel, { label: attrs.label }),
-                m("", { style: "flex: 1 1 0%;" }),
-                m(ButtonHint, { hint: attrs.hint }),
+                (0, mithril_1.default)(ButtonIcon, { icon: attrs.icon }),
+                (0, mithril_1.default)(ButtonLabel, { label: attrs.label }),
+                (0, mithril_1.default)("", { style: "flex: 1 1 0%;" }),
+                (0, mithril_1.default)(ButtonHint, { hint: attrs.hint }),
             ]),
         ];
     }
 };
 const ButtonIcon = {
     view({ attrs }) {
-        return m("", {
+        return (0, mithril_1.default)("", {
             // class: attrs.disabled ? "text-disabled" : "text-icon",
-            class: `mico-menu-button-icon ${MENU_SETTINGS.MENU_BUTTON_ICON_CLASS}`,
+            class: `mico-menu-button-icon ${menu_settings_1.MENU_SETTINGS.MENU_BUTTON_ICON_CLASS}`,
             style: "width: 2rem; flex: none; display: flex; align-items: center; justify-content: space-around;",
         }, [
             attrs.icon ? [
                 ("fas" in attrs.icon || "far" in attrs.icon || "fab" in attrs.icon)
-                    ? m(Icon, Object.assign({}, attrs.icon))
+                    ? (0, mithril_1.default)(icon_1.Icon, Object.assign({}, attrs.icon))
                     : attrs.icon,
             ] : [],
         ]);
@@ -57,8 +63,8 @@ const ButtonIcon = {
 };
 const ButtonLabel = {
     view({ attrs }) {
-        return m("span", {
-            class: `mico-menu-button-label ${MENU_SETTINGS.MENU_BUTTON_LABEL_CLASS}`,
+        return (0, mithril_1.default)("span", {
+            class: `mico-menu-button-label ${menu_settings_1.MENU_SETTINGS.MENU_BUTTON_LABEL_CLASS}`,
             style: "overflow: hidden; text-overflow: ellipsis; white-space: nowrap;",
         }, attrs.label);
     }
@@ -66,8 +72,8 @@ const ButtonLabel = {
 const ButtonHint = {
     view({ attrs }) {
         return attrs.hint
-            ? m("span", {
-                class: `mico-menu-button-hint ${MENU_SETTINGS.MENU_BUTTON_HINT_CLASS}`,
+            ? (0, mithril_1.default)("span", {
+                class: `mico-menu-button-hint ${menu_settings_1.MENU_SETTINGS.MENU_BUTTON_HINT_CLASS}`,
                 style: "overflow: hidden; text-overflow: ellipsis; white-space: nowrap;",
             }, attrs.hint)
             : [];

package/dist/esm/components/menu/MenuSeparator.js

@@ -1,10 +1,16 @@
-import m from "mithril";
-import { MENU_SETTINGS } from "./menu-settings";
-export const MenuSeparator = {
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MenuSeparator = void 0;
+const mithril_1 = __importDefault(require("mithril"));
+const menu_settings_1 = require("./menu-settings");
+exports.MenuSeparator = {
     view() {
         // return m(".my-2.ml-8.mr-2.border-b.border-slate-300");
-        return m("", {
-            class: `mico-menu-separator ${MENU_SETTINGS.MENU_SEPARATOR_CLASS}`,
+        return (0, mithril_1.default)("", {
+            class: `mico-menu-separator ${menu_settings_1.MENU_SETTINGS.MENU_SEPARATOR_CLASS}`,
             style: "margin: 0.25rem 0; border-bottom-width: 1px; border-bottom-style: solid;",
         });
     }

package/dist/esm/components/menu/index.js

@@ -1,6 +1,22 @@
-export * from "./Menu";
-export * from "./MenuButton";
-export * from "./MenuSeparator";
-export * from "./menu-constants";
-export * from "./menu-manager";
-export * from "./menu-settings";
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Menu"), exports);
+__exportStar(require("./MenuButton"), exports);
+__exportStar(require("./MenuSeparator"), exports);
+__exportStar(require("./menu-constants"), exports);
+__exportStar(require("./menu-manager"), exports);
+__exportStar(require("./menu-settings"), exports);

package/dist/esm/components/menu/menu-constants.js

@@ -1,4 +1,7 @@
-export const MENU_CONSTANTS = {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MENU_CONSTANTS = void 0;
+exports.MENU_CONSTANTS = {
     MIN_WIDTH_PX: 200,
     MAX_WIDTH_PX: 500,
 };

package/dist/esm/components/menu/menu-manager.d.ts

@@ -2,6 +2,8 @@ import m from "mithril";
 import { MenuOptions } from "./Menu";
 export declare class MenuManager {
     private containerEl;
+    private directParentEl;
+    private directParentWrapperEl;
     private _menuVnode;
     menuVnode$: import("rxjs").Observable<m.Vnode<any, any> | undefined>;
     get menuVnode(): m.Vnode<any, any> | undefined;

package/dist/esm/components/menu/menu-manager.js

@@ -1,3 +1,4 @@
+"use strict";
 var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
     return new (P || (P = Promise))(function (resolve, reject) {
@@ -7,18 +8,24 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import m from "mithril";
-import { BehaviorSubject } from "rxjs";
-import { Menu } from "./Menu";
-import { MENU_SETTINGS } from "./menu-settings";
-export class MenuManager {
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.menuMgr = exports.MenuManager = void 0;
+const mithril_1 = __importDefault(require("mithril"));
+const rxjs_1 = require("rxjs");
+const Menu_1 = require("./Menu");
+const menu_settings_1 = require("./menu-settings");
+class MenuManager {
     get menuVnode() { return this._menuVnode.value; }
     get isOpen() {
         return Boolean(this.menuVnode);
     }
     constructor() {
-        this._menuVnode = new BehaviorSubject(undefined);
+        this._menuVnode = new rxjs_1.BehaviorSubject(undefined);
         this.menuVnode$ = this._menuVnode.asObservable();
+        // Set up the default container element for the menu
         this.containerEl = document.createElement("div");
         this.containerEl.classList.add("menu-container");
         document.body.append(this.containerEl);
@@ -51,22 +58,39 @@ export class MenuManager {
             yield new Promise((resolve, reject) => {
                 setTimeout(() => resolve(), 0);
             });
-            const menuVnode = m(Menu, {
+            const menuVnode = (0, mithril_1.default)(Menu_1.Menu, {
                 x: ev === null || ev === void 0 ? void 0 : ev.clientX,
-                y: MENU_SETTINGS.ANCHOR === "page" ? ev === null || ev === void 0 ? void 0 : ev.pageY : ev === null || ev === void 0 ? void 0 : ev.clientY,
+                y: menu_settings_1.MENU_SETTINGS.ANCHOR === "page" ? ev === null || ev === void 0 ? void 0 : ev.pageY : ev === null || ev === void 0 ? void 0 : ev.clientY,
                 options,
             }, [
                 menuContents,
             ]);
             this._menuVnode.next(menuVnode);
-            m.render(this.containerEl, menuVnode);
+            // m.render(this.containerEl, menuVnode);
+            if ((options === null || options === void 0 ? void 0 : options.asChild) && (ev === null || ev === void 0 ? void 0 : ev.target) && ev.target instanceof HTMLElement) {
+                this.directParentEl = ev.target;
+                // m.render(ev.target, menuVnode);
+                // this.containerEl = ev.target;
+                this.directParentWrapperEl = document.createElement("div");
+                this.directParentEl.append(this.directParentWrapperEl);
+                mithril_1.default.render(this.directParentWrapperEl, menuVnode);
+            }
+            else {
+                mithril_1.default.render(this.containerEl, menuVnode);
+            }
+            // m.render(this.containerEl, menuVnode);
             // console.log("Added menu");
         });
     }
     hide() {
+        var _a;
         this._menuVnode.next(undefined);
-        m.render(this.containerEl, []);
+        mithril_1.default.render(this.containerEl, []);
+        (_a = this.directParentWrapperEl) === null || _a === void 0 ? void 0 : _a.remove();
+        this.directParentWrapperEl = undefined;
+        this.directParentEl = undefined;
         // console.log("Closed menu");
     }
 }
-export const menuMgr = new MenuManager();
+exports.MenuManager = MenuManager;
+exports.menuMgr = new MenuManager();

package/dist/esm/components/menu/menu-settings.js

@@ -1,4 +1,7 @@
-export const MENU_SETTINGS = {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MENU_SETTINGS = void 0;
+exports.MENU_SETTINGS = {
     ANCHOR: "page",
     MENU_CLASS: "",
     MENU_BUTTON_CLASS: "",

package/dist/esm/components/modal/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/components/modal/index.js

@@ -1 +1,2 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", { value: true });