@hypericon/mico 0.2.7 → 0.3.1

package/dist/components/dialog/Dialog.d.ts

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

package/dist/components/dialog/Dialog.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+// export const Dialog: m.Component<{
+//   created?: (args: {}) => any,
+// }> = {
+//   view({ attrs, children }) {
+//     return m("dialog", {}, [
+//       children,
+//     ]);
+//   }
+// };

package/dist/components/dialog/dialog-manager.d.ts

@@ -0,0 +1,45 @@
+import m from "mithril";
+export interface DialogManagerOptions {
+    containerEl?: HTMLElement;
+    debug?: boolean;
+}
+export interface OpenDialogResult {
+    close: () => Promise<void>;
+}
+export declare class DialogManager {
+    private containerEl;
+    private currentDialog;
+    get isOpen(): boolean;
+    private debug;
+    constructor(options?: DialogManagerOptions);
+    /**
+     * Open a new dialog with the given contents.
+     *
+     * Note: to make use of Mithril's auto-redraw system, the dialog must be defined as a component,
+     * not a Vnode.
+     *
+     * Example:
+     * ```ts
+     * open(MyDialog, { ... }); // WILL redraw
+     * open(m("h1", "...")); // will NOT redraw
+     * ```
+     * @param dialog
+     * @param attrs
+     * @returns once the dialog has been created and is being displayed to the user
+     */
+    open<A = {}>(dialog: m.Component<A, any> | m.Vnode<any, any>, attrs?: A, opts?: {
+        backdropDismiss?: boolean;
+        noEscape?: boolean;
+    }): Promise<void>;
+    private _open;
+    private openWithComponent;
+    private openWithVnode;
+    /**
+     * Close the open dialog.
+     *
+     * Silently does nothing if no dialog is open.
+     */
+    close(): void;
+    private closeThis;
+}
+export declare const dialogMgr: DialogManager;

package/dist/components/dialog/dialog-manager.js

@@ -0,0 +1,173 @@
+"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) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogMgr = exports.DialogManager = void 0;
+const mithril_1 = __importDefault(require("mithril"));
+class DialogManager {
+    get isOpen() { return this.currentDialog !== undefined; }
+    constructor(options) {
+        this.debug = false;
+        if (options === null || options === void 0 ? void 0 : options.debug)
+            this.debug = options.debug;
+        if (options === null || options === void 0 ? void 0 : options.containerEl) {
+            this.containerEl = options.containerEl;
+        }
+        else {
+            this.containerEl = document.createElement("div");
+            this.containerEl.classList.add("mico-dialog-container");
+            document.body.append(this.containerEl);
+        }
+    }
+    /**
+     * Open a new dialog with the given contents.
+     *
+     * Note: to make use of Mithril's auto-redraw system, the dialog must be defined as a component,
+     * not a Vnode.
+     *
+     * Example:
+     * ```ts
+     * open(MyDialog, { ... }); // WILL redraw
+     * open(m("h1", "...")); // will NOT redraw
+     * ```
+     * @param dialog
+     * @param attrs
+     * @returns once the dialog has been created and is being displayed to the user
+     */
+    open(dialog, attrs, opts) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const element = this.containerEl;
+            const manager = this;
+            const dialogId = `${Math.random().toString().replace("0.", "")}`;
+            return new Promise((resolve, reject) => {
+                mithril_1.default.mount(element, {
+                    oninit() {
+                        // 
+                    },
+                    oncreate({ dom }) {
+                        var _a;
+                        const dialog = dom;
+                        (_a = dialog.showModal) === null || _a === void 0 ? void 0 : _a.call(dialog);
+                        manager.currentDialog = dialog;
+                        // Optionally wire up the backdrop to dismiss the dialog
+                        if ((opts === null || opts === void 0 ? void 0 : opts.backdropDismiss) === true) {
+                            dialog.addEventListener("click", (ev) => {
+                                // console.log(ev);
+                                if (ev.target !== dom)
+                                    return;
+                                const dialogRect = dom.getBoundingClientRect();
+                                const isInDialog = (ev.clientY >= dialogRect.top) &&
+                                    (ev.clientY <= dialogRect.bottom) &&
+                                    (ev.clientX >= dialogRect.left) &&
+                                    (ev.clientX <= dialogRect.right);
+                                if (!isInDialog)
+                                    manager.close();
+                            });
+                        }
+                        resolve();
+                    },
+                    onremove() {
+                        manager.debug && console.log("mounted component onremove()");
+                        resolve(undefined);
+                    },
+                    view() {
+                        return (0, mithril_1.default)("dialog", {
+                            id: dialogId,
+                            key: dialogId,
+                            class: "mico-dialog",
+                            onclose: () => {
+                                manager.debug && console.log("dialog onclose()");
+                                mithril_1.default.mount(manager.containerEl, null);
+                            },
+                            oncancel: (ev) => {
+                                if ((opts === null || opts === void 0 ? void 0 : opts.noEscape) === true) {
+                                    ev.preventDefault();
+                                }
+                            },
+                        }, [
+                            ("view" in dialog)
+                                ? (0, mithril_1.default)(dialog, Object.assign({}, attrs))
+                                : dialog,
+                        ]);
+                    },
+                });
+            });
+        });
+    }
+    // This was attempting to intercept a certain function and then return a result from open()
+    // asynchronously, but it was all getting needlessly complicated
+    _open(dialog, attrs, options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const element = this.containerEl;
+            const manager = this;
+            const dialogId = `${Math.random().toString()}`;
+            // const resultFnKey = options?.resultFn;
+            // if (resultFnKey) {
+            //   if (attrs) {
+            //     attrs[resultFnKey] = 
+            //   }
+            // }
+            return new Promise((resolve, reject) => {
+                mithril_1.default.mount(element, {
+                    oninit() {
+                        // 
+                    },
+                    oncreate({ dom }) {
+                        var _a;
+                        const dialog = dom;
+                        (_a = dialog.showModal) === null || _a === void 0 ? void 0 : _a.call(dialog);
+                        manager.currentDialog = dialog;
+                    },
+                    onremove() {
+                        console.log("mounted component onremove()");
+                        resolve(undefined);
+                    },
+                    view() {
+                        return (0, mithril_1.default)("dialog", {
+                            id: dialogId,
+                            key: dialogId,
+                            onclose: () => {
+                                console.log("dialog onclose()");
+                                mithril_1.default.mount(manager.containerEl, null);
+                            },
+                        }, [
+                            ("view" in dialog)
+                                ? (0, mithril_1.default)(dialog, Object.assign({}, attrs))
+                                : dialog,
+                        ]);
+                    },
+                });
+            });
+        });
+    }
+    openWithComponent(dialog) { }
+    openWithVnode(dialog) { }
+    /**
+     * Close the open dialog.
+     *
+     * Silently does nothing if no dialog is open.
+     */
+    close() {
+        var _a;
+        // m.mount(this.containerEl, null);
+        (_a = this.currentDialog) === null || _a === void 0 ? void 0 : _a.close();
+    }
+    // an attempt to close a specific dialog, but only one can be open at once anyway
+    closeThis(dialog) {
+        console.log("close:");
+        console.log(dialog);
+        console.log(dialog.prototype);
+    }
+}
+exports.DialogManager = DialogManager;
+exports.dialogMgr = new DialogManager();

