jsmdcui 0.4.0 → 0.6.3

package/src/cui/rpc.mjs

@@ -9,6 +9,208 @@ let apilist = new Map()
 
 export const jss = JSON.stringify
 
+function parseDollarIdentity(input, { selector = false } = {})
+{
+  const text = String(input ?? "").trim();
+  const match = text.match(/^([A-Za-z_][\w:-]*)?(?:#([A-Za-z_][\w:-]*))?((?:\.[A-Za-z_][\w:-]*)*)$/);
+  if (!match || (!match[1] && !match[2] && !match[3])) return null;
+  if (!selector && !match[1]) return null;
+  return {
+    tag: match[1] || null,
+    id: match[2] || null,
+    classes: match[3] ? match[3].slice(1).split(".") : [],
+  };
+}
+
+function matchesDollarIdentity(identity, selector)
+{
+  if (selector.tag && identity.tag !== selector.tag) return false;
+  if (selector.id && identity.id !== selector.id) return false;
+  return selector.classes.every(name => identity.classes.includes(name));
+}
+
+function findMarkdownCodeElement(documentObject, selector)
+{
+  for (const code of documentObject?.querySelectorAll?.("pre > code") ?? []) {
+    for (const className of code.classList ?? []) {
+      if (!className.startsWith("language-")) continue;
+      const identity = parseDollarIdentity(className.slice("language-".length));
+      if (identity && matchesDollarIdentity(identity, selector)) return code;
+    }
+  }
+  return null;
+}
+
+function findWebDollarElement(documentObject, selectorText, selector)
+{
+  try {
+    const direct = documentObject?.querySelector?.(String(selectorText));
+    if (direct) return direct;
+  } catch {}
+
+  for (const element of documentObject?.querySelectorAll?.("[data-mdcui-tag]") ?? []) {
+    const identity = {
+      tag: element.getAttribute?.("data-mdcui-tag") || null,
+      id: element.id || null,
+      classes: [...(element.classList ?? [])],
+    };
+    if (matchesDollarIdentity(identity, selector)) return element;
+  }
+
+  return findMarkdownCodeElement(documentObject, selector);
+}
+
+function webDollarValue(element)
+{
+  if (element && "value" in element) return String(element.value ?? "");
+  return String(element?.textContent ?? "").replace(/\n$/, "");
+}
+
+function isWebHeading(element)
+{
+  return /^h[1-6]$/i.test(String(element?.tagName ?? ""));
+}
+
+function firstHeadingTaskList(heading)
+{
+  for (let sibling = heading?.nextElementSibling; sibling; sibling = sibling.nextElementSibling) {
+    if (isWebHeading(sibling) || String(sibling.tagName ?? "").toLowerCase() === "section")
+      break;
+    const task = sibling.matches?.("li.task-list-item")
+      ? sibling
+      : sibling.querySelector?.("li.task-list-item");
+    if (!task) continue;
+    const list = task.closest?.("ul, ol");
+    if (list) return list;
+  }
+  return null;
+}
+
+function directTaskCheckbox(item)
+{
+  for (const checkbox of item?.querySelectorAll?.('input[type="checkbox"]') ?? []) {
+    if (checkbox.closest?.("li.task-list-item") === item) return checkbox;
+  }
+  return null;
+}
+
+function webTaskItemValue(item, checkbox)
+{
+  const label = checkbox?.closest?.("label");
+  if (label && label.closest?.("li.task-list-item") === item)
+    return String(label.textContent ?? "").trim();
+
+  const copy = item.cloneNode?.(true);
+  for (const nested of copy?.querySelectorAll?.("ul, ol") ?? []) nested.remove?.();
+  for (const input of copy?.querySelectorAll?.('input[type="checkbox"]') ?? []) input.remove?.();
+  return String(copy?.textContent ?? "").trim();
+}
+
+function webHeadingValue(heading)
+{
+  const single = String(heading?.id ?? "").startsWith("select");
+  const list = firstHeadingTaskList(heading);
+  if (!list) return single ? null : [];
+
+  const selected = [];
+  for (const item of list.children ?? []) {
+    if (!item.matches?.("li.task-list-item")) continue;
+    const checkbox = directTaskCheckbox(item);
+    if (!checkbox?.checked) continue;
+    const value = webTaskItemValue(item, checkbox);
+    if (single) return value;
+    selected.push(value);
+  }
+  return single ? null : selected;
+}
+
+function resizeWebTextarea(element)
+{
+  if (!element || String(element.tagName ?? "").toLowerCase() !== "textarea") return;
+  try {
+    element.style.height = "auto";
+    element.style.height = `${element.scrollHeight}px`;
+    const lineHeight = Number.parseFloat(
+      element.ownerDocument?.defaultView?.getComputedStyle?.(element)?.lineHeight,
+    );
+    if (Number.isFinite(lineHeight) && lineHeight > 0)
+      element.rows = Math.max(1, Math.ceil(element.scrollHeight / lineHeight));
+  } catch {}
+}
+
+function installWebTextareaResize(target)
+{
+  const documentObject = target?.document;
+  if (!documentObject || documentObject.__mdcuiTextareaResizeInstalled) return;
+  documentObject.__mdcuiTextareaResizeInstalled = true;
+  const resizeAll = () => {
+    for (const element of documentObject.querySelectorAll?.("textarea[data-mdcui-tag]") ?? [])
+      resizeWebTextarea(element);
+  };
+  documentObject.addEventListener?.("input", event => {
+    if (event.target?.matches?.("textarea[data-mdcui-tag]"))
+      resizeWebTextarea(event.target);
+  });
+  target.addEventListener?.("resize", resizeAll);
+  if (documentObject.readyState === "loading")
+    documentObject.addEventListener?.("DOMContentLoaded", resizeAll, { once: true });
+  else
+    queueMicrotask(resizeAll);
+}
+
+export function createWebDollar(documentObject = globalThis.document)
+{
+  return function $(selectorText) {
+    const selector = parseDollarIdentity(selectorText, { selector: true });
+    const selection = {
+      html() {
+        try {
+          const element = findWebDollarElement(documentObject, selectorText, selector);
+          return element ? String(element.innerHTML ?? "") : "";
+        } catch {
+          return "";
+        }
+      },
+      val(...args) {
+        try {
+          const element = findWebDollarElement(documentObject, selectorText, selector);
+          if (!element) return args.length > 0 ? selection : "";
+          if (isWebHeading(element)) {
+            if (args.length > 0) return selection;
+            return webHeadingValue(element);
+          }
+          if (!selector) return args.length > 0 ? selection : "";
+          if (args.length > 0) {
+            const value = String(args[0] ?? "");
+            if ("value" in element) {
+              element.value = value;
+              resizeWebTextarea(element);
+            }
+            else element.textContent = value;
+            return selection;
+          }
+          return webDollarValue(element);
+        } catch {
+          return args.length > 0 ? selection : "";
+        }
+      },
+    };
+    return selection;
+  };
+}
+
+export function installWebDollar(target = globalThis)
+{
+  if (!target?.document) return target?.$;
+  const $ = createWebDollar(target.document);
+  target.$ = $;
+  installWebTextareaResize(target);
+  return $;
+}
+
+if (typeof globalThis.document !== "undefined")
+  installWebDollar(globalThis);
+
 
 export async function evalBack(backmod, qjson)
 {
@@ -99,8 +301,11 @@ try{
 
     text = text.replace(/^javascript:/, "");
 
-    const names = Object.keys(mod);
-    const values = Object.values(mod).map(safeFrontValue);
+    const entries = Object.entries(mod).filter(([name]) => name !== "$");
+    if (typeof globalThis.$ === "function")
+      entries.push(["$", globalThis.$]);
+    const names = entries.map(([name]) => name);
+    const values = entries.map(([, value]) => safeFrontValue(value));
 
     try {
       return await new AsyncFunction(...names, `return await (${text})`)(...values);

package/src/cui/task-checkbox.mjs

@@ -0,0 +1,16 @@
+export function toggleTaskCheckboxBeforeColumn(line, column) {
+  const text = String(line ?? "");
+  const end = Math.max(0, Math.min(text.length, Math.trunc(Number(column) || 0) + 1));
+  const prefix = text.slice(0, end);
+  const uncheckedAt = prefix.lastIndexOf("☐");
+  const checkedAt = prefix.lastIndexOf("☒");
+  const checkboxAt = Math.max(uncheckedAt, checkedAt);
+
+  if (checkboxAt < 0) return { line: text, toggled: false };
+
+  const replacement = text[checkboxAt] === "☐" ? "☒" : "☐";
+  return {
+    line: text.slice(0, checkboxAt) + replacement + text.slice(checkboxAt + 1),
+    toggled: true,
+  };
+}