@nexim/element/dist/main.cjs

Utility functions and mixins for building high-performance web components with Lit.

/* @nexim/element v2.0.3 */
"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/main.ts
var main_exports = {};
__export(main_exports, {
  lightDomMixin: () => lightDomMixin,
  loggerMixin: () => loggerMixin
});
module.exports = __toCommonJS(main_exports);
var import_package_tracer = require("@alwatr/package-tracer");

// src/mixin/light-dom.ts
function lightDomMixin(superClass) {
  class MixinClass extends superClass {
    /**
     * Flattens the CSSResultGroup into a single string of CSS text.
     * @param styles - The styles to flatten.
     * @returns A string of concatenated CSS text.
     */
    static flatCssText(styles) {
      if (styles === void 0) return "";
      if ("cssText" in styles) return styles.cssText.trim();
      if (Array.isArray(styles)) {
        return styles.map((style) => "cssText" in style ? style.cssText : MixinClass.flatCssText(style)).join("\n").trim();
      }
      return "";
    }
    /**
     * Injects light DOM styles into the document head if not already present.
     *
     * @param tagName - The tag name of the custom element.
     * @param element - The element class containing the styles.
     */
    static lightDomStyles(tagName, element) {
      const className = `${tagName}-light-dom-style`;
      if (document.querySelector(`style.${className}`) !== null) return;
      const cssText = MixinClass.flatCssText(element.styles);
      if (cssText === "") return;
      const styleEl = document.createElement("style");
      styleEl.classList.add(className);
      styleEl.innerHTML = cssText;
      document.head.append(styleEl);
    }
    /**
     * Overrides the default render root to use the light DOM.
     */
    createRenderRoot() {
      return this;
    }
    /**
     * Called when the element is added to the document's DOM.
     * Adds the light DOM styles to the document head.
     */
    connectedCallback() {
      super.connectedCallback();
      MixinClass.lightDomStyles(this.tagName.toLowerCase(), this.constructor);
    }
  }
  return MixinClass;
}

// src/mixin/logging.ts
var import_logger = require("@alwatr/logger");
var elementIndex = 0;
function loggerMixin(superClass) {
  return class MixinClass extends superClass {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    constructor(...args) {
      super(...args);
      /**
       * Unique index for each element instance.
       */
      this.elementIndex__ = ++elementIndex;
      /**
       * Logger instance with a tag name and unique index.
       */
      this.logger_ = (0, import_logger.createLogger)(`<${this.tagName.toLowerCase()}-${this.elementIndex__.toString()}>`);
      this.logger_.logMethod?.("constructor");
    }
    connectedCallback() {
      this.logger_.logMethod?.("connectedCallback");
      super.connectedCallback();
    }
    disconnectedCallback() {
      this.logger_.logMethod?.("disconnectedCallback");
      super.disconnectedCallback();
    }
    // Override update to measure update time
    update(changedProperties) {
      this.logger_.logMethodArgs?.("update", { changedProperties });
      this.logger_.time?.(this.firstUpdated__ ? "update-time" : "first-update-time");
      super.update(changedProperties);
    }
    // Override firstUpdated to end the first update time measurement
    firstUpdated(changedProperties) {
      this.logger_.logMethodArgs?.("firstUpdated", { changedProperties });
      this.logger_.timeEnd?.("first-update-time");
      super.firstUpdated(changedProperties);
    }
    // Override updated to end the update time measurement
    updated(changedProperties) {
      this.logger_.logMethodArgs?.("updated", { changedProperties });
      if (this.firstUpdated__) {
        this.logger_.timeEnd?.("update-time");
      } else {
        this.firstUpdated__ = true;
      }
      super.updated(changedProperties);
    }
    render() {
      this.logger_.logMethod?.("render");
      return;
    }
    dispatchEvent(event) {
      this.logger_.logMethodArgs?.("dispatchEvent", {
        type: event.type,
        detail: event.detail
      });
      return super.dispatchEvent(event);
    }
    remove() {
      this.logger_.logMethod?.("remove");
      super.remove();
    }
  };
}

// src/main.ts
__dev_mode__: import_package_tracer.packageTracer.add("@nexim/element", "2.0.3");
//# sourceMappingURL=main.cjs.map