bruh 1.10.0 → 1.12.0

package/README.md

@@ -16,6 +16,12 @@
         src="https://img.shields.io/npm/v/bruh"
       >
     </a>
+    <a href="https://www.npmjs.com/package/bruh">
+      <img
+        alt="Distributed download size for the entire library"
+        src="https://img.shields.io/bundlephobia/minzip/bruh"
+      >
+    </a>
     <a href="https://github.com/Technical-Source/bruh/discussions">
       <img
         alt="Github Discussions"
@@ -29,18 +35,72 @@
 
 # What's This?
 
-Bruh is an attempt to make it easier to target modern browser API's in
-development directly. There should be as few neccessary indirections as possible
-between what is written and what is run. But at the same time, the development
-cycle and production outputs should be tailored on an individual project level.
+A js library for the web that places your control on a pedestal.
+It packs flexible SSR (Server-Side HTML Rendering),
+an awesome DOM interface,
+and elegant functional reactivity in a tiny code size.
+
+Along with modern build tooling integration ([vite](https://vitejs.dev)), you're one step away from:
+- JSX and MDX (markdown with JSX instead of HTML) for both HTML rendering and DOM element creation
+- Instant HMR (Hot Module Reloading) for both server rendered HTML and client CSS/JS/TS
+- [Everything else vite provides](https://vitejs.dev/guide/features.html) - CSS modules, PostCSS, production builds, nearly 0 config, _&c_.
+
+<br>
+
+<p>
+  It looks like this, which is pretty epic:
 
-This is not a framework. It is a utilities library made exclusively for
-developers who know what they are doing - a group which you might fit into.
+  <a href="https://codepen.io/pen/?template=dyzRvZY&editors=0010">
+    <img
+      alt="Open in CodePen"
+      align="right"
+      src="https://img.shields.io/badge/Open_in_CodePen-blue?logo=codepen"
+    >
+  </a>
+</p><br>
+
+```jsx
+const Counter = () => {
+  // A reactive value
+  const count = r(0)
+  const increment = () => count.value++
+
+  // Declarative UI without vdom! (and build tools are completely optional)
+  const counter =
+    <button class="counter" onclick={ increment }>
+      Click to increment: { count }
+    </button>
+
+  return counter
+}
+
+// Yes, all of these are vanilla DOM nodes!
+document.body.append(
+  <main>
+    <h1>Bruh</h1>
+    <Counter />
+  </main>
+)
+```
 
 # How do I Get It?
 
-`npm install bruh`
+`npm init bruh` and pick [the "vite" template](https://github.com/Technical-Source/bruh/tree/main/packages/create-bruh/vite)
+
+<p>
+  Think that's too hard? 👉
+
+  <a href="https://codesandbox.io/s/github/Technical-Source/bruh/tree/main/packages/create-bruh/vite">
+    <img
+      alt="Open in CodeSandbox"
+      valign="middle"
+      src="https://img.shields.io/badge/Preview_the_template_in_CodeSandbox-blue?logo=codesandbox"
+    >
+  </a>
+</p><br>
 
 # Where is the documentation?
 
-[Right here](https://technicalsource.dev/bruh)
+[Right here](https://technicalsource.dev/bruh) - but it's not really complete.
+The best way to use this project is to just read the code, it's pretty short.
+If you have any questions, even without reading the code first, feel free to [ask all of them in the discussions](https://github.com/Technical-Source/bruh/discussions).

package/dist/bruh.es.js

@@ -144,8 +144,12 @@ const _FunctionalReactive = class {
     x.forEach((d) => __privateGet(d, _derivatives).add(this));
   }
   get value() {
-    if (__privateGet(_FunctionalReactive, _settersQueue).size)
-      _FunctionalReactive.applyUpdates();
+    if (__privateGet(_FunctionalReactive, _settersQueue).size) {
+      if (__privateGet(this, _depth) !== 0)
+        _FunctionalReactive.applyUpdates();
+      else if (__privateGet(_FunctionalReactive, _settersQueue).has(this))
+        return __privateGet(_FunctionalReactive, _settersQueue).get(this);
+    }
     return __privateGet(this, _value2);
   }
   set value(newValue) {
@@ -221,9 +225,16 @@ var index$1 = /* @__PURE__ */ Object.freeze({
   reactiveDo
 });
 const isBruhChild = (x) => (x == null ? void 0 : x[isReactive]) || x instanceof Node || Array.isArray(x) || x == null || !(typeof x === "function" || typeof x === "object");
-const toNode = (x) => x instanceof Node ? x : document.createTextNode(x);
+const toNode = (x) => {
+  if (x instanceof Node)
+    return x;
+  else if (typeof x === "boolean" || x === void 0 || x === null)
+    return document.createComment(x);
+  else
+    return document.createTextNode(x);
+};
 const bruhChildrenToNodes = (...children) => children.flat(Infinity).flatMap((child) => {
-  if (!child[isReactive])
+  if (!(child == null ? void 0 : child[isReactive]))
     return [toNode(child)];
   if (Array.isArray(child.value)) {
     const liveFragment2 = new LiveFragment();
@@ -284,14 +295,20 @@ const e = (name) => (...variadic) => {
   const { namespace } = (_a2 = props.bruh) != null ? _a2 : {};
   delete props.bruh;
   const element = namespace ? document.createElementNS(namespace, name) : document.createElement(name);
-  if (typeof props.style === "object") {
+  if (typeof props.style === "object" && !props.style[isReactive]) {
     applyStyles(element, props.style);
     delete props.style;
   }
-  if (typeof props.class === "object") {
+  if (typeof props.class === "object" && !props.class[isReactive]) {
     applyClasses(element, props.class);
     delete props.class;
   }
+  for (const name2 in props) {
+    if (name2.startsWith("on") && typeof props[name2] === "function") {
+      element.addEventListener(name2.slice(2), props[name2]);
+      delete props[name2];
+    }
+  }
   applyAttributes(element, props);
   element.append(...bruhChildrenToNodes(...children));
   return element;

package/dist/bruh.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"bruh.es.js","sources":["../src/dom/live-fragment.mjs","../src/reactive/index.mjs","../src/dom/index.browser.mjs","../src/util/index.mjs"],"sourcesContent":["// Lightweight and performant DOM fragment that keeps its place,\n// useful for grouping siblings without making a parent element.\n// Not a true analog of the DocumentFragment, because the implementation\n// would be infeasible with that scope, adding a performance penalty as well.\n// Works as long as the start & end placeholders are siblings in that order\n// and they do not overlap other LiveFragment's:\n// Works: (start A)(start B)(end B)(end A)\n// Fails: (start A)(start B)(end A)(end B)\n// Also, make sure not to call .normalize() on the parent element,\n// because that would ruin the placeholders.\nexport class LiveFragment {\n  startMarker = document.createTextNode(\"\")\n  endMarker   = document.createTextNode(\"\")\n\n  static from(firstNode, lastNode) {\n    const liveFragment = new this()\n    firstNode.before(liveFragment.startMarker)\n    lastNode.after(liveFragment.endMarker)\n    return liveFragment\n  }\n\n  before(...xs) {\n    this.startMarker.before(...xs)\n  }\n\n  prepend(...xs) {\n    this.startMarker.after(...xs)\n  }\n\n  append(...xs) {\n    this.endMarker.before(...xs)\n  }\n\n  after(...xs) {\n    this.endMarker.after(...xs)\n  }\n\n  remove() {\n    const range = document.createRange()\n    range.setStartBefore(this.startMarker)\n    range.setEndAfter(this.endMarker)\n    range.deleteContents()\n  }\n\n  replaceChildren(...xs) {\n    const range = document.createRange()\n    range.setStartAfter(this.startMarker)\n    range.setEndBefore(this.endMarker)\n    range.deleteContents()\n    this.startMarker.after(...xs)\n  }\n\n  replaceWith(...xs) {\n    this.endMarker.after(...xs)\n    this.remove()\n  }\n\n  get childNodes() {\n    const childNodes = []\n\n    for (\n      let currentNode = this.startMarker.nextSibling;\n      currentNode != this.endMarker && currentNode;\n      currentNode = currentNode.nextSibling\n    )\n      childNodes.push(currentNode)\n\n    return childNodes\n  }\n\n  get children() {\n    return this.childNodes\n      .filter(node => node instanceof HTMLElement)\n  }\n}\n","export const isReactive = Symbol.for(\"bruh reactive\")\n\n// A super simple and performant reactive value implementation\nexport class SimpleReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  constructor(value) {\n    this.#value = value\n  }\n\n  get value() {\n    return this.#value\n  }\n\n  set value(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    for (const reaction of this.#reactions)\n      reaction()\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n}\n\n// A reactive implementation for building functional reactive graphs\n// Ensures state consistency, minimal node updates, and transparent update batching\nexport class FunctionalReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  // For derived nodes, f is the derivation function\n  #f\n  // Source nodes are 0 deep in the derivation graph\n  // This is for topological sort\n  #depth = 0\n  // All nodes have a set of derivatives that update when the node changes\n  #derivatives = new Set()\n\n  // Keep track of all the pending changes from the value setter\n  static #settersQueue = new Map()\n  // A queue of derivatives to potentially update, sorted into sets by depth\n  // This starts with depth 1 and can potentially have holes\n  static #derivativesQueue = []\n  // A queue of reactions to run after the graph is fully updated\n  static #reactionsQueue = []\n\n  constructor(x, f) {\n    if (!f) {\n      this.#value = x\n      return\n    }\n\n    this.#value = f()\n    this.#f = f\n    this.#depth = Math.max(...x.map(d => d.#depth)) + 1\n\n    x.forEach(d => d.#derivatives.add(this))\n  }\n\n  get value() {\n    // If there are any pending updates, go ahead and apply them first\n    // It's ok that there's already a microtask queued for this\n    if (FunctionalReactive.#settersQueue.size)\n      FunctionalReactive.applyUpdates()\n\n    return this.#value\n  }\n\n  set value(newValue) {\n    // Only allow source nodes to be directly updated\n    if (this.#depth !== 0)\n      return\n\n    // Unless asked for earlier, these updates are just queued up until the microtasks run\n    if (!FunctionalReactive.#settersQueue.size)\n      queueMicrotask(FunctionalReactive.applyUpdates)\n\n    FunctionalReactive.#settersQueue.set(this, newValue)\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n\n  // Apply an update for a node and queue its derivatives if it actually changed\n  #applyUpdate(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    FunctionalReactive.#reactionsQueue.push(...this.#reactions)\n\n    const queue = FunctionalReactive.#derivativesQueue\n    for (const derivative of this.#derivatives) {\n      const depth = derivative.#depth\n      if (!queue[depth])\n        queue[depth] = new Set()\n\n      queue[depth].add(derivative)\n    }\n  }\n\n  // Apply pending updates from actually changed source nodes\n  static applyUpdates() {\n    if (!FunctionalReactive.#settersQueue.size)\n      return\n\n    // Bootstrap by applying the updates from the pending setters\n    for (const [sourceNode, newValue] of FunctionalReactive.#settersQueue.entries())\n      sourceNode.#applyUpdate(newValue)\n    FunctionalReactive.#settersQueue.clear()\n\n    // Iterate down the depths, ignoring holes\n    // Note that both the queue (Array) and each depth Set iterators update as items are added\n    for (const depthSet of FunctionalReactive.#derivativesQueue) if (depthSet)\n      for (const derivative of depthSet)\n        derivative.#applyUpdate(derivative.#f())\n    FunctionalReactive.#derivativesQueue.length = 0\n\n    // Call all reactions now that the graph has a fully consistent state\n    for (const reaction of FunctionalReactive.#reactionsQueue)\n      reaction()\n    FunctionalReactive.#reactionsQueue.length = 0\n  }\n}\n\n// A little convenience function\nexport const r = (x, f) => new FunctionalReactive(x, f)\n\n// Do something with a value, updating if it is reactive\nexport const reactiveDo = (x, f) => {\n  if (x?.[isReactive]) {\n    f(x.value)\n    return x.addReaction(() => f(x.value))\n  }\n\n  f(x)\n}\n","import { LiveFragment } from \"./live-fragment.mjs\"\nimport { isReactive, reactiveDo } from \"../reactive/index.mjs\"\n\n//#region Bruh child functions e.g. bruhChildrenToNodes()\n\n// A basic check for if a value is allowed as a child in bruh\n// It's responsible for quickly checking the type, not deep validation\nconst isBruhChild = x =>\n  // Reactives and DOM nodes\n  x?.[isReactive] ||\n  x instanceof Node ||\n  // Any array, just assume it contains valid children\n  Array.isArray(x) ||\n  // Allow nullish\n  x == null ||\n  // Disallow functions and objects\n  !(typeof x === \"function\" || typeof x === \"object\")\n  // Everything else can be a child when stringified\n\n// Coerces input into a DOM node, if it isn't already one\nconst toNode = x =>\n  x instanceof Node\n    ? x\n    : document.createTextNode(x)\n\n// Processes bruh children into an array of DOM nodes\n// Reactive values are automatically replaced, so the output must be placed into a parent node\n// before any top level (after flattening arrays) reactions run\nexport const bruhChildrenToNodes = (...children) =>\n  children\n    .flat(Infinity)\n    .flatMap(child => {\n      // Non-reactive values are untouched\n      if (!child[isReactive])\n        return [toNode(child)]\n\n      // Reactive arrays become live fragments with auto-swapped children\n      if (Array.isArray(child.value)) {\n        const liveFragment = new LiveFragment()\n        child.addReaction(() => {\n          liveFragment.replaceChildren(...bruhChildrenToNodes(...child.value))\n        })\n        return [liveFragment.startMarker, ...bruhChildrenToNodes(...child.value), liveFragment.endMarker]\n      }\n\n      // Reactive values become auto-swapped DOM nodes\n      let node = toNode(child.value)\n      child.addReaction(() => {\n        const oldNode = node\n        node = toNode(child.value)\n        oldNode.replaceWith(node)\n      })\n      return [node]\n    })\n\n//#endregion\n\n//#region Reactive-aware element helper functions e.g. applyAttributes()\n\n// Style attribute rules from an object with\n// potentially reactive and/or undefined values\nexport const applyStyles = (element, styles) => {\n  for (const property in styles)\n    reactiveDo(styles[property], value => {\n      if (value !== undefined)\n        element.style.setProperty   (property, value)\n      else\n        element.style.removeProperty(property)\n    })\n}\n\n// Class list from an object mapping from\n// class names to potentially reactive booleans\nexport const applyClasses = (element, classes) => {\n  for (const name in classes)\n    reactiveDo(classes[name], value => {\n      element.classList.toggle(name, value)\n    })\n}\n\n// Attributes from an object with\n// potentially reactive and/or undefined values\nexport const applyAttributes = (element, attributes) => {\n  for (const name in attributes)\n    reactiveDo(attributes[name], value => {\n      if (value !== undefined)\n        element.setAttribute   (name, value)\n      else\n        element.removeAttribute(name)\n    })\n}\n\n//#endregion\n\n//#region t() for text nodes and e() for element nodes\n\n// Text nodes\nexport const t = textContent => {\n  // Non-reactive values are just text nodes\n  if (!textContent[isReactive])\n    return document.createTextNode(textContent)\n\n  // Reactive values auto-update the node's text content\n  const node = document.createTextNode(textContent.value)\n  textContent.addReaction(() => {\n    node.textContent = textContent.value\n  })\n  return node\n}\n\n// Elements\nexport const e = name => (...variadic) => {\n  // If there are no props\n  if (isBruhChild(variadic[0])) {\n    const element = document.createElement(name)\n    element.append(...bruhChildrenToNodes(...variadic))\n    return element\n  }\n\n  // If props exist as the first variadic argument\n  const [props, ...children] = variadic\n\n  // Extract explicit options from the bruh prop\n  const { namespace } = props.bruh ?? {}\n  delete props.bruh\n\n  // Make an element with optional namespace\n  const element =\n    namespace\n      ? document.createElementNS(namespace, name)\n      : document.createElement  (           name)\n\n  // Apply overloaded props, if possible\n  if (typeof props.style === \"object\") {\n    applyStyles(element, props.style)\n    delete props.style\n  }\n  if (typeof props.class === \"object\") {\n    applyClasses(element, props.class)\n    delete props.class\n  }\n  // The rest of the props are attributes\n  applyAttributes(element, props)\n\n  // Add the children to the element\n  element.append(...bruhChildrenToNodes(...children))\n  return element\n}\n\n//#endregion\n\n//#region JSX integration\n\n// The function that jsx tags (except fragments) compile to\nexport const h = (nameOrComponent, props, ...children) => {\n  // If we are making an element, this is just a wrapper of e()\n  // This is likely when the JSX tag name begins with a lowercase character\n  if (typeof nameOrComponent === \"string\") {\n    const makeElement = e(nameOrComponent)\n    return props\n      ? makeElement(props, ...children)\n      : makeElement(...children)\n  }\n\n  // It must be a component, then, as bruh components are just functions\n  // Due to JSX, this would mean a function with only one parameter - props\n  // This object includes the all of the normal props and a \"children\" key\n  return nameOrComponent({ ...props, children })\n}\n\n// The JSX fragment is made into a bruh fragment (just an array)\nexport const JSXFragment = ({ children }) => children\n\n//#endregion\n\n\n\n// Hydration of all bruh-textnode's from prerendered html\nexport const hydrateTextNodes = () => {\n  const tagged = {}\n  const bruhTextNodes = document.getElementsByTagName(\"bruh-textnode\")\n\n  for (const bruhTextNode of bruhTextNodes) {\n    const textNode = document.createTextNode(bruhTextNode.textContent)\n\n    const tag = bruhTextNode.getAttribute(\"tag\")\n    if (tag)\n      tagged[tag] = textNode\n\n    bruhTextNode.replaceWith(textNode)\n  }\n\n  return tagged\n}\n","// Create a pipeline with an initial value and a series of functions\nexport const pipe = (x, ...fs) =>\n  fs.reduce((y, f) => f(y), x)\n\n// Dispatch a custom event to (capturing) and from (bubbling) a target (usually a DOM node)\n// Returns false if the event was cancelled (preventDefault()) and true otherwise\nexport const dispatch = (target, type, options) =>\n  target.dispatchEvent(\n    // Default to behave like most DOM events\n    new CustomEvent(type, {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      ...options\n    })\n  )\n\n// Inspired by https://antfu.me/posts/destructuring-with-object-or-array#take-away\n// Creates an object that is both destructable with {...} and [...]\n// Useful for writing library functions à la react-use & vueuse\nexport const createDestructable = (object, iterable) => {\n  const destructable = {\n    ...object,\n    [Symbol.iterator]: () => iterable[Symbol.iterator]()\n  }\n\n  Object.defineProperty(destructable, Symbol.iterator, {\n    enumerable: false\n  })\n\n  return destructable\n}\n\n// Creates an object (as a Proxy) that acts as a function\n// So functionAsObject(f).property is equivalent to f(\"property\")\n// This is can be useful when combined with destructuring syntax, e.g.:\n// const { html, head, title, body, main, h1, p } = functionAsObject(e)\nexport const functionAsObject = f =>\n  new Proxy({}, {\n    get: (_, property) => f(property)\n  })\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bruh.es.js","sources":["../src/dom/live-fragment.mjs","../src/reactive/index.mjs","../src/dom/index.browser.mjs","../src/util/index.mjs"],"sourcesContent":["// Lightweight and performant DOM fragment that keeps its place,\n// useful for grouping siblings without making a parent element.\n// Not a true analog of the DocumentFragment, because the implementation\n// would be infeasible with that scope, adding a performance penalty as well.\n// Works as long as the start & end placeholders are siblings in that order\n// and they do not overlap other LiveFragment's:\n// Works: (start A)(start B)(end B)(end A)\n// Fails: (start A)(start B)(end A)(end B)\n// Also, make sure not to call .normalize() on the parent element,\n// because that would ruin the placeholders.\nexport class LiveFragment {\n  startMarker = document.createTextNode(\"\")\n  endMarker   = document.createTextNode(\"\")\n\n  static from(firstNode, lastNode) {\n    const liveFragment = new this()\n    firstNode.before(liveFragment.startMarker)\n    lastNode.after(liveFragment.endMarker)\n    return liveFragment\n  }\n\n  before(...xs) {\n    this.startMarker.before(...xs)\n  }\n\n  prepend(...xs) {\n    this.startMarker.after(...xs)\n  }\n\n  append(...xs) {\n    this.endMarker.before(...xs)\n  }\n\n  after(...xs) {\n    this.endMarker.after(...xs)\n  }\n\n  remove() {\n    const range = document.createRange()\n    range.setStartBefore(this.startMarker)\n    range.setEndAfter(this.endMarker)\n    range.deleteContents()\n  }\n\n  replaceChildren(...xs) {\n    const range = document.createRange()\n    range.setStartAfter(this.startMarker)\n    range.setEndBefore(this.endMarker)\n    range.deleteContents()\n    this.startMarker.after(...xs)\n  }\n\n  replaceWith(...xs) {\n    this.endMarker.after(...xs)\n    this.remove()\n  }\n\n  get childNodes() {\n    const childNodes = []\n\n    for (\n      let currentNode = this.startMarker.nextSibling;\n      currentNode != this.endMarker && currentNode;\n      currentNode = currentNode.nextSibling\n    )\n      childNodes.push(currentNode)\n\n    return childNodes\n  }\n\n  get children() {\n    return this.childNodes\n      .filter(node => node instanceof HTMLElement)\n  }\n}\n","export const isReactive = Symbol.for(\"bruh reactive\")\n\n// A super simple and performant reactive value implementation\nexport class SimpleReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  constructor(value) {\n    this.#value = value\n  }\n\n  get value() {\n    return this.#value\n  }\n\n  set value(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    for (const reaction of this.#reactions)\n      reaction()\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n}\n\n// A reactive implementation for building functional reactive graphs\n// Ensures state consistency, minimal node updates, and transparent update batching\nexport class FunctionalReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  // For derived nodes, f is the derivation function\n  #f\n  // Source nodes are 0 deep in the derivation graph\n  // This is for topological sort\n  #depth = 0\n  // All nodes have a set of derivatives that update when the node changes\n  #derivatives = new Set()\n\n  // Keep track of all the pending changes from the value setter\n  static #settersQueue = new Map()\n  // A queue of derivatives to potentially update, sorted into sets by depth\n  // This starts with depth 1 and can potentially have holes\n  static #derivativesQueue = []\n  // A queue of reactions to run after the graph is fully updated\n  static #reactionsQueue = []\n\n  constructor(x, f) {\n    if (!f) {\n      this.#value = x\n      return\n    }\n\n    this.#value = f()\n    this.#f = f\n    this.#depth = Math.max(...x.map(d => d.#depth)) + 1\n\n    x.forEach(d => d.#derivatives.add(this))\n  }\n\n  get value() {\n    // If there are any pending updates\n    if (FunctionalReactive.#settersQueue.size) {\n      // Heuristic quick invalidation for derived nodes\n      // Apply updates now, it's ok that there's already a microtask queued for this\n      if (this.#depth !== 0)\n        FunctionalReactive.applyUpdates()\n      // If this is a source node that was updated, just return that\n      // new value without actually updating any derived nodes yet\n      else if (FunctionalReactive.#settersQueue.has(this))\n        return FunctionalReactive.#settersQueue.get(this)\n    }\n\n    return this.#value\n  }\n\n  set value(newValue) {\n    // Only allow source nodes to be directly updated\n    if (this.#depth !== 0)\n      return\n\n    // Unless asked for earlier, these updates are just queued up until the microtasks run\n    if (!FunctionalReactive.#settersQueue.size)\n      queueMicrotask(FunctionalReactive.applyUpdates)\n\n    FunctionalReactive.#settersQueue.set(this, newValue)\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n\n  // Apply an update for a node and queue its derivatives if it actually changed\n  #applyUpdate(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    FunctionalReactive.#reactionsQueue.push(...this.#reactions)\n\n    const queue = FunctionalReactive.#derivativesQueue\n    for (const derivative of this.#derivatives) {\n      const depth = derivative.#depth\n      if (!queue[depth])\n        queue[depth] = new Set()\n\n      queue[depth].add(derivative)\n    }\n  }\n\n  // Apply pending updates from actually changed source nodes\n  static applyUpdates() {\n    if (!FunctionalReactive.#settersQueue.size)\n      return\n\n    // Bootstrap by applying the updates from the pending setters\n    for (const [sourceNode, newValue] of FunctionalReactive.#settersQueue.entries())\n      sourceNode.#applyUpdate(newValue)\n    FunctionalReactive.#settersQueue.clear()\n\n    // Iterate down the depths, ignoring holes\n    // Note that both the queue (Array) and each depth Set iterators update as items are added\n    for (const depthSet of FunctionalReactive.#derivativesQueue) if (depthSet)\n      for (const derivative of depthSet)\n        derivative.#applyUpdate(derivative.#f())\n    FunctionalReactive.#derivativesQueue.length = 0\n\n    // Call all reactions now that the graph has a fully consistent state\n    for (const reaction of FunctionalReactive.#reactionsQueue)\n      reaction()\n    FunctionalReactive.#reactionsQueue.length = 0\n  }\n}\n\n// A little convenience function\nexport const r = (x, f) => new FunctionalReactive(x, f)\n\n// Do something with a value, updating if it is reactive\nexport const reactiveDo = (x, f) => {\n  if (x?.[isReactive]) {\n    f(x.value)\n    return x.addReaction(() => f(x.value))\n  }\n\n  f(x)\n}\n","import { LiveFragment } from \"./live-fragment.mjs\"\nimport { isReactive, reactiveDo } from \"../reactive/index.mjs\"\n\n//#region Bruh child functions e.g. bruhChildrenToNodes()\n\n// A basic check for if a value is allowed as a child in bruh\n// It's responsible for quickly checking the type, not deep validation\nconst isBruhChild = x =>\n  // Reactives and DOM nodes\n  x?.[isReactive] ||\n  x instanceof Node ||\n  // Any array, just assume it contains valid children\n  Array.isArray(x) ||\n  // Allow nullish\n  x == null ||\n  // Disallow functions and objects\n  !(typeof x === \"function\" || typeof x === \"object\")\n  // Everything else can be a child when stringified\n\n// Coerces input into a DOM node, if it isn't already one\nconst toNode = x => {\n  // Existing DOM nodes are untouched\n  if (x instanceof Node)\n    return x\n  // booleans and nullish are ignored\n  else if (typeof x === \"boolean\" || x === undefined || x === null)\n    return document.createComment(x)\n  // Anything else is treated as text\n  else\n    return document.createTextNode(x)\n}\n\n// Processes bruh children into an array of DOM nodes\n// Reactive values are automatically replaced, so the output must be placed into a parent node\n// before any top level (after flattening arrays) reactions run\nexport const bruhChildrenToNodes = (...children) =>\n  children\n    .flat(Infinity)\n    .flatMap(child => {\n      // Non-reactive values are untouched\n      if (!child?.[isReactive])\n        return [toNode(child)]\n\n      // Reactive arrays become live fragments with auto-swapped children\n      if (Array.isArray(child.value)) {\n        const liveFragment = new LiveFragment()\n        child.addReaction(() => {\n          liveFragment.replaceChildren(...bruhChildrenToNodes(...child.value))\n        })\n        return [liveFragment.startMarker, ...bruhChildrenToNodes(...child.value), liveFragment.endMarker]\n      }\n\n      // Reactive values become auto-swapped DOM nodes\n      let node = toNode(child.value)\n      child.addReaction(() => {\n        const oldNode = node\n        node = toNode(child.value)\n        oldNode.replaceWith(node)\n      })\n      return [node]\n    })\n\n//#endregion\n\n//#region Reactive-aware element helper functions e.g. applyAttributes()\n\n// Style attribute rules from an object with\n// potentially reactive and/or undefined values\nexport const applyStyles = (element, styles) => {\n  for (const property in styles)\n    reactiveDo(styles[property], value => {\n      if (value !== undefined)\n        element.style.setProperty   (property, value)\n      else\n        element.style.removeProperty(property)\n    })\n}\n\n// Class list from an object mapping from\n// class names to potentially reactive booleans\nexport const applyClasses = (element, classes) => {\n  for (const name in classes)\n    reactiveDo(classes[name], value => {\n      element.classList.toggle(name, value)\n    })\n}\n\n// Attributes from an object with\n// potentially reactive and/or undefined values\nexport const applyAttributes = (element, attributes) => {\n  for (const name in attributes)\n    reactiveDo(attributes[name], value => {\n      if (value !== undefined)\n        element.setAttribute   (name, value)\n      else\n        element.removeAttribute(name)\n    })\n}\n\n//#endregion\n\n//#region t() for text nodes and e() for element nodes\n\n// Text nodes\nexport const t = textContent => {\n  // Non-reactive values are just text nodes\n  if (!textContent[isReactive])\n    return document.createTextNode(textContent)\n\n  // Reactive values auto-update the node's text content\n  const node = document.createTextNode(textContent.value)\n  textContent.addReaction(() => {\n    node.textContent = textContent.value\n  })\n  return node\n}\n\n// Elements\nexport const e = name => (...variadic) => {\n  // If there are no props\n  if (isBruhChild(variadic[0])) {\n    const element = document.createElement(name)\n    element.append(...bruhChildrenToNodes(...variadic))\n    return element\n  }\n\n  // If props exist as the first variadic argument\n  const [props, ...children] = variadic\n\n  // Extract explicit options from the bruh prop\n  const { namespace } = props.bruh ?? {}\n  delete props.bruh\n\n  // Make an element with optional namespace\n  const element =\n    namespace\n      ? document.createElementNS(namespace, name)\n      : document.createElement  (           name)\n\n  // Apply overloaded props, if possible\n\n  // Inline style object\n  if (typeof props.style === \"object\" && !props.style[isReactive]) {\n    applyStyles(element, props.style)\n    delete props.style\n  }\n  // Classes object\n  if (typeof props.class === \"object\" && !props.class[isReactive]) {\n    applyClasses(element, props.class)\n    delete props.class\n  }\n  for (const name in props) {\n    // Event listener functions\n    if (name.startsWith(\"on\") && typeof props[name] === \"function\") {\n      element.addEventListener(name.slice(2), props[name])\n      delete props[name]\n    }\n  }\n\n  // The rest of the props are attributes\n  applyAttributes(element, props)\n\n  // Add the children to the element\n  element.append(...bruhChildrenToNodes(...children))\n  return element\n}\n\n//#endregion\n\n//#region JSX integration\n\n// The function that jsx tags (except fragments) compile to\nexport const h = (nameOrComponent, props, ...children) => {\n  // If we are making an element, this is just a wrapper of e()\n  // This is likely when the JSX tag name begins with a lowercase character\n  if (typeof nameOrComponent === \"string\") {\n    const makeElement = e(nameOrComponent)\n    return props\n      ? makeElement(props, ...children)\n      : makeElement(...children)\n  }\n\n  // It must be a component, then, as bruh components are just functions\n  // Due to JSX, this would mean a function with only one parameter - props\n  // This object includes the all of the normal props and a \"children\" key\n  return nameOrComponent({ ...props, children })\n}\n\n// The JSX fragment is made into a bruh fragment (just an array)\nexport const JSXFragment = ({ children }) => children\n\n//#endregion\n\n\n\n// Hydration of all bruh-textnode's from prerendered html\nexport const hydrateTextNodes = () => {\n  const tagged = {}\n  const bruhTextNodes = document.getElementsByTagName(\"bruh-textnode\")\n\n  for (const bruhTextNode of bruhTextNodes) {\n    const textNode = document.createTextNode(bruhTextNode.textContent)\n\n    const tag = bruhTextNode.getAttribute(\"tag\")\n    if (tag)\n      tagged[tag] = textNode\n\n    bruhTextNode.replaceWith(textNode)\n  }\n\n  return tagged\n}\n","// Create a pipeline with an initial value and a series of functions\nexport const pipe = (x, ...fs) =>\n  fs.reduce((y, f) => f(y), x)\n\n// Dispatch a custom event to (capturing) and from (bubbling) a target (usually a DOM node)\n// Returns false if the event was cancelled (preventDefault()) and true otherwise\nexport const dispatch = (target, type, options) =>\n  target.dispatchEvent(\n    // Default to behave like most DOM events\n    new CustomEvent(type, {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      ...options\n    })\n  )\n\n// Inspired by https://antfu.me/posts/destructuring-with-object-or-array#take-away\n// Creates an object that is both destructable with {...} and [...]\n// Useful for writing library functions à la react-use & vueuse\nexport const createDestructable = (object, iterable) => {\n  const destructable = {\n    ...object,\n    [Symbol.iterator]: () => iterable[Symbol.iterator]()\n  }\n\n  Object.defineProperty(destructable, Symbol.iterator, {\n    enumerable: false\n  })\n\n  return destructable\n}\n\n// Creates an object (as a Proxy) that acts as a function\n// So functionAsObject(f).property is equivalent to f(\"property\")\n// This is can be useful when combined with destructuring syntax, e.g.:\n// const { html, head, title, body, main, h1, p } = functionAsObject(e)\nexport const functionAsObject = f =>\n  new Proxy({}, {\n    get: (_, property) => f(property)\n  })\n"],"names":[],"mappings":"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"}

package/dist/bruh.umd.js

@@ -1,2 +1,2 @@
-var ne=Object.defineProperty,oe=Object.defineProperties;var se=Object.getOwnPropertyDescriptors;var W=Object.getOwnPropertySymbols;var ae=Object.prototype.hasOwnProperty,ie=Object.prototype.propertyIsEnumerable;var C=(n,o,i)=>o in n?ne(n,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):n[o]=i,R=(n,o)=>{for(var i in o||(o={}))ae.call(o,i)&&C(n,i,o[i]);if(W)for(var i of W(o))ie.call(o,i)&&C(n,i,o[i]);return n},F=(n,o)=>oe(n,se(o));var E=(n,o,i)=>(C(n,typeof o!="symbol"?o+"":o,i),i),O=(n,o,i)=>{if(!o.has(n))throw TypeError("Cannot "+i)};var a=(n,o,i)=>(O(n,o,"read from private field"),i?i.call(n):o.get(n)),u=(n,o,i)=>{if(o.has(n))throw TypeError("Cannot add the same private member more than once");o instanceof WeakSet?o.add(n):o.set(n,i)},b=(n,o,i,l)=>(O(n,o,"write to private field"),l?l.call(n,i):o.set(n,i),i);var _=(n,o,i)=>(O(n,o,"access private method"),i);(function(n,o){typeof exports=="object"&&typeof module!="undefined"?o(exports):typeof define=="function"&&define.amd?define(["exports"],o):(n=typeof globalThis!="undefined"?globalThis:n||self,o(n.bruh={}))})(this,function(n){var ce,m,g,de,h,S,k,y,A,p,M,N,j,q;"use strict";class o{constructor(){E(this,"startMarker",document.createTextNode(""));E(this,"endMarker",document.createTextNode(""))}static from(e,t){const s=new this;return e.before(s.startMarker),t.after(s.endMarker),s}before(...e){this.startMarker.before(...e)}prepend(...e){this.startMarker.after(...e)}append(...e){this.endMarker.before(...e)}after(...e){this.endMarker.after(...e)}remove(){const e=document.createRange();e.setStartBefore(this.startMarker),e.setEndAfter(this.endMarker),e.deleteContents()}replaceChildren(...e){const t=document.createRange();t.setStartAfter(this.startMarker),t.setEndBefore(this.endMarker),t.deleteContents(),this.startMarker.after(...e)}replaceWith(...e){this.endMarker.after(...e),this.remove()}get childNodes(){const e=[];for(let t=this.startMarker.nextSibling;t!=this.endMarker&&t;t=t.nextSibling)e.push(t);return e}get children(){return this.childNodes.filter(e=>e instanceof HTMLElement)}}var i=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",LiveFragment:o});const l=Symbol.for("bruh reactive");class J{constructor(e){E(this,ce,!0);u(this,m,void 0);u(this,g,new Set);b(this,m,e)}get value(){return a(this,m)}set value(e){if(e!==a(this,m)){b(this,m,e);for(const t of a(this,g))t()}}addReaction(e){return a(this,g).add(e),()=>a(this,g).delete(e)}}ce=l,m=new WeakMap,g=new WeakMap;const c=class{constructor(e,t){u(this,j);E(this,de,!0);u(this,h,void 0);u(this,S,new Set);u(this,k,void 0);u(this,y,0);u(this,A,new Set);if(!t){b(this,h,e);return}b(this,h,t()),b(this,k,t),b(this,y,Math.max(...e.map(s=>a(s,y)))+1),e.forEach(s=>a(s,A).add(this))}get value(){return a(c,p).size&&c.applyUpdates(),a(this,h)}set value(e){a(this,y)===0&&(a(c,p).size||queueMicrotask(c.applyUpdates),a(c,p).set(this,e))}addReaction(e){return a(this,S).add(e),()=>a(this,S).delete(e)}static applyUpdates(){var e,t,s;if(!!a(c,p).size){for(const[d,f]of a(c,p).entries())_(e=d,j,q).call(e,f);a(c,p).clear();for(const d of a(c,M))if(d)for(const f of d)_(s=f,j,q).call(s,a(t=f,k).call(t));a(c,M).length=0;for(const d of a(c,N))d();a(c,N).length=0}}};let v=c;de=l,h=new WeakMap,S=new WeakMap,k=new WeakMap,y=new WeakMap,A=new WeakMap,p=new WeakMap,M=new WeakMap,N=new WeakMap,j=new WeakSet,q=function(e){if(e===a(this,h))return;b(this,h,e),a(c,N).push(...a(this,S));const t=a(c,M);for(const s of a(this,A)){const d=a(s,y);t[d]||(t[d]=new Set),t[d].add(s)}},u(v,p,new Map),u(v,M,[]),u(v,N,[]);const X=(r,e)=>new v(r,e),w=(r,e)=>{if(r==null?void 0:r[l])return e(r.value),r.addReaction(()=>e(r.value));e(r)};var H=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",isReactive:l,SimpleReactive:J,FunctionalReactive:v,r:X,reactiveDo:w});const I=r=>(r==null?void 0:r[l])||r instanceof Node||Array.isArray(r)||r==null||!(typeof r=="function"||typeof r=="object"),z=r=>r instanceof Node?r:document.createTextNode(r),T=(...r)=>r.flat(1/0).flatMap(e=>{if(!e[l])return[z(e)];if(Array.isArray(e.value)){const s=new o;return e.addReaction(()=>{s.replaceChildren(...T(...e.value))}),[s.startMarker,...T(...e.value),s.endMarker]}let t=z(e.value);return e.addReaction(()=>{const s=t;t=z(e.value),s.replaceWith(t)}),[t]}),P=(r,e)=>{for(const t in e)w(e[t],s=>{s!==void 0?r.style.setProperty(t,s):r.style.removeProperty(t)})},B=(r,e)=>{for(const t in e)w(e[t],s=>{r.classList.toggle(t,s)})},D=(r,e)=>{for(const t in e)w(e[t],s=>{s!==void 0?r.setAttribute(t,s):r.removeAttribute(t)})},$=r=>{if(!r[l])return document.createTextNode(r);const e=document.createTextNode(r.value);return r.addReaction(()=>{e.textContent=r.value}),e},L=r=>(...e)=>{var U;if(I(e[0])){const Q=document.createElement(r);return Q.append(...T(...e)),Q}const[t,...s]=e,{namespace:d}=(U=t.bruh)!=null?U:{};delete t.bruh;const f=d?document.createElementNS(d,r):document.createElement(r);return typeof t.style=="object"&&(P(f,t.style),delete t.style),typeof t.class=="object"&&(B(f,t.class),delete t.class),D(f,t),f.append(...T(...s)),f},G=(r,e,...t)=>{if(typeof r=="string"){const s=L(r);return e?s(e,...t):s(...t)}return r(F(R({},e),{children:t}))},K=({children:r})=>r,Y=()=>{const r={},e=document.getElementsByTagName("bruh-textnode");for(const t of e){const s=document.createTextNode(t.textContent),d=t.getAttribute("tag");d&&(r[d]=s),t.replaceWith(s)}return r};var Z=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",bruhChildrenToNodes:T,applyStyles:P,applyClasses:B,applyAttributes:D,t:$,e:L,h:G,JSXFragment:K,hydrateTextNodes:Y});const V=(r,...e)=>e.reduce((t,s)=>s(t),r),x=(r,e,t)=>r.dispatchEvent(new CustomEvent(e,R({bubbles:!0,cancelable:!0,composed:!0},t))),ee=(r,e)=>{const t=F(R({},r),{[Symbol.iterator]:()=>e[Symbol.iterator]()});return Object.defineProperty(t,Symbol.iterator,{enumerable:!1}),t},te=r=>new Proxy({},{get:(e,t)=>r(t)});var re=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",pipe:V,dispatch:x,createDestructable:ee,functionAsObject:te});n.dom=Z,n.liveFragment=i,n.reactive=H,n.util=re,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
+var ne=Object.defineProperty,se=Object.defineProperties;var oe=Object.getOwnPropertyDescriptors;var Q=Object.getOwnPropertySymbols;var ae=Object.prototype.hasOwnProperty,ie=Object.prototype.propertyIsEnumerable;var F=(n,s,i)=>s in n?ne(n,s,{enumerable:!0,configurable:!0,writable:!0,value:i}):n[s]=i,z=(n,s)=>{for(var i in s||(s={}))ae.call(s,i)&&F(n,i,s[i]);if(Q)for(var i of Q(s))ie.call(s,i)&&F(n,i,s[i]);return n},O=(n,s)=>se(n,oe(s));var w=(n,s,i)=>(F(n,typeof s!="symbol"?s+"":s,i),i),L=(n,s,i)=>{if(!s.has(n))throw TypeError("Cannot "+i)};var a=(n,s,i)=>(L(n,s,"read from private field"),i?i.call(n):s.get(n)),l=(n,s,i)=>{if(s.has(n))throw TypeError("Cannot add the same private member more than once");s instanceof WeakSet?s.add(n):s.set(n,i)},y=(n,s,i,u)=>(L(n,s,"write to private field"),u?u.call(n,i):s.set(n,i),i);var P=(n,s,i)=>(L(n,s,"access private method"),i);(function(n,s){typeof exports=="object"&&typeof module!="undefined"?s(exports):typeof define=="function"&&define.amd?define(["exports"],s):(n=typeof globalThis!="undefined"?globalThis:n||self,s(n.bruh={}))})(this,function(n){var ce,v,S,de,h,M,A,m,j,f,N,T,E,q;"use strict";class s{constructor(){w(this,"startMarker",document.createTextNode(""));w(this,"endMarker",document.createTextNode(""))}static from(e,t){const o=new this;return e.before(o.startMarker),t.after(o.endMarker),o}before(...e){this.startMarker.before(...e)}prepend(...e){this.startMarker.after(...e)}append(...e){this.endMarker.before(...e)}after(...e){this.endMarker.after(...e)}remove(){const e=document.createRange();e.setStartBefore(this.startMarker),e.setEndAfter(this.endMarker),e.deleteContents()}replaceChildren(...e){const t=document.createRange();t.setStartAfter(this.startMarker),t.setEndBefore(this.endMarker),t.deleteContents(),this.startMarker.after(...e)}replaceWith(...e){this.endMarker.after(...e),this.remove()}get childNodes(){const e=[];for(let t=this.startMarker.nextSibling;t!=this.endMarker&&t;t=t.nextSibling)e.push(t);return e}get children(){return this.childNodes.filter(e=>e instanceof HTMLElement)}}var i=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",LiveFragment:s});const u=Symbol.for("bruh reactive");class J{constructor(e){w(this,ce,!0);l(this,v,void 0);l(this,S,new Set);y(this,v,e)}get value(){return a(this,v)}set value(e){if(e!==a(this,v)){y(this,v,e);for(const t of a(this,S))t()}}addReaction(e){return a(this,S).add(e),()=>a(this,S).delete(e)}}ce=u,v=new WeakMap,S=new WeakMap;const c=class{constructor(e,t){l(this,E);w(this,de,!0);l(this,h,void 0);l(this,M,new Set);l(this,A,void 0);l(this,m,0);l(this,j,new Set);if(!t){y(this,h,e);return}y(this,h,t()),y(this,A,t),y(this,m,Math.max(...e.map(o=>a(o,m)))+1),e.forEach(o=>a(o,j).add(this))}get value(){if(a(c,f).size){if(a(this,m)!==0)c.applyUpdates();else if(a(c,f).has(this))return a(c,f).get(this)}return a(this,h)}set value(e){a(this,m)===0&&(a(c,f).size||queueMicrotask(c.applyUpdates),a(c,f).set(this,e))}addReaction(e){return a(this,M).add(e),()=>a(this,M).delete(e)}static applyUpdates(){var e,t,o;if(!!a(c,f).size){for(const[d,p]of a(c,f).entries())P(e=d,E,q).call(e,p);a(c,f).clear();for(const d of a(c,N))if(d)for(const p of d)P(o=p,E,q).call(o,a(t=p,A).call(t));a(c,N).length=0;for(const d of a(c,T))d();a(c,T).length=0}}};let g=c;de=u,h=new WeakMap,M=new WeakMap,A=new WeakMap,m=new WeakMap,j=new WeakMap,f=new WeakMap,N=new WeakMap,T=new WeakMap,E=new WeakSet,q=function(e){if(e===a(this,h))return;y(this,h,e),a(c,T).push(...a(this,M));const t=a(c,N);for(const o of a(this,j)){const d=a(o,m);t[d]||(t[d]=new Set),t[d].add(o)}},l(g,f,new Map),l(g,N,[]),l(g,T,[]);const X=(r,e)=>new g(r,e),R=(r,e)=>{if(r==null?void 0:r[u])return e(r.value),r.addReaction(()=>e(r.value));e(r)};var H=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",isReactive:u,SimpleReactive:J,FunctionalReactive:g,r:X,reactiveDo:R});const I=r=>(r==null?void 0:r[u])||r instanceof Node||Array.isArray(r)||r==null||!(typeof r=="function"||typeof r=="object"),C=r=>r instanceof Node?r:typeof r=="boolean"||r===void 0||r===null?document.createComment(r):document.createTextNode(r),k=(...r)=>r.flat(1/0).flatMap(e=>{if(!(e==null?void 0:e[u]))return[C(e)];if(Array.isArray(e.value)){const o=new s;return e.addReaction(()=>{o.replaceChildren(...k(...e.value))}),[o.startMarker,...k(...e.value),o.endMarker]}let t=C(e.value);return e.addReaction(()=>{const o=t;t=C(e.value),o.replaceWith(t)}),[t]}),B=(r,e)=>{for(const t in e)R(e[t],o=>{o!==void 0?r.style.setProperty(t,o):r.style.removeProperty(t)})},D=(r,e)=>{for(const t in e)R(e[t],o=>{r.classList.toggle(t,o)})},U=(r,e)=>{for(const t in e)R(e[t],o=>{o!==void 0?r.setAttribute(t,o):r.removeAttribute(t)})},$=r=>{if(!r[u])return document.createTextNode(r);const e=document.createTextNode(r.value);return r.addReaction(()=>{e.textContent=r.value}),e},W=r=>(...e)=>{var _;if(I(e[0])){const b=document.createElement(r);return b.append(...k(...e)),b}const[t,...o]=e,{namespace:d}=(_=t.bruh)!=null?_:{};delete t.bruh;const p=d?document.createElementNS(d,r):document.createElement(r);typeof t.style=="object"&&!t.style[u]&&(B(p,t.style),delete t.style),typeof t.class=="object"&&!t.class[u]&&(D(p,t.class),delete t.class);for(const b in t)b.startsWith("on")&&typeof t[b]=="function"&&(p.addEventListener(b.slice(2),t[b]),delete t[b]);return U(p,t),p.append(...k(...o)),p},G=(r,e,...t)=>{if(typeof r=="string"){const o=W(r);return e?o(e,...t):o(...t)}return r(O(z({},e),{children:t}))},K=({children:r})=>r,Y=()=>{const r={},e=document.getElementsByTagName("bruh-textnode");for(const t of e){const o=document.createTextNode(t.textContent),d=t.getAttribute("tag");d&&(r[d]=o),t.replaceWith(o)}return r};var Z=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",bruhChildrenToNodes:k,applyStyles:B,applyClasses:D,applyAttributes:U,t:$,e:W,h:G,JSXFragment:K,hydrateTextNodes:Y});const V=(r,...e)=>e.reduce((t,o)=>o(t),r),x=(r,e,t)=>r.dispatchEvent(new CustomEvent(e,z({bubbles:!0,cancelable:!0,composed:!0},t))),ee=(r,e)=>{const t=O(z({},r),{[Symbol.iterator]:()=>e[Symbol.iterator]()});return Object.defineProperty(t,Symbol.iterator,{enumerable:!1}),t},te=r=>new Proxy({},{get:(e,t)=>r(t)});var re=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",pipe:V,dispatch:x,createDestructable:ee,functionAsObject:te});n.dom=Z,n.liveFragment=i,n.reactive=H,n.util=re,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
 //# sourceMappingURL=bruh.umd.js.map

package/dist/bruh.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"bruh.umd.js","sources":["../src/dom/live-fragment.mjs","../src/reactive/index.mjs","../src/dom/index.browser.mjs","../src/util/index.mjs"],"sourcesContent":["// Lightweight and performant DOM fragment that keeps its place,\n// useful for grouping siblings without making a parent element.\n// Not a true analog of the DocumentFragment, because the implementation\n// would be infeasible with that scope, adding a performance penalty as well.\n// Works as long as the start & end placeholders are siblings in that order\n// and they do not overlap other LiveFragment's:\n// Works: (start A)(start B)(end B)(end A)\n// Fails: (start A)(start B)(end A)(end B)\n// Also, make sure not to call .normalize() on the parent element,\n// because that would ruin the placeholders.\nexport class LiveFragment {\n  startMarker = document.createTextNode(\"\")\n  endMarker   = document.createTextNode(\"\")\n\n  static from(firstNode, lastNode) {\n    const liveFragment = new this()\n    firstNode.before(liveFragment.startMarker)\n    lastNode.after(liveFragment.endMarker)\n    return liveFragment\n  }\n\n  before(...xs) {\n    this.startMarker.before(...xs)\n  }\n\n  prepend(...xs) {\n    this.startMarker.after(...xs)\n  }\n\n  append(...xs) {\n    this.endMarker.before(...xs)\n  }\n\n  after(...xs) {\n    this.endMarker.after(...xs)\n  }\n\n  remove() {\n    const range = document.createRange()\n    range.setStartBefore(this.startMarker)\n    range.setEndAfter(this.endMarker)\n    range.deleteContents()\n  }\n\n  replaceChildren(...xs) {\n    const range = document.createRange()\n    range.setStartAfter(this.startMarker)\n    range.setEndBefore(this.endMarker)\n    range.deleteContents()\n    this.startMarker.after(...xs)\n  }\n\n  replaceWith(...xs) {\n    this.endMarker.after(...xs)\n    this.remove()\n  }\n\n  get childNodes() {\n    const childNodes = []\n\n    for (\n      let currentNode = this.startMarker.nextSibling;\n      currentNode != this.endMarker && currentNode;\n      currentNode = currentNode.nextSibling\n    )\n      childNodes.push(currentNode)\n\n    return childNodes\n  }\n\n  get children() {\n    return this.childNodes\n      .filter(node => node instanceof HTMLElement)\n  }\n}\n","export const isReactive = Symbol.for(\"bruh reactive\")\n\n// A super simple and performant reactive value implementation\nexport class SimpleReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  constructor(value) {\n    this.#value = value\n  }\n\n  get value() {\n    return this.#value\n  }\n\n  set value(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    for (const reaction of this.#reactions)\n      reaction()\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n}\n\n// A reactive implementation for building functional reactive graphs\n// Ensures state consistency, minimal node updates, and transparent update batching\nexport class FunctionalReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  // For derived nodes, f is the derivation function\n  #f\n  // Source nodes are 0 deep in the derivation graph\n  // This is for topological sort\n  #depth = 0\n  // All nodes have a set of derivatives that update when the node changes\n  #derivatives = new Set()\n\n  // Keep track of all the pending changes from the value setter\n  static #settersQueue = new Map()\n  // A queue of derivatives to potentially update, sorted into sets by depth\n  // This starts with depth 1 and can potentially have holes\n  static #derivativesQueue = []\n  // A queue of reactions to run after the graph is fully updated\n  static #reactionsQueue = []\n\n  constructor(x, f) {\n    if (!f) {\n      this.#value = x\n      return\n    }\n\n    this.#value = f()\n    this.#f = f\n    this.#depth = Math.max(...x.map(d => d.#depth)) + 1\n\n    x.forEach(d => d.#derivatives.add(this))\n  }\n\n  get value() {\n    // If there are any pending updates, go ahead and apply them first\n    // It's ok that there's already a microtask queued for this\n    if (FunctionalReactive.#settersQueue.size)\n      FunctionalReactive.applyUpdates()\n\n    return this.#value\n  }\n\n  set value(newValue) {\n    // Only allow source nodes to be directly updated\n    if (this.#depth !== 0)\n      return\n\n    // Unless asked for earlier, these updates are just queued up until the microtasks run\n    if (!FunctionalReactive.#settersQueue.size)\n      queueMicrotask(FunctionalReactive.applyUpdates)\n\n    FunctionalReactive.#settersQueue.set(this, newValue)\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n\n  // Apply an update for a node and queue its derivatives if it actually changed\n  #applyUpdate(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    FunctionalReactive.#reactionsQueue.push(...this.#reactions)\n\n    const queue = FunctionalReactive.#derivativesQueue\n    for (const derivative of this.#derivatives) {\n      const depth = derivative.#depth\n      if (!queue[depth])\n        queue[depth] = new Set()\n\n      queue[depth].add(derivative)\n    }\n  }\n\n  // Apply pending updates from actually changed source nodes\n  static applyUpdates() {\n    if (!FunctionalReactive.#settersQueue.size)\n      return\n\n    // Bootstrap by applying the updates from the pending setters\n    for (const [sourceNode, newValue] of FunctionalReactive.#settersQueue.entries())\n      sourceNode.#applyUpdate(newValue)\n    FunctionalReactive.#settersQueue.clear()\n\n    // Iterate down the depths, ignoring holes\n    // Note that both the queue (Array) and each depth Set iterators update as items are added\n    for (const depthSet of FunctionalReactive.#derivativesQueue) if (depthSet)\n      for (const derivative of depthSet)\n        derivative.#applyUpdate(derivative.#f())\n    FunctionalReactive.#derivativesQueue.length = 0\n\n    // Call all reactions now that the graph has a fully consistent state\n    for (const reaction of FunctionalReactive.#reactionsQueue)\n      reaction()\n    FunctionalReactive.#reactionsQueue.length = 0\n  }\n}\n\n// A little convenience function\nexport const r = (x, f) => new FunctionalReactive(x, f)\n\n// Do something with a value, updating if it is reactive\nexport const reactiveDo = (x, f) => {\n  if (x?.[isReactive]) {\n    f(x.value)\n    return x.addReaction(() => f(x.value))\n  }\n\n  f(x)\n}\n","import { LiveFragment } from \"./live-fragment.mjs\"\nimport { isReactive, reactiveDo } from \"../reactive/index.mjs\"\n\n//#region Bruh child functions e.g. bruhChildrenToNodes()\n\n// A basic check for if a value is allowed as a child in bruh\n// It's responsible for quickly checking the type, not deep validation\nconst isBruhChild = x =>\n  // Reactives and DOM nodes\n  x?.[isReactive] ||\n  x instanceof Node ||\n  // Any array, just assume it contains valid children\n  Array.isArray(x) ||\n  // Allow nullish\n  x == null ||\n  // Disallow functions and objects\n  !(typeof x === \"function\" || typeof x === \"object\")\n  // Everything else can be a child when stringified\n\n// Coerces input into a DOM node, if it isn't already one\nconst toNode = x =>\n  x instanceof Node\n    ? x\n    : document.createTextNode(x)\n\n// Processes bruh children into an array of DOM nodes\n// Reactive values are automatically replaced, so the output must be placed into a parent node\n// before any top level (after flattening arrays) reactions run\nexport const bruhChildrenToNodes = (...children) =>\n  children\n    .flat(Infinity)\n    .flatMap(child => {\n      // Non-reactive values are untouched\n      if (!child[isReactive])\n        return [toNode(child)]\n\n      // Reactive arrays become live fragments with auto-swapped children\n      if (Array.isArray(child.value)) {\n        const liveFragment = new LiveFragment()\n        child.addReaction(() => {\n          liveFragment.replaceChildren(...bruhChildrenToNodes(...child.value))\n        })\n        return [liveFragment.startMarker, ...bruhChildrenToNodes(...child.value), liveFragment.endMarker]\n      }\n\n      // Reactive values become auto-swapped DOM nodes\n      let node = toNode(child.value)\n      child.addReaction(() => {\n        const oldNode = node\n        node = toNode(child.value)\n        oldNode.replaceWith(node)\n      })\n      return [node]\n    })\n\n//#endregion\n\n//#region Reactive-aware element helper functions e.g. applyAttributes()\n\n// Style attribute rules from an object with\n// potentially reactive and/or undefined values\nexport const applyStyles = (element, styles) => {\n  for (const property in styles)\n    reactiveDo(styles[property], value => {\n      if (value !== undefined)\n        element.style.setProperty   (property, value)\n      else\n        element.style.removeProperty(property)\n    })\n}\n\n// Class list from an object mapping from\n// class names to potentially reactive booleans\nexport const applyClasses = (element, classes) => {\n  for (const name in classes)\n    reactiveDo(classes[name], value => {\n      element.classList.toggle(name, value)\n    })\n}\n\n// Attributes from an object with\n// potentially reactive and/or undefined values\nexport const applyAttributes = (element, attributes) => {\n  for (const name in attributes)\n    reactiveDo(attributes[name], value => {\n      if (value !== undefined)\n        element.setAttribute   (name, value)\n      else\n        element.removeAttribute(name)\n    })\n}\n\n//#endregion\n\n//#region t() for text nodes and e() for element nodes\n\n// Text nodes\nexport const t = textContent => {\n  // Non-reactive values are just text nodes\n  if (!textContent[isReactive])\n    return document.createTextNode(textContent)\n\n  // Reactive values auto-update the node's text content\n  const node = document.createTextNode(textContent.value)\n  textContent.addReaction(() => {\n    node.textContent = textContent.value\n  })\n  return node\n}\n\n// Elements\nexport const e = name => (...variadic) => {\n  // If there are no props\n  if (isBruhChild(variadic[0])) {\n    const element = document.createElement(name)\n    element.append(...bruhChildrenToNodes(...variadic))\n    return element\n  }\n\n  // If props exist as the first variadic argument\n  const [props, ...children] = variadic\n\n  // Extract explicit options from the bruh prop\n  const { namespace } = props.bruh ?? {}\n  delete props.bruh\n\n  // Make an element with optional namespace\n  const element =\n    namespace\n      ? document.createElementNS(namespace, name)\n      : document.createElement  (           name)\n\n  // Apply overloaded props, if possible\n  if (typeof props.style === \"object\") {\n    applyStyles(element, props.style)\n    delete props.style\n  }\n  if (typeof props.class === \"object\") {\n    applyClasses(element, props.class)\n    delete props.class\n  }\n  // The rest of the props are attributes\n  applyAttributes(element, props)\n\n  // Add the children to the element\n  element.append(...bruhChildrenToNodes(...children))\n  return element\n}\n\n//#endregion\n\n//#region JSX integration\n\n// The function that jsx tags (except fragments) compile to\nexport const h = (nameOrComponent, props, ...children) => {\n  // If we are making an element, this is just a wrapper of e()\n  // This is likely when the JSX tag name begins with a lowercase character\n  if (typeof nameOrComponent === \"string\") {\n    const makeElement = e(nameOrComponent)\n    return props\n      ? makeElement(props, ...children)\n      : makeElement(...children)\n  }\n\n  // It must be a component, then, as bruh components are just functions\n  // Due to JSX, this would mean a function with only one parameter - props\n  // This object includes the all of the normal props and a \"children\" key\n  return nameOrComponent({ ...props, children })\n}\n\n// The JSX fragment is made into a bruh fragment (just an array)\nexport const JSXFragment = ({ children }) => children\n\n//#endregion\n\n\n\n// Hydration of all bruh-textnode's from prerendered html\nexport const hydrateTextNodes = () => {\n  const tagged = {}\n  const bruhTextNodes = document.getElementsByTagName(\"bruh-textnode\")\n\n  for (const bruhTextNode of bruhTextNodes) {\n    const textNode = document.createTextNode(bruhTextNode.textContent)\n\n    const tag = bruhTextNode.getAttribute(\"tag\")\n    if (tag)\n      tagged[tag] = textNode\n\n    bruhTextNode.replaceWith(textNode)\n  }\n\n  return tagged\n}\n","// Create a pipeline with an initial value and a series of functions\nexport const pipe = (x, ...fs) =>\n  fs.reduce((y, f) => f(y), x)\n\n// Dispatch a custom event to (capturing) and from (bubbling) a target (usually a DOM node)\n// Returns false if the event was cancelled (preventDefault()) and true otherwise\nexport const dispatch = (target, type, options) =>\n  target.dispatchEvent(\n    // Default to behave like most DOM events\n    new CustomEvent(type, {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      ...options\n    })\n  )\n\n// Inspired by https://antfu.me/posts/destructuring-with-object-or-array#take-away\n// Creates an object that is both destructable with {...} and [...]\n// Useful for writing library functions à la react-use & vueuse\nexport const createDestructable = (object, iterable) => {\n  const destructable = {\n    ...object,\n    [Symbol.iterator]: () => iterable[Symbol.iterator]()\n  }\n\n  Object.defineProperty(destructable, Symbol.iterator, {\n    enumerable: false\n  })\n\n  return destructable\n}\n\n// Creates an object (as a Proxy) that acts as a function\n// So functionAsObject(f).property is equivalent to f(\"property\")\n// This is can be useful when combined with destructuring syntax, e.g.:\n// const { html, head, title, body, main, h1, p } = functionAsObject(e)\nexport const functionAsObject = f =>\n  new Proxy({}, {\n    get: (_, property) => f(property)\n  })\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"bruh.umd.js","sources":["../src/dom/live-fragment.mjs","../src/reactive/index.mjs","../src/dom/index.browser.mjs","../src/util/index.mjs"],"sourcesContent":["// Lightweight and performant DOM fragment that keeps its place,\n// useful for grouping siblings without making a parent element.\n// Not a true analog of the DocumentFragment, because the implementation\n// would be infeasible with that scope, adding a performance penalty as well.\n// Works as long as the start & end placeholders are siblings in that order\n// and they do not overlap other LiveFragment's:\n// Works: (start A)(start B)(end B)(end A)\n// Fails: (start A)(start B)(end A)(end B)\n// Also, make sure not to call .normalize() on the parent element,\n// because that would ruin the placeholders.\nexport class LiveFragment {\n  startMarker = document.createTextNode(\"\")\n  endMarker   = document.createTextNode(\"\")\n\n  static from(firstNode, lastNode) {\n    const liveFragment = new this()\n    firstNode.before(liveFragment.startMarker)\n    lastNode.after(liveFragment.endMarker)\n    return liveFragment\n  }\n\n  before(...xs) {\n    this.startMarker.before(...xs)\n  }\n\n  prepend(...xs) {\n    this.startMarker.after(...xs)\n  }\n\n  append(...xs) {\n    this.endMarker.before(...xs)\n  }\n\n  after(...xs) {\n    this.endMarker.after(...xs)\n  }\n\n  remove() {\n    const range = document.createRange()\n    range.setStartBefore(this.startMarker)\n    range.setEndAfter(this.endMarker)\n    range.deleteContents()\n  }\n\n  replaceChildren(...xs) {\n    const range = document.createRange()\n    range.setStartAfter(this.startMarker)\n    range.setEndBefore(this.endMarker)\n    range.deleteContents()\n    this.startMarker.after(...xs)\n  }\n\n  replaceWith(...xs) {\n    this.endMarker.after(...xs)\n    this.remove()\n  }\n\n  get childNodes() {\n    const childNodes = []\n\n    for (\n      let currentNode = this.startMarker.nextSibling;\n      currentNode != this.endMarker && currentNode;\n      currentNode = currentNode.nextSibling\n    )\n      childNodes.push(currentNode)\n\n    return childNodes\n  }\n\n  get children() {\n    return this.childNodes\n      .filter(node => node instanceof HTMLElement)\n  }\n}\n","export const isReactive = Symbol.for(\"bruh reactive\")\n\n// A super simple and performant reactive value implementation\nexport class SimpleReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  constructor(value) {\n    this.#value = value\n  }\n\n  get value() {\n    return this.#value\n  }\n\n  set value(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    for (const reaction of this.#reactions)\n      reaction()\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n}\n\n// A reactive implementation for building functional reactive graphs\n// Ensures state consistency, minimal node updates, and transparent update batching\nexport class FunctionalReactive {\n  [isReactive] = true\n\n  #value\n  #reactions = new Set()\n\n  // For derived nodes, f is the derivation function\n  #f\n  // Source nodes are 0 deep in the derivation graph\n  // This is for topological sort\n  #depth = 0\n  // All nodes have a set of derivatives that update when the node changes\n  #derivatives = new Set()\n\n  // Keep track of all the pending changes from the value setter\n  static #settersQueue = new Map()\n  // A queue of derivatives to potentially update, sorted into sets by depth\n  // This starts with depth 1 and can potentially have holes\n  static #derivativesQueue = []\n  // A queue of reactions to run after the graph is fully updated\n  static #reactionsQueue = []\n\n  constructor(x, f) {\n    if (!f) {\n      this.#value = x\n      return\n    }\n\n    this.#value = f()\n    this.#f = f\n    this.#depth = Math.max(...x.map(d => d.#depth)) + 1\n\n    x.forEach(d => d.#derivatives.add(this))\n  }\n\n  get value() {\n    // If there are any pending updates\n    if (FunctionalReactive.#settersQueue.size) {\n      // Heuristic quick invalidation for derived nodes\n      // Apply updates now, it's ok that there's already a microtask queued for this\n      if (this.#depth !== 0)\n        FunctionalReactive.applyUpdates()\n      // If this is a source node that was updated, just return that\n      // new value without actually updating any derived nodes yet\n      else if (FunctionalReactive.#settersQueue.has(this))\n        return FunctionalReactive.#settersQueue.get(this)\n    }\n\n    return this.#value\n  }\n\n  set value(newValue) {\n    // Only allow source nodes to be directly updated\n    if (this.#depth !== 0)\n      return\n\n    // Unless asked for earlier, these updates are just queued up until the microtasks run\n    if (!FunctionalReactive.#settersQueue.size)\n      queueMicrotask(FunctionalReactive.applyUpdates)\n\n    FunctionalReactive.#settersQueue.set(this, newValue)\n  }\n\n  addReaction(reaction) {\n    this.#reactions.add(reaction)\n\n    return () =>\n      this.#reactions.delete(reaction)\n  }\n\n  // Apply an update for a node and queue its derivatives if it actually changed\n  #applyUpdate(newValue) {\n    if (newValue === this.#value)\n      return\n\n    this.#value = newValue\n    FunctionalReactive.#reactionsQueue.push(...this.#reactions)\n\n    const queue = FunctionalReactive.#derivativesQueue\n    for (const derivative of this.#derivatives) {\n      const depth = derivative.#depth\n      if (!queue[depth])\n        queue[depth] = new Set()\n\n      queue[depth].add(derivative)\n    }\n  }\n\n  // Apply pending updates from actually changed source nodes\n  static applyUpdates() {\n    if (!FunctionalReactive.#settersQueue.size)\n      return\n\n    // Bootstrap by applying the updates from the pending setters\n    for (const [sourceNode, newValue] of FunctionalReactive.#settersQueue.entries())\n      sourceNode.#applyUpdate(newValue)\n    FunctionalReactive.#settersQueue.clear()\n\n    // Iterate down the depths, ignoring holes\n    // Note that both the queue (Array) and each depth Set iterators update as items are added\n    for (const depthSet of FunctionalReactive.#derivativesQueue) if (depthSet)\n      for (const derivative of depthSet)\n        derivative.#applyUpdate(derivative.#f())\n    FunctionalReactive.#derivativesQueue.length = 0\n\n    // Call all reactions now that the graph has a fully consistent state\n    for (const reaction of FunctionalReactive.#reactionsQueue)\n      reaction()\n    FunctionalReactive.#reactionsQueue.length = 0\n  }\n}\n\n// A little convenience function\nexport const r = (x, f) => new FunctionalReactive(x, f)\n\n// Do something with a value, updating if it is reactive\nexport const reactiveDo = (x, f) => {\n  if (x?.[isReactive]) {\n    f(x.value)\n    return x.addReaction(() => f(x.value))\n  }\n\n  f(x)\n}\n","import { LiveFragment } from \"./live-fragment.mjs\"\nimport { isReactive, reactiveDo } from \"../reactive/index.mjs\"\n\n//#region Bruh child functions e.g. bruhChildrenToNodes()\n\n// A basic check for if a value is allowed as a child in bruh\n// It's responsible for quickly checking the type, not deep validation\nconst isBruhChild = x =>\n  // Reactives and DOM nodes\n  x?.[isReactive] ||\n  x instanceof Node ||\n  // Any array, just assume it contains valid children\n  Array.isArray(x) ||\n  // Allow nullish\n  x == null ||\n  // Disallow functions and objects\n  !(typeof x === \"function\" || typeof x === \"object\")\n  // Everything else can be a child when stringified\n\n// Coerces input into a DOM node, if it isn't already one\nconst toNode = x => {\n  // Existing DOM nodes are untouched\n  if (x instanceof Node)\n    return x\n  // booleans and nullish are ignored\n  else if (typeof x === \"boolean\" || x === undefined || x === null)\n    return document.createComment(x)\n  // Anything else is treated as text\n  else\n    return document.createTextNode(x)\n}\n\n// Processes bruh children into an array of DOM nodes\n// Reactive values are automatically replaced, so the output must be placed into a parent node\n// before any top level (after flattening arrays) reactions run\nexport const bruhChildrenToNodes = (...children) =>\n  children\n    .flat(Infinity)\n    .flatMap(child => {\n      // Non-reactive values are untouched\n      if (!child?.[isReactive])\n        return [toNode(child)]\n\n      // Reactive arrays become live fragments with auto-swapped children\n      if (Array.isArray(child.value)) {\n        const liveFragment = new LiveFragment()\n        child.addReaction(() => {\n          liveFragment.replaceChildren(...bruhChildrenToNodes(...child.value))\n        })\n        return [liveFragment.startMarker, ...bruhChildrenToNodes(...child.value), liveFragment.endMarker]\n      }\n\n      // Reactive values become auto-swapped DOM nodes\n      let node = toNode(child.value)\n      child.addReaction(() => {\n        const oldNode = node\n        node = toNode(child.value)\n        oldNode.replaceWith(node)\n      })\n      return [node]\n    })\n\n//#endregion\n\n//#region Reactive-aware element helper functions e.g. applyAttributes()\n\n// Style attribute rules from an object with\n// potentially reactive and/or undefined values\nexport const applyStyles = (element, styles) => {\n  for (const property in styles)\n    reactiveDo(styles[property], value => {\n      if (value !== undefined)\n        element.style.setProperty   (property, value)\n      else\n        element.style.removeProperty(property)\n    })\n}\n\n// Class list from an object mapping from\n// class names to potentially reactive booleans\nexport const applyClasses = (element, classes) => {\n  for (const name in classes)\n    reactiveDo(classes[name], value => {\n      element.classList.toggle(name, value)\n    })\n}\n\n// Attributes from an object with\n// potentially reactive and/or undefined values\nexport const applyAttributes = (element, attributes) => {\n  for (const name in attributes)\n    reactiveDo(attributes[name], value => {\n      if (value !== undefined)\n        element.setAttribute   (name, value)\n      else\n        element.removeAttribute(name)\n    })\n}\n\n//#endregion\n\n//#region t() for text nodes and e() for element nodes\n\n// Text nodes\nexport const t = textContent => {\n  // Non-reactive values are just text nodes\n  if (!textContent[isReactive])\n    return document.createTextNode(textContent)\n\n  // Reactive values auto-update the node's text content\n  const node = document.createTextNode(textContent.value)\n  textContent.addReaction(() => {\n    node.textContent = textContent.value\n  })\n  return node\n}\n\n// Elements\nexport const e = name => (...variadic) => {\n  // If there are no props\n  if (isBruhChild(variadic[0])) {\n    const element = document.createElement(name)\n    element.append(...bruhChildrenToNodes(...variadic))\n    return element\n  }\n\n  // If props exist as the first variadic argument\n  const [props, ...children] = variadic\n\n  // Extract explicit options from the bruh prop\n  const { namespace } = props.bruh ?? {}\n  delete props.bruh\n\n  // Make an element with optional namespace\n  const element =\n    namespace\n      ? document.createElementNS(namespace, name)\n      : document.createElement  (           name)\n\n  // Apply overloaded props, if possible\n\n  // Inline style object\n  if (typeof props.style === \"object\" && !props.style[isReactive]) {\n    applyStyles(element, props.style)\n    delete props.style\n  }\n  // Classes object\n  if (typeof props.class === \"object\" && !props.class[isReactive]) {\n    applyClasses(element, props.class)\n    delete props.class\n  }\n  for (const name in props) {\n    // Event listener functions\n    if (name.startsWith(\"on\") && typeof props[name] === \"function\") {\n      element.addEventListener(name.slice(2), props[name])\n      delete props[name]\n    }\n  }\n\n  // The rest of the props are attributes\n  applyAttributes(element, props)\n\n  // Add the children to the element\n  element.append(...bruhChildrenToNodes(...children))\n  return element\n}\n\n//#endregion\n\n//#region JSX integration\n\n// The function that jsx tags (except fragments) compile to\nexport const h = (nameOrComponent, props, ...children) => {\n  // If we are making an element, this is just a wrapper of e()\n  // This is likely when the JSX tag name begins with a lowercase character\n  if (typeof nameOrComponent === \"string\") {\n    const makeElement = e(nameOrComponent)\n    return props\n      ? makeElement(props, ...children)\n      : makeElement(...children)\n  }\n\n  // It must be a component, then, as bruh components are just functions\n  // Due to JSX, this would mean a function with only one parameter - props\n  // This object includes the all of the normal props and a \"children\" key\n  return nameOrComponent({ ...props, children })\n}\n\n// The JSX fragment is made into a bruh fragment (just an array)\nexport const JSXFragment = ({ children }) => children\n\n//#endregion\n\n\n\n// Hydration of all bruh-textnode's from prerendered html\nexport const hydrateTextNodes = () => {\n  const tagged = {}\n  const bruhTextNodes = document.getElementsByTagName(\"bruh-textnode\")\n\n  for (const bruhTextNode of bruhTextNodes) {\n    const textNode = document.createTextNode(bruhTextNode.textContent)\n\n    const tag = bruhTextNode.getAttribute(\"tag\")\n    if (tag)\n      tagged[tag] = textNode\n\n    bruhTextNode.replaceWith(textNode)\n  }\n\n  return tagged\n}\n","// Create a pipeline with an initial value and a series of functions\nexport const pipe = (x, ...fs) =>\n  fs.reduce((y, f) => f(y), x)\n\n// Dispatch a custom event to (capturing) and from (bubbling) a target (usually a DOM node)\n// Returns false if the event was cancelled (preventDefault()) and true otherwise\nexport const dispatch = (target, type, options) =>\n  target.dispatchEvent(\n    // Default to behave like most DOM events\n    new CustomEvent(type, {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      ...options\n    })\n  )\n\n// Inspired by https://antfu.me/posts/destructuring-with-object-or-array#take-away\n// Creates an object that is both destructable with {...} and [...]\n// Useful for writing library functions à la react-use & vueuse\nexport const createDestructable = (object, iterable) => {\n  const destructable = {\n    ...object,\n    [Symbol.iterator]: () => iterable[Symbol.iterator]()\n  }\n\n  Object.defineProperty(destructable, Symbol.iterator, {\n    enumerable: false\n  })\n\n  return destructable\n}\n\n// Creates an object (as a Proxy) that acts as a function\n// So functionAsObject(f).property is equivalent to f(\"property\")\n// This is can be useful when combined with destructuring syntax, e.g.:\n// const { html, head, title, body, main, h1, p } = functionAsObject(e)\nexport const functionAsObject = f =>\n  new Proxy({}, {\n    get: (_, property) => f(property)\n  })\n"],"names":[],"mappings":"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"}

package/package.json

@@ -10,7 +10,7 @@
     "library",
     "modern"
   ],
-  "version": "1.10.0",
+  "version": "1.12.0",
   "license": "MIT",
   "author": {
     "name": "Daniel Ethridge",
@@ -24,9 +24,11 @@
     "directory": "packages/bruh"
   },
   "type": "module",
+  "main": "./dist/bruh.umd.js",
   "exports": {
     "./": {
-      "browser": "./src/index.mjs"
+      "browser": "./dist/bruh.es.js",
+      "default": "./dist/bruh.umd.js"
     },
     "./dom": {
       "node": "./src/dom/index.node.mjs",

package/src/dom/index.browser.mjs

@@ -18,10 +18,17 @@ const isBruhChild = x =>
   // Everything else can be a child when stringified
 
 // Coerces input into a DOM node, if it isn't already one
-const toNode = x =>
-  x instanceof Node
-    ? x
-    : document.createTextNode(x)
+const toNode = x => {
+  // Existing DOM nodes are untouched
+  if (x instanceof Node)
+    return x
+  // booleans and nullish are ignored
+  else if (typeof x === "boolean" || x === undefined || x === null)
+    return document.createComment(x)
+  // Anything else is treated as text
+  else
+    return document.createTextNode(x)
+}
 
 // Processes bruh children into an array of DOM nodes
 // Reactive values are automatically replaced, so the output must be placed into a parent node
@@ -31,7 +38,7 @@ export const bruhChildrenToNodes = (...children) =>
     .flat(Infinity)
     .flatMap(child => {
       // Non-reactive values are untouched
-      if (!child[isReactive])
+      if (!child?.[isReactive])
         return [toNode(child)]
 
       // Reactive arrays become live fragments with auto-swapped children
@@ -131,14 +138,25 @@ export const e = name => (...variadic) => {
       : document.createElement  (           name)
 
   // Apply overloaded props, if possible
-  if (typeof props.style === "object") {
+
+  // Inline style object
+  if (typeof props.style === "object" && !props.style[isReactive]) {
     applyStyles(element, props.style)
     delete props.style
   }
-  if (typeof props.class === "object") {
+  // Classes object
+  if (typeof props.class === "object" && !props.class[isReactive]) {
     applyClasses(element, props.class)
     delete props.class
   }
+  for (const name in props) {
+    // Event listener functions
+    if (name.startsWith("on") && typeof props[name] === "function") {
+      element.addEventListener(name.slice(2), props[name])
+      delete props[name]
+    }
+  }
+
   // The rest of the props are attributes
   applyAttributes(element, props)
 

package/src/dom/index.node.mjs

@@ -125,6 +125,7 @@ export class MetaElement {
 
     const contents = this.children
       .flat(Infinity)
+      .filter(x => typeof x !== "boolean" && x !== undefined && x !== null)
       .map(child =>
         (child[isMetaNode] || child[isMetaRawString])
           ? child.toString()

package/src/reactive/index.mjs

@@ -70,10 +70,17 @@ export class FunctionalReactive {
   }
 
   get value() {
-    // If there are any pending updates, go ahead and apply them first
-    // It's ok that there's already a microtask queued for this
-    if (FunctionalReactive.#settersQueue.size)
-      FunctionalReactive.applyUpdates()
+    // If there are any pending updates
+    if (FunctionalReactive.#settersQueue.size) {
+      // Heuristic quick invalidation for derived nodes
+      // Apply updates now, it's ok that there's already a microtask queued for this
+      if (this.#depth !== 0)
+        FunctionalReactive.applyUpdates()
+      // If this is a source node that was updated, just return that
+      // new value without actually updating any derived nodes yet
+      else if (FunctionalReactive.#settersQueue.has(this))
+        return FunctionalReactive.#settersQueue.get(this)
+    }
 
     return this.#value
   }