Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
@advanced-rest-client/events-target-mixin
Advanced tools
@advanced-rest-client/events-target-mixin - npm Package Compare versions
Comparing version 3.0.0 to 3.1.0
@@ -33,1 +33,49 @@ <a name="2.0.2"></a> | ||
| <a name="3.1.0"></a> | ||
| ## 3.1.0 (2020-04-14) | ||
| ### Build | ||
| * bumping version [cae961e](https://github.com/advanced-rest-client/events-target-mixin/commit/cae961e8eb49234dffa4f3506efba0c82d21473e) by Pawel | ||
| ### Update | ||
| * upgrading project to new structure and to support Object [d92d8a7](https://github.com/advanced-rest-client/events-target-mixin/commit/d92d8a7a3a0951bd573c32af0fdb49e5b71279d9) by Pawel | ||
| ### Bug Fixes | ||
| * fixing npm audit errors [01311fb](https://github.com/advanced-rest-client/events-target-mixin/commit/01311fb984d8dd4d2f4bf72edaf2647959e91de5) by Pawel Psztyc | ||
| ### Other | ||
| * Docs: Adding npm badge to readme file | ||
| [f164b0d](https://github.com/advanced-rest-client/events-target-mixin/commit/f164b0dcbe31062d04908aed8ac9aa3f57ed8b66) by Pawel | ||
| * Update: Finalizing element | ||
| [4fc048a](https://github.com/advanced-rest-client/events-target-mixin/commit/4fc048a53bf8b6d2a92febe7ac0d14cb51b585cd) by Pawel | ||
| * Update: Updating import paths to match web spec | ||
| [68af9c0](https://github.com/advanced-rest-client/events-target-mixin/commit/68af9c0b19b584862e157946a4afc56c9978a7b7) by Pawel Psztyc | ||
| * Update: Upgrading dependencies | ||
| [92777cd](https://github.com/advanced-rest-client/events-target-mixin/commit/92777cd64c3fef1cce897a4550fa05490257e6a3) by Pawel Psztyc | ||
| * New: Adding npm ignore file | ||
| [7f75610](https://github.com/advanced-rest-client/events-target-mixin/commit/7f7561031cae94329281ac687a19cb81397125d0) by Pawel Psztyc | ||
| * Update: Updating paths in tests | ||
| [7681de9](https://github.com/advanced-rest-client/events-target-mixin/commit/7681de9106317bc4db0a0524f558646139fb5531) by Pawel | ||
| * Update: Adding conditional call to connected and disconnected callback | ||
| [b9faf2c](https://github.com/advanced-rest-client/events-target-mixin/commit/b9faf2c5dffe360a678c76904998143b174cbc48) by Pawel | ||
| * Fix: Fixing travis config | ||
| [99805fd](https://github.com/advanced-rest-client/events-target-mixin/commit/99805fdd45a441bb7f1235ec49b193302625db77) by Pawel Psztyc | ||
| * Update: Updated Travis configuration to connect to Sauce Labs. | ||
| [728866f](https://github.com/advanced-rest-client/events-target-mixin/commit/728866f8715f5dd05b88134fa441f3265f100f6c) by Pawel Psztyc | ||
| * Update: Removing old travis keys | ||
| [a662fb4](https://github.com/advanced-rest-client/events-target-mixin/commit/a662fb49de44bfe79b96462295129645dc52f620) by Pawel Psztyc | ||
| * Breaking: Updating component to Polymer 3 | ||
| [acd7a29](https://github.com/advanced-rest-client/events-target-mixin/commit/acd7a29b51c2f19267e329e629377af27f7c624d) by Pawel Psztyc | ||
| * Update: Updated behavior definition. | ||
| [efa49f6](https://github.com/advanced-rest-client/events-target-mixin/commit/efa49f687bbdb860324e0dcc7aecf40c32b4e180) by Pawel Psztyc | ||
| * Update: Added Sauce Labs configuration to Travis configuration | ||
| [bd87333](https://github.com/advanced-rest-client/events-target-mixin/commit/bd873337f93134f45190872be4f23ad98460e282) by Pawel Psztyc | ||
@@ -1,109 +0,2 @@ | ||
| /** | ||
| @license | ||
| Copyright 2017 The Advanced REST client authors <arc@mulesoft.com> | ||
| Licensed under the Apache License, Version 2.0 (the "License"); you may not | ||
| use this file except in compliance with the License. You may obtain a copy of | ||
| the License at | ||
| http://www.apache.org/licenses/LICENSE-2.0 | ||
| Unless required by applicable law or agreed to in writing, software | ||
| distributed under the License is distributed on an "AS IS" BASIS, WITHOUT | ||
| WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the | ||
| License for the specific language governing permissions and limitations under | ||
| the License. | ||
| */ | ||
| /** | ||
| * `ArcBehaviors.EventsTargetBehavior` is a behavior mixin that allows setting | ||
| * up event listeners on a default or set node. | ||
| * | ||
| * By default the element listens on the `window` element for events. By setting | ||
| * `eventsTarget` property on this element it removes all previously set | ||
| * listeners and adds the same listeners to the node. | ||
| * It also restores default state when the `eventsTarget` is removed. | ||
| * | ||
| * Implementations should implement two abstract methods: | ||
| * `_attachListeners(node)` and `_detachListeners(node)`. Both of them will be | ||
| * called with event target argument when it's required to either set or remove | ||
| * listeners. | ||
| * | ||
| * ### Example (Polymer 2.x) | ||
| * | ||
| * ```javascript | ||
| * class EventableElement extends EventsTargetMixin(HTMLElement) { | ||
| * _attachListeners: function(node) { | ||
| * mode.addEventListener('event', this._callback); | ||
| * } | ||
| * | ||
| * _detachListeners: function(node) { | ||
| * mode.removeEventListener('event', this._callback); | ||
| * } | ||
| * } | ||
| * ``` | ||
| * | ||
| * The mixin handles connectedCallback / disconnectedCallback and calls the | ||
| * functions with required parameters. | ||
| * | ||
| * @mixinFunction | ||
| * @param {Class} base | ||
| * @return {Class} | ||
| */ | ||
| export const EventsTargetMixin = (base) => class extends base { | ||
| static get properties() { | ||
| return { | ||
| /** | ||
| * Events handlers target. By default the element listens on | ||
| * `window` object. If set, all events listeners will be attached to this | ||
| * object instead of `window`. | ||
| */ | ||
| eventsTarget: { type: Object }, | ||
| // An event target used to attach listeners. | ||
| _oldEventsTarget: Object | ||
| }; | ||
| } | ||
| get eventsTarget() { | ||
| return this._eventsTarget; | ||
| } | ||
| set eventsTarget(value) { | ||
| const old = this._eventsTarget; | ||
| if (old === value) { | ||
| return; | ||
| } | ||
| this._eventsTarget = value; | ||
| this._eventsTargetChanged(value); | ||
| } | ||
| connectedCallback() { | ||
| if (super.connectedCallback) { | ||
| super.connectedCallback(); | ||
| } | ||
| this._eventsTargetChanged(this.eventsTarget); | ||
| } | ||
| disconnectedCallback() { | ||
| if (super.disconnectedCallback) { | ||
| super.disconnectedCallback(); | ||
| } | ||
| if (this._oldEventsTarget) { | ||
| this._detachListeners(this._oldEventsTarget); | ||
| } | ||
| } | ||
| /** | ||
| * Removes old handlers (if any) and attaches listeners on new event | ||
| * event target. | ||
| * | ||
| * @param {?Node} eventsTarget Event target to set handlers on. If not set it | ||
| * will set handlers on the `window` object. | ||
| */ | ||
| _eventsTargetChanged(eventsTarget) { | ||
| if (this._oldEventsTarget) { | ||
| this._detachListeners(this._oldEventsTarget); | ||
| } | ||
| this._oldEventsTarget = eventsTarget || window; | ||
| this._attachListeners(this._oldEventsTarget); | ||
| } | ||
| // To be implement by the element to set event listeners on the target | ||
| _attachListeners() {} | ||
| // To be implement by the element to remove event listeners from the target | ||
| _detachListeners() {} | ||
| }; | ||
| // This is left for compatybility. | ||
| export { EventsTargetMixin } from './src/EventsTargetMixin.js'; |
@@ -5,3 +5,3 @@ { | ||
| "web-components", | ||
| "polymer" | ||
| "events" | ||
| ], | ||
@@ -13,12 +13,20 @@ "repository": { | ||
| "name": "@advanced-rest-client/events-target-mixin", | ||
| "version": "3.0.0", | ||
| "version": "3.1.0", | ||
| "license": "Apache-2.0", | ||
| "devDependencies": { | ||
| "@advanced-rest-client/testing-karma-sl": "^1.0.2", | ||
| "@open-wc/testing": "^0.11.1", | ||
| "@open-wc/testing-karma": "^2.0.6", | ||
| "@advanced-rest-client/eslint-config": "^1.1.5", | ||
| "@advanced-rest-client/prettier-config": "^0.1.0", | ||
| "@advanced-rest-client/testing-karma-sl": "^1.2.0", | ||
| "@commitlint/cli": "^8.3.5", | ||
| "@commitlint/config-conventional": "^8.3.4", | ||
| "@open-wc/testing": "^2.5.11", | ||
| "@open-wc/testing-karma": "^3.3.12", | ||
| "@polymer/gen-typescript-declarations": "^1.6.1", | ||
| "lit-element": "^2.2.0" | ||
| "husky": "^4.2.3", | ||
| "lint-staged": "^10.1.0", | ||
| "lit-element": "^2.3.1", | ||
| "sinon": "^9.0.1" | ||
| }, | ||
| "main": "events-target-mixin.js", | ||
| "main": "index.js", | ||
| "module": "index.js", | ||
| "author": "The Advanced REST client authors <arc@mulesoft.com>", | ||
@@ -28,5 +36,3 @@ "scripts": { | ||
| "test:watch": "karma start --auto-watch=true --single-run=false", | ||
| "test:legacy": "karma start --legacy --coverage", | ||
| "test:legacy:watch": "karma start --legacy --auto-watch=true --single-run=false", | ||
| "test:sl": "karma start karma.sl.config.js --legacy --coverage", | ||
| "test:sl": "karma start karma.sl.config.js --coverage", | ||
| "update-types": "gen-typescript-declarations --deleteExisting --outDir ." | ||
@@ -33,0 +39,0 @@ }, |
@@ -5,8 +5,4 @@ [](https://www.npmjs.com/package/@advanced-rest-client/events-target-mixin) | ||
| A Mixin that support event targets retargeting so the element listens on a set node instead of default one (window). | ||
| A Mixin that support event targets retargeting so the element listens on a set node instead of the default `window` object. | ||
| ### API components | ||
| This components is a part of [API components ecosystem](https://elements.advancedrestclient.com/) | ||
| ## Usage | ||
@@ -21,5 +17,4 @@ | ||
| ```js | ||
| import { LitElement, html } from 'lit-element'; | ||
| import { EventsTargetMixin } '@advanced-rest-client/events-target-mixin/events-target-mixin.js'; | ||
| ```javascript | ||
| import { EventsTargetMixin } '@advanced-rest-client/events-target-mixin'; | ||
@@ -45,3 +40,5 @@ class SampleElement extends EventsTargetMixin(HTMLElement) { | ||
| <div id="target"></div> | ||
| <script> | ||
| example.eventsTarget = target; | ||
| </script> | ||
| ``` | ||
@@ -51,2 +48,23 @@ | ||
| ### 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. | ||
| ```javascript | ||
| 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 | ||
@@ -53,0 +71,0 @@ |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by11.31%
37504
- Number of package files
- increased by33.33%
8
- Lines of code
- increased by5.17%
122
- Number of lines in readme file
- increased by30%
78
Worsened metrics
- Dev dependency count
- increased by140%
12
- Number of medium supply chain risk alerts
- increased byInfinity%
1
No dependency changes