bruh 1.13.1 → 2.0.0-beta.1

package/dist/browser/jsx-runtime.mjs

@@ -0,0 +1,2 @@
+export { Fragment, jsx, jsx as jsxDEV, jsx as jsxs } from '../browser.mjs';
+//# sourceMappingURL=jsx-runtime.mjs.map

package/dist/browser/jsx-runtime.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"jsx-runtime.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/browser.mjs

@@ -0,0 +1,174 @@
+import { isReactive, reactiveDo } from './reactive.mjs';
+
+const terminalBruhChildToNode = (child) => {
+  if (child instanceof Node)
+    return child;
+  else if (child == null || typeof child === "boolean")
+    return document.createComment(child + "");
+  else
+    return document.createTextNode(child + "");
+};
+const reactiveTerminalBruhChildToNode = (child) => {
+  let node = terminalBruhChildToNode(child.value);
+  const stopReacting = child.addReaction(() => {
+    if (!node.parentNode) {
+      stopReacting();
+      return;
+    }
+    const oldNode = node;
+    const child_ = child;
+    if (child.value != null && typeof child.value === "object" && Symbol.iterator in child.value) {
+      stopReacting();
+      oldNode.replaceWith(...reactiveIterableBruhChildToNodes(child_));
+    } else {
+      node = terminalBruhChildToNode(child_.value);
+      oldNode.replaceWith(node);
+    }
+  });
+  return node;
+};
+function* reactiveIterableBruhChildToNodes(child) {
+  const first = document.createComment("[");
+  const last = document.createComment("]");
+  const stopReacting = child.addReaction(() => {
+    if (!first.parentNode) {
+      stopReacting();
+      return;
+    }
+    const range = document.createRange();
+    range.setStartAfter(first);
+    if (child.value != null && typeof child.value === "object" && Symbol.iterator in child.value) {
+      const child_ = child;
+      range.setEndBefore(last);
+      range.deleteContents();
+      first.after(...bruhChildrenToNodes(child_.value));
+    } else {
+      const child_ = child;
+      stopReacting();
+      range.setEndAfter(last);
+      range.deleteContents();
+      first.replaceWith(reactiveTerminalBruhChildToNode(child_));
+    }
+  });
+  yield first;
+  yield* bruhChildrenToNodes(child.value);
+  yield last;
+}
+function* bruhChildrenToNodes(children) {
+  const partiallyFlattened = Array.isArray(children) ? children.flat(Infinity) : children;
+  for (const child of partiallyFlattened) {
+    if (!isReactive(child)) {
+      if (child != null && typeof child === "object" && Symbol.iterator in child)
+        yield* bruhChildrenToNodes(child);
+      else
+        yield terminalBruhChildToNode(child);
+    } else {
+      if (child.value != null && typeof child.value === "object" && Symbol.iterator in child.value)
+        yield* reactiveIterableBruhChildToNodes(child);
+      else
+        yield reactiveTerminalBruhChildToNode(child);
+    }
+  }
+}
+const isElementWithStyle = (element) => (
+  // @ts-ignore
+  element.style instanceof CSSStyleDeclaration
+);
+const applyStyles = (element, styles) => {
+  for (const property in styles) {
+    const property_ = property;
+    reactiveDo(styles[property_], (value) => {
+      if (value != null && typeof value !== "boolean")
+        element.style.setProperty(property, value + "");
+      else
+        element.style.removeProperty(property);
+    });
+  }
+};
+const applyClasses = (element, classes) => {
+  for (const name in classes)
+    reactiveDo(classes[name], (value) => {
+      element.classList.toggle(name, value === true);
+    });
+};
+const applyAttributes = (element, attributes) => {
+  for (const name in attributes)
+    reactiveDo(attributes[name], (value) => {
+      if (typeof value === "boolean")
+        element.toggleAttribute(name, value);
+      else if (value != null)
+        element.setAttribute(name, value + "");
+      else
+        element.removeAttribute(name);
+    });
+};
+const t = (textContent) => {
+  if (!isReactive(textContent))
+    return document.createTextNode(textContent + "");
+  const node = document.createTextNode(textContent.value + "");
+  textContent.addReaction(() => {
+    node.textContent = textContent.value + "";
+  });
+  return node;
+};
+const jsx = (nameOrComponent, props_, key) => {
+  if (key !== void 0)
+    props_.key = key;
+  if (typeof nameOrComponent !== "string") {
+    const component = nameOrComponent;
+    const props2 = props_;
+    return component(props2);
+  }
+  const name = nameOrComponent;
+  const props = props_;
+  let options = {};
+  if (typeof props.bruh === "object" && !isReactive(props.bruh)) {
+    options = props.bruh;
+    delete props.bruh;
+  }
+  const { namespace } = options;
+  const element = namespace ? document.createElementNS(namespace, name) : document.createElement(name);
+  if ("children" in props) {
+    element.append(
+      ...bruhChildrenToNodes(
+        props.children != null && typeof props.children === "object" && Symbol.iterator in props.children ? props.children : [props.children]
+      )
+    );
+    delete props.children;
+  }
+  if ("style" in props && props.style != null && typeof props.style === "object" && !isReactive(props.style) && isElementWithStyle(element)) {
+    applyStyles(element, props.style);
+    delete props.style;
+  }
+  if ("class" in props && props.class != null && typeof props.class === "object" && !isReactive(props.class)) {
+    applyClasses(element, props.class);
+    delete props.class;
+  }
+  for (const name_ in props) {
+    const name2 = name_;
+    if (typeof props[name2] === "function" && name2.startsWith("on")) {
+      element.addEventListener(name2.slice(2), props[name2]);
+      delete props[name2];
+    }
+  }
+  applyAttributes(element, props);
+  return element;
+};
+const Fragment = (props) => props.children;
+class BruhText extends HTMLElement {
+  static hydrated = {};
+  constructor() {
+    super();
+    const textNode = document.createTextNode(this.textContent);
+    const tag = this.getAttribute("tag");
+    if (tag) {
+      const set = BruhText.hydrated[tag] ??= /* @__PURE__ */ new Set();
+      set.add(textNode);
+    }
+    this.replaceWith(textNode);
+  }
+}
+customElements.define("bruh-text", BruhText);
+
+export { BruhText, Fragment, applyAttributes, applyClasses, applyStyles, bruhChildrenToNodes, jsx, t };
+//# sourceMappingURL=browser.mjs.map

