@nent/core/dist/components/n-data-session.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 } from '@stencil/core/internal/client';
import { a as actionBus, e as eventBus } from './index2.js';
import { a as addDataProvider, r as removeDataProvider } from './factory.js';
import { D as DATA_COMMANDS } from './interfaces5.js';
import { D as DATA_EVENTS } from './interfaces3.js';

/* It's a data provider that uses the sessionStorage API to store data */
class SessionService {
  /**
   * A constructor function that takes in a window object, an eventBus object, a name string, and a
   * prefix string. The prefix string is set to an empty string by default. The constructor function
   * then sets the sessionStorage property to the window's sessionStorage.
   * @param {Window} win - Window - the window object
   * @param {IEventEmitter} eventBus - IEventEmitter - This is the event bus that the class will use to
   * emit events.
   * @param {string} name - The name of the session storage key.
   * @param {string} [prefix] - This is the prefix that will be used for all the keys in the session
   * storage.
   */
  constructor(win, eventBus, name, prefix = '') {
    this.eventBus = eventBus;
    this.name = name;
    this.prefix = prefix;
    this.sessionStorage = win.sessionStorage;
  }
  async get(key) {
    var _a;
    return (_a = this.sessionStorage) === null || _a === void 0 ? void 0 : _a.getItem(this.prefix + key);
  }
  async set(key, value) {
    var _a;
    const existing = await this.get(key);
    if (existing == value)
      return;
    (_a = this.sessionStorage) === null || _a === void 0 ? void 0 : _a.setItem(this.prefix + key, value);
    this.eventBus.emit(DATA_EVENTS.DataChanged, {
      provider: this.name,
    });
  }
}

const DataSession = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    /**
     * Provider name to use in nent expressions.
     */
    this.name = 'session';
  }
  registerProvider() {
    addDataProvider(this.name, this.provider);
    this.actionSubscription = actionBus.on(this.name, async (action) => {
      if (action.command == DATA_COMMANDS.SetData) {
        const { data } = action;
        await Promise.all(Object.keys(action.data).map(key => this.provider.set(key, data[key])));
      }
    });
  }
  componentWillLoad() {
    this.provider = new SessionService(window, eventBus, this.name, this.keyPrefix);
    this.registerProvider();
  }
  disconnectedCallback() {
    var _a;
    removeDataProvider(this.name);
    (_a = this.actionSubscription) === null || _a === void 0 ? void 0 : _a.call(this);
  }
  render() {
    return null;
  }
  get el() { return this; }
}, [1, "n-data-session", {
    "keyPrefix": [1, "key-prefix"],
    "name": [1]
  }]);
function defineCustomElement$1() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["n-data-session"];
  components.forEach(tagName => { switch (tagName) {
    case "n-data-session":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, DataSession);
      }
      break;
  } });
}

const NDataSession = DataSession;
const defineCustomElement = defineCustomElement$1;

export { NDataSession, defineCustomElement };