@lisergia/core 23.0.0 → 23.0.1

package/dist/index.mjs

@@ -1,563 +0,0 @@
-// src/App.ts
-import { autorun, computed, makeObservable, observable, observe } from "mobx";
-
-// src/EventEmitter.ts
-import AutoBind from "auto-bind";
-import { createNanoEvents } from "nanoevents";
-var EventEmitter = class {
-  emitter;
-  entries = /* @__PURE__ */ new Map();
-  constructor() {
-    AutoBind(this);
-    this.emitter = createNanoEvents();
-  }
-  on(event, callback) {
-    if (!callback) {
-      return console.trace("No callback provided");
-    }
-    const emitter = this.emitter.on(event, callback);
-    this.entries.set(callback, emitter);
-    return emitter;
-  }
-  off(event, callback) {
-    const unsubscribe = this.entries.get(callback);
-    if (unsubscribe) {
-      unsubscribe();
-    }
-  }
-  fire(event, ...args) {
-    this.emitter.emit(event, ...args);
-  }
-  destroy() {
-    this.entries.forEach((unsubscribe) => unsubscribe());
-  }
-};
-
-// src/Component.ts
-var Component = class extends EventEmitter {
-  application;
-  autoListeners;
-  autoMount;
-  classes;
-  selector;
-  selectors;
-  id;
-  element;
-  elements = {};
-  constructor({
-    application,
-    autoListeners = true,
-    autoMount = true,
-    classes,
-    element,
-    elements,
-    id
-  }) {
-    super();
-    this.application = application;
-    this.autoListeners = autoListeners;
-    this.autoMount = autoMount;
-    this.classes = classes;
-    this.selector = element;
-    this.selectors = elements;
-    this.id = id;
-    if (this.autoMount) {
-      this.create();
-    }
-    if (this.autoListeners) {
-      this.addEventListeners();
-    }
-  }
-  create() {
-    if (this.selector) {
-      this.initElement(this.selector);
-    }
-    if (this.selectors) {
-      this.initElements(this.selectors);
-    }
-  }
-  initElement(selector) {
-    if (selector instanceof HTMLElement) {
-      this.element = selector;
-    } else {
-      this.element = document.querySelector(selector);
-    }
-  }
-  initElements(selectors) {
-    for (const key in selectors) {
-      const selector = selectors[key];
-      if (selector === window) {
-        this.elements[key] = window;
-      } else if (selector instanceof HTMLElement) {
-        this.elements[key] = selector;
-      } else if (selector instanceof NodeList) {
-        this.elements[key] = selector;
-      } else if (Array.isArray(selector)) {
-        this.elements[key] = selector;
-      } else {
-        const elements = this.element.querySelectorAll(selector);
-        if (elements.length === 0) {
-          const elements2 = document.querySelectorAll(selector);
-          if (elements2.length === 0) {
-            this.elements[key] = null;
-          } else if (elements2.length === 1) {
-            this.elements[key] = elements2[0];
-          } else {
-            this.elements[key] = elements2;
-          }
-        } else if (elements.length === 1) {
-          this.elements[key] = elements[0];
-        } else {
-          this.elements[key] = elements;
-        }
-      }
-    }
-  }
-  addEventListeners() {
-  }
-  removeEventListeners() {
-  }
-  destroy() {
-    super.destroy();
-    this.removeEventListeners();
-  }
-};
-
-// src/Links.ts
-import { reaction } from "mobx";
-
-// src/Link.ts
-var Link = class extends Component {
-  constructor({ element }) {
-    super({ element });
-  }
-  onClick(event) {
-    event.preventDefault();
-    this.fire("click", this.element.href);
-  }
-  addEventListeners() {
-    const isLocal = this.element.href.includes(window.location.origin);
-    const isLocalPrevented = this.element.dataset.linkOverride === "";
-    const isNotEmail = !this.element.href.startsWith("mailto");
-    const isNotPhone = !this.element.href.startsWith("tel");
-    const isDownload = this.element.hasAttribute("download");
-    const isAnchor = this.element.href.includes("#");
-    if (isAnchor) {
-      const hash = this.element.href.split("#")[1];
-      const element = document.querySelector(`#${hash}`);
-      if (element) {
-        return;
-      }
-    }
-    if (isLocalPrevented || isDownload) {
-      return;
-    }
-    if (isLocal) {
-      this.element.onclick = this.onClick;
-    } else if (isNotEmail && isNotPhone) {
-      this.element.rel = "noopener";
-      this.element.setAttribute("target", "_blank");
-    }
-  }
-  removeEventListeners() {
-    this.element.onclick = null;
-  }
-};
-
-// src/Links.ts
-var Links = class extends EventEmitter {
-  constructor(application) {
-    super();
-    this.application = application;
-    reaction(
-      () => application.currentPage,
-      () => this.refresh(),
-      { fireImmediately: true }
-    );
-  }
-  addEventListeners() {
-    var _a;
-    (_a = this.links) == null ? void 0 : _a.forEach((link) => link.destroy());
-    const links = document.querySelectorAll("a");
-    this.links = Array.from(links).map((element) => {
-      const link = new Link({
-        element
-      });
-      link.on("click", this.onLinkClick);
-      return link;
-    });
-  }
-  onLinkClick(href) {
-    this.application.route = href;
-  }
-  refresh() {
-    this.addEventListeners();
-  }
-};
-
-// src/App.ts
-var ApplicationManager = class extends Component {
-  template = document.documentElement.dataset.template ?? "404";
-  constructor() {
-    super({
-      autoListeners: false,
-      element: ".app"
-    });
-    makeObservable(this, {
-      // Application DOM Element.
-      element: observable,
-      // Components.
-      canvas: observable,
-      components: observable,
-      transition: observable,
-      // Page Information.
-      currentPage: observable,
-      nextPage: observable,
-      // Route Information.
-      route: observable,
-      // Template Information.
-      template: observable,
-      // Page Scroll.
-      scroll: computed
-    });
-    observe(this.components, this.onComponentChange);
-    observe(this, "route", this.onRouteChange);
-    autorun(this.onTitleUpdate);
-    autorun(this.onTemplateUpdate);
-    this.addEventListeners();
-  }
-  onTitleUpdate() {
-    var _a;
-    const title = (_a = this.nextPage) == null ? void 0 : _a.title;
-    if (title) {
-      document.title = title;
-    }
-  }
-  onTemplateUpdate() {
-    var _a;
-    const template = (_a = this.nextPage) == null ? void 0 : _a.template;
-    if (template) {
-      document.documentElement.dataset.template = template;
-      this.template = template;
-    }
-  }
-  //
-  // Components.
-  //
-  canvas;
-  components = [];
-  transition;
-  initComponents(components) {
-    const classes = components.map(
-      ({ component: Component2 }) => new Component2({
-        application: this
-      })
-    );
-    this.canvas = classes.find((component) => component.id === "canvas");
-    this.transition = classes.find((component) => component.id === "transition");
-    classes.forEach((component) => {
-      this.addComponent(component);
-    });
-  }
-  addComponent(component) {
-    this.components.push(component);
-  }
-  removeComponent(component) {
-    component.destroy();
-    const index = this.components.indexOf(component);
-    if (index !== -1) {
-      this.components.splice(index, 1);
-    }
-  }
-  onComponentChange(event) {
-    if (event.type === "splice") {
-      const { added, removed } = event;
-    }
-  }
-  //
-  // Datasets.
-  //
-  datasets = [];
-  initDatasets(datasets) {
-    this.datasets = datasets;
-  }
-  //
-  // Routes.
-  //
-  pages = /* @__PURE__ */ new Map();
-  initRoutes(routes) {
-    routes.forEach(({ component, template }) => {
-      this.pages.set(template, component);
-    });
-  }
-  //
-  // Sprites.
-  //
-  async initSprites(url = "/bundle.svg") {
-    const request = await window.fetch(url);
-    const response = await request.text();
-    const sprite = document.createElement("div");
-    sprite.innerHTML = response;
-    sprite.style.left = "-999999px";
-    sprite.style.opacity = "0";
-    sprite.style.position = "absolute";
-    sprite.style.top = "0";
-    document.body.appendChild(sprite);
-  }
-  initPage() {
-    this.createPage();
-    this.createLinks();
-  }
-  //
-  // Links.
-  //
-  createLinks() {
-    this.links = new Links(this);
-  }
-  //
-  // Page.
-  //
-  currentPage = void 0;
-  createPage(template = this.template) {
-    const PageClass = this.pages.get(template);
-    const page = new PageClass({
-      application: this,
-      datasets: this.datasets
-    });
-    this.currentPage = page;
-    this.currentPage.create();
-  }
-  destroyPage() {
-    if (this.currentPage) {
-      this.currentPage.destroy();
-    }
-  }
-  //
-  // Navigate.
-  //
-  route = window.location.pathname;
-  onRouteChange({ oldValue, newValue }) {
-    this.onRouteChangeRequest({
-      href: newValue,
-      pushState: true
-    });
-  }
-  async onRouteChangeRequest({ href, pushState = true }) {
-    const request = await window.fetch(href);
-    const response = await request.text();
-    this.onRequest({
-      href,
-      response,
-      pushState
-    });
-  }
-  //
-  // Request.
-  //
-  nextPage = {};
-  async onRequest({ href, response, pushState }) {
-    var _a, _b;
-    const domParser = new DOMParser();
-    const dom = domParser.parseFromString(response, "text/html");
-    const html = dom.querySelector("html");
-    const app = dom.querySelector(".app");
-    this.nextPage = {
-      element: app,
-      template: html.dataset.template ?? this.template,
-      title: dom.title ?? document.title
-    };
-    if (this.transition) {
-      await ((_b = (_a = this.transition).onTransition) == null ? void 0 : _b.call(_a, this));
-    } else {
-      this.currentPage.element.remove();
-      this.currentPage.destroy();
-      this.element.appendChild(this.nextPage.element.firstElementChild);
-      this.createPage(this.nextPage.template);
-    }
-    if (pushState) {
-      window.history.pushState({}, this.nextPage.title, href);
-    }
-  }
-  //
-  // Pop State.
-  //
-  onPopState() {
-    this.onRouteChangeRequest({
-      href: document.location.pathname,
-      pushState: false
-    });
-  }
-  //
-  // Scroll.
-  //
-  get scroll() {
-    var _a;
-    return ((_a = this.currentPage) == null ? void 0 : _a.scroll) ?? 0;
-  }
-  //
-  // Listeners.
-  //
-  addEventListeners() {
-    window.addEventListener("popstate", this.onPopState);
-  }
-  removeEventListeners() {
-    window.removeEventListener("popstate", this.onPopState);
-  }
-};
-var Application = new ApplicationManager();
-
-// src/Page.ts
-import Lenis from "lenis";
-import { makeObservable as makeObservable2, observable as observable2 } from "mobx";
-import Tempus from "tempus";
-var Page = class extends Component {
-  datasets = [];
-  scroll = 0;
-  scrollEnabled = true;
-  scrollOptions = {};
-  constructor({
-    application,
-    classes,
-    datasets,
-    element,
-    elements,
-    scrollEnabled = true,
-    scrollOptions = {}
-  }) {
-    super({
-      autoMount: false,
-      autoListeners: false,
-      classes,
-      element,
-      elements
-    });
-    this.application = application;
-    this.datasets = datasets;
-    this.scrollEnabled = scrollEnabled;
-    this.scrollOptions = scrollOptions;
-    makeObservable2(this, {
-      element: observable2,
-      elements: observable2,
-      components: observable2,
-      scroll: observable2
-    });
-  }
-  create() {
-    super.create();
-    this.createResizeObserver();
-    this.createComponents();
-    this.createScroll();
-    this.addEventListeners();
-  }
-  createResizeObserver() {
-    this.resizeObserver = new ResizeObserver(() => {
-      this.onResize();
-    });
-    this.resizeObserver.observe(this.elements.wrapper);
-  }
-  destroyResizeObserver() {
-    this.resizeObserver.disconnect();
-  }
-  //
-  // Components.
-  //
-  components = /* @__PURE__ */ new Set();
-  createComponents() {
-    this.datasets.map(({ component: Component2, selector }) => {
-      const elements = this.element.querySelectorAll(selector);
-      const components = Array.from(elements).map((element) => {
-        const component = new Component2({
-          application: this.application,
-          element
-        });
-        return component;
-      });
-      components.forEach((component) => {
-        this.application.addComponent(component);
-        this.components.add(component);
-      });
-    });
-  }
-  destroyComponents() {
-    this.components.forEach((component) => {
-      this.application.removeComponent(component);
-    });
-    this.components.clear();
-  }
-  createScroll() {
-    if (!this.scrollEnabled) {
-      this.element.addEventListener("scroll", this.onScrollFallback);
-      return;
-    }
-    this.lenis = new Lenis({
-      content: this.elements.wrapper,
-      wrapper: this.element,
-      ...this.scrollOptions
-    });
-    this.lenis.on("scroll", (event) => {
-      this.onScroll(event.scroll);
-      this.emitter.emit("scroll", event);
-    });
-  }
-  destroyScroll() {
-    var _a;
-    if (!this.scrollEnabled) {
-      this.element.removeEventListener("scroll", this.onScrollFallback);
-      return;
-    }
-    (_a = this.lenis) == null ? void 0 : _a.destroy();
-  }
-  //
-  // Events.
-  //
-  onResize() {
-    var _a;
-    (_a = this.lenis) == null ? void 0 : _a.resize();
-  }
-  onRAF(time) {
-    var _a;
-    (_a = this.lenis) == null ? void 0 : _a.raf(time);
-  }
-  onScroll(scroll) {
-    this.scroll = scroll;
-  }
-  onScrollFallback() {
-    this.scroll = this.element.scrollTop;
-    this.emitter.emit("scroll", { scroll: this.scroll });
-  }
-  //
-  // Events.
-  //
-  addEventListeners() {
-    super.addEventListeners();
-    this.unsubscribeRaf = Tempus.add(this.onRAF);
-  }
-  removeEventListeners() {
-    var _a;
-    super.removeEventListeners();
-    (_a = this.unsubscribeRaf) == null ? void 0 : _a.call(this);
-    this.unsubscribeRaf = void 0;
-  }
-  //
-  // Destroy.
-  //
-  destroy() {
-    super.destroy();
-    this.destroyResizeObserver();
-    this.destroyComponents();
-    this.destroyScroll();
-  }
-};
-
-// src/index.ts
-import Tempus2 from "tempus";
-export {
-  Application,
-  ApplicationManager,
-  Component,
-  EventEmitter,
-  Link,
-  Links,
-  Page,
-  Tempus2 as Tempus
-};