@livx.cc/bare-v3 0.1.0-alpha.10

package/dist/ui.js

@@ -0,0 +1,598 @@
+// src/interactions/commands.js
+function commands({ root, document: document2, options }) {
+  for (const dialog of root.querySelectorAll("dialog[data-b3-command]")) {
+    let select = function(item, scroll = true) {
+      active = item || null;
+      for (const option of list.querySelectorAll('[role="option"]'))
+        option.setAttribute("aria-selected", String(option === active));
+      if (active) {
+        input.setAttribute("aria-activedescendant", active.id);
+        if (scroll)
+          active.scrollIntoView({ block: "nearest" });
+      } else
+        input.removeAttribute("aria-activedescendant");
+    }, filter = function() {
+      const terms = input.value.trim().toLocaleLowerCase().split(/\s+/).filter(Boolean);
+      const items = [...list.querySelectorAll('[role="option"]')];
+      for (const item of items) {
+        const text = `${item.textContent} ${item.dataset.b3Keywords || ""}`.toLocaleLowerCase();
+        item.hidden = !terms.every((term) => text.includes(term));
+      }
+      for (const group of list.querySelectorAll('[role="group"]'))
+        group.hidden = ![...group.querySelectorAll('[role="option"]')].some((item) => !item.hidden);
+      const matches = items.filter((item) => !item.hidden);
+      available = matches.filter((item) => item.id && item.getAttribute("aria-disabled") !== "true");
+      list.hidden = !matches.length;
+      input.setAttribute("aria-expanded", String(dialog.open && !!matches.length));
+      if (empty)
+        empty.hidden = !!matches.length;
+      if (status)
+        status.textContent = `${available.length} ${available.length === 1 ? "action" : "actions"} available.`;
+      select(available[0], false);
+    }, choose = function(item) {
+      if (!item || !available.includes(item) || item.hidden || item.getAttribute("aria-disabled") === "true" || !list.contains(item))
+        return;
+      const accepted = dialog.dispatchEvent(new document2.defaultView.CustomEvent("b3:command", {
+        bubbles: true,
+        cancelable: true,
+        detail: { value: item.dataset.b3Value, item }
+      }));
+      if (accepted)
+        dialog.close();
+    };
+    const input = dialog.querySelector('input[role="combobox"]');
+    const list = dialog.querySelector('[role="listbox"]');
+    if (!input || !list?.id || input.getAttribute("aria-controls") !== list.id)
+      continue;
+    const empty = dialog.querySelector("[data-b3-command-empty]");
+    const status = dialog.querySelector("[data-b3-command-status]");
+    let active = null;
+    let available = [];
+    input.addEventListener("input", filter, options);
+    input.addEventListener("keydown", (event) => {
+      if (event.isComposing || event.altKey || event.ctrlKey || event.metaKey)
+        return;
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+        event.preventDefault();
+        if (!available.length)
+          return;
+        const index = available.indexOf(active);
+        const next = event.key === "ArrowDown" ? Math.min(index + 1, available.length - 1) : Math.max(index - 1, 0);
+        select(available[next]);
+      } else if (event.key === "Enter") {
+        event.preventDefault();
+        choose(active);
+      }
+    }, options);
+    list.addEventListener("pointerdown", (event) => {
+      if (event.target.closest('[role="option"]'))
+        event.preventDefault();
+    }, options);
+    list.addEventListener("click", (event) => {
+      choose(event.target.closest('[role="option"]'));
+    }, options);
+    const observer = new document2.defaultView.MutationObserver(() => {
+      if (dialog.open) {
+        input.value = "";
+        filter();
+      } else {
+        input.setAttribute("aria-expanded", "false");
+        input.removeAttribute("aria-activedescendant");
+      }
+    });
+    observer.observe(dialog, { attributes: true, attributeFilter: ["open"] });
+    options.signal.addEventListener("abort", () => observer.disconnect(), { once: true });
+    filter();
+  }
+}
+
+// src/interactions/outline.js
+function outline({ root, document: document2, find, options }) {
+  const view = document2.defaultView;
+  const outlines = [...root.querySelectorAll("[data-b3-toc]")].map((nav) => {
+    const items = [...nav.querySelectorAll('a[href^="#"]')].flatMap((link) => {
+      let id;
+      try {
+        id = decodeURIComponent(link.getAttribute("href").slice(1));
+      } catch {
+        return [];
+      }
+      const heading = find(id);
+      return heading ? [{ link, heading }] : [];
+    });
+    return items;
+  }).filter((items) => items.length);
+  if (!outlines.length)
+    return;
+  let frame = 0;
+  function update() {
+    frame = 0;
+    for (const items of outlines) {
+      const visible = items.filter(({ heading }) => heading.getClientRects().length);
+      let active = visible[0];
+      for (const item of visible) {
+        const offset = parseFloat(view.getComputedStyle(item.heading).scrollMarginBlockStart) || 0;
+        if (item.heading.getBoundingClientRect().top <= offset + 1)
+          active = item;
+      }
+      if (view.scrollY > 0 && view.scrollY + view.innerHeight >= document2.documentElement.scrollHeight - 2)
+        active = visible.at(-1);
+      for (const item of items) {
+        if (item === active)
+          item.link.setAttribute("aria-current", "location");
+        else
+          item.link.removeAttribute("aria-current");
+      }
+    }
+  }
+  function schedule() {
+    if (!frame)
+      frame = view.requestAnimationFrame(update);
+  }
+  view.addEventListener("scroll", schedule, { ...options, passive: true });
+  view.addEventListener("resize", schedule, options);
+  view.addEventListener("hashchange", schedule, options);
+  options.signal.addEventListener("abort", () => view.cancelAnimationFrame(frame), { once: true });
+  update();
+}
+
+// src/interactions/tabs.js
+function tabs({ root, document: document2, find, options }) {
+  function activate(tab, focus = false) {
+    const list = tab.closest('[role="tablist"]');
+    if (!list || tab.disabled)
+      return;
+    for (const item of list.querySelectorAll('[role="tab"]')) {
+      if (item.closest('[role="tablist"]') !== list)
+        continue;
+      const selected = item === tab;
+      item.setAttribute("aria-selected", String(selected));
+      item.tabIndex = selected ? 0 : -1;
+      const panel = find(item.getAttribute("aria-controls"));
+      if (panel)
+        panel.hidden = !selected;
+    }
+    if (focus)
+      tab.focus();
+  }
+  for (const list of root.querySelectorAll('[role="tablist"][data-b3-tabs]')) {
+    const tabs2 = [...list.querySelectorAll('[role="tab"]')].filter((tab) => !tab.disabled && tab.closest('[role="tablist"]') === list);
+    const selected = tabs2.find((tab) => tab.getAttribute("aria-selected") === "true") || tabs2[0];
+    if (selected)
+      activate(selected);
+  }
+  root.addEventListener("click", (event) => {
+    const target = event.target.closest?.('[role="tab"]');
+    if (target && !target.disabled && target.closest("[data-b3-tabs]"))
+      activate(target);
+  }, options);
+  root.addEventListener("keydown", (event) => {
+    const tab = event.target.closest?.('[role="tab"]');
+    const list = tab?.closest('[role="tablist"][data-b3-tabs]');
+    if (list) {
+      const tabs2 = [...list.querySelectorAll('[role="tab"]')].filter((item) => !item.disabled && item.closest('[role="tablist"]') === list);
+      const index = tabs2.indexOf(tab);
+      const vertical = list.getAttribute("aria-orientation") === "vertical";
+      const rtl = document2.defaultView.getComputedStyle(list).direction === "rtl";
+      const next = vertical ? "ArrowDown" : rtl ? "ArrowLeft" : "ArrowRight";
+      const previous = vertical ? "ArrowUp" : rtl ? "ArrowRight" : "ArrowLeft";
+      let destination;
+      if (event.key === next)
+        destination = tabs2[(index + 1) % tabs2.length];
+      if (event.key === previous)
+        destination = tabs2[(index - 1 + tabs2.length) % tabs2.length];
+      if (event.key === "Home")
+        destination = tabs2[0];
+      if (event.key === "End")
+        destination = tabs2.at(-1);
+      if (destination) {
+        event.preventDefault();
+        activate(destination, true);
+      }
+    }
+  }, options);
+}
+
+// src/interactions/disclosures.js
+function disclosures({ root, document: document2, options }) {
+  function placeDisclosure(disclosure) {
+    const panel = disclosure.querySelector(".b3-dropdown-panel");
+    if (!panel || !disclosure.open)
+      return;
+    panel.style.transform = "";
+    panel.style.insetBlockStart = "";
+    panel.style.insetBlockEnd = "";
+    const viewport = document2.defaultView;
+    const bounds = panel.getBoundingClientRect();
+    const shift = bounds.left < 8 ? 8 - bounds.left : bounds.right > viewport.innerWidth - 8 ? viewport.innerWidth - 8 - bounds.right : 0;
+    panel.style.transform = `translateX(${shift}px)`;
+    if (bounds.bottom > viewport.innerHeight - 8 && disclosure.getBoundingClientRect().top > bounds.height + 8) {
+      panel.style.insetBlockStart = "auto";
+      panel.style.insetBlockEnd = "calc(100% + .5rem)";
+    }
+  }
+  root.addEventListener("toggle", (event) => {
+    if (event.target.matches?.("details.b3-dropdown"))
+      placeDisclosure(event.target);
+  }, { ...options, capture: true });
+  document2.defaultView.addEventListener("resize", () => {
+    root.querySelectorAll("details.b3-dropdown[open]").forEach(placeDisclosure);
+  }, options);
+  root.addEventListener("keydown", (event) => {
+    if (event.key === "Escape") {
+      const disclosure = event.target.closest?.("details.b3-dropdown[open]");
+      if (disclosure) {
+        disclosure.open = false;
+        disclosure.querySelector("summary")?.focus();
+      }
+    }
+  }, options);
+  root.addEventListener("click", (event) => {
+    for (const disclosure of root.querySelectorAll("details.b3-dropdown[open]")) {
+      if (!disclosure.contains(event.target))
+        disclosure.open = false;
+    }
+  }, options);
+}
+
+// src/interactions/dialog-focus.js
+function dialogFocus({ root, document: document2, options }) {
+  const prepared = new Map;
+  const restore = (title) => {
+    const original = prepared.get(title);
+    if (!original)
+      return;
+    for (const [name, value] of Object.entries(original)) {
+      const owned = name === "tabindex" ? "-1" : "";
+      if (title.getAttribute(name) !== owned)
+        continue;
+      if (value === null)
+        title.removeAttribute(name);
+      else
+        title.setAttribute(name, value);
+    }
+    prepared.delete(title);
+  };
+  const prepare = (dialog) => {
+    if (!dialog.matches?.("dialog.b3-sheet"))
+      return;
+    const explicit = [...dialog.querySelectorAll("[autofocus]")].find((node) => !prepared.has(node));
+    if (explicit) {
+      for (const title2 of prepared.keys())
+        if (dialog.contains(title2))
+          restore(title2);
+      return;
+    }
+    const id = dialog.getAttribute("aria-labelledby")?.trim().split(/\s+/)[0];
+    const title = id && document2.getElementById(id);
+    if (!title || !dialog.contains(title) || prepared.has(title))
+      return;
+    prepared.set(title, Object.fromEntries(["tabindex", "autofocus", "data-b3-initial-focus"].map((name) => [name, title.getAttribute(name)])));
+    title.setAttribute("tabindex", "-1");
+    title.setAttribute("autofocus", "");
+    title.setAttribute("data-b3-initial-focus", "");
+  };
+  prepare(root);
+  for (const dialog of root.querySelectorAll("dialog.b3-sheet"))
+    prepare(dialog);
+  root.addEventListener("beforetoggle", (event) => {
+    if (event.newState === "open")
+      prepare(event.target);
+  }, { ...options, capture: true });
+  options.signal.addEventListener("abort", () => {
+    for (const title of prepared.keys())
+      restore(title);
+  }, { once: true });
+}
+
+// src/interactions/motion.js
+var running = new WeakMap;
+var ease = "cubic-bezier(.16,1,.3,1)";
+var presets = {
+  enter: { keyframes: [{ opacity: 0, transform: "translateY(12px) scale(.985)" }, { opacity: 1, transform: "none" }], duration: 320 },
+  exit: { keyframes: [{ opacity: 1, transform: "none" }, { opacity: 0, transform: "translateY(-6px) scale(.98)" }], duration: 180, easing: "cubic-bezier(.4,0,1,1)" },
+  update: { keyframes: [{ opacity: 0.35 }, { opacity: 1 }], duration: 180 },
+  confirm: { keyframes: [{ transform: "scale(.9)" }, { transform: "scale(1.08)", offset: 0.5 }, { transform: "scale(.985)", offset: 0.8 }, { transform: "scale(1)" }], duration: 380 },
+  reveal: { keyframes: [{ opacity: 0, clipPath: "inset(0 0 100%)", transform: "translateY(8px)" }, { opacity: 1, clipPath: "inset(0)", transform: "none" }], duration: 440 }
+};
+var reducedMotion = (element) => element.ownerDocument?.defaultView?.matchMedia("(prefers-reduced-motion: reduce)").matches || element.closest('[data-b3-motion="reduce"]');
+function play(element, keyframes, options) {
+  running.get(element)?.cancel();
+  if (!element.isConnected || !element.animate || reducedMotion(element))
+    return null;
+  const animation = element.animate(keyframes, { easing: ease, fill: "backwards", ...options });
+  running.set(element, animation);
+  const preference = element.ownerDocument.defaultView.matchMedia("(prefers-reduced-motion: reduce)");
+  const reduce = () => {
+    if (preference.matches)
+      animation.cancel();
+  };
+  preference.addEventListener("change", reduce);
+  const cleanup = () => {
+    preference.removeEventListener("change", reduce);
+    if (running.get(element) === animation)
+      running.delete(element);
+  };
+  animation.addEventListener("finish", cleanup, { once: true });
+  animation.addEventListener("cancel", cleanup, { once: true });
+  return animation;
+}
+function motion(element, intent = "update", options = {}) {
+  const preset = presets[intent];
+  if (!preset)
+    throw new TypeError(`Unknown motion intent: ${intent}`);
+  return play(element, preset.keyframes, { duration: preset.duration, easing: preset.easing || ease, delay: Math.min(200, Math.max(0, options.delay || 0)) });
+}
+function sequence(elements, intent = "enter") {
+  return Array.from(elements, (element, index) => motion(element, intent, { delay: Math.min(index * 45, 180) })).filter(Boolean);
+}
+function layout(root, update) {
+  const measure = () => {
+    const entries = new Map;
+    for (const element of root.querySelectorAll("[data-b3-layout]")) {
+      const key = element.dataset.b3Layout;
+      if (!key || entries.has(key))
+        throw new Error("Layout motion requires unique, non-empty data-b3-layout keys");
+      entries.set(key, { element, rect: element.getBoundingClientRect() });
+    }
+    return entries;
+  };
+  const before = measure();
+  for (const { element } of before.values())
+    running.get(element)?.cancel();
+  update();
+  const animations = [];
+  for (const [key, { element, rect }] of measure()) {
+    const previous = before.get(key);
+    if (!previous || previous.element !== element) {
+      const a = motion(element, "enter");
+      if (a)
+        animations.push(a);
+      continue;
+    }
+    const from = previous.rect;
+    if (!rect.width || !rect.height || !from.width || !from.height)
+      continue;
+    const x = from.x - rect.x, y = from.y - rect.y;
+    const sx = from.width / rect.width, sy = from.height / rect.height;
+    if (Math.abs(x) + Math.abs(y) + Math.abs(sx - 1) + Math.abs(sy - 1) < 0.01)
+      continue;
+    const animation = play(element, [
+      { transformOrigin: "top left", transform: `translate(${x}px,${y}px) scale(${sx},${sy})` },
+      { transformOrigin: "top left", transform: "none" }
+    ], { duration: 420 });
+    if (animation)
+      animations.push(animation);
+  }
+  return animations;
+}
+function settle(element, { x = 0, y = 0 } = {}) {
+  if (!Number.isFinite(x) || !Number.isFinite(y))
+    throw new TypeError("Settle displacement must be finite");
+  const frames = Array.from({ length: 41 }, (_, index) => {
+    const t = index / 40;
+    const amount = index === 40 ? 0 : Math.exp(-7 * t) * (Math.cos(11 * t) + 0.6 * Math.sin(11 * t));
+    return { offset: t, transform: `translate(${x * amount}px,${y * amount}px)` };
+  });
+  return play(element, frames, { duration: 460, easing: "linear" });
+}
+
+// src/interactions/sheets.js
+function sheets({ root, document: document2, options, dismiss }) {
+  let drag = null, suppressClick = null;
+  const settling = new Map;
+  const reset = (state, animate = true) => {
+    const { dialog, handle, pointerId, distance } = state;
+    drag = null;
+    delete dialog.dataset.b3Dragging;
+    dialog.style.removeProperty("transform");
+    if (handle.hasPointerCapture(pointerId))
+      handle.releasePointerCapture(pointerId);
+    if (animate && distance && dialog.open && !reducedMotion(dialog)) {
+      const animation = settle(dialog, { y: distance });
+      if (!animation)
+        return;
+      settling.set(dialog, animation);
+      animation.finished.catch(() => {}).finally(() => {
+        if (settling.get(dialog) === animation)
+          settling.delete(dialog);
+      });
+    }
+  };
+  root.addEventListener("pointerdown", (event) => {
+    suppressClick = null;
+    const handle = event.target.closest?.(".b3-sheet-handle");
+    const dialog = handle?.closest('dialog.b3-sheet[data-b3-drag="dismiss"]:modal');
+    if (!dialog || drag || !event.isPrimary || event.button !== 0 || dialog.hasAttribute("data-b3-closing"))
+      return;
+    settling.get(dialog)?.cancel();
+    for (const animation of dialog.getAnimations())
+      animation.cancel();
+    drag = { dialog, handle, pointerId: event.pointerId, y: event.clientY, distance: 0, moved: false };
+    dialog.dataset.b3Dragging = "";
+    handle.setPointerCapture(event.pointerId);
+  }, options);
+  root.addEventListener("pointermove", (event) => {
+    if (!drag || event.pointerId !== drag.pointerId)
+      return;
+    drag.distance = Math.max(0, event.clientY - drag.y);
+    drag.moved ||= Math.abs(event.clientY - drag.y) > 6;
+    drag.dialog.style.transform = `translateY(${drag.distance}px)`;
+  }, options);
+  root.addEventListener("pointerup", (event) => {
+    if (!drag || event.pointerId !== drag.pointerId)
+      return;
+    const state = drag;
+    if (state.moved)
+      suppressClick = { pointerId: state.pointerId, handle: state.handle };
+    const threshold = Math.min(120, state.dialog.offsetHeight * 0.25);
+    if (state.moved && state.distance >= threshold) {
+      const accepted = dismiss(state.dialog);
+      reset(state, !accepted);
+    } else
+      reset(state);
+  }, options);
+  const cancel = (event) => {
+    if (drag && event.pointerId === drag.pointerId)
+      reset(drag);
+  };
+  root.addEventListener("pointercancel", cancel, options);
+  root.addEventListener("lostpointercapture", cancel, options);
+  root.addEventListener("click", (event) => {
+    const suppressed = suppressClick;
+    suppressClick = null;
+    if (suppressed && event.detail !== 0 && (event.pointerId === suppressed.pointerId || suppressed.handle.contains(event.target))) {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+    }
+  }, { ...options, capture: true });
+  root.addEventListener("close", (event) => {
+    if (drag?.dialog === event.target)
+      reset(drag, false);
+    settling.get(event.target)?.cancel();
+  }, { ...options, capture: true });
+  options.signal.addEventListener("abort", () => {
+    if (drag)
+      reset(drag, false);
+    for (const animation of settling.values())
+      animation.cancel();
+    settling.clear();
+  }, { once: true });
+}
+
+// src/interactions/dialogs.js
+function dialogs({ root, document: document2, find, options }) {
+  dialogFocus({ root, document: document2, options });
+  const openers = new WeakMap;
+  const closing = new Map;
+  let backdropStart = null;
+  let backdropEnd = null;
+  const outside = (event, dialog) => {
+    const r = dialog.getBoundingClientRect();
+    return event.clientX < r.left || event.clientX > r.right || event.clientY < r.top || event.clientY > r.bottom;
+  };
+  const dismiss = (dialog) => {
+    if (!dialog.open || closing.has(dialog))
+      return false;
+    if (!dialog.dispatchEvent(new Event("cancel", { cancelable: true })))
+      return false;
+    if (reducedMotion(dialog) || !dialog.animate) {
+      dialog.close();
+      return true;
+    }
+    const css = document2.defaultView.getComputedStyle(dialog);
+    const end = dialog.matches(".b3-sheet") ? "translateY(100%)" : dialog.dataset.b3Placement === "end" ? `translateX(${css.direction === "rtl" ? "-" : ""}100%)` : "scale(.985)";
+    const animation = dialog.animate([{ transform: css.transform, opacity: 1 }, { transform: end, opacity: 0 }], { duration: 160, easing: "cubic-bezier(.4, 0, 1, 1)" });
+    closing.set(dialog, animation);
+    dialog.dataset.b3Closing = "";
+    animation.finished.then(() => {
+      if (dialog.open)
+        dialog.close();
+    }, () => {}).finally(() => {
+      closing.delete(dialog);
+      delete dialog.dataset.b3Closing;
+    });
+    return true;
+  };
+  root.addEventListener("cancel", (event) => {
+    if (!event.cancelable || event.defaultPrevented || !event.isTrusted || !event.target.matches?.("dialog.b3-dialog,dialog.b3-sheet"))
+      return;
+    event.preventDefault();
+    event.stopImmediatePropagation();
+    dismiss(event.target);
+  }, { ...options, capture: true });
+  sheets({ root, document: document2, options, dismiss });
+  options.signal.addEventListener("abort", () => {
+    for (const [dialog, animation] of closing) {
+      animation.cancel();
+      delete dialog.dataset.b3Closing;
+    }
+    closing.clear();
+  }, { once: true });
+  root.addEventListener("pointerdown", (event) => {
+    const dialog = event.target;
+    backdropEnd = null;
+    backdropStart = event.isPrimary && event.button === 0 && dialog.matches?.('dialog[data-b3-backdrop="dismiss"]:modal') && outside(event, dialog) ? { dialog, pointerId: event.pointerId } : null;
+  }, options);
+  root.addEventListener("pointerup", (event) => {
+    const start = backdropStart;
+    backdropStart = null;
+    if (start && start.pointerId === event.pointerId && event.target === start.dialog && outside(event, start.dialog))
+      backdropEnd = start;
+  }, options);
+  root.addEventListener("pointercancel", () => {
+    backdropStart = null;
+    backdropEnd = null;
+  }, options);
+  root.addEventListener("click", (event) => {
+    const end = backdropEnd;
+    backdropEnd = null;
+    if (!end || event.target !== end.dialog || !outside(event, end.dialog))
+      return;
+    event.preventDefault();
+    event.stopImmediatePropagation();
+    dismiss(end.dialog);
+  }, { ...options, capture: true });
+  root.addEventListener("close", (event) => {
+    closing.get(event.target)?.cancel();
+    closing.delete(event.target);
+    delete event.target.dataset.b3Closing;
+    const opener = openers.get(event.target);
+    if (opener?.isConnected && !opener.disabled)
+      opener.focus();
+    openers.delete(event.target);
+  }, { ...options, capture: true });
+  root.addEventListener("click", (event) => {
+    const target = event.target.closest?.("[data-b3-open],[data-b3-close]");
+    if (!target || target.disabled)
+      return;
+    if (target.dataset.b3Open) {
+      const dialog = find(target.dataset.b3Open);
+      if (dialog?.tagName === "DIALOG") {
+        openers.set(dialog, target);
+        if (!dialog.open)
+          dialog.showModal();
+      }
+    }
+    if (target.hasAttribute("data-b3-close")) {
+      const dialog = target.closest("dialog");
+      if (dialog)
+        dismiss(dialog);
+    }
+  }, options);
+}
+
+// src/interactions/toasts.js
+function toasts({ root, options }) {
+  root.addEventListener("click", (event) => {
+    const target = event.target.closest?.("[data-b3-dismiss]");
+    if (target && !target.disabled)
+      target.closest(".b3-toast")?.remove();
+  }, options);
+}
+
+// src/ui.js
+function mount(root = document) {
+  const controller = new AbortController;
+  const options = { signal: controller.signal };
+  const document2 = root.ownerDocument || root;
+  const find = (id) => {
+    const element = document2.getElementById(id);
+    return element && (root === document2 || root.contains(element)) ? element : null;
+  };
+  const context = { root, document: document2, find, options };
+  tabs(context);
+  disclosures(context);
+  dialogs(context);
+  toasts(context);
+  outline(context);
+  commands(context);
+  return () => controller.abort();
+}
+export {
+  layout,
+  motion,
+  mount,
+  sequence,
+  settle
+};

