Have ideas to improve npm?Join in the discussion! »

    @advanced-rest-client/events-target-mixin
    TypeScript icon, indicating that this package has built-in type declarations

    3.2.3 • Public • Published

    Published on NPM

    Build Status

    A Mixin that support event targets retargeting so the element listens on a set node instead of the default window object.

    Usage

    Installation

    npm install @advanced-rest-client/events-target-mixin --save
    

    In a web component

    import { EventsTargetMixin } '@advanced-rest-client/events-target-mixin';
     
    class SampleElement extends EventsTargetMixin(HTMLElement) {
      _attachListeners(node) {
        node.addEventListener('my-event', this._testEventHandler);
      }
     
      _detachListeners(node) {
        node.removeEventListener('my-event', this._testEventHandler);
      }
     
      _testEventHandler() {
     
      }
    }
    customElements.define('sample-element', SampleElement);
    <sample-element id="example"></sample-element>
    <div id="target"></div>
    <script>
    example.eventsTarget = target;
    </script> 

    The element listens for events that bubbles through #target element.

    In a class that does not extend HTMLElement interface

    When constructing the object call the _eventsTargetChanged() method with an object that is the default events target. If argument is not set then window is used instead.

    import { EventsTargetMixin } '@advanced-rest-client/events-target-mixin';
     
    class EventableObject extends EventsTargetMixin(Object) {
      constructor() {
        super();
        this._eventsTargetChanged();
      }
    }

    Because such class has no lifecycle methods, you should call detachedCallback() manually when the instance should no longer listen on the target object. Skipping this part may cause the GC to not clean the instance from memory.

    Development

    git clone https://github.com/advanced-rest-client/events-target-mixin
    cd events-target-mixin
    npm install

    Running the tests

    npm test

    Install

    npm i @advanced-rest-client/events-target-mixin

    DownloadsWeekly Downloads

    601

    Version

    3.2.3

    License

    Apache-2.0

    Unpacked Size

    47.5 kB

    Total Files

    11

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar
    • avatar