@nent/core/dist/cjs/n-view-prompt.cjs.entry.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
 */
'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-1829aebc.js');
const logging = require('./logging-37c154cf.js');
const state$1 = require('./state-f97ff0e6.js');
const remote = require('./remote-d40ac61b.js');
const interfaces = require('./interfaces-95d0415a.js');
const visits = require('./visits-81507e28.js');
const state = require('./state-246c735d.js');
const strings = require('./strings-fe5a8e44.js');
const stateSubscriber = require('./state-subscriber-0ded559f.js');
require('./index-96f3ab3f.js');
require('./tokens-4f8bcd42.js');
require('./factory-0d7ddff9.js');
require('./index-637e8c28.js');
require('./values-b2399e33.js');
require('./promises-463f4e01.js');
require('./mutex-7ae5ebad.js');
require('./memory-33fe6263.js');

const viewPromptCss = ":host{display:block}:host([hidden]){display:none}";

const ViewPrompt = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.match = null;
    this.exactMatch = false;
    this.contentElement = null;
    /**
     * The title for this view. This is prefixed
     * before the app title configured in n-views
     *
     */
    this.pageTitle = '';
    /**
     * The page description for this view.
     *
     */
    this.pageDescription = '';
    /**
     * The keywords to add to the keywords meta-tag for this view.
     *
     */
    this.pageKeywords = '';
    /**
     * The robots instruction for search indexing
     *
     */
    this.pageRobots = 'none';
    /**
     * The url for this route should only be matched
     * when it is exact.
     */
    this.exact = true;
    /**
     * The visit strategy for this do.
     * once: persist the visit and never force it again
     * always: do not persist, but don't don't show again in-session
     * optional: do not force this view-do ever. It will be available by URL
     */
    this.visit = 'once';
    /**
     * Cross Origin Mode if the content is pulled from
     * a remote location
     */
    this.mode = 'cors';
    /**
     * Before rendering remote HTML, replace any data-tokens with their
     * resolved values. This also commands this component to
     * re-render it's HTML for data-changes. This can affect
     * performance.
     *
     * IMPORTANT: ONLY WORKS ON REMOTE HTML
     */
    this.resolveTokens = false;
    /**
     * Force render with data & route changes.
     */
    this.noCache = false;
    /**
     * To debug timed elements, set this value to true.
     */
    this.debug = false;
  }
  get parentView() {
    return this.el.closest('n-view');
  }
  componentWillLoad() {
    logging.debugIf(this.debug, `n-view-prompt: ${this.path} loading`);
    this.contentKey = `rem-content-${strings.slugify(this.contentSrc || 'none')}`;
    if (!state.state.router) {
      logging.warn(`n-view-prompt: ${this.path} cannot load outside of an n-views element`);
      return;
    }
    if (!this.parentView) {
      logging.warn(`n-view-prompt: ${this.path} cannot load outside of an n-views element`);
      return;
    }
    this.route = state.state.router.createRoute(this.el, this.parentView, (match) => {
      this.match = match ? Object.assign({}, match) : null;
      this.exactMatch = (match === null || match === void 0 ? void 0 : match.isExact) || false;
    });
    if (state$1.state.dataEnabled && this.resolveTokens) {
      this.dataSubscription = new stateSubscriber.CommonStateSubscriber(this, 'dataEnabled', interfaces.DATA_EVENTS.DataChanged);
    }
  }
  async componentWillRender() {
    var _a;
    logging.debugIf(this.debug, `n-view-prompt: ${this.path} will render`);
    if ((_a = this.match) === null || _a === void 0 ? void 0 : _a.isExact) {
      logging.debugIf(this.debug, `n-view-prompt: ${this.path} matched exact`);
      if (this.contentSrc && this.contentElement == null)
        this.contentElement = await remote.resolveRemoteContentElement(window, this.contentSrc, this.mode, this.contentKey, this.resolveTokens, 'content');
      await visits.recordVisit(this.visit, this.path);
    }
  }
  render() {
    var _a;
    logging.debugIf(this.debug, `n-view-prompt: ${this.path} render`);
    remote.replaceHtmlInElement(this.el, `#${this.contentKey}`, this.contentElement);
    return (index.h(index.Host, { hidden: !((_a = this.match) === null || _a === void 0 ? void 0 : _a.isExact) }, index.h("slot", null), index.h("slot", { name: "content" })));
  }
  async componentDidRender() {
    var _a, _b, _c, _d;
    if (!((_b = (_a = this.route) === null || _a === void 0 ? void 0 : _a.match) === null || _b === void 0 ? void 0 : _b.isExact)) {
      (_c = this.contentElement) === null || _c === void 0 ? void 0 : _c.remove();
      if (this.noCache)
        this.contentElement = null;
    }
    await ((_d = this.route) === null || _d === void 0 ? void 0 : _d.loadCompleted());
  }
  disconnectedCallback() {
    var _a, _b;
    (_a = this.dataSubscription) === null || _a === void 0 ? void 0 : _a.destroy();
    (_b = this.route) === null || _b === void 0 ? void 0 : _b.destroy();
  }
  get el() { return index.getElement(this); }
};
ViewPrompt.style = viewPromptCss;

exports.n_view_prompt = ViewPrompt;