package/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "@livx.cc/bare-v3",
+  "version": "0.1.0-alpha.10",
+  "type": "module",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "exports": {
+    "./css": "./dist/bare.css",
+    "./css/min": "./dist/bare.min.css",
+    "./manifest": "./dist/manifest.json",
+    "./references/*": "./dist/references/*",
+    "./ui": "./dist/ui.js"
+  },
+  "scripts": {
+    "build": "bun scripts/build.ts",
+    "test": "bun test",
+    "lab": "bun lab/cli.ts",
+    "check:package": "bun scripts/check-package.ts",
+    "typecheck": "tsc"
+  },
+  "devDependencies": {
+    "@livx.cc/agentx": "0.99.42",
+    "@livx.cc/bare-v2": "3.0.0",
+    "@picocss/pico": "2.1.1",
+    "@tailwindcss/cli": "4.3.3",
+    "@types/bun": "1.4.2",
+    "ai.libx.js": "0.18.29",
+    "basecoat-css": "1.0.2",
+    "daisyui": "5.7.28",
+    "lightningcss": "1.33.0",
+    "lucide-static": "1.31.0",
+    "tailwindcss": "4.3.3",
+    "typescript": "7.0.2"
+  },
+  "publishConfig": {
+    "access": "public",
+    "tag": "alpha"
+  },
+  "license": "UNLICENSED",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Livshitz/bare-v3.git"
+  },
+  "description": "Experimental semantic CSS and optional interactions with compact LLM reference packs"
+}