package/dist/browser.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"browser.mjs","sources":["../src/dom/index.browser.mts"],"sourcesContent":["import { isReactive, reactiveDo } from \"../reactive/index.mts\"\nimport type { Reactive, MaybeReactive } from \"../reactive/index.mts\"\nimport type {\n  PropertyWiseOr,\n  LikelyAsString,\n  LikelyAsAbsent,\n  LikelyAsBoolean\n} from \"./types.mts\"\nimport type { PropertiesHyphen as Styles } from \"csstype\"\nimport type {\n  ElementType,\n\n  HTMLTag,\n  SVGTag,\n  MathMLTag,\n\n  Namespace,\n  HTMLNamespace,\n  SVGNamespace,\n  MathMLNamespace,\n\n  ElementToEventMap,\n  ElementToAttributes\n} from \"html-info\"\n\nexport type TerminalBruhChild =\n  | Node\n  | LikelyAsString\n  | LikelyAsAbsent\n\nexport type TerminalBruhChildOutputNode<Child extends TerminalBruhChild>\n  = Child extends Node\n    ? Child\n  : Child extends LikelyAsString\n    ? Text\n  : Child extends LikelyAsAbsent\n    ? Comment\n  : Node\n\n// disallow a reactive from directly holding a reactive\nexport type FlatBruhChild =\n  | MaybeReactive<TerminalBruhChild>\n  | Reactive<TerminalBruhChild | Iterable<BruhChild>>\n\nexport type BruhChild =\n  | FlatBruhChild\n  | Iterable<BruhChild>\n\nexport type StylesToApply = {\n  [Property in keyof Styles]: MaybeReactive<Styles[Property] | LikelyAsAbsent>\n}\n\nexport interface ClassesToApply {\n  [className: string]: MaybeReactive<LikelyAsBoolean>\n}\n\nexport type AttributesToApply<\n  Name extends string,\n  NS   extends Namespace = HTMLNamespace\n> = {\n  [Attribute in keyof ElementToAttributes<Name, NS>]?:\n    MaybeReactive<ElementToAttributes<Name, NS>[Attribute] | LikelyAsBoolean>\n}\n\ntype EventMapToListenerProps<EventMap> = {\n  [E in ((keyof EventMap) & string) as `on${E}`]:\n    (event: EventMap[E]) => void\n}\n\ntype AttributeMapToProps<AttributeMap> = {\n  [Attribute in keyof AttributeMap]:\n    MaybeReactive<AttributeMap[Attribute] | LikelyAsBoolean>\n    | ( Attribute extends \"style\"\n        ? StylesToApply\n      : Attribute extends \"class\"\n        ? ClassesToApply\n      : never\n    )\n}\n\nexport interface BruhOptions {\n  namespace?: Namespace\n}\n\ninterface BaseBruhProps {\n  bruh?:  BruhOptions,\n  children?: BruhChild\n}\n\nexport type BruhProps<\n  Name extends string,\n  NS   extends string = HTMLNamespace\n>\n  = BaseBruhProps\n  & (\n    NS extends HTMLNamespace\n      ? { bruh?: { namespace?:  HTMLNamespace } }\n      : { bruh: { namespace: NS } }\n  )\n  & Partial<\n    EventMapToListenerProps<ElementToEventMap<Name, NS>> &\n    AttributeMapToProps<ElementToAttributes<Name, NS>>\n  >\n\nexport type   HTMLTagToBruhProps = { [Name in   HTMLTag]: BruhProps<Name,   HTMLNamespace> }\nexport type    SVGTagToBruhProps = { [Name in    SVGTag]: BruhProps<Name,    SVGNamespace> }\nexport type MathMLTagToBruhProps = { [Name in MathMLTag]: BruhProps<Name, MathMLNamespace> }\n\nexport type TagToBruhProps =\n  PropertyWiseOr<\n    HTMLTagToBruhProps,\n    PropertyWiseOr<\n      SVGTagToBruhProps,\n      MathMLTagToBruhProps\n    >\n  >\n\nexport namespace JSX {\n  /** @see https://www.typescriptlang.org/docs/handbook/jsx.html#children-type-checking */\n  export interface ElementChildrenAttribute { children: {} }\n\n  /** @see https://www.typescriptlang.org/docs/handbook/jsx.html#attribute-type-checking */\n  export interface IntrinsicElements extends TagToBruhProps {}\n\n  export type Element = any\n\n  export type ElementType = HTMLTag | SVGTag | MathMLTag | ((props: any) => Element)\n}\n\n// Coerces input into a DOM node, if it isn't already one\nconst terminalBruhChildToNode: {\n  <Child extends TerminalBruhChild>(child: Child): TerminalBruhChildOutputNode<Child>\n} = (child: TerminalBruhChild): any => {\n  // Existing DOM nodes are untouched\n  if (child instanceof Node)\n    return child\n  // Nullish and booleans are ignored\n  else if (child == null || typeof child === \"boolean\")\n    return document.createComment(child + \"\")\n  // Anything else is treated as text\n  else\n    return document.createTextNode(child + \"\")\n}\n\n// Auto-swapping single reactive node\nconst reactiveTerminalBruhChildToNode: {\n  <Child extends TerminalBruhChild>(child: Reactive<Child>): TerminalBruhChildOutputNode<Child>\n} = (child: Reactive<TerminalBruhChild>): any => {\n  let node = terminalBruhChildToNode(child.value)\n\n  const stopReacting = child.addReaction(() => {\n    // Stop swapping if no longer possible\n    if (!node.parentNode) {\n      stopReacting()\n      return\n    }\n\n    const oldNode = node as typeof node & ChildNode\n    const child_ = child as Reactive<BruhChild>\n\n    // If an iterable now, stop swapping, then switch to reactive iterable swapping\n    if (\n      child.value != null &&\n      typeof child.value === \"object\" &&\n      Symbol.iterator in child.value\n    ) {\n      stopReacting()\n      oldNode.replaceWith(...reactiveIterableBruhChildToNodes(child_ as Reactive<Iterable<BruhChild>>))\n    }\n    // Normal swap\n    else {\n      node = terminalBruhChildToNode(child_.value as TerminalBruhChild)\n      oldNode.replaceWith(node)\n    }\n  })\n\n  return node\n}\n\n// Auto-swapping reactive iterable of nodes\nfunction * reactiveIterableBruhChildToNodes(child: Reactive<Iterable<BruhChild>>): IterableIterator<Node> {\n  // Markers owned by the swapper here itself, so that\n  // the values in the iterable can be swapped separately\n  const first = document.createComment(\"[\")\n  const last  = document.createComment(\"]\")\n\n  const stopReacting = child.addReaction(() => {\n    // Stop swapping if there is no parent to swap within\n    if (!first.parentNode) {\n      stopReacting()\n      return\n    }\n\n    // Make a range starting after the first marker\n    const range = document.createRange()\n    range.setStartAfter(first)\n\n    // Normal swap, replacing content between the first and last markers\n    if (\n      child.value != null &&\n      typeof child.value === \"object\" &&\n      Symbol.iterator in child.value\n    ) {\n      const child_ = child as Reactive<Iterable<BruhChild>>\n\n      range.setEndBefore(last)\n      range.deleteContents()\n      first.after(...bruhChildrenToNodes(child_.value))\n    }\n    // Switch to single swapping node by replacing everything\n    else {\n      const child_ = child as unknown as Reactive<TerminalBruhChild>\n\n      stopReacting()\n      range.setEndAfter(last)\n      range.deleteContents()\n      first.replaceWith(reactiveTerminalBruhChildToNode(child_))\n    }\n  })\n\n  yield first\n  yield* bruhChildrenToNodes(child.value)\n  yield last\n}\n\n// Processes bruh children into an iterable 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 iterables) reactions run\nexport function * bruhChildrenToNodes(children: Iterable<BruhChild>): IterableIterator<Node> {\n  const partiallyFlattened =\n    Array.isArray(children)\n      ? children.flat<BruhChild, number>(Infinity)\n      : children\n\n  for (const child of partiallyFlattened) {\n    if (!isReactive(child)) {\n      if (\n        child != null &&\n        typeof child === \"object\" &&\n        Symbol.iterator in child\n      )\n        yield* bruhChildrenToNodes(child)\n      else\n        yield terminalBruhChildToNode(child)\n    }\n    else {\n      if (\n        child.value != null &&\n        typeof child.value === \"object\" &&\n        Symbol.iterator in child.value\n      )\n        yield* reactiveIterableBruhChildToNodes(child as Reactive<Iterable<BruhChild>>)\n      else\n        yield reactiveTerminalBruhChildToNode(child as Reactive<TerminalBruhChild>)\n    }\n  }\n}\n\n//#endregion\n\n//#region Reactive-aware element helper functions e.g. applyAttributes()\n\ntype ElementWithStyle = HTMLElement | SVGElement | MathMLElement\n\n// https://w3c.github.io/csswg-drafts/cssom/#the-elementcssinlinestyle-mixin\nconst isElementWithStyle = <T extends Element>(element: T): element is (T & ElementWithStyle) =>\n  // @ts-ignore\n  element.style instanceof CSSStyleDeclaration\n\n/**\n * Style attribute rules from an object with\n * potentially reactive and/or set as absent values\n */\nexport const applyStyles = <E extends ElementWithStyle>(\n  element: E,\n  styles:  StylesToApply\n) => {\n  for (const property in styles) {\n    const property_ = property as keyof StylesToApply\n    reactiveDo(styles[property_], value => {\n      if (value != null && typeof value !== \"boolean\")\n        element.style.setProperty   (property, value + \"\")\n      else\n        element.style.removeProperty(property)\n    })\n  }\n}\n\n/**\n * Class list from an object mapping from\n * class names to potentially reactive booleans\n */\nexport const applyClasses = (\n  element: Element,\n  classes: ClassesToApply\n) => {\n  for (const name in classes)\n    reactiveDo(classes[name], value => {\n      // without coercing to a boolean, `undefined` would toggle instead of forcing removal\n      element.classList.toggle(name, value === true)\n    })\n}\n\n/**\n * Attributes from an object with\n * potentially reactive and/or set as absent values\n */\nexport const applyAttributes = <\n  Name extends string,\n  NS   extends Namespace = HTMLNamespace\n>(\n  element:    ElementType<Name, NS>,\n  attributes: AttributesToApply<Name, NS>\n) => {\n  for (const name in attributes)\n    reactiveDo<ElementToAttributes<Name, NS>[typeof name] | LikelyAsBoolean>(attributes[name], value => {\n      if (typeof value === \"boolean\")\n        element.toggleAttribute(name, value)\n      else if (value != null)\n        element.setAttribute   (name, value + \"\")\n      else\n        element.removeAttribute(name)\n    })\n}\n\n//#endregion\n\n//#region t()\n\n// Text nodes\nexport const t = (textContent: MaybeReactive<LikelyAsString>) => {\n  // Non-reactive values are just text nodes\n  if (!isReactive(textContent))\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//#endregion\n\n//#region JSX integration\n\ndeclare global {\n  interface String {\n    startsWith<Prefix extends string>(\n      prefix: Prefix,\n      position?: 0\n    ): this is `${Prefix}${string}`\n  }\n}\n\nexport const jsx: {\n  /**\n   * Create an HTML element\n   */\n  <\n    Name extends HTMLTag\n  >(\n    name: Name,\n    props: HTMLTagToBruhProps[Name],\n    key?: string\n  ):\n    HTMLElementTagNameMap[Name]\n\n  /**\n   * Create an SVG element\n   */\n  <\n    Name extends SVGTag\n  >(\n    name: Name,\n    props: SVGTagToBruhProps[Name],\n    key?: string\n  ):\n    SVGElementTagNameMap[Name]\n\n  /**\n   * Create a MathML element\n   */\n  <\n    Name extends MathMLTag\n  >(\n    name: Name,\n    props: MathMLTagToBruhProps[Name],\n    key?: string\n  ):\n    MathMLElementTagNameMap[Name]\n\n  /**\n   * Create an element\n   */\n  <\n    Name extends string,\n    NS   extends Namespace = HTMLNamespace\n  >(\n    name: Name,\n    props: BruhProps<Name, NS>,\n    key?: string\n  ):\n    ElementType<Name, NS>\n\n  /**\n   * Call a function as a JSX component\n   */\n  <\n    Props extends Record<any, unknown>,\n    Result\n  >(\n    component: (props: Props) => Result,\n    props: Props,\n    key?: string\n  ): Result\n} =\n<\n  Name extends string,\n  NS   extends Namespace = HTMLNamespace\n>\n(\n  nameOrComponent: Name | Function,\n  props_: Record<any, unknown>,\n  key?: string\n) => {\n  if (key !== undefined)\n    props_.key = key\n\n  // It must be a component, as bruh components are just functions\n  // Due to JSX, this would mean a function with only one parameter - props\n  // This object includes all of the normal props and a \"children\" key\n  if (typeof nameOrComponent !== \"string\") {\n    const component = nameOrComponent\n    const props = props_ as Record<any, unknown>\n\n    return component(props)\n  }\n\n  const name = nameOrComponent\n  const props = props_ as BruhProps<Name, NS>\n\n  // Extract explicit options from the bruh prop\n  let options: BruhOptions = {}\n  if (typeof props.bruh === \"object\" && !isReactive(props.bruh)) {\n    options = props.bruh\n    delete props.bruh\n  }\n  const { namespace } = options\n\n  // Make an element with optional namespace\n  const element =\n    namespace\n      ? document.createElementNS(namespace, name) as ElementType<Name, NS>\n      : document.createElement  (           name) as ElementType<Name, NS>\n\n  if (\"children\" in props) {\n    element.append(\n      ...bruhChildrenToNodes(\n        (\n          props.children != null &&\n          typeof props.children === \"object\" &&\n          Symbol.iterator in props.children\n        )\n          ? props.children\n          : [props.children]\n      )\n    )\n\n    delete props.children\n  }\n\n  // Apply overloaded props, if possible\n\n  // Inline style object\n  if (\n    \"style\" in props &&\n    props.style != null &&\n    typeof props.style === \"object\" &&\n    !isReactive(props.style) &&\n    isElementWithStyle(element)\n  ) {\n    applyStyles(element, props.style)\n    delete props.style\n  }\n\n  // Classes object\n  if (\n    \"class\" in props &&\n    props.class != null &&\n    typeof props.class === \"object\" &&\n    !isReactive(props.class)\n  ) {\n    applyClasses(element, props.class)\n    delete props.class\n  }\n\n  for (const name_ in props) {\n    const name = name_ as string & (keyof typeof props)\n    // Event listener functions\n    if (typeof props[name] === \"function\" && name.startsWith(\"on\")) {\n      element.addEventListener(name.slice(2), props[name] as any)\n      delete props[name]\n    }\n  }\n\n  // The rest of the props are attributes\n  applyAttributes(element, props as AttributesToApply<Name, NS>)\n\n  return element\n}\n\nexport const Fragment =\n  <Children extends BruhChild>\n  (props: { children: Children }) => props.children\n\n//#endregion\n\n\nexport class BruhText extends HTMLElement {\n  static hydrated: { readonly [tag: string]: ReadonlySet<Text> } = {}\n\n  constructor() {\n    super()\n\n    const textNode = document.createTextNode(this.textContent!)\n\n    const tag = this.getAttribute(\"tag\")\n    if (tag) {\n      const set = (BruhText.hydrated as { [tag: string]: Set<Text> })[tag] ??= new Set()\n      set.add(textNode)\n    }\n\n    this.replaceWith(textNode)\n  }\n}\n\ncustomElements.define(\"bruh-text\", BruhText)\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"bruh-text\": BruhText\n  }\n}\ndeclare module \"html-info\" {\n  interface HTMLTagToAttributes {\n    \"bruh-text\": {\n      \"tag\"?: string\n    }\n  }\n}\n"],"names":["props","name"],"mappings":"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"}

