mevebu 2.0.0 → 2.2.0

package/README.md

@@ -2,7 +2,7 @@
 
 # mevebu
 
-**200 free browser tools, one page each. No sign up. No uploads. Everything runs in your tab.**
+**210 free browser tools, one page each. No sign up. No uploads. Everything runs in your tab.**
 
 A private toolbox for the small jobs that do not deserve a whole app: format JSON, decode a JWT, make a password, build a cron line, pick a color, scan a QR code, and a lot more.
 
@@ -10,7 +10,7 @@ A private toolbox for the small jobs that do not deserve a whole app: format JSO
 [![npm downloads](https://img.shields.io/npm/dm/mevebu?color=2ea44f)](https://www.npmjs.com/package/mevebu)
 [![License: MIT](https://img.shields.io/github/license/mevebu/mevebu?color=blue)](./LICENSE)
 [![GitHub stars](https://img.shields.io/github/stars/mevebu/mevebu?style=flat&color=yellow)](https://github.com/mevebu/mevebu/stargazers)
-![Tools](https://img.shields.io/badge/tools-200-brightgreen)
+![Tools](https://img.shields.io/badge/tools-210-brightgreen)
 ![Privacy](https://img.shields.io/badge/privacy-100%25%20in--browser-blue)
 
 [Quick start](#quick-start) · [What's inside](#whats-inside) · [Privacy](#privacy-by-design) · [Credit](#credit) · [Development](#development) · [FAQ](#faq)
@@ -23,7 +23,7 @@ A private toolbox for the small jobs that do not deserve a whole app: format JSO
 
 ## What is mevebu?
 
-mevebu is a collection of **200 small online tools** that all run **inside your browser**. Each tool lives on its own page, does one job, and does it fast. Most of them update as you type, so there is no submit button and no waiting.
+mevebu is a collection of **210 small online tools** that all run **inside your browser**. Each tool lives on its own page, does one job, and does it fast. Most of them update as you type, so there is no submit button and no waiting.
 
 Think of it as a clean, private alternative to the usual "free online tools" websites. There are no accounts, no ads in your way, no uploads, and no tracking. Your text, passwords, tokens, and files stay on your device.
 
@@ -64,12 +64,12 @@ mevebu tries port `5555` first, then `5678`, then `5432`, and finally any free p
 
 ## What's inside
 
-mevebu has **200 tools in 20 categories**. Here is the full breakdown:
+mevebu has **210 tools in 20 categories**. Here is the full breakdown:
 
 | Category           | Tools |
 | ------------------ | ----: |
-| Data Generator     |     5 |
-| Passwords and keys |    10 |
+| Data Generator     |    10 |
+| Passwords and keys |    15 |
 | Developer          |    21 |
 | Convert            |    15 |
 | Text and data      |    14 |
@@ -88,7 +88,7 @@ mevebu has **200 tools in 20 categories**. Here is the full breakdown:
 | GitHub             |     8 |
 | Units              |     8 |
 | QR codes           |     2 |
-| **Total**          | **200** |
+| **Total**          | **210** |
 
 The counts come straight from the tool registry, so this table and the app never drift apart.
 
@@ -176,7 +176,7 @@ That is all. The catalog, search, breadcrumbs, and category pages pick it up aut
 ## FAQ
 
 **What is mevebu?**
-mevebu is a free, open source collection of 200 browser based tools for developers, students, creators, and everyday use. Every tool runs locally in your browser.
+mevebu is a free, open source collection of 210 browser based tools for developers, students, creators, and everyday use. Every tool runs locally in your browser.
 
 **Is mevebu really free?**
 Yes. It is MIT licensed, with no paid tier, no account, and no usage limits.

package/mevebu/app/tailwind.css

@@ -37,9 +37,6 @@
     --text-lead--line-height: 1.06;
     --text-hero: clamp(34px, 6vw, 58px);
     --text-hero--line-height: 1.03;
-    --text-display: 44px;
-    --text-display--line-height: 1;
-    --animate-toss: toss 450ms ease;
   }
 }
 @layer base {
@@ -503,6 +500,9 @@
     width: var(--ctl);
     height: var(--ctl);
   }
+  .h-1\.5 {
+    height: calc(var(--spacing) * 1.5);
+  }
   .h-2 {
     height: calc(var(--spacing) * 2);
   }
@@ -512,6 +512,9 @@
   .h-24 {
     height: calc(var(--spacing) * 24);
   }
+  .h-40 {
+    height: calc(var(--spacing) * 40);
+  }
   .h-\[22px\] {
     height: 22px;
   }
@@ -539,6 +542,9 @@
   .h-px {
     height: 1px;
   }
+  .max-h-56 {
+    max-height: calc(var(--spacing) * 56);
+  }
   .max-h-80 {
     max-height: calc(var(--spacing) * 80);
   }
@@ -563,6 +569,9 @@
   .min-h-8 {
     min-height: calc(var(--spacing) * 8);
   }
+  .min-h-9 {
+    min-height: calc(var(--spacing) * 9);
+  }
   .min-h-11 {
     min-height: calc(var(--spacing) * 11);
   }
@@ -773,6 +782,9 @@
   .grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
+  .grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
   .grid-cols-4 {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
@@ -978,9 +990,21 @@
     --tw-border-style: dashed;
     border-style: dashed;
   }
+  .border-current\/15 {
+    border-color: currentcolor;
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, currentcolor 15%, transparent);
+    }
+  }
   .border-danger {
     border-color: var(--danger);
   }
+  .border-danger\/40 {
+    border-color: var(--danger);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--danger) 40%, transparent);
+    }
+  }
   .border-jade {
     border-color: var(--jade);
   }
@@ -1011,6 +1035,12 @@
   .bg-danger {
     background-color: var(--danger);
   }
+  .bg-danger\/10 {
+    background-color: var(--danger);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--danger) 10%, transparent);
+    }
+  }
   .bg-deck {
     background-color: var(--deck);
   }
