@intelligo.ai/bonfire - npm Package Compare versions

Comparing version 1.0.912 to 1.1.0

dist/lib/index.js

@@ -1,104 +0,2 @@
-import onChange from 'on-change';
-import { BehaviorSubject } from 'rxjs';
-import * as uuid from 'uuid';
-var changeDetectionKey = uuid();
-export function ReRenderOnChange() {
-    return function (target) {
-        return new Proxy(target, {
-            construct: function (clz, args) {
-                var isFound = false;
-                args.forEach(function (element) {
-                    if (element.__proto__.hasOwnProperty('detectChanges')) {
-                        isFound = true;
-                        target.prototype[changeDetectionKey] = element;
-                    }
-                });
-                if (!isFound) {
-                    throw new Error("\n                    Change detection ref is not set on this component constructor: == " + target.name + " ==\n                    Example: \n                    ...\n\n                    constructor(\n                        private cd: ChangeDetectorRef\n                    ) { }\n                    ...\n\n          ");
-                }
-                return Reflect.construct(clz, args);
-            }
-        });
-    };
-}
-export function SetChecker() {
-    return function (target, key) {
-        var changeDetection = function () {
-            var cd = target[changeDetectionKey];
-            if (cd && cd.markForCheck) {
-                cd.markForCheck();
-            }
-        };
-        var handleChange = function (path, value, perValue) {
-            if (value !== perValue) {
-                target["__" + key + "$$"] = onChange({ value: target["__" + key + "$$"].value }, handleChange);
-                changeDetection();
-            }
-        };
-        var set = function (value) {
-            target["__" + key + "$$"] = onChange({ value: value }, handleChange);
-            changeDetection();
-        };
-        var get = function () {
-            var vl = target["__" + key + "$$"];
-            return vl ? vl.value : null;
-        };
-        Object.defineProperty(target, key, {
-            configurable: true,
-            enumerable: true,
-            get: get,
-            set: set
-        });
-    };
-}
-export function WithObservable(observableKey) {
-    return function (target, key) {
-        var pKey = observableKey || key + "$";
-        var proxyKey = "proxy__key__" + key;
-        var init = function (isGet) {
-            return function (newVal) {
-                var _this = this;
-                var handleChange = function (path, value, perValue) {
-                    if (value !== perValue) {
-                        _this[pKey].next(_this[proxyKey].value);
-                    }
-                };
-                Object.defineProperty(this, key, {
-                    get: function () {
-                        var _a;
-                        return (_a = _this[proxyKey]) === null || _a === void 0 ? void 0 : _a.value;
-                    },
-                    set: function (val) {
-                        var value = val;
-                        if (!_this[pKey]) {
-                            _this[pKey] = new BehaviorSubject(val);
-                        }
-                        if (_this[proxyKey]) {
-                            _this[proxyKey].value = val;
-                        }
-                        else {
-                            value = val;
-                            _this[proxyKey] = onChange({ value: value }, handleChange);
-                        }
-                    },
-                    enumerable: true,
-                    configurable: true
-                });
-                if (isGet) {
-                    return this[key]; // get
-                }
-                else {
-                    this[key] = newVal; // set
-                }
-            };
-        };
-        // Override property to let init occur on first get/set
-        return Object.defineProperty(target, key, {
-            get: init(true),
-            set: init(false),
-            enumerable: true,
-            configurable: true
-        });
-    };
-}
+export * from './public/public-api';
 //# sourceMappingURL=index.js.map

dist/types/index.d.ts

@@ -1,3 +0,1 @@
-export declare function ReRenderOnChange(): (target: any) => any;
-export declare function SetChecker<J = any>(): (target: Object, key: string) => void;
-export declare function WithObservable<T = any>(observableKey?: string): (target: any, key: string) => any;
+export * from './public/public-api';