package/dist/cli/node.mjs

@@ -0,0 +1,16 @@
+#!/usr/bin/env node
+import { processImages } from '../media/images/node.mjs';
+import { join } from 'node:path';
+import { cac } from 'cac';
+
+const cli = cac("bruh");
+cli.command(
+  "process-images <directory>",
+  "Processes the images in the given directory for the optimized-picture component"
+).action(async (directory, options) => {
+  const imagesDirectory = join(process.cwd(), directory);
+  await processImages(imagesDirectory);
+});
+cli.help();
+cli.parse();
+//# sourceMappingURL=node.mjs.map

package/dist/cli/node.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"node.mjs","sources":["../../src/cli/index.mts"],"sourcesContent":["#!/usr/bin/env node\n\nimport { processImages } from \"../media/images.node.mts\"\nimport { join } from \"path\"\n\nimport { cac } from \"cac\"\nconst cli = cac(\"bruh\")\n\ncli\n  .command(\n    \"process-images <directory>\",\n    \"Processes the images in the given directory for the optimized-picture component\"\n  )\n  .action(async (directory: string, options) => {\n    const imagesDirectory = join(process.cwd(), directory)\n    await processImages(imagesDirectory)\n  })\n\ncli.help()\ncli.parse()\n"],"names":[],"mappings":";;;;;AAMA,MAAM,GAAA,GAAM,IAAI,MAAM,CAAA;AAEtB,GACG,CAAA,OAAA;AAAA,EACC,4BAAA;AAAA,EACA;AACF,CACC,CAAA,MAAA,CAAO,OAAO,SAAA,EAAmB,OAAY,KAAA;AAC5C,EAAA,MAAM,eAAkB,GAAA,IAAA,CAAK,OAAQ,CAAA,GAAA,IAAO,SAAS,CAAA;AACrD,EAAA,MAAM,cAAc,eAAe,CAAA;AACrC,CAAC,CAAA;AAEH,GAAA,CAAI,IAAK,EAAA;AACT,GAAA,CAAI,KAAM,EAAA"}