@@ -1361,9 +1391,19 @@
   .text-\[0\.92em\] {
     font-size: 0.92em;
   }
+  .text-\[clamp\(20px\,3\.4vw\,28px\)\] {
+    font-size: clamp(20px, 3.4vw, 28px);
+  }
   .text-\[clamp\(34px\,6vw\,52px\)\] {
     font-size: clamp(34px, 6vw, 52px);
   }
+  .text-\[clamp\(38px\,9vw\,62px\)\] {
+    font-size: clamp(38px, 9vw, 62px);
+  }
+  .leading-\[1\.4\] {
+    --tw-leading: 1.4;
+    line-height: 1.4;
+  }
   .leading-\[1\.5\] {
     --tw-leading: 1.5;
     line-height: 1.5;
@@ -1384,6 +1424,10 @@
     --tw-leading: 1.65;
     line-height: 1.65;
   }
+  .leading-none {
+    --tw-leading: 1;
+    line-height: 1;
+  }
   .leading-normal {
     --tw-leading: var(--leading-normal);
     line-height: var(--leading-normal);
@@ -1420,6 +1464,10 @@
     --tw-tracking: -0.035em;
     letter-spacing: -0.035em;
   }
+  .tracking-\[0\.2em\] {
+    --tw-tracking: 0.2em;
+    letter-spacing: 0.2em;
+  }
   .tracking-\[0\.06em\] {
     --tw-tracking: 0.06em;
     letter-spacing: 0.06em;
@@ -1428,6 +1476,10 @@
     --tw-tracking: 0.08em;
     letter-spacing: 0.08em;
   }
+  .tracking-\[0\.14em\] {
+    --tw-tracking: 0.14em;
+    letter-spacing: 0.14em;
+  }
   .text-balance {
     text-wrap: balance;
   }
@@ -1476,6 +1528,9 @@
   .text-void {
     color: var(--void);
   }
+  .capitalize {
+    text-transform: capitalize;
+  }
   .lowercase {
     text-transform: lowercase;
   }
@@ -1626,10 +1681,18 @@
     --tw-duration: 200ms;
     transition-duration: 200ms;
   }
+  .duration-1000 {
+    --tw-duration: 1000ms;
+    transition-duration: 1000ms;
+  }
   .ease-\[var\(--ease\)\] {
     --tw-ease: var(--ease);
     transition-timing-function: var(--ease);
   }
+  .ease-linear {
+    --tw-ease: linear;
+    transition-timing-function: linear;
+  }
   .outline-none {
     --tw-outline-style: none;
     outline-style: none;

package/mevebu/libs/js/core.js

@@ -750,7 +750,7 @@ export function blank(iconName, text) {
 // ---------- version ----------
 
 // Kept in one place. The CLI reads the same value from package.json.
-export const VERSION = "2.0.0";
+export const VERSION = "2.2.0";
 export const PACKAGE_NAME = "mevebu";
 export const REPO_SLUG = "mevebu/mevebu";
 

package/mevebu/libs/js/random.js

@@ -0,0 +1,54 @@
+// A small seeded generator shared by the data tools. A seed is worth writing
+// down: the same one always produces the same file, so a fixture can be rebuilt
+// after it drifts.
+
+/** Mulberry32. Fast, deterministic, and good enough for fixtures. */
+export function seeded(seed) {
+  let state = hashSeed(String(seed)) >>> 0;
+  return () => {
+    state = (state + 0x6d2b79f5) >>> 0;
+    let t = state;
+    t = Math.imul(t ^ (t >>> 15), t | 1);
+    t ^= t + Math.imul(t ^ (t >>> 7), t | 61);
+    return ((t ^ (t >>> 14)) >>> 0) / 4294967296;
+  };
+}
+
+export function hashSeed(text) {
+  let hash = 2166136261;
+  for (let i = 0; i < text.length; i++) {
+    hash ^= text.charCodeAt(i);
+    hash = Math.imul(hash, 16777619);
+  }
+  return hash >>> 0;
+}
+
+export function pick(random, list) {
+  return list[Math.floor(random() * list.length)];
+}
+
+export function shuffle(list, random) {
+  const out = [...list];
+  for (let i = out.length - 1; i > 0; i--) {
+    const j = Math.floor(random() * (i + 1));
+    [out[i], out[j]] = [out[j], out[i]];
+  }
+  return out;
+}
+
+/** A number from a normal distribution, by Box-Muller. */
+export function gaussian(random, mean = 0, deviation = 1) {
+  const u = Math.max(1e-9, random());
+  const v = random();
+  return mean + deviation * Math.sqrt(-2 * Math.log(u)) * Math.cos(2 * Math.PI * v);
+}
+
+export function uuid(random) {
+  const hex = "0123456789abcdef";
+  let out = "";
+  for (let i = 0; i < 32; i++) {
+    if (i === 8 || i === 12 || i === 16 || i === 20) out += "-";
+    out += i === 12 ? "4" : hex[Math.floor(random() * 16)];
+  }
+  return out;
+}

package/mevebu/libs/js/registry.js

@@ -120,6 +120,96 @@ export const TOOLS = [
     keywords: "data dictionary csv schema profile columns nulls distinct metadata",
     load: () => import("./tools/data-dictionary.js"),
   },
+  {
+    id: "json-schema-sample",
+    category: "data-gen",
+    name: "JSON Schema Sample",
+    icon: "braces",
+    note: "Generate documents from a JSON Schema.",
+    about: "Required fields, types, enums, bounds and patterns, with a seed.",
+    tutorial: {
+      intro: "Make sample documents that pass a schema.",
+      steps: [
+        "Paste a JSON Schema.",
+        "Set how many documents and a seed.",
+        "Press Generate, then copy the JSON or take a ZIP with one file per document.",
+      ],
+    },
+    keywords: "json schema sample mock fixture generate validator draft 2020-12",
+    load: () => import("./tools/json-schema-sample.js"),
+  },
+  {
+    id: "mock-api-payload",
+    category: "data-gen",
+    name: "Mock API Payload",
+    icon: "braces",
+    note: "Write the JSON an endpoint returns.",
+    about: "A list with pagination, a single item, or an error, from one field list.",
+    tutorial: {
+      intro: "Build a fixture before the endpoint exists.",
+      steps: [
+        "Define the fields and their types.",
+        "Pick the shape: list, single item, or error.",
+        "Copy the JSON or download it.",
+      ],
+    },
+    keywords: "mock api payload fixture json response pagination error frontend",
+    load: () => import("./tools/mock-api-payload.js"),
+  },
+  {
+    id: "dataset-splitter",
+    category: "data-gen",
+    name: "Dataset Splitter",
+    icon: "table",
+    note: "Split a CSV into train, validation and test.",
+    about: "Seeded and stratified, and every row lands in exactly one set.",
+    tutorial: {
+      intro: "Prepare a dataset for training.",
+      steps: [
+        "Drop a CSV.",
+        "Set the train and validation percentages, a seed, and an optional stratify column.",
+        "Press Split and download for a ZIP with three files.",
+      ],
+    },
+    keywords: "dataset split train validation test machine learning csv stratified seed",
+    load: () => import("./tools/dataset-splitter.js"),
+  },
+  {
+    id: "time-series",
+    category: "data-gen",
+    name: "Synthetic Time Series",
+    icon: "chart-line",
+    note: "Generate a dated series with trend and season.",
+    about: "Preview the chart, add a spike, then download the CSV.",
+    tutorial: {
+      intro: "Make a series that looks like real data.",
+      steps: [
+        "Set the start date, the frequency and the length.",
+        "Shape the trend, the season and the noise, then add a spike if you need one.",
+        "Press Download CSV.",
+      ],
+    },
+    keywords: "time series synthetic data trend season noise chart demo seed",
+    load: () => import("./tools/time-series.js"),
+  },
+  {
+    id: "survey-responses",
+    category: "data-gen",
+    name: "Survey Responses",
+    icon: "clipboard-list",
+    note: "Generate fake survey answers.",
+    about: "Weights per option, so answers lean the way real answers lean.",
+    tutorial: {
+      intro: "Test a results dashboard with plausible responses.",
+      steps: [
+        "Add questions and their options.",
+        "Set a weight per option and the number of respondents.",
+        "Press Download CSV. One row is one respondent.",
+      ],
+    },
+    keywords: "survey responses fake data dashboard test weights csv",
+    load: () => import("./tools/survey-responses.js"),
+  },
 
   {
     id: "password-generator",
@@ -301,6 +391,96 @@ export const TOOLS = [
     keywords: "url inspect phishing host homograph link safe",
     load: () => import("./tools/url-inspector.js"),
   },
+  {
+    id: "totp-generator",
+    category: "security",
+    name: "TOTP Generator",
+    icon: "shield-check",
+    note: "Read the code your authenticator would show.",
+    about: "Paste a Base32 secret or an otpauth URI. The code refreshes on its own.",
+    tutorial: {
+      intro: "Get a time based one time password from a secret.",
+      steps: [
+        "Paste a Base32 secret, or a full otpauth:// URI.",
+        "Pick the digits, the period and the hash if they are not the default.",
+        "Copy the code. It changes on its own every period.",
+      ],
+    },
+    keywords: "totp otp 2fa authenticator google authenticator base32 code",
+    load: () => import("./tools/totp-generator.js"),
+  },
+  {
+    id: "totp-verifier",
+    category: "security",
+    name: "TOTP Verifier",
+    icon: "shield-check",
+    note: "Check a code against a secret.",
+    about: "Shows which step matched, so a wrong secret is distinguishable from a wrong clock.",
+    tutorial: {
+      intro: "Debug a two factor integration.",
+      steps: [
+        "Paste the secret and the code.",
+        "Set the drift window, or leave it at one step either side.",
+        "Read the verdict, which names the step that matched.",
+      ],
+    },
+    keywords: "totp verify validate otp 2fa drift clock debug",
+    load: () => import("./tools/totp-verifier.js"),
+  },
+  {
+    id: "passphrase-generator",
+    category: "security",
+    name: "Passphrase Generator",
+    icon: "key-round",
+    note: "Make a passphrase you can type from memory.",
+    about: "Words from a bundled list, with the entropy in bits shown next to it.",
+    tutorial: {
+      intro: "Make a password that is long and memorable.",
+      steps: [
+        "Pick how many words.",
+        "Choose a separator, and whether to add a number or a symbol.",
+        "Press Generate, then copy it.",
+      ],
+    },
+    keywords: "passphrase password memorable words diceware entropy",
+    load: () => import("./tools/passphrase-generator.js"),
+  },
+  {
+    id: "file-hash",
+    category: "security",
+    name: "File Hash Checker",
+    icon: "file-key",
+    note: "Hash a file and compare the checksum.",
+    about: "SHA-1, SHA-256 and SHA-512, read in the tab, with a match or mismatch.",
+    tutorial: {
+      intro: "Verify a download before you open it.",
+      steps: [
+        "Drop the file.",
+        "Paste the checksum you were given.",
+        "Read match or mismatch, and copy any digest you need.",
+      ],
+    },
+    keywords: "file hash checksum sha256 verify download integrity",
+    load: () => import("./tools/file-hash.js"),
+  },
+  {
+    id: "aes-text",
+    category: "security",
+    name: "AES Text Encrypt",
+    icon: "lock",
+    note: "Encrypt a message with a password.",
+    about: "AES-256-GCM with PBKDF2, and one string that carries everything needed to decrypt.",
+    tutorial: {
+      intro: "Send a secret through a channel you do not trust.",
+      steps: [
+        "Write the message and set a password.",
+        "Press Encrypt and copy the string that starts with mv1.",
+        "To read it back, switch to Decrypt, paste the string and the same password.",
+      ],
+    },
+    keywords: "aes encrypt decrypt password gcm pbkdf2 secret message",
+    load: () => import("./tools/aes-text.js"),
+  },
 
   {
     id: "uuid-generator",

package/mevebu/libs/js/tools/aes-text.js

@@ -0,0 +1,192 @@
+// Encrypt a message with a password. AES-256-GCM with a PBKDF2 key, and the salt
+// and IV packed into the output, so one string is enough to decrypt.
+import {
+  el, icon, toast, bench, stack, panel, textArea, textInput, button, actions,
+  toolcard, notice, copyButton, output, chipRow,
+} from "../core.js";
+
+const ITERATIONS = 310_000;
+const SALT_BYTES = 16;
+const IV_BYTES = 12;
+const VERSION = 1;
+
+function toBase64(bytes) {
+  let binary = "";
+  for (const byte of bytes) binary += String.fromCharCode(byte);
+  return btoa(binary);
+}
+
+function fromBase64(text) {
+  const binary = atob(text.replace(/\s+/g, ""));
+  const out = new Uint8Array(binary.length);
+  for (let i = 0; i < binary.length; i++) out[i] = binary.charCodeAt(i);
+  return out;
+}
+
+async function deriveKey(password, salt) {
+  const base = await crypto.subtle.importKey(
+    "raw",
+    new TextEncoder().encode(password),
+    "PBKDF2",
+    false,
+    ["deriveKey"]
+  );
+  return crypto.subtle.deriveKey(
+    { name: "PBKDF2", salt, iterations: ITERATIONS, hash: "SHA-256" },
+    base,
+    { name: "AES-GCM", length: 256 },
+    false,
+    ["encrypt", "decrypt"]
+  );
+}
+
+export function mount(slot) {
+  let mode = "encrypt";
+
+  const message = textArea({ rows: 6, placeholder: "The message", "aria-label": "Message" });
+  const password = textInput({
+    type: "password",
+    placeholder: "A password you will remember",
+    "aria-label": "Password",
+    autocomplete: "new-password",
+  });
+  const show = el("input", { type: "checkbox", class: "m-0 size-4 accent-[var(--jade)]" });
+  const showLabel = el("label", { class: "inline-flex min-h-9 cursor-pointer items-center gap-2 text-sm text-ink-2" }, show, "Show password");
+
+  const modeRow = chipRow(
+    [
+      { value: "encrypt", label: "Encrypt" },
+      { value: "decrypt", label: "Decrypt" },
+    ],
+    {
+      value: "encrypt",
+      label: "Mode",
+      onChange: (value) => {
+        mode = value;
+        sync();
+      },
+    }
+  );
+
+  const error = notice("warn");
+  const result = output({ rows: 8 });
+  const summary = el("p", { class: "text-sm text-ink-2" });
+
+  function sync() {
+    const decrypting = mode === "decrypt";
+    message.placeholder = decrypting
+      ? "Paste the encrypted text, starting with mv1."
+      : "The message";
+    message.setAttribute("aria-label", decrypting ? "Encrypted text" : "Message");
+    run.textContent = decrypting ? "Decrypt text" : "Encrypt text";
+    result.write("");
+    summary.textContent = "";
+    error.write("");
+  }
+
+  async function act() {
+    error.write("");
+    result.write("");
+    summary.textContent = "";
+    const text = message.value;
+    const pass = password.value;
+    if (!text.trim()) {
+      error.write(mode === "decrypt" ? "Paste the encrypted text first." : "Write the message first.");
+      return;
+    }
+    if (!pass) {
+      error.write("Set a password first.");
+      return;
+    }
+
+    try {
+      if (mode === "encrypt") {
+        const salt = crypto.getRandomValues(new Uint8Array(SALT_BYTES));
+        const iv = crypto.getRandomValues(new Uint8Array(IV_BYTES));
+        const key = await deriveKey(pass, salt);
+        const cipher = new Uint8Array(
+          await crypto.subtle.encrypt({ name: "AES-GCM", iv }, key, new TextEncoder().encode(text))
+        );
+        const packed = new Uint8Array(1 + SALT_BYTES + IV_BYTES + cipher.length);
+        packed[0] = VERSION;
+        packed.set(salt, 1);
+        packed.set(iv, 1 + SALT_BYTES);
+        packed.set(cipher, 1 + SALT_BYTES + IV_BYTES);
+        const encoded = `mv1.${toBase64(packed)}`;
+        result.write(encoded);
+        summary.textContent = `${encoded.length} characters · AES-256-GCM · PBKDF2-SHA-256, ${ITERATIONS.toLocaleString()} rounds`;
+        toast("Encrypted");
+      } else {
+        const clean = text.trim();
+        const body = clean.startsWith("mv1.") ? clean.slice(4) : clean;
+        let packed;
+        try {
+          packed = fromBase64(body);
+        } catch {
+          throw new Error("That is not Base64. Paste the whole string, starting with mv1.");
+        }
+        if (packed.length < 1 + SALT_BYTES + IV_BYTES + 16) throw new Error("That string is too short to be an encrypted message.");
+        if (packed[0] !== VERSION) throw new Error(`This was written by version ${packed[0]}, which this page does not know.`);
+        const salt = packed.slice(1, 1 + SALT_BYTES);
+        const iv = packed.slice(1 + SALT_BYTES, 1 + SALT_BYTES + IV_BYTES);
+        const cipher = packed.slice(1 + SALT_BYTES + IV_BYTES);
+        const key = await deriveKey(pass, salt);
+        let plain;
+        try {
+          plain = await crypto.subtle.decrypt({ name: "AES-GCM", iv }, key, cipher);
+        } catch {
+          throw new Error("Wrong password, or the text was changed after it was encrypted.");
+        }
+        const decoded = new TextDecoder().decode(plain);
+        result.write(decoded);
+        summary.textContent = `${decoded.length} characters`;
+        toast("Decrypted");
+      }
+    } catch (caught) {
+      error.write(caught?.message || "That did not work.");
+    }
+  }
+
+  show.addEventListener("change", () => {
+    password.type = show.checked ? "text" : "password";
+  });
+
+  const run = button("Encrypt text", { icon: "lock", kind: "fill", onclick: act });
+  const copy = copyButton(() => result.textContent, "Copy result");
+  const clear = button("Clear", {
+    icon: "trash",
+    kind: "quiet",
+    onclick: () => {
+      message.value = "";
+      password.value = "";
+      result.write("");
+      summary.textContent = "";
+      error.write("");
+      message.focus();
+    },
+  });
+
+  sync();
+
+  const shell = toolcard({
+    body: bench(
+      stack(
+        el("div", { class: "grid gap-1.5" }, el("span", { class: "text-sm font-semibold text-ink-2" }, "Mode"), modeRow),
+        panel("Message", message),
+        panel("Password", password),
+        showLabel,
+        error
+      ),
+      stack(summary, result,
+        el("p", { class: "m-0 text-2xs leading-[1.6] text-ink-3" },
+          "AES-256-GCM with a key stretched by PBKDF2-SHA-256. The salt and IV are packed into the output, so one string is all you need to decrypt. A lost password cannot be recovered, which is the point."))
+    ),
+    foot: actions(clear, copy, run),
+  });
+
+  slot.append(shell.node);
+
+  return {};
+}
+
+export default { mount };