@slickgrid-universal/binding 0.19.2 → 1.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/README.md +21 -21
- package/dist/commonjs/binding.helper.d.ts +3 -3
- package/dist/commonjs/binding.helper.js +3 -1
- package/dist/commonjs/binding.helper.js.map +1 -1
- package/dist/commonjs/binding.service.d.ts +6 -23
- package/dist/commonjs/binding.service.js +16 -10
- package/dist/commonjs/binding.service.js.map +1 -1
- package/dist/commonjs/index.d.ts +1 -0
- package/dist/commonjs/index.js +1 -0
- package/dist/commonjs/index.js.map +1 -1
- package/dist/commonjs/interfaces.d.ts +18 -0
- package/dist/commonjs/interfaces.js +3 -0
- package/dist/commonjs/interfaces.js.map +1 -0
- package/dist/esm/binding.helper.d.ts +3 -3
- package/dist/esm/binding.helper.js +3 -1
- package/dist/esm/binding.helper.js.map +1 -1
- package/dist/esm/binding.service.d.ts +6 -23
- package/dist/esm/binding.service.js +16 -10
- package/dist/esm/binding.service.js.map +1 -1
- package/dist/esm/index.d.ts +1 -0
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/interfaces.d.ts +18 -0
- package/dist/esm/interfaces.js +2 -0
- package/dist/esm/interfaces.js.map +1 -0
- package/package.json +12 -11
- package/src/index.ts +3 -0
- package/CHANGELOG.md +0 -68
package/LICENSE
CHANGED
package/README.md
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
[](https://opensource.org/licenses/MIT)
|
|
2
|
-
[](http://www.typescriptlang.org/)
|
|
3
|
-
[](https://www.npmjs.com/package/@slickgrid-universal/binding)
|
|
5
|
-
[](https://www.npmjs.com/package/@slickgrid-universal/binding)
|
|
6
|
-
|
|
7
|
-
[](https://github.com/ghiscoding/slickgrid-universal/actions)
|
|
8
|
-
[](https://www.cypress.io/)
|
|
9
|
-
[](https://github.com/facebook/jest)
|
|
10
|
-
[](https://codecov.io/gh/ghiscoding/slickgrid-universal)
|
|
11
|
-
|
|
12
|
-
## Binding Engine & Helper
|
|
13
|
-
#### @slickgrid-universal/binding
|
|
14
|
-
|
|
15
|
-
A very Simple Vanilla Implementation of a Binding Engine & Helper to add properties/events 2 way bindings. This binding engine is a very simple implementation and is used by simple components like the Custom Footer & Pagination. Again this is a very simple implementation and should not be used with large components but is good enough for small use cases like a footer, pagination and other small ones.
|
|
16
|
-
|
|
17
|
-
### External Dependencies
|
|
18
|
-
- [DOM Purify](https://github.com/cure53/DOMPurify) to sanitize HTML text
|
|
19
|
-
|
|
20
|
-
### Installation
|
|
21
|
-
Follow the instruction provided in the main [README](https://github.com/ghiscoding/slickgrid-universal#installation)
|
|
1
|
+
[](https://opensource.org/licenses/MIT)
|
|
2
|
+
[](http://www.typescriptlang.org/)
|
|
3
|
+
[](https://github.com/ghiscoding/ws-conventional-version-roller)
|
|
4
|
+
[](https://www.npmjs.com/package/@slickgrid-universal/binding)
|
|
5
|
+
[](https://www.npmjs.com/package/@slickgrid-universal/binding)
|
|
6
|
+
|
|
7
|
+
[](https://github.com/ghiscoding/slickgrid-universal/actions)
|
|
8
|
+
[](https://www.cypress.io/)
|
|
9
|
+
[](https://github.com/facebook/jest)
|
|
10
|
+
[](https://codecov.io/gh/ghiscoding/slickgrid-universal)
|
|
11
|
+
|
|
12
|
+
## Binding Engine & Helper
|
|
13
|
+
#### @slickgrid-universal/binding
|
|
14
|
+
|
|
15
|
+
A very Simple Vanilla Implementation of a Binding Engine & Helper to add properties/events 2 way bindings. This binding engine is a very simple implementation and is used by simple components like the Custom Footer & Pagination. Again this is a very simple implementation and should not be used with large components but is good enough for small use cases like a footer, pagination and other small ones.
|
|
16
|
+
|
|
17
|
+
### External Dependencies
|
|
18
|
+
- [DOM Purify](https://github.com/cure53/DOMPurify) to sanitize HTML text
|
|
19
|
+
|
|
20
|
+
### Installation
|
|
21
|
+
Follow the instruction provided in the main [README](https://github.com/ghiscoding/slickgrid-universal#installation)
|
|
@@ -7,12 +7,12 @@ export declare class BindingHelper {
|
|
|
7
7
|
get observers(): BindingService[];
|
|
8
8
|
constructor();
|
|
9
9
|
dispose(): void;
|
|
10
|
-
addElementBinding(variable: any, property: string, selector: string, attribute: string, events?: string | string[], callback?: (val: any) => void): void;
|
|
10
|
+
addElementBinding<T extends Element = Element>(variable: any, property: string, selector: string, attribute: string, events?: string | string[], callback?: (val: any) => void): void;
|
|
11
11
|
/** From a DOM element selector, which could be zero or multiple elements, add an event listener */
|
|
12
|
-
bindEventHandler(selector: string, eventName: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
12
|
+
bindEventHandler<T extends Element = Element>(selector: string, eventName: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
13
13
|
/**
|
|
14
14
|
* From a DOM element selector, which could be zero or multiple elements, set the value on a given attribute name
|
|
15
15
|
* For example ('div.hello', 'textContent', 'world') => would set the textContent equal to 'world' on a div element having the class 'hello'
|
|
16
16
|
*/
|
|
17
|
-
setElementAttributeValue(selector: string, attribute: string, value: any): void;
|
|
17
|
+
setElementAttributeValue<T extends Element = Element>(selector: string, attribute: string, value: any): void;
|
|
18
18
|
}
|
|
@@ -17,8 +17,10 @@ class BindingHelper {
|
|
|
17
17
|
return this._observers;
|
|
18
18
|
}
|
|
19
19
|
dispose() {
|
|
20
|
-
|
|
20
|
+
let observer = this._observers.pop();
|
|
21
|
+
while (observer) {
|
|
21
22
|
observer.dispose();
|
|
23
|
+
observer = this._observers.pop();
|
|
22
24
|
}
|
|
23
25
|
this._observers = [];
|
|
24
26
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"binding.helper.js","sourceRoot":"","sources":["../../src/binding.helper.ts"],"names":[],"mappings":";;;AAAA,uDAAmD;AAEnD,MAAa,aAAa;IAexB;QAdQ,eAAU,GAAqB,EAAE,CAAC;QAClC,yBAAoB,GAAG,EAAE,CAAC;IAalB,CAAC;IAXjB,IAAI,mBAAmB;QACrB,OAAO,IAAI,CAAC,oBAAoB,IAAI,EAAE,CAAC;IACzC,CAAC;IACD,IAAI,mBAAmB,CAAC,MAAc;QACpC,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC;IACrC,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,UAAU,CAAC;IACzB,CAAC;IAID,OAAO;QACL,
|
|
1
|
+
{"version":3,"file":"binding.helper.js","sourceRoot":"","sources":["../../src/binding.helper.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,21 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
variable: any;
|
|
3
|
-
property: string;
|
|
4
|
-
}
|
|
5
|
-
export interface ElementBinding {
|
|
6
|
-
element: Element | null;
|
|
7
|
-
attribute: string;
|
|
8
|
-
}
|
|
9
|
-
export interface ElementBindingWithListener extends ElementBinding {
|
|
10
|
-
event: string;
|
|
11
|
-
listener: (val: any) => any;
|
|
12
|
-
}
|
|
13
|
-
export interface BoundedEventWithListener {
|
|
14
|
-
element: Element;
|
|
15
|
-
eventName: string;
|
|
16
|
-
listener: EventListenerOrEventListenerObject;
|
|
17
|
-
uid: string;
|
|
18
|
-
}
|
|
1
|
+
import { Binding, BoundedEventWithListener, ElementBinding, ElementBindingWithListener } from './interfaces';
|
|
19
2
|
/**
|
|
20
3
|
* Create 2 way Bindings for any variable that are primitive or object types, when it's an object type it will watch for property changes
|
|
21
4
|
* The following 2 articles helped in building this service:
|
|
@@ -34,27 +17,27 @@ export declare class BindingService {
|
|
|
34
17
|
get property(): string;
|
|
35
18
|
dispose(): void;
|
|
36
19
|
valueGetter(): any;
|
|
37
|
-
valueSetter(val: any): void;
|
|
20
|
+
valueSetter<T extends Element = Element>(val: any): void;
|
|
38
21
|
/**
|
|
39
22
|
* Add binding to 1 or more DOM Element by an object attribute and optionally on an event, we can do it in couple ways
|
|
40
23
|
* 1- if there's no event provided, it will simply replace the DOM elemnt (by an attribute), for example an innerHTML
|
|
41
24
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
42
25
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
43
26
|
*/
|
|
44
|
-
bind(elements:
|
|
27
|
+
bind<T extends Element = Element>(elements: T | NodeListOf<T> | null, attribute: string, eventName?: string, eventCallback?: (val: any) => any): this;
|
|
45
28
|
/** Unbind (remove) an element event listener */
|
|
46
29
|
unbind(element: Element | null, eventName: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions, eventUid?: string): void;
|
|
47
30
|
/** Unbind All (remove) bounded elements with listeners */
|
|
48
31
|
unbindAll(): void;
|
|
49
32
|
/**
|
|
50
33
|
* Add binding to a single element by an object attribute and optionally on an event, we can do it in couple ways
|
|
51
|
-
* 1- if there's no event provided, it will simply replace the DOM
|
|
34
|
+
* 1- if there's no event provided, it will simply replace the DOM element (by an attribute), for example an innerHTML
|
|
52
35
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
53
36
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
54
37
|
*/
|
|
55
|
-
protected bindSingleElement(element:
|
|
38
|
+
protected bindSingleElement<T extends Element = Element>(element: T | null, attribute: string, eventName?: string, eventCallback?: (val: any) => any): void;
|
|
56
39
|
/** Generate a UUID version 4 RFC compliant */
|
|
57
40
|
protected generateUuidV4(): string;
|
|
41
|
+
protected hasData(value: any): boolean;
|
|
58
42
|
protected sanitizeText(dirtyText: string): string;
|
|
59
43
|
}
|
|
60
|
-
export {};
|
|
@@ -2,8 +2,7 @@
|
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.BindingService = void 0;
|
|
4
4
|
/* eslint-disable no-bitwise */
|
|
5
|
-
const
|
|
6
|
-
const DOMPurify = DOMPurify_['default'] || DOMPurify_; // patch to fix rollup to work
|
|
5
|
+
const DOMPurify = require("dompurify");
|
|
7
6
|
/**
|
|
8
7
|
* Create 2 way Bindings for any variable that are primitive or object types, when it's an object type it will watch for property changes
|
|
9
8
|
* The following 2 articles helped in building this service:
|
|
@@ -64,14 +63,14 @@ class BindingService {
|
|
|
64
63
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
65
64
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
66
65
|
*/
|
|
67
|
-
bind(elements, attribute, eventName,
|
|
66
|
+
bind(elements, attribute, eventName, eventCallback) {
|
|
68
67
|
if (elements && elements.forEach) {
|
|
69
68
|
// multiple DOM elements coming from a querySelectorAll() call
|
|
70
|
-
elements.forEach(elm => this.bindSingleElement(elm, attribute, eventName,
|
|
69
|
+
elements.forEach(elm => this.bindSingleElement(elm, attribute, eventName, eventCallback));
|
|
71
70
|
}
|
|
72
71
|
else if (elements) {
|
|
73
72
|
// single DOM element coming from a querySelector() call
|
|
74
|
-
this.bindSingleElement(elements, attribute, eventName,
|
|
73
|
+
this.bindSingleElement(elements, attribute, eventName, eventCallback);
|
|
75
74
|
}
|
|
76
75
|
return this;
|
|
77
76
|
}
|
|
@@ -97,22 +96,26 @@ class BindingService {
|
|
|
97
96
|
}
|
|
98
97
|
/**
|
|
99
98
|
* Add binding to a single element by an object attribute and optionally on an event, we can do it in couple ways
|
|
100
|
-
* 1- if there's no event provided, it will simply replace the DOM
|
|
99
|
+
* 1- if there's no event provided, it will simply replace the DOM element (by an attribute), for example an innerHTML
|
|
101
100
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
102
101
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
103
102
|
*/
|
|
104
|
-
bindSingleElement(element, attribute, eventName,
|
|
103
|
+
bindSingleElement(element, attribute, eventName, eventCallback) {
|
|
105
104
|
const binding = { element, attribute };
|
|
106
105
|
if (element) {
|
|
107
106
|
if (eventName) {
|
|
108
107
|
const listener = () => {
|
|
109
|
-
|
|
108
|
+
var _a;
|
|
109
|
+
let elmValue = element[attribute];
|
|
110
|
+
if (this.hasData(elmValue) && ((_a = element) === null || _a === void 0 ? void 0 : _a.type) === 'number') {
|
|
111
|
+
elmValue = +elmValue; // input is always string but we can parse to number when its type is number
|
|
112
|
+
}
|
|
110
113
|
this.valueSetter(elmValue);
|
|
111
114
|
if (this._binding.variable.hasOwnProperty(this._binding.property) || this._binding.property in this._binding.variable) {
|
|
112
115
|
this._binding.variable[this._binding.property] = this.valueGetter();
|
|
113
116
|
}
|
|
114
|
-
if (typeof
|
|
115
|
-
return
|
|
117
|
+
if (typeof eventCallback === 'function') {
|
|
118
|
+
return eventCallback(this.valueGetter());
|
|
116
119
|
}
|
|
117
120
|
};
|
|
118
121
|
binding.event = eventName;
|
|
@@ -132,6 +135,9 @@ class BindingService {
|
|
|
132
135
|
return v.toString(16);
|
|
133
136
|
});
|
|
134
137
|
}
|
|
138
|
+
hasData(value) {
|
|
139
|
+
return value !== undefined && value !== null && value !== '';
|
|
140
|
+
}
|
|
135
141
|
sanitizeText(dirtyText) {
|
|
136
142
|
return (DOMPurify === null || DOMPurify === void 0 ? void 0 : DOMPurify.sanitize) ? DOMPurify.sanitize(dirtyText, {}) : dirtyText;
|
|
137
143
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"binding.service.js","sourceRoot":"","sources":["../../src/binding.service.ts"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,
|
|
1
|
+
{"version":3,"file":"binding.service.js","sourceRoot":"","sources":["../../src/binding.service.ts"],"names":[],"mappings":"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"}
|
package/dist/commonjs/index.d.ts
CHANGED
package/dist/commonjs/index.js
CHANGED
|
@@ -12,4 +12,5 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
12
12
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
13
13
|
__exportStar(require("./binding.helper"), exports);
|
|
14
14
|
__exportStar(require("./binding.service"), exports);
|
|
15
|
+
__exportStar(require("./interfaces"), exports);
|
|
15
16
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,mDAAiC;AACjC,oDAAkC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,mDAAiC;AACjC,oDAAkC;AAClC,+CAA6B"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export interface Binding {
|
|
2
|
+
variable: any;
|
|
3
|
+
property: string;
|
|
4
|
+
}
|
|
5
|
+
export interface ElementBinding<T extends Element = Element> {
|
|
6
|
+
element: T | null;
|
|
7
|
+
attribute: string;
|
|
8
|
+
}
|
|
9
|
+
export interface ElementBindingWithListener<T extends Element = Element> extends ElementBinding<T> {
|
|
10
|
+
event: string;
|
|
11
|
+
listener: (val: any) => any;
|
|
12
|
+
}
|
|
13
|
+
export interface BoundedEventWithListener<T extends Element = Element> {
|
|
14
|
+
element: T;
|
|
15
|
+
eventName: string;
|
|
16
|
+
listener: EventListenerOrEventListenerObject;
|
|
17
|
+
uid: string;
|
|
18
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/interfaces.ts"],"names":[],"mappings":""}
|
|
@@ -7,12 +7,12 @@ export declare class BindingHelper {
|
|
|
7
7
|
get observers(): BindingService[];
|
|
8
8
|
constructor();
|
|
9
9
|
dispose(): void;
|
|
10
|
-
addElementBinding(variable: any, property: string, selector: string, attribute: string, events?: string | string[], callback?: (val: any) => void): void;
|
|
10
|
+
addElementBinding<T extends Element = Element>(variable: any, property: string, selector: string, attribute: string, events?: string | string[], callback?: (val: any) => void): void;
|
|
11
11
|
/** From a DOM element selector, which could be zero or multiple elements, add an event listener */
|
|
12
|
-
bindEventHandler(selector: string, eventName: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
12
|
+
bindEventHandler<T extends Element = Element>(selector: string, eventName: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
13
13
|
/**
|
|
14
14
|
* From a DOM element selector, which could be zero or multiple elements, set the value on a given attribute name
|
|
15
15
|
* For example ('div.hello', 'textContent', 'world') => would set the textContent equal to 'world' on a div element having the class 'hello'
|
|
16
16
|
*/
|
|
17
|
-
setElementAttributeValue(selector: string, attribute: string, value: any): void;
|
|
17
|
+
setElementAttributeValue<T extends Element = Element>(selector: string, attribute: string, value: any): void;
|
|
18
18
|
}
|
|
@@ -14,8 +14,10 @@ export class BindingHelper {
|
|
|
14
14
|
return this._observers;
|
|
15
15
|
}
|
|
16
16
|
dispose() {
|
|
17
|
-
|
|
17
|
+
let observer = this._observers.pop();
|
|
18
|
+
while (observer) {
|
|
18
19
|
observer.dispose();
|
|
20
|
+
observer = this._observers.pop();
|
|
19
21
|
}
|
|
20
22
|
this._observers = [];
|
|
21
23
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"binding.helper.js","sourceRoot":"","sources":["../../src/binding.helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD,MAAM,OAAO,aAAa;IAexB;QAdQ,eAAU,GAAqB,EAAE,CAAC;QAClC,yBAAoB,GAAG,EAAE,CAAC;IAalB,CAAC;IAXjB,IAAI,mBAAmB;QACrB,OAAO,IAAI,CAAC,oBAAoB,IAAI,EAAE,CAAC;IACzC,CAAC;IACD,IAAI,mBAAmB,CAAC,MAAc;QACpC,IAAI,CAAC,oBAAoB,GAAG,MAAM,CAAC;IACrC,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,UAAU,CAAC;IACzB,CAAC;IAID,OAAO;QACL,
|
|
1
|
+
{"version":3,"file":"binding.helper.js","sourceRoot":"","sources":["../../src/binding.helper.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,21 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
variable: any;
|
|
3
|
-
property: string;
|
|
4
|
-
}
|
|
5
|
-
export interface ElementBinding {
|
|
6
|
-
element: Element | null;
|
|
7
|
-
attribute: string;
|
|
8
|
-
}
|
|
9
|
-
export interface ElementBindingWithListener extends ElementBinding {
|
|
10
|
-
event: string;
|
|
11
|
-
listener: (val: any) => any;
|
|
12
|
-
}
|
|
13
|
-
export interface BoundedEventWithListener {
|
|
14
|
-
element: Element;
|
|
15
|
-
eventName: string;
|
|
16
|
-
listener: EventListenerOrEventListenerObject;
|
|
17
|
-
uid: string;
|
|
18
|
-
}
|
|
1
|
+
import { Binding, BoundedEventWithListener, ElementBinding, ElementBindingWithListener } from './interfaces';
|
|
19
2
|
/**
|
|
20
3
|
* Create 2 way Bindings for any variable that are primitive or object types, when it's an object type it will watch for property changes
|
|
21
4
|
* The following 2 articles helped in building this service:
|
|
@@ -34,27 +17,27 @@ export declare class BindingService {
|
|
|
34
17
|
get property(): string;
|
|
35
18
|
dispose(): void;
|
|
36
19
|
valueGetter(): any;
|
|
37
|
-
valueSetter(val: any): void;
|
|
20
|
+
valueSetter<T extends Element = Element>(val: any): void;
|
|
38
21
|
/**
|
|
39
22
|
* Add binding to 1 or more DOM Element by an object attribute and optionally on an event, we can do it in couple ways
|
|
40
23
|
* 1- if there's no event provided, it will simply replace the DOM elemnt (by an attribute), for example an innerHTML
|
|
41
24
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
42
25
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
43
26
|
*/
|
|
44
|
-
bind(elements:
|
|
27
|
+
bind<T extends Element = Element>(elements: T | NodeListOf<T> | null, attribute: string, eventName?: string, eventCallback?: (val: any) => any): this;
|
|
45
28
|
/** Unbind (remove) an element event listener */
|
|
46
29
|
unbind(element: Element | null, eventName: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions, eventUid?: string): void;
|
|
47
30
|
/** Unbind All (remove) bounded elements with listeners */
|
|
48
31
|
unbindAll(): void;
|
|
49
32
|
/**
|
|
50
33
|
* Add binding to a single element by an object attribute and optionally on an event, we can do it in couple ways
|
|
51
|
-
* 1- if there's no event provided, it will simply replace the DOM
|
|
34
|
+
* 1- if there's no event provided, it will simply replace the DOM element (by an attribute), for example an innerHTML
|
|
52
35
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
53
36
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
54
37
|
*/
|
|
55
|
-
protected bindSingleElement(element:
|
|
38
|
+
protected bindSingleElement<T extends Element = Element>(element: T | null, attribute: string, eventName?: string, eventCallback?: (val: any) => any): void;
|
|
56
39
|
/** Generate a UUID version 4 RFC compliant */
|
|
57
40
|
protected generateUuidV4(): string;
|
|
41
|
+
protected hasData(value: any): boolean;
|
|
58
42
|
protected sanitizeText(dirtyText: string): string;
|
|
59
43
|
}
|
|
60
|
-
export {};
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
/* eslint-disable no-bitwise */
|
|
2
|
-
import * as
|
|
3
|
-
const DOMPurify = DOMPurify_['default'] || DOMPurify_; // patch to fix rollup to work
|
|
2
|
+
import * as DOMPurify from 'dompurify';
|
|
4
3
|
/**
|
|
5
4
|
* Create 2 way Bindings for any variable that are primitive or object types, when it's an object type it will watch for property changes
|
|
6
5
|
* The following 2 articles helped in building this service:
|
|
@@ -61,14 +60,14 @@ export class BindingService {
|
|
|
61
60
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
62
61
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
63
62
|
*/
|
|
64
|
-
bind(elements, attribute, eventName,
|
|
63
|
+
bind(elements, attribute, eventName, eventCallback) {
|
|
65
64
|
if (elements && elements.forEach) {
|
|
66
65
|
// multiple DOM elements coming from a querySelectorAll() call
|
|
67
|
-
elements.forEach(elm => this.bindSingleElement(elm, attribute, eventName,
|
|
66
|
+
elements.forEach(elm => this.bindSingleElement(elm, attribute, eventName, eventCallback));
|
|
68
67
|
}
|
|
69
68
|
else if (elements) {
|
|
70
69
|
// single DOM element coming from a querySelector() call
|
|
71
|
-
this.bindSingleElement(elements, attribute, eventName,
|
|
70
|
+
this.bindSingleElement(elements, attribute, eventName, eventCallback);
|
|
72
71
|
}
|
|
73
72
|
return this;
|
|
74
73
|
}
|
|
@@ -94,22 +93,26 @@ export class BindingService {
|
|
|
94
93
|
}
|
|
95
94
|
/**
|
|
96
95
|
* Add binding to a single element by an object attribute and optionally on an event, we can do it in couple ways
|
|
97
|
-
* 1- if there's no event provided, it will simply replace the DOM
|
|
96
|
+
* 1- if there's no event provided, it will simply replace the DOM element (by an attribute), for example an innerHTML
|
|
98
97
|
* 2- when an event is provided, we will replace the DOM element (by an attribute) every time an event is triggered
|
|
99
98
|
* 2.1- we could also provide an extra callback method to execute when the event gets triggered
|
|
100
99
|
*/
|
|
101
|
-
bindSingleElement(element, attribute, eventName,
|
|
100
|
+
bindSingleElement(element, attribute, eventName, eventCallback) {
|
|
102
101
|
const binding = { element, attribute };
|
|
103
102
|
if (element) {
|
|
104
103
|
if (eventName) {
|
|
105
104
|
const listener = () => {
|
|
106
|
-
|
|
105
|
+
var _a;
|
|
106
|
+
let elmValue = element[attribute];
|
|
107
|
+
if (this.hasData(elmValue) && ((_a = element) === null || _a === void 0 ? void 0 : _a.type) === 'number') {
|
|
108
|
+
elmValue = +elmValue; // input is always string but we can parse to number when its type is number
|
|
109
|
+
}
|
|
107
110
|
this.valueSetter(elmValue);
|
|
108
111
|
if (this._binding.variable.hasOwnProperty(this._binding.property) || this._binding.property in this._binding.variable) {
|
|
109
112
|
this._binding.variable[this._binding.property] = this.valueGetter();
|
|
110
113
|
}
|
|
111
|
-
if (typeof
|
|
112
|
-
return
|
|
114
|
+
if (typeof eventCallback === 'function') {
|
|
115
|
+
return eventCallback(this.valueGetter());
|
|
113
116
|
}
|
|
114
117
|
};
|
|
115
118
|
binding.event = eventName;
|
|
@@ -129,6 +132,9 @@ export class BindingService {
|
|
|
129
132
|
return v.toString(16);
|
|
130
133
|
});
|
|
131
134
|
}
|
|
135
|
+
hasData(value) {
|
|
136
|
+
return value !== undefined && value !== null && value !== '';
|
|
137
|
+
}
|
|
132
138
|
sanitizeText(dirtyText) {
|
|
133
139
|
return (DOMPurify === null || DOMPurify === void 0 ? void 0 : DOMPurify.sanitize) ? DOMPurify.sanitize(dirtyText, {}) : dirtyText;
|
|
134
140
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"binding.service.js","sourceRoot":"","sources":["../../src/binding.service.ts"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"binding.service.js","sourceRoot":"","sources":["../../src/binding.service.ts"],"names":[],"mappings":"AAAA,+BAA+B;AAC/B,OAAO,KAAK,SAAS,MAAM,WAAW,CAAC;AAGvC;;;;;GAKG;AACH,MAAM,OAAO,cAAc;IAOzB,YAAY,OAAgB;QANlB,WAAM,GAAQ,IAAI,CAAC;QAGnB,+BAA0B,GAA+B,EAAE,CAAC;QAC5D,qBAAgB,GAAuD,EAAE,CAAC;QAGlF,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAC;QACxB,IAAI,CAAC,SAAS,GAAG,OAAO,CAAC,QAAQ,IAAI,EAAE,CAAC;QACxC,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;QAC3B,IAAI,OAAO,CAAC,QAAQ,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,OAAO,CAAC,QAAQ,IAAI,OAAO,CAAC,QAAQ,CAAC,EAAE;YACvI,IAAI,CAAC,MAAM,GAAG,OAAO,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;SACnK;aAAM;YACL,IAAI,CAAC,MAAM,GAAG,OAAO,OAAO,CAAC,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC;SAC7G;QAED,IAAI,OAAO,OAAO,CAAC,QAAQ,KAAK,QAAQ,EAAE;YACxC,MAAM,CAAC,cAAc,CAAC,OAAO,CAAC,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAAE;gBACxD,GAAG,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;gBAChC,GAAG,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC;aACjC,CAAC,CAAC;SACJ;IACH,CAAC;IAED,IAAI,yBAAyB;QAC3B,OAAO,IAAI,CAAC,0BAA0B,CAAC;IACzC,CAAC;IAED,IAAI,eAAe;QACjB,OAAO,IAAI,CAAC,gBAAgB,CAAC;IAC/B,CAAC;IAED,IAAI,QAAQ;QACV,OAAO,IAAI,CAAC,SAAS,CAAC;IACxB,CAAC;IAED,OAAO;QACL,IAAI,CAAC,SAAS,EAAE,CAAC;QACjB,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;QACrC,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAC;IAC7B,CAAC;IAED,WAAW;QACT,OAAO,IAAI,CAAC,MAAM,CAAC;IACrB,CAAC;IAED,WAAW,CAA8B,GAAQ;QAC/C,IAAI,CAAC,MAAM,GAAG,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;QACrE,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,gBAAgB,CAAC,EAAE;YACxC,KAAK,MAAM,OAAO,IAAI,IAAI,CAAC,gBAAgB,EAAE;gBAC3C,IAAI,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,MAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,SAAS,CAAA,EAAE;oBACzC,OAAO,CAAC,OAAa,CAAC,OAAO,CAAC,SAAoB,CAAC,GAAG,OAAO,GAAG,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;iBAC/G;aACF;SACF;IACH,CAAC;IAED;;;;;OAKG;IACH,IAAI,CAA8B,QAAkC,EAAE,SAAiB,EAAE,SAAkB,EAAE,aAAiC;QAC5I,IAAI,QAAQ,IAAK,QAA0B,CAAC,OAAO,EAAE;YACnD,8DAA8D;YAC7D,QAA0B,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC;SAC9G;aAAM,IAAI,QAAQ,EAAE;YACnB,wDAAwD;YACxD,IAAI,CAAC,iBAAiB,CAAC,QAAa,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,CAAC,CAAC;SAC5E;QAED,OAAO,IAAI,CAAC;IACd,CAAC;IAED,gDAAgD;IAChD,MAAM,CAAC,OAAuB,EAAE,SAAiB,EAAE,QAA4C,EAAE,OAAwC,EAAE,QAAiB;QAC1J,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,mBAAmB,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;YAC1D,MAAM,QAAQ,GAAG,IAAI,CAAC,0BAA0B,CAAC,SAAS,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,KAAK,QAAQ,CAAC,CAAC;YACtF,IAAI,QAAQ,IAAI,CAAC,EAAE;gBACjB,IAAI,CAAC,0BAA0B,CAAC,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;aACrD;SACF;IACH,CAAC;IAED,0DAA0D;IAC1D,SAAS;QACP,IAAI,YAAY,GAAG,IAAI,CAAC,0BAA0B,CAAC,GAAG,EAAE,CAAC;QACzD,OAAO,YAAY,EAAE;YACnB,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,YAAY,CAAC;YAC3D,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,CAAC,CAAC;YAC1D,YAAY,GAAG,IAAI,CAAC,0BAA0B,CAAC,GAAG,EAAE,CAAC;SACtD;QACD,IAAI,CAAC,0BAA0B,GAAG,EAAE,CAAC;IACvC,CAAC;IAED;;;;;OAKG;IACO,iBAAiB,CAA8B,OAAiB,EAAE,SAAiB,EAAE,SAAkB,EAAE,aAAiC;QAClJ,MAAM,OAAO,GAAsD,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC;QAC1F,IAAI,OAAO,EAAE;YACX,IAAI,SAAS,EAAE;gBACb,MAAM,QAAQ,GAAG,GAAG,EAAE;;oBACpB,IAAI,QAAQ,GAAQ,OAAO,CAAC,SAAoB,CAAC,CAAC;oBAClD,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAA,MAAC,OAAuC,0CAAE,IAAI,MAAK,QAAQ,EAAE;wBACzF,QAAQ,GAAG,CAAC,QAAQ,CAAC,CAAC,4EAA4E;qBACnG;oBACD,IAAI,CAAC,WAAW,CAAI,QAAQ,CAAC,CAAC;oBAC9B,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE;wBACrH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;qBACrE;oBAED,IAAI,OAAO,aAAa,KAAK,UAAU,EAAE;wBACvC,OAAO,aAAa,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC;qBAC1C;gBACH,CAAC,CAAC;gBAED,OAAyC,CAAC,KAAK,GAAG,SAAS,CAAC;gBAC5D,OAAyC,CAAC,QAAQ,GAAG,QAAQ,CAAC;gBAC/D,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;gBAC9C,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC;aACpG;YACD,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YACpC,OAAO,CAAC,SAAoB,CAAC,GAAG,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC;SAChH;IACH,CAAC;IAED,8CAA8C;IACpC,cAAc;QACtB,OAAO,sCAAsC,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACnE,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;YACjC,MAAM,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC;YAC1C,OAAO,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACxB,CAAC,CAAC,CAAC;IACL,CAAC;IAES,OAAO,CAAC,KAAU;QAC1B,OAAO,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;IAC/D,CAAC;IAES,YAAY,CAAC,SAAiB;QACtC,OAAO,CAAC,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/E,CAAC;CACF"}
|
package/dist/esm/index.d.ts
CHANGED
package/dist/esm/index.js
CHANGED
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export interface Binding {
|
|
2
|
+
variable: any;
|
|
3
|
+
property: string;
|
|
4
|
+
}
|
|
5
|
+
export interface ElementBinding<T extends Element = Element> {
|
|
6
|
+
element: T | null;
|
|
7
|
+
attribute: string;
|
|
8
|
+
}
|
|
9
|
+
export interface ElementBindingWithListener<T extends Element = Element> extends ElementBinding<T> {
|
|
10
|
+
event: string;
|
|
11
|
+
listener: (val: any) => any;
|
|
12
|
+
}
|
|
13
|
+
export interface BoundedEventWithListener<T extends Element = Element> {
|
|
14
|
+
element: T;
|
|
15
|
+
eventName: string;
|
|
16
|
+
listener: EventListenerOrEventListenerObject;
|
|
17
|
+
uid: string;
|
|
18
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../src/interfaces.ts"],"names":[],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@slickgrid-universal/binding",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "1.2.2",
|
|
4
4
|
"description": "Simple Vanilla Implementation of a Binding Engine & Helper to add properties/events 2 way bindings",
|
|
5
5
|
"main": "dist/commonjs/index.js",
|
|
6
|
+
"browser": "src/index.ts",
|
|
6
7
|
"module": "dist/esm/index.js",
|
|
7
8
|
"types": "dist/commonjs/index.d.ts",
|
|
8
9
|
"typings": "dist/commonjs/index.d.ts",
|
|
@@ -14,14 +15,14 @@
|
|
|
14
15
|
],
|
|
15
16
|
"scripts": {
|
|
16
17
|
"build": "cross-env tsc --build",
|
|
17
|
-
"postbuild": "npm-run-all bundle:commonjs",
|
|
18
|
+
"postbuild": "npm-run-all bundle:commonjs --npm-path npm",
|
|
18
19
|
"build:watch": "cross-env tsc --incremental --watch",
|
|
19
|
-
"dev": "run
|
|
20
|
-
"dev:watch": "run-p build:watch",
|
|
21
|
-
"bundle": "run-p bundle:commonjs bundle:esm",
|
|
20
|
+
"dev": "npm run build",
|
|
21
|
+
"dev:watch": "run-p build:watch --npm-path npm",
|
|
22
|
+
"bundle": "run-p bundle:commonjs bundle:esm --npm-path npm",
|
|
22
23
|
"bundle:commonjs": "tsc --project tsconfig.bundle.json --outDir dist/commonjs --module commonjs",
|
|
23
24
|
"bundle:esm": "cross-env tsc --project tsconfig.bundle.json --outDir dist/esm --module esnext --target es2018",
|
|
24
|
-
"prebundle": "npm-run-all delete:dist",
|
|
25
|
+
"prebundle": "npm-run-all delete:dist --npm-path npm",
|
|
25
26
|
"delete:dist": "cross-env rimraf --maxBusyTries=10 dist",
|
|
26
27
|
"package:add-browser-prop": "cross-env node ../change-package-browser.js --add-browser=true --folder-name=binding",
|
|
27
28
|
"package:remove-browser-prop": "cross-env node ../change-package-browser.js --remove-browser=true --folder-name=binding"
|
|
@@ -38,8 +39,8 @@
|
|
|
38
39
|
"url": "https://github.com/ghiscoding/slickgrid-universal/issues"
|
|
39
40
|
},
|
|
40
41
|
"engines": {
|
|
41
|
-
"node": ">=
|
|
42
|
-
"npm": ">=
|
|
42
|
+
"node": ">=16.11.0",
|
|
43
|
+
"npm": ">=8.0.0"
|
|
43
44
|
},
|
|
44
45
|
"browserslist": [
|
|
45
46
|
"last 2 version",
|
|
@@ -47,12 +48,12 @@
|
|
|
47
48
|
"not dead"
|
|
48
49
|
],
|
|
49
50
|
"dependencies": {
|
|
50
|
-
"dompurify": "^2.3.
|
|
51
|
+
"dompurify": "^2.3.5"
|
|
51
52
|
},
|
|
52
53
|
"devDependencies": {
|
|
53
54
|
"cross-env": "^7.0.3",
|
|
54
55
|
"npm-run-all": "^4.1.5",
|
|
55
56
|
"rimraf": "^3.0.2"
|
|
56
57
|
},
|
|
57
|
-
"gitHead": "
|
|
58
|
-
}
|
|
58
|
+
"gitHead": "4ff8a387237d3f097481da8be78033629fda7357"
|
|
59
|
+
}
|
package/src/index.ts
ADDED
package/CHANGELOG.md
DELETED
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
# Change Log
|
|
2
|
-
|
|
3
|
-
All notable changes to this project will be documented in this file.
|
|
4
|
-
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
|
-
|
|
6
|
-
## [0.19.2](https://github.com/ghiscoding/slickgrid-universal/compare/v0.19.1...v0.19.2) (2021-11-19)
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
### Bug Fixes
|
|
10
|
-
|
|
11
|
-
* **build:** add DOM purify optional default import to fix rollup builds ([3bd335d](https://github.com/ghiscoding/slickgrid-universal/commit/3bd335dd62d0829c1581ca0fde560c93dcd84458))
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
# [0.19.0](https://github.com/ghiscoding/slickgrid-universal/compare/v0.18.0...v0.19.0) (2021-10-28)
|
|
19
|
-
|
|
20
|
-
**Note:** Version bump only for package @slickgrid-universal/binding
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
# [0.18.0](https://github.com/ghiscoding/slickgrid-universal/compare/v0.17.0...v0.18.0) (2021-09-29)
|
|
28
|
-
|
|
29
|
-
**Note:** Version bump only for package @slickgrid-universal/binding
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
# [0.17.0](https://github.com/ghiscoding/slickgrid-universal/compare/v0.16.2...v0.17.0) (2021-09-09)
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
### Bug Fixes
|
|
40
|
-
|
|
41
|
-
* **core:** potential event binding leaks not all removed when disposing ([3e61712](https://github.com/ghiscoding/slickgrid-universal/commit/3e61712156f3b76b48b04d66bb05f2533f041831))
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
# [0.16.0](https://github.com/ghiscoding/slickgrid-universal/compare/v0.15.0...v0.16.0) (2021-07-16)
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
### Features
|
|
51
|
-
|
|
52
|
-
* **services:** make everything extendable by using `protected` ([ecbb93a](https://github.com/ghiscoding/slickgrid-universal/commit/ecbb93a56abba39dd050bbd6019b86694495edd1))
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
# [0.15.0](https://github.com/ghiscoding/slickgrid-universal/compare/v0.14.1...v0.15.0) (2021-07-06)
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
### Bug Fixes
|
|
62
|
-
|
|
63
|
-
* **build:** the "files" property should be included in pkg.json ([3d8f12e](https://github.com/ghiscoding/slickgrid-universal/commit/3d8f12e5f55079445c6fb5cde767f8e0b4511ebb))
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
### Features
|
|
67
|
-
|
|
68
|
-
* **components:** extract Custom Footer to be an external component ([1794c27](https://github.com/ghiscoding/slickgrid-universal/commit/1794c27d7669c172f606d709d3360bc5d2f77798))
|