package.json

 {
   "name": "@intelligo.ai/bonfire",
-  "version": "1.0.912",
+  "version": "1.1.0",
   "description": "Open source decorators utils for angular",
@@ -5,0 +5,0 @@ "main": "./dist/lib/index",

README.md

@@ -1,2 +0,2 @@
-![alt text](https://i.imgur.com/fRpDEDh.png)             
+![alt text](https://i.imgur.com/fRpDEDh.png)
 
@@ -12,3 +12,5 @@ # Bonfire
 You can make your code cleaner and simpler with adding just 2 decorators to your code.
+
 We know that angular change detection is not simple if you want it to be officiant. So I made Bonfire.
+
 Simple solution to hard problem.
@@ -25,16 +27,16 @@
 ```sh
+
 $ npm i @intelligo.ai/bonfire
+
 ```
 
+## The Tools
 
-## The Tools
 See Examples Below:
 
-| Tools | What it does?  | How to use?  |
-| :-----: | :-: | :-: |
-| (1) ReRenderOnChange | The decorator on the component is actually what causes the other decorators to use change detection | Put it on the top of the component and make sure the component have change detection injected |
-| (2) SetChecker | Put it on a property we want to trigger re-render ***only*** if it changed | Just put it on the property |
-| (3) WithObservable | Generate a behavior subject (Observable), Which emit values that stored in the original property (You don't need to maintain it at all! Just use it) | Put in on the original property and next to it write the same property name with '$', it will store automatically |
+| Tools              | What it does?                                                                                                                                        | How to use?                                                                                                        |
+| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ |
+| (2) DetectChange   | Emit the detect change function when the value change                                                                                                | Inject the change detection ref to the component and use the decorator on the property you want to track.          |
+| (3) WithObservable | Generate a behavior subject (Observable), Which emit values that stored in the original property (You don't need to maintain it at all! Just use it) | Put in on the original property and next to it write the same property name with '\$', it will store automatically |
 
-
 ## Where to use
@@ -45,36 +47,70 @@
 ```typescript
-import { ReRenderOnChange, SetChecker, WithObservable } from '@intelligo.ai/bonfire';
 
-@ReRenderOnChange() // <== (1)
+import  {  DetectChange  WithObservable  }  from  '@intelligo.ai/bonfire';
+
+
+
+
 @Component({
-  selector: 'my-component',
-  templateUrl: './my-component.component.html',
-  styleUrls: ['./my-component.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush // <== IMPORTANT
+
+selector:  'my-component',
+
+templateUrl:  './my-component.component.html',
+
+styleUrls: ['./my-component.component.scss'],
+
+changeDetection:  ChangeDetectionStrategy.OnPush  // <== IMPORTANT
+
 })
 
-export class MyComponent {
 
-  @SetChecker() group: ISomeInterface = {
-   test: [
-     {
-       name: 'Hello',
-       age: 30
-     }
-    ]
-  }; // <== (2)
 
-  @WithObservable() showLoader = false; showLoader$: BehaviorSubject<boolean>; // <== (3)
+export  class  MyComponent  {
 
-  constructor(
-    private cd: ChangeDetectorRef // <== MOST IMPORTANT
-  ) {
 
-    setTimeout(() => {
-      // This won't trigger change detection unless you are using SetChecker :-)
-      this.groups.test[0].name = 'World'
-    },5000)
 
-  }
+@DetectChange() group:  ISomeInterface  =  {
+
+test: [
+
+{
+
+name:  'Hello',
+
+age:  30
+
 }
+
+]
+
+};  // <== (1)
+
+
+
+@WithObservable() showLoader  =  false;  showLoader$:  BehaviorSubject<boolean>;  // <== (2)
+
+
+
+constructor(
+
+private  cd:  ChangeDetectorRef  // <== MOST IMPORTANT
+
+)  {
+
+
+
+setTimeout(()  =>  {
+
+// This won't trigger change detection unless you are using DetectChange :-)
+
+this.groups.test[0].name  =  'World'
+
+},5000)
+
+
+
+}
+
+}
+
 ```
@@ -87,3 +123,5 @@
 - [Angular](https://angular.io/) - Platform for building mobile and desktop web applications.
+
 - [Rxjs](https://rxjs-dev.firebaseapp.com/) - Reactive extensions library for javascript.
+
 - [uuid](https://www.npmjs.com/package/uuid) - Simple, fast generation of RFC4122 UUIDS.
@@ -90,0 +128,0 @@

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

Major refactor

Supply chain risk

Package 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

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

14777

increased by26.28%

Number of package files

17

increased by240%

Lines of code

135

increased by27.36%

Number of lines in readme file

134

increased by39.58%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes