mevebu 0.3.1 → 0.4.0

package/mevebu/libs/js/tools/data-validator.js

@@ -0,0 +1,111 @@
+// Checks each value against a rule and lists the rows that fail.
+import { el, bench, stack, panel, textArea, selectInput, textInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+function tile(label) {
+  const value = el("span", { class: "mvb-stat__v" }, "0");
+  const node = el("div", { class: "mvb-stat" }, value, el("span", { class: "mvb-stat__k" }, label));
+  node.set = (text) => { value.textContent = text; };
+  return node;
+}
+
+export function mount(slot) {
+  const source = textArea({ rows: 12, "aria-label": "Values, one per line", placeholder: "One value per line" });
+  const rule = selectInput([
+    { value: "notempty", label: "Not empty" },
+    { value: "email", label: "Email" },
+    { value: "url", label: "URL" },
+    { value: "number", label: "Number" },
+    { value: "minlength", label: "Minimum length" },
+    { value: "maxlength", label: "Maximum length" },
+    { value: "regex", label: "Regex" },
+  ], { value: "email", "aria-label": "Rule" });
+  const setting = textInput({ "aria-label": "Rule setting", placeholder: "Number" });
+  const settingField = panel("Setting", setting);
+
+  const tableWrap = el("div", { class: "mvb-scroll" });
+  const totalTile = tile("Total");
+  const validTile = tile("Valid");
+  const invalidTile = tile("Invalid");
+  const stats = el("div", { class: "mvb-stats" }, totalTile, validTile, invalidTile);
+  const error = notice("error");
+  let failing = [];
+
+  function needsSetting() {
+    return ["minlength", "maxlength", "regex"].includes(rule.value);
+  }
+
+  function check(value) {
+    switch (rule.value) {
+      case "notempty":
+        return value.trim() ? null : "Empty";
+      case "email":
+        return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value) ? null : "Not an email";
+      case "url":
+        try { new URL(value); return null; } catch { return "Not a URL"; }
+      case "number":
+        return value.trim() !== "" && !Number.isNaN(Number(value)) ? null : "Not a number";
+      case "minlength":
+        return value.length >= Number(setting.value) ? null : `Shorter than ${setting.value}`;
+      case "maxlength":
+        return value.length <= Number(setting.value) ? null : `Longer than ${setting.value}`;
+      case "regex":
+        try { return new RegExp(setting.value).test(value) ? null : "No match"; } catch { return "Invalid pattern"; }
+      default:
+        return null;
+    }
+  }
+
+  function run() {
+    error.write("");
+    settingField.hidden = !needsSetting();
+    setting.placeholder = rule.value === "regex" ? "Pattern" : "Number";
+
+    const raw = source.value.split(/\r?\n/);
+    if (raw.length && raw[raw.length - 1] === "") raw.pop();
+    const values = raw;
+
+    const failures = [];
+    values.forEach((value, i) => {
+      const reason = check(value);
+      if (reason) failures.push({ line: i + 1, value, reason });
+    });
+    failing = failures;
+
+    if (!values.length) {
+      tableWrap.replaceChildren(el("p", { class: "mvb-note" }, "Paste one value per line."));
+    } else if (!failures.length) {
+      tableWrap.replaceChildren(el("p", { class: "mvb-note" }, "Every value passes."));
+    } else {
+      tableWrap.replaceChildren(el("table", { class: "mvb-ttable" },
+        el("thead", {}, el("tr", {}, el("th", {}, "#"), el("th", {}, "Value"), el("th", {}, "Reason"))),
+        el("tbody", {}, ...failures.map((row) => el("tr", {},
+          el("th", {}, String(row.line)),
+          el("td", {}, row.value),
+          el("td", {}, row.reason)
+        )))
+      ));
+    }
+
+    totalTile.set(String(values.length));
+    validTile.set(String(values.length - failures.length));
+    invalidTile.set(String(failures.length));
+  }
+
+  source.addEventListener("input", run);
+  rule.addEventListener("change", run);
+  setting.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Values", source), panel("Rule", rule), settingField, error),
+      stack(stats, panel("Failed rows", tableWrap))
+    ),
+    foot: actions(copyButton(() => failing.map((row) => row.value).join("\n"), "Copy failing values", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/date-difference.js

@@ -0,0 +1,100 @@
+// Counts the gap between two dates in days, weeks and calendar units.
+import { el, bench, stack, panel, textInput, checkbox, notice, copyButton, actions, toolcard } from "../core.js";
+
+const DAY = 86400000;
+
+function parseDate(value) {
+  const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value);
+  if (!match) return null;
+  const year = Number(match[1]);
+  const month = Number(match[2]) - 1;
+  const day = Number(match[3]);
+  const date = new Date(year, month, day);
+  if (date.getFullYear() !== year || date.getMonth() !== month || date.getDate() !== day) return null;
+  return date;
+}
+
+function calendarDiff(from, to) {
+  let years = to.getFullYear() - from.getFullYear();
+  let months = to.getMonth() - from.getMonth();
+  let days = to.getDate() - from.getDate();
+  if (days < 0) {
+    months -= 1;
+    days += new Date(to.getFullYear(), to.getMonth(), 0).getDate();
+  }
+  if (months < 0) {
+    years -= 1;
+    months += 12;
+  }
+  return { years, months, days };
+}
+
+const kvRow = (key, value) =>
+  el("div", { class: "mvb-kv__row" }, el("span", { class: "mvb-kv__k" }, key), el("span", { class: "mvb-kv__v" }, value));
+
+export function mount(slot) {
+  const start = textInput({ type: "date", value: "2026-01-01", "aria-label": "Start date" });
+  const end = textInput({ type: "date", value: "2026-12-31", "aria-label": "End date" });
+  const includeEnd = checkbox("Include the end date", { checked: false });
+  const days = el("span", { class: "mvb-kv__v" }, "-");
+  const weeks = el("span", { class: "mvb-kv__v" }, "-");
+  const calendar = el("span", { class: "mvb-kv__v" }, "-");
+  const kv = el(
+    "div",
+    { class: "mvb-kv" },
+    kvRow("Total days", days),
+    kvRow("Weeks", weeks),
+    kvRow("Calendar gap", calendar)
+  );
+  const error = notice("error");
+  let text = "";
+
+  function clear() {
+    days.textContent = "-";
+    weeks.textContent = "-";
+    calendar.textContent = "-";
+    text = "";
+  }
+
+  function run() {
+    error.write("");
+    const a = parseDate(start.value);
+    const b = parseDate(end.value);
+    if (!a || !b) {
+      clear();
+      error.write("Pick a valid start and end date.");
+      return;
+    }
+    if (b < a) {
+      clear();
+      error.write("The end date is before the start date.");
+      return;
+    }
+    const to = includeEnd.input.checked ? new Date(b.getFullYear(), b.getMonth(), b.getDate() + 1) : b;
+    const total = Math.round((to - a) / DAY);
+    const diff = calendarDiff(a, to);
+    const weekCount = Math.floor(total / 7);
+    const rest = total % 7;
+    days.textContent = String(total);
+    weeks.textContent = rest ? `${weekCount} weeks ${rest} days` : `${weekCount} weeks`;
+    calendar.textContent = `${diff.years} years ${diff.months} months ${diff.days} days`;
+    text = `${total} days`;
+  }
+
+  for (const input of [start, end]) input.addEventListener("input", run);
+  includeEnd.input.addEventListener("change", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Start", start), panel("End", end), includeEnd, error),
+      stack(panel("Difference", kv))
+    ),
+    foot: actions(copyButton(() => text, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/date-format.js

@@ -0,0 +1,107 @@
+// A date typed in one format, written out in the others.
+import { el, bench, stack, panel, textInput, selectInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+const FORMATS = [
+  { value: "iso", label: "ISO (yyyy-mm-dd)" },
+  { value: "dmy", label: "Day first (dd/mm/yyyy)" },
+  { value: "mdy", label: "Month first (mm/dd/yyyy)" },
+];
+
+const pad = (n) => String(n).padStart(2, "0");
+
+function parseDate(text, format) {
+  const raw = text.trim();
+  let year;
+  let month;
+  let day;
+  if (format === "iso") {
+    const match = /^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(raw);
+    if (!match) return null;
+    [year, month, day] = [Number(match[1]), Number(match[2]), Number(match[3])];
+  } else {
+    const match = /^(\d{1,2})[/.\-](\d{1,2})[/.\-](\d{2,4})$/.exec(raw);
+    if (!match) return null;
+    const first = Number(match[1]);
+    const second = Number(match[2]);
+    let rest = Number(match[3]);
+    if (rest < 100) rest += rest < 70 ? 2000 : 1900;
+    if (format === "dmy") [day, month, year] = [first, second, rest];
+    else [month, day, year] = [first, second, rest];
+  }
+  const date = new Date(year, month - 1, day);
+  if (date.getFullYear() !== year || date.getMonth() !== month - 1 || date.getDate() !== day) return null;
+  return date;
+}
+
+function intlFormat(date, options, fallback) {
+  try {
+    return new Intl.DateTimeFormat(undefined, options).format(date);
+  } catch {
+    return fallback;
+  }
+}
+
+const kvRow = (key, value) => el("div", { class: "mvb-kv__row" },
+  el("span", { class: "mvb-kv__k" }, key),
+  el("span", { class: "mvb-kv__v" }, value));
+
+export function mount(slot) {
+  const format = selectInput(FORMATS, { value: "iso", "aria-label": "Input format" });
+  const entry = textInput({ placeholder: "2026-10-15", "aria-label": "Date" });
+
+  const iso = el("span", { class: "mvb-kv__v" }, "-");
+  const long = el("span", { class: "mvb-kv__v" }, "-");
+  const medium = el("span", { class: "mvb-kv__v" }, "-");
+  const weekday = el("span", { class: "mvb-kv__v" }, "-");
+  const unix = el("span", { class: "mvb-kv__v" }, "-");
+  const out = el("div", { class: "mvb-kv" },
+    kvRow("ISO", iso),
+    kvRow("Long", long),
+    kvRow("Medium", medium),
+    kvRow("Weekday", weekday),
+    kvRow("Unix seconds", unix));
+
+  const error = notice("error");
+  const note = notice("note");
+  note.write("Pick the input format so the date is read the way you meant.");
+
+  let isoText = "";
+
+  function run() {
+    const date = parseDate(entry.value, format.value);
+    if (!date) {
+      iso.textContent = "-";
+      long.textContent = "-";
+      medium.textContent = "-";
+      weekday.textContent = "-";
+      unix.textContent = "-";
+      isoText = "";
+      error.write(entry.value.trim() ? "That date does not match the chosen format." : "");
+      return;
+    }
+    error.write("");
+    isoText = `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;
+    iso.textContent = isoText;
+    long.textContent = intlFormat(date, { dateStyle: "long" }, date.toDateString());
+    medium.textContent = intlFormat(date, { dateStyle: "medium" }, date.toDateString());
+    weekday.textContent = intlFormat(date, { weekday: "long" }, "");
+    unix.textContent = String(Math.floor(date.getTime() / 1000));
+  }
+
+  format.addEventListener("change", run);
+  entry.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Input format", format), panel("Date", entry), error),
+      stack(out, note)
+    ),
+    foot: actions(copyButton(() => isoText, "Copy ISO date", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/delimiter-converter.js

@@ -0,0 +1,109 @@
+// Swaps one delimiter for another, keeping quoted fields intact.
+import { el, bench, stack, panel, textArea, selectInput, notice, output, copyButton, actions, toolcard } from "../core.js";
+
+const OPTIONS = [
+  { value: ",", label: "Comma" },
+  { value: ";", label: "Semicolon" },
+  { value: "\t", label: "Tab" },
+  { value: "|", label: "Pipe" },
+];
+
+function parseDelimited(text, delimiter) {
+  const rows = [];
+  let row = [];
+  let field = "";
+  let quoted = false;
+  for (let i = 0; i < text.length; i++) {
+    const char = text[i];
+    if (quoted) {
+      if (char === '"') {
+        if (text[i + 1] === '"') { field += '"'; i++; }
+        else quoted = false;
+      } else field += char;
+    } else if (char === '"') {
+      quoted = true;
+    } else if (char === delimiter) {
+      row.push(field);
+      field = "";
+    } else if (char === "\n") {
+      row.push(field);
+      rows.push(row);
+      row = [];
+      field = "";
+    } else if (char !== "\r") {
+      field += char;
+    }
+  }
+  if (field !== "" || row.length) {
+    row.push(field);
+    rows.push(row);
+  }
+  return rows;
+}
+
+function detectDelimiter(text) {
+  const candidates = [",", ";", "\t", "|"];
+  const first = text.split(/\r?\n/)[0] ?? "";
+  const counts = { ",": 0, ";": 0, "\t": 0, "|": 0 };
+  let quoted = false;
+  for (let i = 0; i < first.length; i++) {
+    const char = first[i];
+    if (char === '"') quoted = !quoted;
+    else if (!quoted && char in counts) counts[char]++;
+  }
+  let best = ",";
+  let bestCount = 0;
+  for (const candidate of candidates) {
+    if (counts[candidate] > bestCount) { bestCount = counts[candidate]; best = candidate; }
+  }
+  return best;
+}
+
+function stringifyCSV(rows, delimiter) {
+  return rows.map((row) => row.map((cell) => {
+    const value = cell == null ? "" : String(cell);
+    const needsQuote = value.includes(delimiter) || /["\n\r]/.test(value) || value !== value.trim();
+    return needsQuote ? `"${value.replace(/"/g, '""')}"` : value;
+  }).join(delimiter)).join("\n");
+}
+
+export function mount(slot) {
+  const source = textArea({ rows: 12, class: "mvb-in mvb-in--area mvb-in--mono", "aria-label": "Data", placeholder: "Paste delimited data here" });
+  const from = selectInput([{ value: "auto", label: "Auto" }, ...OPTIONS], { value: "auto", "aria-label": "Current delimiter" });
+  const to = selectInput(OPTIONS, { value: ";", "aria-label": "New delimiter" });
+  const result = output({ rows: 12 });
+  const error = notice("error");
+  let current = "";
+
+  function run() {
+    error.write("");
+    const text = source.value;
+    if (!text.trim()) {
+      current = "";
+      result.write("");
+      return;
+    }
+    const used = from.value === "auto" ? detectDelimiter(text) : from.value;
+    const rows = parseDelimited(text, used);
+    current = stringifyCSV(rows, to.value);
+    result.write(current);
+  }
+
+  source.addEventListener("input", run);
+  from.addEventListener("change", run);
+  to.addEventListener("change", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Data", source), panel("From", from), panel("To", to), error),
+      stack(panel("Result", result))
+    ),
+    foot: actions(copyButton(() => current, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/discount-calculator.js

@@ -0,0 +1,83 @@
+// One or two discounts on a price, with optional tax added after.
+import { el, bench, stack, panel, numberInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+function fmt(n) {
+  return n.toLocaleString(undefined, { maximumFractionDigits: 2 });
+}
+
+function tile(label) {
+  const value = el("span", { class: "mvb-stat__v" }, "-");
+  const node = el("div", { class: "mvb-stat" }, value, el("span", { class: "mvb-stat__k" }, label));
+  node.set = (text) => { value.textContent = text; };
+  return node;
+}
+
+export function mount(slot) {
+  const price = numberInput({ value: "120", "aria-label": "Original price" });
+  const first = numberInput({ value: "20", "aria-label": "First discount percent" });
+  const second = numberInput({ placeholder: "None", "aria-label": "Second discount percent" });
+  const tax = numberInput({ placeholder: "None", "aria-label": "Tax percent" });
+  const finalTile = tile("Final price");
+  const savedTile = tile("Saved");
+  const effectiveTile = tile("Effective discount");
+  const stats = el("div", { class: "mvb-stats" }, finalTile, savedTile, effectiveTile);
+  const error = notice("error");
+  let text = "";
+
+  function clear() {
+    finalTile.set("-");
+    savedTile.set("-");
+    effectiveTile.set("-");
+    text = "";
+  }
+
+  function run() {
+    error.write("");
+    const p = Number(price.value);
+    const d1 = first.value.trim() === "" ? 0 : Number(first.value);
+    const d2 = second.value.trim() === "" ? 0 : Number(second.value);
+    const t = tax.value.trim() === "" ? 0 : Number(tax.value);
+    if (price.value.trim() === "" || ![p, d1, d2, t].every(Number.isFinite)) {
+      clear();
+      return;
+    }
+    if (p < 0 || d1 < 0 || d2 < 0 || t < 0) {
+      clear();
+      error.write("The price, discounts and tax cannot be negative.");
+      return;
+    }
+    const afterDiscounts = p * (1 - d1 / 100) * (1 - d2 / 100);
+    const finalPrice = afterDiscounts * (1 + t / 100);
+    const saved = p - afterDiscounts;
+    const effective = p === 0 ? 0 : (saved / p) * 100;
+    finalTile.set(fmt(finalPrice));
+    savedTile.set(fmt(saved));
+    effectiveTile.set(`${fmt(effective)}%`);
+    text = `Final price ${fmt(finalPrice)}, saved ${fmt(saved)}, effective discount ${fmt(effective)}%`;
+  }
+
+  price.addEventListener("input", run);
+  first.addEventListener("input", run);
+  second.addEventListener("input", run);
+  tax.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(
+        panel("Original price", price),
+        panel("First discount %", first),
+        panel("Second discount %", second),
+        panel("Tax %", tax),
+        error
+      ),
+      stack(stats)
+    ),
+    foot: actions(copyButton(() => text, "Copy result", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/doi-resolver.js

@@ -0,0 +1,67 @@
+// Cleans a DOI and writes its resolver link.
+import { el, bench, stack, panel, textInput, notice, copyButton, actions, toolcard } from "../core.js";
+
+function kvRow(key) {
+  const value = el("span", { class: "mvb-kv__v" }, "-");
+  const row = el("div", { class: "mvb-kv__row" }, el("span", { class: "mvb-kv__k" }, key), value);
+  return { row, value };
+}
+
+const clean = (raw) =>
+  raw
+    .trim()
+    .replace(/^https?:\/\/(dx\.)?doi\.org\//i, "")
+    .replace(/^doi:\s*/i, "")
+    .trim();
+
+export function mount(slot) {
+  const input = textInput({ placeholder: "10.1000/xyz or https://doi.org/10.1000/xyz", "aria-label": "DOI" });
+  const doiRow = kvRow("Cleaned DOI");
+  const linkRow = kvRow("Resolver URL");
+  const kv = el("div", { class: "mvb-kv" }, doiRow.row, linkRow.row);
+  const error = notice("error");
+  const note = notice("note");
+  note.write("A matching pattern does not prove the DOI is registered.");
+  let link = "";
+
+  function run() {
+    const cleaned = clean(input.value);
+    if (!input.value.trim()) {
+      error.write("");
+      doiRow.value.textContent = "-";
+      linkRow.value.textContent = "-";
+      link = "";
+      return;
+    }
+    if (!/^10\.\d{4,9}\/\S+$/.test(cleaned)) {
+      error.write("That does not look like a DOI.");
+      doiRow.value.textContent = cleaned || "-";
+      linkRow.value.textContent = "-";
+      link = "";
+      return;
+    }
+    error.write("");
+    doiRow.value.textContent = cleaned;
+    link = `https://doi.org/${cleaned}`;
+    linkRow.value.textContent = link;
+  }
+
+  input.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("DOI", input), note, error),
+      stack(panel("Result", kv))
+    ),
+    foot: actions(
+      copyButton(() => doiRow.value.textContent, "Copy DOI"),
+      copyButton(() => link, "Copy link", "fill")
+    ),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/env-formatter.js

@@ -0,0 +1,72 @@
+// Tidies KEY=value lines: sorts the names and flags duplicates.
+import { el, bench, stack, panel, textArea, notice, switchControl, output, copyButton, actions, toolcard } from "../core.js";
+
+function parse(text) {
+  const entries = [];
+  const comments = [];
+  const seen = new Set();
+  const duplicates = [];
+  for (const raw of text.replace(/\r\n?/g, "\n").split("\n")) {
+    const line = raw.trim();
+    if (!line) continue;
+    if (line.startsWith("#")) { comments.push(line); continue; }
+    const at = line.indexOf("=");
+    const key = at === -1 ? line : line.slice(0, at).trim();
+    const value = at === -1 ? null : line.slice(at + 1).trim();
+    if (seen.has(key)) duplicates.push(key);
+    else seen.add(key);
+    entries.push({ key, value });
+  }
+  return { entries, comments, duplicates };
+}
+
+export function mount(slot) {
+  const source = textArea({
+    rows: 12,
+    class: "mvb-in mvb-in--area mvb-in--mono",
+    "aria-label": "Environment variables",
+    placeholder: "KEY=value",
+    value: "API_URL=https://example.com\n# a note\nPORT=3000\nAPI_URL=https://other.com",
+  });
+  const result = output({ rows: 12 });
+  const warn = notice("warn");
+  let sort = true;
+  let keepComments = true;
+
+  const sortSwitch = switchControl("Sort names", { checked: true });
+  sortSwitch.input.addEventListener("change", () => { sort = sortSwitch.input.checked; run(); });
+
+  const commentSwitch = switchControl("Keep comments", { checked: true });
+  commentSwitch.input.addEventListener("change", () => { keepComments = commentSwitch.input.checked; run(); });
+
+  function run() {
+    warn.write("");
+    if (!source.value.trim()) {
+      result.write("");
+      return;
+    }
+    const { entries, comments, duplicates } = parse(source.value);
+    const ordered = sort ? entries.slice().sort((a, b) => a.key.localeCompare(b.key)) : entries;
+    const lines = [];
+    if (keepComments) lines.push(...comments);
+    for (const entry of ordered) lines.push(entry.value === null ? entry.key : `${entry.key}=${entry.value}`);
+    result.write(lines.join("\n"));
+    if (duplicates.length) warn.write(`Duplicate names: ${[...new Set(duplicates)].join(", ")}.`);
+  }
+
+  source.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Options", el("div", { class: "mvb-stack" }, sortSwitch, commentSwitch)), panel("Input", source), warn),
+      stack(panel("Tidied", result))
+    ),
+    foot: actions(copyButton(() => result.textContent, "Copy list", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };