@rhtml/custom-attributes 0.0.112 → 0.0.113

package/dist/index.js

@@ -1,313 +1,19 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CustomAttributeRegistry = exports.MediaQueryAttribute = exports.createFiltersFromSelector = exports.Breakpoints = exports.MediaMatchers = exports.Attribute = exports.Directive = exports.CustomAttribute = exports.Modifier = exports.Input = void 0;
-const noop = function () {
-    /*  */
-};
-const observe = (target, memberName) => {
-    const prototype = target.constructor.prototype;
-    const OnInit = prototype.OnInit || noop;
-    const OnDestroy = prototype.OnDestroy || noop;
-    const OnUpdateAttribute = prototype.OnUpdateAttribute || noop;
-    let observer;
-    prototype.OnInit = function () {
-        var _a;
-        const element = (_a = this.element) !== null && _a !== void 0 ? _a : this;
-        if (observer) {
-            observer.disconnect();
-        }
-        observer = new MutationObserver(() => {
-            OnUpdateAttribute.call(this, memberName, element.getAttribute(memberName));
-            target[memberName] = element.getAttribute(memberName);
-        });
-        observer.observe(element, {
-            attributeFilter: [memberName],
-            attributes: true
-        });
-        return OnInit.call(this);
-    };
-    prototype.OnDestroy = function () {
-        observer.disconnect();
-        return OnDestroy.call(this);
-    };
-};
-/**
- * Decorator @Input
- * Used to get attribute from element
- */
-exports.Input = (options) => (target, memberName) => {
-    const OnInit = target.OnInit || noop;
-    Object.defineProperty(target, 'OnInit', {
-        value() {
-            var _a;
-            let originalValue = this[memberName];
-            const element = (_a = this.element) !== null && _a !== void 0 ? _a : this;
-            Object.defineProperty(this, memberName, {
-                get: function () {
-                    originalValue = element.getAttribute(memberName.toLowerCase());
-                    return originalValue;
-                },
-                set(value) {
-                    element.setAttribute(memberName.toLowerCase(), value);
-                    originalValue = value;
-                },
-                configurable: true
-            });
-            return OnInit.call(this);
-        },
-        configurable: true
-    });
-    if (options === null || options === void 0 ? void 0 : options.observe) {
-        observe(target, memberName);
-    }
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
 };
-/**
- * Decorator @Modifier
- * Accepts parameter options with selector and registry
- */
-exports.Modifier = (options) => {
-    return (target) => {
-        target['options'] = options;
-    };
-};
-/**
- * Decorator @CustomAttribute
- * Accepts parameter options with selector and registry
- */
-exports.CustomAttribute = exports.Modifier;
-/**
- * Decorator @Directive
- * Accepts parameter options with selector and registry
- */
-exports.Directive = exports.Modifier;
-/*  */
-class Attribute {
-    setStyles(keys) {
-        return (div) => {
-            for (const [key, value] of Object.entries(keys)) {
-                div['style'][key] = value;
-            }
-        };
-    }
-    OnInit() {
-        /* */
-    }
-    OnDestroy() {
-        /* */
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    OnUpdate(_oldValue, _newValue) {
-        /* */
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    OnUpdateAttribute(_name, _value) {
-        /* */
-    }
-}
-exports.Attribute = Attribute;
-/**
- * Media query Attribute
- * for performance reasons it is key value pair
- */
-exports.MediaMatchers = new Map([
-    ['screen and (max-width: 599px)', 'xs'],
-    ['screen and (min-width: 600px) and (max-width: 959px)', 'sm'],
-    ['screen and (min-width: 960px) and (max-width: 1279px)', 'md'],
-    ['screen and (min-width: 1280px) and (max-width: 1919px)', 'lg'],
-    ['screen and (min-width: 1920px) and (max-width: 5000px)', 'xl'],
-    ['screen and (max-width: 959px)', 'lt-md'],
-    ['screen and (max-width: 1279px)', 'lt-lg'],
-    ['screen and (max-width: 1919px)', 'lt-xl'],
-    ['screen and (min-width: 600px)', 'gt-xs'],
-    ['screen and (min-width: 960px)', 'gt-sm'],
-    ['screen and (min-width: 1280px)', 'gt-md'],
-    ['screen and (min-width: 1920px)', 'gt-lg']
-]);
-exports.Breakpoints = [...exports.MediaMatchers.values()];
-exports.createFiltersFromSelector = (selector) => [
-    ...exports.Breakpoints.map(breakpoint => `${selector}.${breakpoint}`),
-    selector
-];
-class MediaQueryAttribute extends Attribute {
-    constructor() {
-        super(...arguments);
-        this.matchers = new Map();
-        this.cachedAttributes = new Map();
-        this.listener = (event) => {
-            const key = `${this.selector.toLowerCase()}.${exports.MediaMatchers.get(event.media)}`;
-            const attribute = this.cachedAttributes.get(key);
-            if (event.matches && attribute) {
-                return this.OnEnterMediaQuery([event, attribute]);
-            }
-            return this.OnExitMediaQuery([event, key]);
-        };
-    }
-    OnInit() {
-        if (this.OnEnterMediaQuery || this.OnExitMediaQuery) {
-            this.originalValue = this.value;
-            for (const query of exports.MediaMatchers.keys()) {
-                const matcher = window.matchMedia(query);
-                const attr = Object.values(this.element.attributes).find(v => v.name ===
-                    `${this.selector.toLowerCase()}.${exports.MediaMatchers.get(query)}`);
-                if (attr) {
-                    this.cachedAttributes.set(attr.name, attr);
-                    matcher.addEventListener('change', this.listener);
-                }
-                if (attr && matcher.matches) {
-                    this.listener(matcher);
-                }
-                this.matchers.set(matcher, matcher);
-            }
-        }
-    }
-    OnDestroy() {
-        for (const matcher of this.matchers.values()) {
-            matcher.removeEventListener('change', this.listener);
-        }
-        this.cachedAttributes.clear();
-        this.matchers.clear();
-    }
-}
-exports.MediaQueryAttribute = MediaQueryAttribute;
-/* Media query Attribute  END */
-class CustomAttributeRegistry {
-    constructor(parent) {
-        this.parent = parent;
-        this._attrMap = new Map();
-        this._elementMap = new Map();
-        if (!parent) {
-            throw new Error('Must be given a parent element');
-        }
-        this.observe();
-    }
-    define(attrName, Constructor) {
-        this._attrMap.set(attrName.toLowerCase(), Constructor);
-        this.upgradeAttribute(attrName);
-    }
-    get(element, attrName) {
-        const map = this._elementMap.get(element);
-        if (!map)
-            return;
-        return map.get(attrName.toLowerCase());
-    }
-    getConstructor(attrName) {
-        return this._attrMap.get(attrName.toLowerCase());
-    }
-    observe() {
-        var _a, _b;
-        this.observer = new MutationObserver(mutations => {
-            for (const mutation of mutations) {
-                if (mutation.type === 'attributes') {
-                    const attr = this.getConstructor(mutation.attributeName);
-                    if (attr) {
-                        this.found(mutation.attributeName, mutation.target, mutation.oldValue);
-                    }
-                }
-                else {
-                    for (const node of mutation.removedNodes) {
-                        this.downgrade(node);
-                    }
-                    for (const node of mutation.addedNodes) {
-                        this.upgradeElement(node);
-                    }
-                }
-            }
-        });
-        this.observer.observe((_b = (_a = this.parent) === null || _a === void 0 ? void 0 : _a['shadowRoot']) !== null && _b !== void 0 ? _b : this.parent, {
-            childList: true,
-            subtree: true,
-            attributes: true,
-            attributeOldValue: true
-        });
-    }
-    unsubscribe() {
-        var _a;
-        (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
-        const values = [...this._elementMap.values()];
-        for (const elModifiers of values) {
-            const modifiers = [...elModifiers.values()];
-            for (const modifier of modifiers) {
-                modifier.OnDestroy();
-            }
-            elModifiers.clear();
-        }
-        this._elementMap.clear();
-    }
-    upgradeAttribute(attrName, doc) {
-        const parent = doc || this.parent;
-        const matches = parent.querySelectorAll('[' + attrName + ']');
-        for (const match of [...matches]) {
-            this.found(attrName, match);
-        }
-    }
-    upgradeElement(element) {
-        if (element.nodeType !== 1) {
-            return;
-        }
-        for (const attr of element.attributes) {
-            if (this.getConstructor(attr.name)) {
-                this.found(attr.name, element);
-            }
-        }
-        for (const [attr] of this._attrMap) {
-            this.upgradeAttribute(attr, element);
-        }
-    }
-    downgrade(element) {
-        const map = this._elementMap.get(element);
-        if (!map) {
-            return;
-        }
-        for (const [, instance] of map) {
-            if (instance.OnDestroy) {
-                instance.OnDestroy();
-            }
-        }
-        this._elementMap.delete(element);
-    }
-    found(attributeName, el, oldVal) {
-        var _a, _b;
-        let map = this._elementMap.get(el);
-        if (!map) {
-            map = new Map();
-            this._elementMap.set(el, map);
-        }
-        const modifier = map.get(attributeName);
-        const attribute = el.getAttribute(attributeName);
-        if (!modifier) {
-            const Modifier = this.getConstructor(attributeName);
-            const modifier = new Modifier();
-            if ((_b = (_a = Modifier.options) === null || _a === void 0 ? void 0 : _a.observedAttributes) === null || _b === void 0 ? void 0 : _b.length) {
-                for (const observedAttribute of Modifier.options.observedAttributes) {
-                    observe(modifier, observedAttribute);
-                }
-            }
-            map.set(attributeName, modifier);
-            modifier.element = el;
-            modifier.selector = attributeName;
-            modifier.value = attribute || modifier.value;
-            modifier.parent = this.parent;
-            if (modifier.OnInit) {
-                modifier.OnInit();
-            }
-            return;
-        }
-        if (attribute == null && !!modifier.value) {
-            modifier.value = attribute;
-            if (modifier.OnDestroy) {
-                modifier.OnDestroy();
-            }
-            map.delete(attributeName);
-            return;
-        }
-        if (attribute !== modifier.value) {
-            modifier.value = attribute;
-            if (modifier.OnUpdate) {
-                modifier.OnUpdate(oldVal, attribute);
-            }
-            return;
-        }
-    }
-}
-exports.CustomAttributeRegistry = CustomAttributeRegistry;
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./attribute"), exports);
+__exportStar(require("./custom-registry"), exports);
+__exportStar(require("./decorators"), exports);
+__exportStar(require("./helpers"), exports);
+__exportStar(require("./media-attribute"), exports);
+__exportStar(require("./types"), exports);
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,8CAA4B;AAC5B,oDAAkC;AAClC,+CAA6B;AAC7B,4CAA0B;AAC1B,oDAAkC;AAClC,0CAAwB"}

package/dist/media-attribute.d.ts

@@ -0,0 +1,27 @@
+import { Attribute } from './attribute';
+/**
+ * Media query Attribute
+ * for performance reasons it is key value pair
+ */
+export declare const MediaMatchers: Map<string, string>;
+declare type MediaEvent = MediaQueryList | MediaQueryListEvent;
+export declare type EnterMediaQueryAttributes = [MediaEvent, Attr];
+export declare type ExitMediaQueryAttributes = [MediaEvent, string];
+export interface OnUpdateMediaQuery {
+    OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
+    OnExitMediaQuery(tuple: [MediaEvent, string]): void;
+}
+export declare const Breakpoints: string[];
+export declare const createFiltersFromSelector: (selector: string) => string[];
+export declare abstract class MediaQueryAttribute<T> extends Attribute<T> implements OnUpdateMediaQuery {
+    prevValue: string;
+    originalValue: string;
+    private matchers;
+    private cachedAttributes;
+    listener: (event: MediaQueryList | MediaQueryListEvent) => void;
+    OnInit(): void;
+    OnDestroy(): void;
+    abstract OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
+    abstract OnExitMediaQuery(tuple: [MediaEvent, string]): void;
+}
+export {};

package/dist/media-attribute.js

@@ -0,0 +1,69 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MediaQueryAttribute = exports.createFiltersFromSelector = exports.Breakpoints = exports.MediaMatchers = void 0;
+const attribute_1 = require("./attribute");
+/**
+ * Media query Attribute
+ * for performance reasons it is key value pair
+ */
+exports.MediaMatchers = new Map([
+    ['screen and (max-width: 599px)', 'xs'],
+    ['screen and (min-width: 600px) and (max-width: 959px)', 'sm'],
+    ['screen and (min-width: 960px) and (max-width: 1279px)', 'md'],
+    ['screen and (min-width: 1280px) and (max-width: 1919px)', 'lg'],
+    ['screen and (min-width: 1920px) and (max-width: 5000px)', 'xl'],
+    ['screen and (max-width: 959px)', 'lt-md'],
+    ['screen and (max-width: 1279px)', 'lt-lg'],
+    ['screen and (max-width: 1919px)', 'lt-xl'],
+    ['screen and (min-width: 600px)', 'gt-xs'],
+    ['screen and (min-width: 960px)', 'gt-sm'],
+    ['screen and (min-width: 1280px)', 'gt-md'],
+    ['screen and (min-width: 1920px)', 'gt-lg']
+]);
+exports.Breakpoints = [...exports.MediaMatchers.values()];
+exports.createFiltersFromSelector = (selector) => [
+    ...exports.Breakpoints.map(breakpoint => `${selector}.${breakpoint}`),
+    selector
+];
+class MediaQueryAttribute extends attribute_1.Attribute {
+    constructor() {
+        super(...arguments);
+        this.matchers = new Map();
+        this.cachedAttributes = new Map();
+        this.listener = (event) => {
+            const key = `${this.selector.toLowerCase()}.${exports.MediaMatchers.get(event.media)}`;
+            const attribute = this.cachedAttributes.get(key);
+            if (event.matches && attribute) {
+                return this.OnEnterMediaQuery([event, attribute]);
+            }
+            return this.OnExitMediaQuery([event, key]);
+        };
+    }
+    OnInit() {
+        if (this.OnEnterMediaQuery || this.OnExitMediaQuery) {
+            this.originalValue = this.value;
+            for (const query of exports.MediaMatchers.keys()) {
+                const matcher = window.matchMedia(query);
+                const attr = Object.values(this.element.attributes).find(v => v.name ===
+                    `${this.selector.toLowerCase()}.${exports.MediaMatchers.get(query)}`);
+                if (attr) {
+                    this.cachedAttributes.set(attr.name, attr);
+                    matcher.addEventListener('change', this.listener);
+                }
+                if (attr && matcher.matches) {
+                    this.listener(matcher);
+                }
+                this.matchers.set(matcher, matcher);
+            }
+        }
+    }
+    OnDestroy() {
+        for (const matcher of this.matchers.values()) {
+            matcher.removeEventListener('change', this.listener);
+        }
+        this.cachedAttributes.clear();
+        this.matchers.clear();
+    }
+}
+exports.MediaQueryAttribute = MediaQueryAttribute;
+//# sourceMappingURL=media-attribute.js.map

package/dist/media-attribute.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-attribute.js","sourceRoot":"","sources":["../src/media-attribute.ts"],"names":[],"mappings":"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"}

package/dist/types.d.ts

@@ -0,0 +1,30 @@
+import { CustomAttributeRegistry } from './custom-registry';
+export declare type C<T> = new (...args: never[]) => T;
+export interface Constructor<T> extends C<T> {
+    options: ModifierOptions;
+}
+export interface ModifierOptions {
+    /**
+     * Main selector of the attribute
+     */
+    selector: string;
+    /**
+     * Define custom attribute registry
+     */
+    registry?(this: HTMLElement): CustomAttributeRegistry;
+    /**
+     * Specify attributes to be listened
+     */
+    observedAttributes?: string[];
+    /**
+     * Define MutationObserver to listen for parent element changes
+     * Defining property will attach observer to this.element
+     *  */
+    observe?: MutationObserverInit;
+}
+export interface InputOptions {
+    /**
+     * If enabled will trigger OnUpdate method on the Attribute
+     * */
+    observe: true;
+}

package/dist/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rhtml/custom-attributes",
-  "version": "0.0.112",
+  "version": "0.0.113",
   "description": "Custom Attribute Registry",
   "scripts": {
     "start": "npx parcel ./examples/index.html --out-dir build/examples",

package/src/attribute.ts

@@ -0,0 +1,35 @@
+/* eslint-disable @typescript-eslint/no-unused-vars */
+import { ModifierOptions } from './types';
+
+/*  */
+export abstract class Attribute<T = {}> {
+  public static options: ModifierOptions;
+  public element?: HTMLElement;
+  public value?: string;
+  public selector?: string;
+  public parent?: HTMLElement;
+  public observer?: MutationObserver;
+  setStyles(keys: T) {
+    return (div: HTMLElement | Element | HTMLDivElement) => {
+      for (const [key, value] of Object.entries(keys)) {
+        div['style'][key] = value;
+      }
+    };
+  }
+  OnInit(): void {
+    /* */
+  }
+  OnDestroy(): void {
+    /* */
+  }
+  OnUpdate(_oldValue: string, _newValue: string) {
+    /* */
+  }
+  OnUpdateAttribute(_name: string, _value: string) {
+    /* */
+  }
+
+  OnChange(_records: MutationRecord[]): void {
+    /* */
+  }
+}