@mangoweb/scripts-base - npm Package Compare versions

Comparing version 0.0.12 to 0.0.13

lib/Component.d.ts

@@ -0,0 +0,0 @@ import { ComponentEl, DefaultComponentEl, DelegateTarget, EventListeners, EventMap, EventMapByElement } from './componentTypes';

lib/Component.js

@@ -0,0 +0,0 @@ "use strict";

lib/components/Component.d.ts

@@ -0,0 +0,0 @@ export interface NamedComponent {

lib/components/Component.js

@@ -0,0 +0,0 @@ "use strict";

lib/components/Emitter.d.ts

@@ -0,0 +0,0 @@ import { EventListeners } from '../componentTypes';

lib/components/Emitter.js

@@ -0,0 +0,0 @@ "use strict";

lib/components/Example.d.ts

@@ -0,0 +0,0 @@ import { Component } from '../Component';

lib/components/Example.js

@@ -0,0 +0,0 @@ "use strict";

lib/components/index.d.ts

 export * from './Emitter';
 export * from './Example';
-export * from './Shapes';
 //# sourceMappingURL=index.d.ts.map

lib/components/index.js

@@ -8,3 +8,2 @@ "use strict";
 __export(require("./Example"));
-__export(require("./Shapes"));
 //# sourceMappingURL=index.js.map

lib/components/InView.d.ts

@@ -1,3 +0,3 @@
-import { Component } from '../Component';
-interface InViewProps {
+import { Component } from './Component';
+interface InViewData {
     targets?: string;
@@ -9,3 +9,3 @@ threshold?: number;
 }
-export declare class InView extends Component<InViewProps> {
+export declare class InView extends Component<InViewData> {
     static componentName: string;
@@ -17,3 +17,3 @@ private readonly targets;
     private readonly CLASSES;
-    constructor(el: HTMLElement, props: InViewProps);
+    constructor(el: HTMLElement, data: InViewData);
     private observerInit;
@@ -20,0 +20,0 @@ private onScrollInit;

lib/components/InView.js

@@ -16,15 +16,15 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var Component_1 = require("../Component");
+var Component_1 = require("./Component");
 var InView = /** @class */ (function (_super) {
     __extends(InView, _super);
-    function InView(el, props) {
-        var _this = _super.call(this, el, props) || this;
-        _this.CLASSES = {
+    function InView(el, data) {
+        var _this = _super.call(this, el, data) || this;
+        _this.CLASSES = Object.freeze({
             topThreshold: 'view-topThreshold',
             bottomThreshold: 'view-bottomThreshold',
-        };
-        _this.targets = props.targets ? _this.el.querySelectorAll(props.targets) : [_this.el];
-        _this.threshold = _this.getPropOrElse('threshold', 0);
-        _this.detectOnce = _this.getPropOrElse('detectOnce', true);
-        _this.strictTop = _this.getPropOrElse('strictTop', false);
+        });
+        _this.targets = data.targets ? _this.el.querySelectorAll(data.targets) : [_this.el];
+        _this.threshold = _this.getProp('threshold', 0);
+        _this.detectOnce = _this.getProp('detectOnce', true);
+        _this.strictTop = _this.getProp('strictTop', false);
         if ('IntersectionObserver' in window) {
@@ -66,4 +66,6 @@ _this.observerInit();
                     var targetArea = targetRect.width * targetRect.height;
-                    var intersectionArea = Math.max(0, Math.min(targetRect.left + targetRect.width, window.innerWidth) - Math.max(targetRect.left, 0)) * // width
-                        Math.max(0, Math.min(targetRect.top + targetRect.height, window.innerHeight) - Math.max(targetRect.top, 0)); // height
+                    var intersectionArea = Math.max(0, Math.min(targetRect.left + targetRect.width, window.innerWidth) -
+                        Math.max(targetRect.left, 0)) * // width
+                        Math.max(0, Math.min(targetRect.top + targetRect.height, window.innerHeight) -
+                            Math.max(targetRect.top, 0)); // height
                     var intersectionRatio = intersectionArea / targetArea;
@@ -79,10 +81,12 @@ _this._updateState(target, intersectionRatio, targetRect.top < window.innerHeight / 2);
         var hasBottomClassThreshold = target.classList.contains(this.CLASSES.bottomThreshold);
-        var strictTop = this.props.hasOwnProperty('detectOnce') && this.props.strictTop ? this.threshold : 0;
+        var strictTop = this.data.hasOwnProperty('detectOnce') && this.data.strictTop ? this.threshold : 0;
         var topThreshold = hasTopClassThreshold ? strictTop : this.threshold;
-        var isTop = (this.detectOnce && hasTopClassThreshold) || (intersectionRatio > topThreshold || targetTopAboveViewCenter);
-        var isBottom = (this.detectOnce && hasBottomClassThreshold) || (intersectionRatio <= this.threshold && targetTopAboveViewCenter);
+        var isTop = (this.detectOnce && hasTopClassThreshold) ||
+            (intersectionRatio > topThreshold || targetTopAboveViewCenter);
+        var isBottom = (this.detectOnce && hasBottomClassThreshold) ||
+            (intersectionRatio <= this.threshold && targetTopAboveViewCenter);
         target.classList.toggle(this.CLASSES.topThreshold, isTop);
         target.classList.toggle(this.CLASSES.bottomThreshold, isBottom);
-        if (this.props.afterUpdate) {
-            this.props.afterUpdate(isTop, isBottom);
+        if (this.data.afterUpdate) {
+            this.data.afterUpdate(isTop, isBottom);
         }
@@ -89,0 +93,0 @@ };

lib/components/Shapes.d.ts

@@ -1,3 +0,3 @@
-import { Component } from '../Component';
-export interface ShapesProps {
+import { Component } from './Component';
+export interface ShapesData {
     url: string;
@@ -10,3 +10,3 @@ }
  */
-export declare class Shapes extends Component<ShapesProps> {
+export declare class Shapes extends Component<ShapesData> {
     static componentName: string;
@@ -13,0 +13,0 @@ init(): void;

lib/components/Shapes.js

@@ -16,3 +16,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var Component_1 = require("../Component");
+var Component_1 = require("./Component");
 /**
@@ -29,8 +29,7 @@ * Shapes component class
     Shapes.prototype.init = function () {
-        document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#BasicStructure', '1.1') &&
-            this.injectSprite();
+        document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#BasicStructure', '1.1') && this.injectSprite();
     };
     Shapes.prototype.injectSprite = function () {
         var _this = this;
-        fetch(this.props.url)
+        fetch(this.data.url)
             .then(function (response) {
@@ -37,0 +36,0 @@ if (!response.ok) {

lib/componentTypes.d.ts

@@ -0,0 +0,0 @@ export declare type ComponentEl = HTMLElement | SVGElement | Window;

lib/componentTypes.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 //# sourceMappingURL=componentTypes.js.map

lib/index.d.ts

@@ -0,0 +0,0 @@ /// <reference path="../src/extensions.d.ts" />

lib/index.js

@@ -0,0 +0,0 @@ "use strict";

lib/initializeComponents.d.ts

@@ -0,0 +0,0 @@ import { ComponentConstructor } from './Component';

lib/initializeComponents.js

@@ -0,0 +0,0 @@ "use strict";

lib/utils/emulateTransitionEnd.d.ts

 export declare const emulateTransitionEnd: (element: Element, callback: (e: Element) => void, duration: number) => void;
 //# sourceMappingURL=emulateTransitionEnd.d.ts.map

lib/utils/emulateTransitionEnd.js

@@ -0,0 +0,0 @@ "use strict";

lib/utils/filterNodeList.d.ts

 export declare const filterNodeList: <E extends HTMLElement>(list: NodeListOf<E> | HTMLCollectionOf<E>, selector: string) => E[];
 //# sourceMappingURL=filterNodeList.d.ts.map

lib/utils/filterNodeList.js

@@ -0,0 +0,0 @@ "use strict";

lib/utils/index.d.ts

@@ -0,0 +0,0 @@ export * from './emulateTransitionEnd';

lib/utils/index.js

@@ -0,0 +0,0 @@ "use strict";

lib/utils/inject.d.ts

@@ -0,0 +0,0 @@ declare type ScriptElementConfig = Partial<Omit<HTMLScriptElement, keyof HTMLElement>>;

lib/utils/inject.js

@@ -0,0 +0,0 @@ "use strict";

lib/utils/matchesSelector.d.ts

 export declare const matchesSelector: (element: Element, selector: string) => boolean;
 //# sourceMappingURL=matchesSelector.d.ts.map

lib/utils/matchesSelector.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.matchesSelector = function (element, selector) {
-    return (element.matches || element.msMatchesSelector).call(element, selector);
+    var matches = false;
+    try {
+        matches = (element.matches || element.msMatchesSelector).call(element, selector);
+    }
+    catch (e) {
+        // Fails on invalid or unknown selectors
+    }
+    return matches;
 };
 //# sourceMappingURL=matchesSelector.js.map

package.json

 {
   "name": "@mangoweb/scripts-base",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "Simple component model for small to medium sites. Usable from JS & TS.",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -129,3 +129,3 @@ # `@mangoweb/scripts-base`
 ```typescript
-import { Shapes } from `@mangoweb/scripts-base`
+import { Shapes } from `@mangoweb/shapes`
 import { InView } from `@mangoweb/in-view`
@@ -137,2 +137,2 @@ ```
 - [InView](https://www.npmjs.com/package/@mangoweb/in-view)
-- Shapes
+- [Shapes](https://www.npmjs.com/package/@mangoweb/shapes)

src/components/index.ts

 export * from './Emitter'
 export * from './Example'
-export * from './Shapes'

src/utils/matchesSelector.ts

 export const matchesSelector = (element: Element, selector: string): boolean => {
-	return (element.matches || element.msMatchesSelector).call(element, selector)
+	let matches = false
+	try {
+		matches = (element.matches || element.msMatchesSelector).call(element, selector)
+	} catch (e) {
+		// Fails on invalid or unknown selectors
+	}
+	return matches
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This 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

89549

increased by0.22%

Worsened metrics

Number of package files

78

decreased by-1.27%

Lines of code

1179

decreased by-2%

No dependency changes