package/dist/components/aside-toc.mjs

@@ -0,0 +1,162 @@
+import { jsx, bruhChildrenToNodes } from '../browser.mjs';
+import { r } from '../reactive.mjs';
+import { spaceSeparated } from './utils.mjs';
+import { BruhCustomElementBase } from './custom-elements.mjs';
+
+const clamp = (min, x, max) => Math.min(Math.max(min, x), max);
+const getHeadingLevel = (heading) => parseInt(heading.localName[1]);
+const getSectionMetrics = (headings, container) => {
+  const metrics = /* @__PURE__ */ new Map();
+  for (let i = 0; i < headings.length; i++) {
+    const heading = headings[i];
+    const currentLevel = getHeadingLevel(heading);
+    let nextHeading;
+    for (let j = i + 1; j < headings.length; j++) {
+      const candidate = headings[j];
+      const candidateLevel = getHeadingLevel(candidate);
+      if (candidateLevel <= currentLevel) {
+        nextHeading = candidate;
+        break;
+      }
+    }
+    const contentTop = heading.getBoundingClientRect().top;
+    const contentBottom = nextHeading?.getBoundingClientRect().top ?? (heading.parentElement)?.getBoundingClientRect().bottom ?? innerHeight;
+    const visibleContentTop = clamp(0, contentTop, innerHeight);
+    const visibleContentBottom = clamp(0, contentBottom, innerHeight);
+    metrics.set(heading, {
+      contentTop,
+      contentBottom,
+      visibleContentTop,
+      visibleContentBottom
+    });
+  }
+  return metrics;
+};
+const getProportionalPromience = ({
+  contentTop,
+  contentBottom,
+  visibleContentTop,
+  visibleContentBottom
+}) => {
+  const contentHeight = contentBottom - contentTop;
+  const visibleContentHeight = visibleContentBottom - visibleContentTop;
+  if (visibleContentHeight === 0)
+    return 0;
+  const visibleContentOverScreen = visibleContentHeight / innerHeight;
+  const proportionOfContentVisible = visibleContentHeight / contentHeight;
+  return Math.max(visibleContentOverScreen, proportionOfContentVisible);
+};
+const kumaraswamyCDF = (a2, b2, x) => 1 - (1 - x ** a2) ** b2;
+const a = 1.4;
+const b = 3;
+const getProbabilisticProminence = ({
+  visibleContentTop,
+  visibleContentBottom
+}) => kumaraswamyCDF(a, b, visibleContentBottom / innerHeight) - kumaraswamyCDF(a, b, visibleContentTop / innerHeight);
+const getProminences = ({
+  headings,
+  probabilisticInfluence = 1 / 10
+}) => {
+  const metrics = getSectionMetrics(headings);
+  const prominences = /* @__PURE__ */ new Map();
+  for (const [heading, sectionMetrics] of metrics) {
+    let prominence;
+    const proportionalProminence = probabilisticInfluence !== 1 ? getProportionalPromience(sectionMetrics) : void 0;
+    const probabilisticProminence = probabilisticInfluence !== 0 ? getProbabilisticProminence(sectionMetrics) : void 0;
+    if (probabilisticInfluence === 0)
+      prominence = proportionalProminence;
+    else if (probabilisticInfluence === 1)
+      prominence = probabilisticProminence;
+    else
+      prominence = proportionalProminence ** (1 - probabilisticInfluence) * probabilisticProminence ** probabilisticInfluence;
+    prominences.set(heading, prominence);
+  }
+  return prominences;
+};
+class BruhAsideTOC extends BruhCustomElementBase {
+  static observedAttributes = [
+    "headings",
+    "container",
+    "max-level",
+    "probabilistic-influence"
+  ];
+  static bruh = {
+    parseAttributes: {
+      headings: (s) => [...new Set(spaceSeparated(s))],
+      container: (s) => s || void 0,
+      "max-level": (s) => {
+        const maxLevel = parseInt(s);
+        return isNaN(maxLevel) ? 3 : clamp(2, maxLevel, 6);
+      },
+      "probabilistic-influence": (s) => {
+        const probabilisticInfluence = parseFloat(s);
+        return isNaN(probabilisticInfluence) ? void 0 : clamp(0, probabilisticInfluence, 1);
+      }
+    }
+  };
+  #prominences;
+  #rendered;
+  constructor() {
+    super();
+    const headings = r(
+      [this.bruh.attributes.headings, this.bruh.attributes["max-level"]],
+      () => this.bruh.attributes.headings.value?.map((id) => this.ownerDocument.getElementById(id)).filter((e) => {
+        if (!(e instanceof HTMLHeadingElement))
+          return false;
+        const level = getHeadingLevel(e);
+        return level > 1 && level <= (this.bruh.attributes["max-level"].value ?? 2);
+      })
+    );
+    const container = r(
+      [this.bruh.attributes.container],
+      () => this.bruh.attributes.container.value ? this.ownerDocument.getElementById(this.bruh.attributes.container.value) ?? void 0 : void 0
+    );
+    const resizeOrScroll = r({ innerHeight, innerWidth, scrollY });
+    const onResizeOrScroll = () => {
+      resizeOrScroll.value = { innerHeight, innerWidth, scrollY };
+    };
+    addEventListener("resize", onResizeOrScroll, { passive: true });
+    addEventListener("scroll", onResizeOrScroll, { passive: true });
+    this.#prominences = r([headings, container, this.bruh.attributes["probabilistic-influence"], resizeOrScroll], () => {
+      if (!headings.value?.length)
+        return;
+      const prominences = getProminences({
+        headings: headings.value,
+        probabilisticInfluence: this.bruh.attributes["probabilistic-influence"].value
+      });
+      const oldValue = this.#prominences.value;
+      if (oldValue) {
+        const oldHeadings = new Set(oldValue.keys());
+        const newHeadings = new Set(prominences.keys());
+        const didChange = [...newHeadings].some((h) => !oldHeadings.has(h)) || [...oldHeadings].some((h) => !newHeadings.has(h));
+        if (!didChange) {
+          for (const [heading, prominence] of prominences)
+            oldValue.get(heading).value = prominence;
+          return oldValue;
+        }
+      }
+      return new Map([...prominences].map(([heading, prominence]) => [heading, r(prominence)]));
+    });
+    this.#rendered = r([this.#prominences], () => {
+      const prominences = this.#prominences.value;
+      if (!prominences)
+        return;
+      return /* @__PURE__ */ jsx("ol", { children: [...prominences].map(([heading, prominence]) => /* @__PURE__ */ jsx(
+        "li",
+        {
+          class: `bruh-aside-toc--level-${getHeadingLevel(heading)}`,
+          style: { "--prominence": prominence },
+          children: /* @__PURE__ */ jsx("a", { href: `#${heading.id}`, children: heading.textContent })
+        }
+      )) });
+    });
+  }
+  mountedCallback() {
+    const children = bruhChildrenToNodes([this.#rendered]);
+    this.replaceChildren(...children);
+  }
+}
+customElements.define("bruh-aside-toc", BruhAsideTOC);
+
+export { BruhAsideTOC };
+//# sourceMappingURL=aside-toc.mjs.map

package/dist/components/aside-toc.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"aside-toc.mjs","sources":["../../src/components/aside-toc/index.tsx"],"sourcesContent":["/** @jsxImportSource bruh/browser */\nimport { bruhChildrenToNodes } from \"bruh/browser\"\nimport { FunctionalReactive, r } from \"../../reactive/index.mts\"\nimport { spaceSeparated } from \"../utils.mts\"\nimport { BruhCustomElementBase } from \"../custom-elements.mts\"\n\nconst clamp = (min: number, x: number, max: number) =>\n  Math.min(Math.max(min, x), max)\n\nconst getHeadingLevel = (heading: HTMLHeadingElement) =>\n  parseInt(heading.localName[1])\n\ntype SectionMetrics = {\n  contentTop: number,\n  contentBottom: number,\n  visibleContentTop: number,\n  visibleContentBottom: number\n}\n\nconst getSectionMetrics = (\n  headings: ReadonlyArray<HTMLHeadingElement>,\n  container?: HTMLElement\n) => {\n  const metrics = new Map<HTMLHeadingElement, SectionMetrics>()\n\n  for (let i = 0; i < headings.length; i++) {\n    const heading = headings[i]\n    const currentLevel = getHeadingLevel(heading)\n\n    let nextHeading: HTMLHeadingElement | undefined\n    for (let j = i + 1; j < headings.length; j++) {\n      const candidate = headings[j]\n      const candidateLevel = getHeadingLevel(candidate)\n\n      if (candidateLevel <= currentLevel) {\n        nextHeading = candidate\n        break\n      }\n    }\n\n    const contentTop = heading.getBoundingClientRect().top\n    const contentBottom =\n      nextHeading?.getBoundingClientRect().top\n      ?? (container ?? heading.parentElement)?.getBoundingClientRect().bottom\n      ?? innerHeight\n\n    const visibleContentTop    = clamp(0, contentTop,    innerHeight)\n    const visibleContentBottom = clamp(0, contentBottom, innerHeight)\n\n    metrics.set(heading, {\n      contentTop,\n      contentBottom,\n      visibleContentTop,\n      visibleContentBottom,\n    })\n  }\n\n  return metrics\n}\n\nconst getProportionalPromience = (\n  {\n    contentTop,\n    contentBottom,\n    visibleContentTop,\n    visibleContentBottom\n  }: SectionMetrics\n) => {\n  const contentHeight = contentBottom - contentTop\n  const visibleContentHeight = visibleContentBottom - visibleContentTop\n\n  if (visibleContentHeight === 0)\n    return 0\n\n  const visibleContentOverScreen = visibleContentHeight / innerHeight\n  const proportionOfContentVisible = visibleContentHeight / contentHeight\n\n  return Math.max(visibleContentOverScreen, proportionOfContentVisible)\n}\n\n/**\n * Cumulative Distribution Function over Kumaraswamy distribution (cheap and similar to beta)\n *\n * Corresponding PDF is `a * b * x ** (a - 1) * (1 - x ** a) ** (b - 1)`\n */\nconst kumaraswamyCDF = (\n  a: number,\n  b: number,\n  /** Up to this point */\n  x: number\n) => 1 - (1 - x ** a) ** b\n\n// We could have an e.g. 256 entry Float32Array of evenly split cached values\n// for expensive CDFs, but this one is very fast\n\n// I manually tuned these parameters to match what I thought looked accurate\n// The center of attention is ~22.5% of the way down the screen\nconst a = 1.4\nconst b = 3\n\nconst getProbabilisticProminence = (\n  {\n    visibleContentTop,\n    visibleContentBottom\n  }: SectionMetrics\n) =>\n  kumaraswamyCDF(a, b, visibleContentBottom / innerHeight) -\n  kumaraswamyCDF(a, b, visibleContentTop    / innerHeight)\n\nconst getProminences = ({\n  headings,\n  probabilisticInfluence = 1/10\n}: {\n  headings: ReadonlyArray<HTMLHeadingElement>,\n  probabilisticInfluence?: number\n}) => {\n  const metrics = getSectionMetrics(headings)\n\n  const prominences = new Map<HTMLHeadingElement, number>()\n\n  let i = 0\n  for (const [heading, sectionMetrics] of metrics) {\n    let prominence: number\n\n    const proportionalProminence = probabilisticInfluence !== 1\n      ? getProportionalPromience(sectionMetrics)\n      : undefined\n\n    const probabilisticProminence = probabilisticInfluence !== 0\n      ? getProbabilisticProminence(sectionMetrics)\n      : undefined\n\n    if (probabilisticInfluence === 0)\n      prominence = proportionalProminence!\n    else if (probabilisticInfluence === 1)\n      prominence = probabilisticProminence!\n    else\n      prominence = (\n        proportionalProminence!  ** (1 - probabilisticInfluence) *\n        probabilisticProminence! ** probabilisticInfluence\n      )\n\n    prominences.set(heading, prominence)\n    i++\n  }\n\n  return prominences\n}\n\n\ntype BruhAsideTOCAttributes = {\n  \"headings\"?: ReadonlyArray<string>,\n  \"container\"?: string,\n  \"max-level\": 2 | 3 |4 | 5 | 6\n  \"probabilistic-influence\"?: number\n}\n\nexport class BruhAsideTOC extends BruhCustomElementBase<BruhAsideTOCAttributes> {\n  static observedAttributes = [\n    \"headings\",\n    \"container\",\n    \"max-level\",\n    \"probabilistic-influence\"\n  ] as const\n\n  static bruh = {\n    parseAttributes: {\n      headings: (s: string | null) => [...new Set(spaceSeparated(s))],\n\n      container: (s: string | null) => s || undefined,\n\n      \"max-level\": (s: string | null) => {\n        const maxLevel = parseInt(s as string)\n        return isNaN(maxLevel)\n          ? 3\n          : clamp(2, maxLevel, 6)\n      },\n\n      \"probabilistic-influence\": (s: string | null) => {\n        const probabilisticInfluence = parseFloat(s as string)\n        return isNaN(probabilisticInfluence)\n          ? undefined\n          : clamp(0, probabilisticInfluence, 1)\n      }\n    }\n  }\n\n  #prominences: FunctionalReactive<Map<HTMLHeadingElement, FunctionalReactive<number>> | undefined>\n  #rendered\n\n  constructor() {\n    super()\n\n    const headings = r([this.bruh.attributes.headings, this.bruh.attributes[\"max-level\"]], () =>\n      this.bruh.attributes.headings.value\n        ?.map(id => this.ownerDocument.getElementById(id))\n        .filter((e): e is HTMLHeadingElement => {\n          if (!(e instanceof HTMLHeadingElement))\n            return false\n\n          const level = getHeadingLevel(e)\n          return level > 1 && level <= (this.bruh.attributes[\"max-level\"].value ?? 2)\n        })\n    )\n\n    const container = r([this.bruh.attributes.container], () =>\n      this.bruh.attributes.container.value\n        ? this.ownerDocument.getElementById(this.bruh.attributes.container.value) ?? undefined\n        : undefined\n    )\n\n    const resizeOrScroll = r({ innerHeight, innerWidth, scrollY })\n    const onResizeOrScroll = () => {\n      resizeOrScroll.value = { innerHeight, innerWidth, scrollY }\n    }\n    addEventListener(\"resize\", onResizeOrScroll, { passive: true })\n    addEventListener(\"scroll\", onResizeOrScroll, { passive: true })\n\n    this.#prominences = r([headings, container, this.bruh.attributes[\"probabilistic-influence\"], resizeOrScroll], () => {\n      if (!headings.value?.length)\n        return\n\n      const prominences = getProminences({\n        headings: headings.value,\n        probabilisticInfluence: this.bruh.attributes[\"probabilistic-influence\"].value\n      })\n\n      const oldValue = this.#prominences.value\n      if (oldValue) {\n        const oldHeadings = new Set(oldValue.keys())\n        const newHeadings = new Set(prominences.keys())\n        const didChange =\n          [...newHeadings].some(h => !oldHeadings.has(h)) ||\n          [...oldHeadings].some(h => !newHeadings.has(h))\n\n        if (!didChange) {\n          for (const [heading, prominence] of prominences)\n            oldValue.get(heading)!.value = prominence\n\n          return oldValue\n        }\n      }\n\n      return new Map([...prominences].map(([heading, prominence]) => [heading, r(prominence)]))\n    })\n\n    this.#rendered = r([this.#prominences], () => {\n      const prominences = this.#prominences.value\n      if (!prominences)\n        return\n\n      return (\n        <ol>\n          {[...prominences].map(([heading, prominence]) => (\n            <li\n              class={`bruh-aside-toc--level-${getHeadingLevel(heading)}`}\n              style={{ \"--prominence\": prominence }}\n            >\n              <a href={`#${heading.id}`}>\n                {heading.textContent}\n              </a>\n            </li>\n          ))}\n        </ol>\n      )\n    })\n  }\n\n  mountedCallback() {\n    const children = bruhChildrenToNodes([this.#rendered])\n    this.replaceChildren(...children)\n  }\n}\n\ncustomElements.define(\"bruh-aside-toc\", BruhAsideTOC)\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"bruh-aside-toc\": BruhAsideTOC\n  }\n}\ndeclare module \"html-info\" {\n  interface HTMLTagToAttributes {\n    \"bruh-aside-toc\": {\n      /**\n       * Space separated list of heading ids\n       */\n      \"headings\"?: ReadonlyArray<string>,\n      /** Content container id */\n      \"container\"?: string,\n      \"max-level\"?: `${2 | 3 | 4 | 5 | 6}`\n    }\n  }\n}\ndeclare module \"csstype\" {\n  interface PropertiesHyphen {\n    \"--prominence\"?: number\n  }\n}\n"],"names":["a","b"],"mappings":"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"}

package/dist/components/custom-elements.mjs

@@ -0,0 +1,52 @@
+import { r } from '../reactive.mjs';
+import { attempt } from '../utils.mjs';
+
+class CustomElement extends HTMLElement {
+  // https://html.spec.whatwg.org/multipage/custom-elements.html#element-definition
+  /**
+   * Which attributes to observe for `attributeChangedCallback()`
+   */
+  static observedAttributes;
+  /**
+   * Disable `attachInternals()` and/or `attachShadow()`
+   */
+  static disabledFeatures;
+  /**
+   * Whether the element is form-associated
+   */
+  static formAssociated;
+}
+class BruhCustomElementBase extends CustomElement {
+  static bruh;
+  bruh = {
+    attributes: {}
+  };
+  #setBruhAttribute(name, value = this.getAttribute(name)) {
+    const constructor = this.constructor;
+    const parse = constructor.bruh?.parseAttributes?.[name];
+    this.bruh.attributes[name] ??= r();
+    this.bruh.attributes[name].value = parse ? attempt(() => parse(value)) : value ?? void 0;
+  }
+  constructor() {
+    super();
+    const { observedAttributes } = this.constructor;
+    if (observedAttributes)
+      for (const name of observedAttributes)
+        this.#setBruhAttribute(name);
+  }
+  attributeChangedCallback(name, oldValue, newValue, namespace) {
+    this.#setBruhAttribute(name, newValue);
+  }
+  #mounted = false;
+  /**
+   * Overrides must call `super.connectedCallback()`
+   */
+  connectedCallback() {
+    if (this.#mounted) return;
+    this.mountedCallback?.();
+    this.#mounted = true;
+  }
+}
+
+export { BruhCustomElementBase, CustomElement };
+//# sourceMappingURL=custom-elements.mjs.map

package/dist/components/custom-elements.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-elements.mjs","sources":["../../src/components/custom-elements.mts"],"sourcesContent":["import { type SourceNode, r } from \"../reactive/index.mts\";\nimport { attempt } from \"../utils/index.mts\";\n\nexport class CustomElement extends HTMLElement {\n  // https://html.spec.whatwg.org/multipage/custom-elements.html#element-definition\n  /**\n   * Which attributes to observe for `attributeChangedCallback()`\n   */\n  static observedAttributes?: ReadonlyArray<string>\n\n  /**\n   * Disable `attachInternals()` and/or `attachShadow()`\n   */\n  static disabledFeatures?: ReadonlyArray<\"internals\" | \"shadow\">\n\n  /**\n   * Whether the element is form-associated\n   */\n  static formAssociated?: boolean\n\n  // https://html.spec.whatwg.org/multipage/custom-elements.html#custom-element-reactions\n  /**\n   * Called whenever the element is connected to a document\n   * @see https://html.spec.whatwg.org/multipage/infrastructure.html#becomes-connected\n   */\n  connectedCallback?(): void\n\n  /**\n   * Called whenever the element is disconnected from a document\n   * @see https://html.spec.whatwg.org/multipage/infrastructure.html#becomes-disconnected\n   */\n  disconnectedCallback?(): void\n\n  /**\n   * Called whenever the element is moved to a new document\n   * @see https://dom.spec.whatwg.org/#concept-node-move-ext\n   */\n  connectedMoveCallback?(): void\n\n  /**\n   * Called whenever the element is adopted by a new document\n   * @see https://dom.spec.whatwg.org/#concept-node-adopt\n   */\n  adoptedCallback?(oldDocument: Document, newDocument: Document): void\n\n  /**\n   * Called whenever an attribute is changed, appended, removed, or replaced\n   * @see https://dom.spec.whatwg.org/#concept-element-attributes-change-ext\n   */\n  attributeChangedCallback?(name: string, oldValue: string | null, newValue: string | null, namespace: string | null): void\n\n  /**\n   * Called (if the element is form-associated) whenever the form \"owner\" of the element is reset and doing so changes the form that owns the element\n   * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#reset-the-form-owner\n   */\n  formAssociatedCallback?(formOwner: HTMLFormElement | null): void\n\n  /**\n   * Called (if the element is form-associated) whenever the form \"owner\" of the element is reset\n   * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#concept-form-reset\n   */\n  formResetCallback?(): void\n\n  /**\n   * Called (if the element is form-associated) whenever the element is disabled or enabled\n   * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#concept-fe-disabled\n   */\n  formDisabledCallback?(isDisabled: boolean): void\n\n  /**\n   * Called (if the element is form-associated) whenever the element's value is restored\n   * @see https://html.spec.whatwg.org/multipage/browsing-the-web.html#restore-persisted-state\n   */\n  formStateRestoreCallback?(\n    state: FormDataEntryValue | FormDataIterator<[string, FormDataEntryValue]> | null,\n    reason: \"autocomplete\" | \"restore\"\n  ): void\n}\n\ntype ThisConstructor<BaseClass extends BruhCustomElementBase> = BaseClass extends BruhCustomElementBase<infer Attributes> ? typeof BruhCustomElementBase & {\n  observedAttributes?: ReadonlyArray<keyof Attributes>\n  bruh?: {\n    parseAttributes?: {\n      [A in keyof Attributes]?: (raw: string | null) => Attributes[A]\n    }\n  }\n} : never\n\nexport class BruhCustomElementBase<\n  Attributes extends { [attribute: string]: any}  = {}\n> extends CustomElement {\n  static bruh?: {\n    parseAttributes?: Partial<{\n      [attribute: string]: (raw: string | null) => any\n    }>\n  }\n\n  bruh = {\n    attributes: {} as {\n      [A in (keyof Attributes & string)]: SourceNode<Attributes[A] | undefined>\n    }\n  };\n\n  #setBruhAttribute<A extends keyof Attributes & string>(\n    name: A,\n    value = this.getAttribute(name)\n  ) {\n    const constructor = this.constructor as ThisConstructor<this>\n    const parse = constructor.bruh?.parseAttributes?.[name]\n\n    this.bruh.attributes[name] ??= r()\n    this.bruh.attributes[name].value =\n      parse\n        ? attempt(() => parse(value))\n        : value ?? undefined\n  }\n\n  constructor() {\n    super()\n\n    const { observedAttributes } = this.constructor as ThisConstructor<this>\n\n    if (observedAttributes)\n      for (const name of observedAttributes)\n        this.#setBruhAttribute(name)\n  }\n\n  attributeChangedCallback<A extends keyof Attributes & string>(\n    name: A,\n    oldValue: string | null,\n    newValue: string | null,\n    namespace: string | null\n  ) {\n    this.#setBruhAttribute(name, newValue)\n  }\n\n  #mounted = false;\n  /**\n   * Overrides must call `super.connectedCallback()`\n   */\n  connectedCallback() {\n    if (this.#mounted) return\n    this.mountedCallback?.()\n    this.#mounted = true\n  }\n\n  /**\n   * Called when the element is first connected to a document\n   */\n  mountedCallback?(): void\n}\n"],"names":[],"mappings":";;;AAGO,MAAM,sBAAsB,WAAY,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAK7C,OAAO,kBAAA;AAAA;AAAA;AAAA;AAAA,EAKP,OAAO,gBAAA;AAAA;AAAA;AAAA;AAAA,EAKP,OAAO,cAAA;AA2DT;AAWO,MAAM,8BAEH,aAAc,CAAA;AAAA,EACtB,OAAO,IAAA;AAAA,EAMP,IAAO,GAAA;AAAA,IACL,YAAY;AAAC,GAGf;AAAA,EAEA,kBACE,IACA,EAAA,KAAA,GAAQ,IAAK,CAAA,YAAA,CAAa,IAAI,CAC9B,EAAA;AACA,IAAA,MAAM,cAAc,IAAK,CAAA,WAAA;AACzB,IAAA,MAAM,KAAQ,GAAA,WAAA,CAAY,IAAM,EAAA,eAAA,GAAkB,IAAI,CAAA;AAEtD,IAAA,IAAA,CAAK,IAAK,CAAA,UAAA,CAAW,IAAI,CAAA,KAAM,CAAE,EAAA;AACjC,IAAA,IAAA,CAAK,IAAK,CAAA,UAAA,CAAW,IAAI,CAAA,CAAE,KACzB,GAAA,KAAA,GACI,OAAQ,CAAA,MAAM,KAAM,CAAA,KAAK,CAAC,CAAA,GAC1B,KAAS,IAAA,MAAA;AAAA;AACjB,EAEA,WAAc,GAAA;AACZ,IAAM,KAAA,EAAA;AAEN,IAAM,MAAA,EAAE,kBAAmB,EAAA,GAAI,IAAK,CAAA,WAAA;AAEpC,IAAI,IAAA,kBAAA;AACF,MAAA,KAAA,MAAW,IAAQ,IAAA,kBAAA;AACjB,QAAA,IAAA,CAAK,kBAAkB,IAAI,CAAA;AAAA;AACjC,EAEA,wBACE,CAAA,IAAA,EACA,QACA,EAAA,QAAA,EACA,SACA,EAAA;AACA,IAAK,IAAA,CAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAAA;AACvC,EAEA,QAAW,GAAA,KAAA;AAAA;AAAA;AAAA;AAAA,EAIX,iBAAoB,GAAA;AAClB,IAAA,IAAI,KAAK,QAAU,EAAA;AACnB,IAAA,IAAA,CAAK,eAAkB,IAAA;AACvB,IAAA,IAAA,CAAK,QAAW,GAAA,IAAA;AAAA;AAOpB;;;;"}