@nent/core/dist/components/n-view-link-next.js

Functional elements to add routing, data-binding, dynamic HTML, declarative actions, audio, video, and so much more. Supercharge static HTML files into web apps without script or builds.

/*!
 * NENT 2022
 */
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
import { e as eventBus } from './index2.js';
import { R as ROUTE_EVENTS } from './interfaces4.js';
import { s as state, o as onChange } from './state4.js';
import { d as defineCustomElement$2 } from './view-link.js';

const ViewLinkNext = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.route = null;
  }
  get parentView() {
    return this.el.closest('n-view');
  }
  get parentViewPrompt() {
    return this.el.closest('n-view-prompt');
  }
  async componentWillLoad() {
    if (state.router) {
      await this.setupRoute();
    }
    else {
      const dispose = onChange('router', async () => {
        await this.setupRoute();
        dispose();
      });
    }
  }
  async setupRoute() {
    if (this.parentViewPrompt) {
      this.setPage(this.parentViewPrompt.route);
    }
    else if (this.parentView) {
      this.setPage(this.parentView.route);
    }
    else {
      await this.subscribe();
    }
  }
  async setPage(route) {
    var _a;
    this.route = await route.getNextRoute();
    this.title = await ((_a = this.route) === null || _a === void 0 ? void 0 : _a.resolvePageTitle());
  }
  async subscribe() {
    var _a, _b;
    this.matchSubscription = eventBus.on(ROUTE_EVENTS.RouteMatchedExact, async ({ route }) => {
      await this.setPage(route);
    });
    if ((_a = state.router) === null || _a === void 0 ? void 0 : _a.exactRoute)
      await this.setPage((_b = state.router) === null || _b === void 0 ? void 0 : _b.exactRoute);
  }
  render() {
    var _a;
    const text = this.text || this.title;
    return (h("n-view-link", { "link-class": this.linkClass, path: ((_a = this.route) === null || _a === void 0 ? void 0 : _a.path) || '', title: this.title, "active-class": "none", validate: true }, h("slot", { name: "start" }), text ? text : h("slot", null), h("slot", { name: "end" })));
  }
  disconnectedCallback() {
    var _a;
    (_a = this.matchSubscription) === null || _a === void 0 ? void 0 : _a.call(this);
  }
  get el() { return this; }
  static get style() { return "n-view-link-next { display: inline-block; }"; }
}, [4, "n-view-link-next", {
    "text": [1],
    "linkClass": [1, "link-class"],
    "route": [32],
    "title": [32]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["n-view-link-next", "n-view-link"];
  components.forEach(tagName => { switch (tagName) {
    case "n-view-link-next":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, ViewLinkNext);
      }
      break;
    case "n-view-link":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
  } });
}

const NViewLinkNext = ViewLinkNext;
const defineCustomElement = defineCustomElement$1;

export { NViewLinkNext, defineCustomElement };