package/dist/components/dialog/index.d.ts

@@ -0,0 +1 @@
+export * from "./dialog-manager";

package/dist/components/dialog/index.js

@@ -0,0 +1,18 @@
+"use strict";
+// export * from "./Dialog";
+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("./dialog-manager"), exports);

package/dist/components/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./dialog";
 export * from "./icon";
 export * from "./markdown";
 export * from "./menu";

package/dist/components/index.js

@@ -17,6 +17,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 // export * from "./accordion";
 // export * from "./data-grid";
 // export * from "./data-table";
+__exportStar(require("./dialog"), exports);
 // export * from "./drawer";
 // export * from "./form";
 __exportStar(require("./icon"), exports);

package/dist/components/menu/index.d.ts

@@ -2,5 +2,5 @@ export * from "./Menu";
 export * from "./MenuButton";
 export * from "./MenuSeparator";
 export * from "./menu-constants";
-export * from "./menu-service";
+export * from "./menu-manager";
 export * from "./menu-settings";

package/dist/components/menu/index.js

@@ -18,5 +18,5 @@ __exportStar(require("./Menu"), exports);
 __exportStar(require("./MenuButton"), exports);
 __exportStar(require("./MenuSeparator"), exports);
 __exportStar(require("./menu-constants"), exports);
-__exportStar(require("./menu-service"), exports);
+__exportStar(require("./menu-manager"), exports);
 __exportStar(require("./menu-settings"), exports);

package/dist/components/menu/{menu-service.d.ts → menu-manager.d.ts}

@@ -1,5 +1,5 @@
 import m from "mithril";
-export declare class MenuService {
+export declare class MenuManager {
     private containerEl;
     private _menuVnode;
     menuVnode$: import("rxjs").Observable<m.Vnode<any, any> | undefined>;
@@ -18,4 +18,4 @@ export declare class MenuService {
     show(ev: MouseEvent | undefined, menuContents: m.ChildArrayOrPrimitive): Promise<void>;
     hide(): void;
 }
-export declare const menuService: MenuService;
+export declare const menuMgr: MenuManager;

package/dist/components/menu/{menu-service.js → menu-manager.js}

@@ -12,12 +12,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.menuService = exports.MenuService = void 0;
+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 MenuService {
+class MenuManager {
     get menuVnode() { return this._menuVnode.value; }
     get isOpen() {
         return Boolean(this.menuVnode);
@@ -74,5 +74,5 @@ class MenuService {
         // console.log("Closed menu");
     }
 }
-exports.MenuService = MenuService;
-exports.menuService = new MenuService();
+exports.MenuManager = MenuManager;
+exports.menuMgr = new MenuManager();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hypericon/mico",
-  "version": "0.2.7",
+  "version": "0.3.1",
   "description": "UI components and utilities with Mithril",
   "author": "Ed Johnson, Hypericon Ltd",
   "license": "MIT",