mevebu 2.3.0 → 2.4.0

package/mevebu/libs/js/tools/json-to-yaml.js

@@ -0,0 +1,59 @@
+// Converts JSON to YAML with a vendored writer. Block style by default, flow
+// style on request.
+import { bench, stack, panel, textArea, output, notice, chipRow, downloadButton, copyButton, actions, toolcard } from "../core.js";
+import { dump } from "../vendor/js-yaml.mjs";
+
+const EXAMPLE = '{\n  "service": "api",\n  "replicas": 2,\n  "ports": [8080, 8443],\n  "labels": { "tier": "backend" }\n}';
+
+export function mount(slot) {
+  const source = textArea({ rows: 14, "aria-label": "JSON", value: EXAMPLE });
+  const result = output({ tag: "textarea", rows: 12 });
+  const error = notice("error");
+  let style = "block";
+
+  const chips = chipRow(
+    [{ value: "block", label: "Block" }, { value: "flow", label: "Flow" }],
+    { value: "block", label: "Style", onChange: (value) => { style = value; run(); } },
+  );
+
+  function run() {
+    error.write("");
+    if (!source.value.trim()) {
+      result.value = "";
+      return;
+    }
+    let value;
+    try {
+      value = JSON.parse(source.value);
+    } catch (caught) {
+      result.value = "";
+      error.write(caught.message);
+      return;
+    }
+    result.value = dump(value, {
+      indent: 2,
+      lineWidth: -1,
+      noRefs: true,
+      flowLevel: style === "flow" ? 0 : -1,
+    });
+  }
+
+  source.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("Style", chips), panel("JSON", source), error),
+      stack(panel("YAML", result)),
+    ),
+    foot: actions(
+      downloadButton(() => result.value, "data.yaml", "Download", "text/yaml"),
+      copyButton(() => result.value, "Copy YAML", "fill"),
+    ),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/xml-minifier.js

@@ -0,0 +1,103 @@
+// Compacts XML by dropping indentation between tags. CDATA, comments,
+// processing instructions and attribute values are copied unchanged.
+import { el, bench, stack, panel, textArea, output, notice, copyButton, actions, toolcard } from "../core.js";
+import { bytes } from "../js-tokens.js";
+
+const EXAMPLE = '<?xml version="1.0"?>\n<config>\n  <server host="localhost" port="8080">\n    <name>api</name>\n  </server>\n  <note><![CDATA[keep  this  spacing]]></note>\n</config>';
+
+const tile = (key, value) =>
+  el("div", { class: "grid gap-0.5 rounded-r1 border border-orbit bg-deck-2 px-3.5 py-3" },
+    el("span", { class: "wrap-anywhere text-xl font-bold tracking-[-0.02em] tabular-nums" }, value),
+    el("span", { class: "text-2xs font-semibold text-ink-3" }, key));
+
+function minify(source) {
+  let out = "";
+  let i = 0;
+
+  while (i < source.length) {
+    if (source.startsWith("<![CDATA[", i)) {
+      const end = source.indexOf("]]>", i + 9);
+      if (end === -1) return { error: "Unclosed CDATA section." };
+      out += source.slice(i, end + 3);
+      i = end + 3;
+      continue;
+    }
+    if (source.startsWith("<!--", i)) {
+      const end = source.indexOf("-->", i + 4);
+      if (end === -1) return { error: "Unclosed comment." };
+      out += source.slice(i, end + 3);
+      i = end + 3;
+      continue;
+    }
+    if (source[i] === "<") {
+      let j = i + 1;
+      let quote = null;
+      while (j < source.length) {
+        const ch = source[j];
+        if (quote) {
+          if (ch === quote) quote = null;
+        } else if (ch === '"' || ch === "'") {
+          quote = ch;
+        } else if (ch === ">") {
+          break;
+        }
+        j++;
+      }
+      if (j >= source.length) return { error: "Unclosed tag." };
+      out += source.slice(i, j + 1);
+      i = j + 1;
+      continue;
+    }
+
+    let j = source.indexOf("<", i);
+    if (j === -1) j = source.length;
+    const text = source.slice(i, j);
+    if (!/^\s+$/.test(text) || !text.includes("\n")) out += text;
+    i = j;
+  }
+
+  return { text: out };
+}
+
+export function mount(slot) {
+  const source = textArea({ rows: 14, "aria-label": "XML", value: EXAMPLE });
+  const result = output({ tag: "textarea", rows: 12 });
+  const stats = el("div", { class: "grid gap-2.5 [grid-template-columns:repeat(auto-fit,minmax(120px,1fr))]" });
+  const error = notice("error");
+
+  function run() {
+    error.write("");
+    stats.replaceChildren();
+    if (!source.value.trim()) {
+      result.value = "";
+      return;
+    }
+    const output = minify(source.value);
+    if (output.error) {
+      result.value = "";
+      error.write(output.error);
+      return;
+    }
+    const before = bytes(source.value);
+    const after = bytes(output.text);
+    const saved = before ? Math.max(0, Math.round((1 - after / before) * 100)) : 0;
+    result.value = output.text;
+    stats.append(tile("Before", `${before} B`), tile("After", `${after} B`), tile("Saved", `${saved}%`));
+  }
+
+  source.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("XML", source), error),
+      stack(panel("Minified", result), stats),
+    ),
+    foot: actions(copyButton(() => result.value, "Copy XML", "fill")),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/tools/yaml-to-json.js

@@ -0,0 +1,46 @@
+// Converts YAML to JSON with a vendored parser. Anchors are resolved and the
+// key order is kept.
+import { bench, stack, panel, textArea, output, notice, downloadButton, copyButton, actions, toolcard } from "../core.js";
+import { load } from "../vendor/js-yaml.mjs";
+
+const EXAMPLE = "service: api\nreplicas: 2\nports:\n  - 8080\n  - 8443\nlabels:\n  tier: backend";
+
+export function mount(slot) {
+  const source = textArea({ rows: 14, "aria-label": "YAML", value: EXAMPLE });
+  const result = output({ tag: "textarea", rows: 12 });
+  const error = notice("error");
+  function run() {
+    error.write("");
+    if (!source.value.trim()) {
+      result.value = "";
+      return;
+    }
+    try {
+      result.value = JSON.stringify(load(source.value), null, 2);
+    } catch (caught) {
+      result.value = "";
+      const line = caught.mark?.line;
+      const where = typeof line === "number" ? `Line ${line + 1}: ` : "";
+      error.write(`${where}${caught.reason ?? caught.message}`);
+    }
+  }
+
+  source.addEventListener("input", run);
+
+  const card = toolcard({
+    body: bench(
+      stack(panel("YAML", source), error),
+      stack(panel("JSON", result)),
+    ),
+    foot: actions(
+      downloadButton(() => result.value, "data.json", "Download", "application/json"),
+      copyButton(() => result.value, "Copy JSON", "fill"),
+    ),
+  });
+  slot.append(card.node);
+  run();
+
+  return {};
+}
+
+export default { mount };

package/mevebu/libs/js/vendor/js-yaml.LICENSE

@@ -0,0 +1,21 @@
+(The MIT License)
+
+Copyright (C) 2011-2015 by Vitaly Puzrin
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.