@rhtml/custom-attributes 0.0.111 → 0.0.112
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/README.md +90 -0
- package/dist/index.d.ts +34 -0
- package/dist/index.js +86 -3
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/index.ts +113 -5
package/README.md
CHANGED
|
@@ -306,3 +306,93 @@ By changing `delay` attribute because we use `observe: true` method `OnUpdateAtt
|
|
|
306
306
|
My Animated Element
|
|
307
307
|
</h2>
|
|
308
308
|
```
|
|
309
|
+
|
|
310
|
+
#### Media query matcher
|
|
311
|
+
|
|
312
|
+
By extending `MediaQueryAttribute` we gain two more events to handle media matches `OnEnterMediaQuery` and `OnExitMediaQuery`
|
|
313
|
+
|
|
314
|
+
For example when we define attribute selector `color` we can use available media breakpoints `xs`, `sm`, `md`,`lg`,`xl`.
|
|
315
|
+
|
|
316
|
+
Extending `MediaQueryAttribute` will help you to track values from specific resolutions
|
|
317
|
+
|
|
318
|
+
```typescript
|
|
319
|
+
import {
|
|
320
|
+
EnterMediaQueryAttributes,
|
|
321
|
+
ExitMediaQueryAttributes,
|
|
322
|
+
MediaQueryAttribute,
|
|
323
|
+
Modifier
|
|
324
|
+
} from '@rhtml/custom-attributes';
|
|
325
|
+
|
|
326
|
+
interface Styles {
|
|
327
|
+
color: string;
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
@Modifier({
|
|
331
|
+
selector: 'color'
|
|
332
|
+
})
|
|
333
|
+
export class Color extends MediaQueryAttribute<Styles> {
|
|
334
|
+
OnInit() {
|
|
335
|
+
this.modify();
|
|
336
|
+
/* Executing media matcher init */
|
|
337
|
+
super.OnInit();
|
|
338
|
+
}
|
|
339
|
+
|
|
340
|
+
OnDestroy() {
|
|
341
|
+
this.clean();
|
|
342
|
+
/* Executing media matcher destroy */
|
|
343
|
+
super.OnDestroy();
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
OnUpdate() {
|
|
347
|
+
this.modify();
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
OnEnterMediaQuery([event, attribute]: EnterMediaQueryAttributes) {
|
|
351
|
+
console.log(event, attribute.value);
|
|
352
|
+
this.prevValue = this.value;
|
|
353
|
+
this.value = attribute.value ?? this.value;
|
|
354
|
+
this.modify();
|
|
355
|
+
}
|
|
356
|
+
|
|
357
|
+
OnExitMediaQuery([event, selector]: ExitMediaQueryAttributes) {
|
|
358
|
+
this.value = this.prevValue ?? this.originalValue;
|
|
359
|
+
this.modify();
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
clean() {
|
|
363
|
+
this.setStyles({ color: null })(this.element);
|
|
364
|
+
}
|
|
365
|
+
|
|
366
|
+
modify() {
|
|
367
|
+
this.setStyles({ color: this.value || null })(this.element);
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
```
|
|
371
|
+
|
|
372
|
+
##### Usage
|
|
373
|
+
|
|
374
|
+
```html
|
|
375
|
+
<div color="red" color.xs="green" color.md="gray">
|
|
376
|
+
My text
|
|
377
|
+
</div>
|
|
378
|
+
```
|
|
379
|
+
|
|
380
|
+
##### Available breakpoints
|
|
381
|
+
|
|
382
|
+
| Breakpoint | Media Query |
|
|
383
|
+
| ---------- | ------------------------------------------------------ |
|
|
384
|
+
| xs | screen and (max-width: 599px) |
|
|
385
|
+
| sm | screen and (min-width: 600px) and (max-width: 959px) |
|
|
386
|
+
| md | screen and (min-width: 960px) and (max-width: 1279px) |
|
|
387
|
+
| lg | screen and (min-width: 1280px) and (max-width: 1919px) |
|
|
388
|
+
| xl | screen and (min-width: 1920px) and (max-width: 5000px) |
|
|
389
|
+
| | |
|
|
390
|
+
| lt-sm | screen and (max-width: 599px) (use xs) |
|
|
391
|
+
| lt-md | screen and (max-width: 959px) |
|
|
392
|
+
| lt-lg | screen and (max-width: 1279px) |
|
|
393
|
+
| lt-xl | screen and (max-width: 1919px) |
|
|
394
|
+
| | |
|
|
395
|
+
| gt-xs | screen and (min-width: 600px) |
|
|
396
|
+
| gt-sm | screen and (min-width: 960px) |
|
|
397
|
+
| gt-md | screen and (min-width: 1280px) |
|
|
398
|
+
| gt-lg | screen and (min-width: 1920px) |
|
package/dist/index.d.ts
CHANGED
|
@@ -23,7 +23,16 @@ export declare const Input: (options?: InputOptions) => (target: any, memberName
|
|
|
23
23
|
* Accepts parameter options with selector and registry
|
|
24
24
|
*/
|
|
25
25
|
export declare const Modifier: (options: ModifierOptions) => (target: Function) => void;
|
|
26
|
+
/**
|
|
27
|
+
* Decorator @CustomAttribute
|
|
28
|
+
* Accepts parameter options with selector and registry
|
|
29
|
+
*/
|
|
26
30
|
export declare const CustomAttribute: (options: ModifierOptions) => (target: Function) => void;
|
|
31
|
+
/**
|
|
32
|
+
* Decorator @Directive
|
|
33
|
+
* Accepts parameter options with selector and registry
|
|
34
|
+
*/
|
|
35
|
+
export declare const Directive: (options: ModifierOptions) => (target: Function) => void;
|
|
27
36
|
export declare abstract class Attribute<T = {}> {
|
|
28
37
|
static options: ModifierOptions;
|
|
29
38
|
element?: HTMLElement;
|
|
@@ -36,6 +45,31 @@ export declare abstract class Attribute<T = {}> {
|
|
|
36
45
|
OnUpdate(_oldValue: string, _newValue: string): void;
|
|
37
46
|
OnUpdateAttribute(_name: string, _value: string): void;
|
|
38
47
|
}
|
|
48
|
+
/**
|
|
49
|
+
* Media query Attribute
|
|
50
|
+
* for performance reasons it is key value pair
|
|
51
|
+
*/
|
|
52
|
+
export declare const MediaMatchers: Map<string, string>;
|
|
53
|
+
declare type MediaEvent = MediaQueryList | MediaQueryListEvent;
|
|
54
|
+
export declare type EnterMediaQueryAttributes = [MediaEvent, Attr];
|
|
55
|
+
export declare type ExitMediaQueryAttributes = [MediaEvent, string];
|
|
56
|
+
export interface OnUpdateMediaQuery {
|
|
57
|
+
OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
|
|
58
|
+
OnExitMediaQuery(tuple: [MediaEvent, string]): void;
|
|
59
|
+
}
|
|
60
|
+
export declare const Breakpoints: string[];
|
|
61
|
+
export declare const createFiltersFromSelector: (selector: string) => string[];
|
|
62
|
+
export declare abstract class MediaQueryAttribute<T> extends Attribute<T> implements OnUpdateMediaQuery {
|
|
63
|
+
prevValue: string;
|
|
64
|
+
originalValue: string;
|
|
65
|
+
private matchers;
|
|
66
|
+
private cachedAttributes;
|
|
67
|
+
listener: (event: MediaQueryList | MediaQueryListEvent) => void;
|
|
68
|
+
OnInit(): void;
|
|
69
|
+
OnDestroy(): void;
|
|
70
|
+
abstract OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
|
|
71
|
+
abstract OnExitMediaQuery(tuple: [MediaEvent, string]): void;
|
|
72
|
+
}
|
|
39
73
|
export declare class CustomAttributeRegistry {
|
|
40
74
|
private parent;
|
|
41
75
|
private _attrMap;
|
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.CustomAttributeRegistry = exports.Attribute = exports.CustomAttribute = exports.Modifier = exports.Input = void 0;
|
|
3
|
+
exports.CustomAttributeRegistry = exports.MediaQueryAttribute = exports.createFiltersFromSelector = exports.Breakpoints = exports.MediaMatchers = exports.Attribute = exports.Directive = exports.CustomAttribute = exports.Modifier = exports.Input = void 0;
|
|
4
4
|
const noop = function () {
|
|
5
5
|
/* */
|
|
6
6
|
};
|
|
@@ -70,8 +70,17 @@ exports.Modifier = (options) => {
|
|
|
70
70
|
target['options'] = options;
|
|
71
71
|
};
|
|
72
72
|
};
|
|
73
|
-
|
|
73
|
+
/**
|
|
74
|
+
* Decorator @CustomAttribute
|
|
75
|
+
* Accepts parameter options with selector and registry
|
|
76
|
+
*/
|
|
74
77
|
exports.CustomAttribute = exports.Modifier;
|
|
78
|
+
/**
|
|
79
|
+
* Decorator @Directive
|
|
80
|
+
* Accepts parameter options with selector and registry
|
|
81
|
+
*/
|
|
82
|
+
exports.Directive = exports.Modifier;
|
|
83
|
+
/* */
|
|
75
84
|
class Attribute {
|
|
76
85
|
setStyles(keys) {
|
|
77
86
|
return (div) => {
|
|
@@ -96,11 +105,76 @@ class Attribute {
|
|
|
96
105
|
}
|
|
97
106
|
}
|
|
98
107
|
exports.Attribute = Attribute;
|
|
108
|
+
/**
|
|
109
|
+
* Media query Attribute
|
|
110
|
+
* for performance reasons it is key value pair
|
|
111
|
+
*/
|
|
112
|
+
exports.MediaMatchers = new Map([
|
|
113
|
+
['screen and (max-width: 599px)', 'xs'],
|
|
114
|
+
['screen and (min-width: 600px) and (max-width: 959px)', 'sm'],
|
|
115
|
+
['screen and (min-width: 960px) and (max-width: 1279px)', 'md'],
|
|
116
|
+
['screen and (min-width: 1280px) and (max-width: 1919px)', 'lg'],
|
|
117
|
+
['screen and (min-width: 1920px) and (max-width: 5000px)', 'xl'],
|
|
118
|
+
['screen and (max-width: 959px)', 'lt-md'],
|
|
119
|
+
['screen and (max-width: 1279px)', 'lt-lg'],
|
|
120
|
+
['screen and (max-width: 1919px)', 'lt-xl'],
|
|
121
|
+
['screen and (min-width: 600px)', 'gt-xs'],
|
|
122
|
+
['screen and (min-width: 960px)', 'gt-sm'],
|
|
123
|
+
['screen and (min-width: 1280px)', 'gt-md'],
|
|
124
|
+
['screen and (min-width: 1920px)', 'gt-lg']
|
|
125
|
+
]);
|
|
126
|
+
exports.Breakpoints = [...exports.MediaMatchers.values()];
|
|
127
|
+
exports.createFiltersFromSelector = (selector) => [
|
|
128
|
+
...exports.Breakpoints.map(breakpoint => `${selector}.${breakpoint}`),
|
|
129
|
+
selector
|
|
130
|
+
];
|
|
131
|
+
class MediaQueryAttribute extends Attribute {
|
|
132
|
+
constructor() {
|
|
133
|
+
super(...arguments);
|
|
134
|
+
this.matchers = new Map();
|
|
135
|
+
this.cachedAttributes = new Map();
|
|
136
|
+
this.listener = (event) => {
|
|
137
|
+
const key = `${this.selector.toLowerCase()}.${exports.MediaMatchers.get(event.media)}`;
|
|
138
|
+
const attribute = this.cachedAttributes.get(key);
|
|
139
|
+
if (event.matches && attribute) {
|
|
140
|
+
return this.OnEnterMediaQuery([event, attribute]);
|
|
141
|
+
}
|
|
142
|
+
return this.OnExitMediaQuery([event, key]);
|
|
143
|
+
};
|
|
144
|
+
}
|
|
145
|
+
OnInit() {
|
|
146
|
+
if (this.OnEnterMediaQuery || this.OnExitMediaQuery) {
|
|
147
|
+
this.originalValue = this.value;
|
|
148
|
+
for (const query of exports.MediaMatchers.keys()) {
|
|
149
|
+
const matcher = window.matchMedia(query);
|
|
150
|
+
const attr = Object.values(this.element.attributes).find(v => v.name ===
|
|
151
|
+
`${this.selector.toLowerCase()}.${exports.MediaMatchers.get(query)}`);
|
|
152
|
+
if (attr) {
|
|
153
|
+
this.cachedAttributes.set(attr.name, attr);
|
|
154
|
+
matcher.addEventListener('change', this.listener);
|
|
155
|
+
}
|
|
156
|
+
if (attr && matcher.matches) {
|
|
157
|
+
this.listener(matcher);
|
|
158
|
+
}
|
|
159
|
+
this.matchers.set(matcher, matcher);
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
OnDestroy() {
|
|
164
|
+
for (const matcher of this.matchers.values()) {
|
|
165
|
+
matcher.removeEventListener('change', this.listener);
|
|
166
|
+
}
|
|
167
|
+
this.cachedAttributes.clear();
|
|
168
|
+
this.matchers.clear();
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
exports.MediaQueryAttribute = MediaQueryAttribute;
|
|
172
|
+
/* Media query Attribute END */
|
|
99
173
|
class CustomAttributeRegistry {
|
|
100
174
|
constructor(parent) {
|
|
101
175
|
this.parent = parent;
|
|
102
176
|
this._attrMap = new Map();
|
|
103
|
-
this._elementMap = new
|
|
177
|
+
this._elementMap = new Map();
|
|
104
178
|
if (!parent) {
|
|
105
179
|
throw new Error('Must be given a parent element');
|
|
106
180
|
}
|
|
@@ -149,6 +223,15 @@ class CustomAttributeRegistry {
|
|
|
149
223
|
unsubscribe() {
|
|
150
224
|
var _a;
|
|
151
225
|
(_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
226
|
+
const values = [...this._elementMap.values()];
|
|
227
|
+
for (const elModifiers of values) {
|
|
228
|
+
const modifiers = [...elModifiers.values()];
|
|
229
|
+
for (const modifier of modifiers) {
|
|
230
|
+
modifier.OnDestroy();
|
|
231
|
+
}
|
|
232
|
+
elModifiers.clear();
|
|
233
|
+
}
|
|
234
|
+
this._elementMap.clear();
|
|
152
235
|
}
|
|
153
236
|
upgradeAttribute(attrName, doc) {
|
|
154
237
|
const parent = doc || this.parent;
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAMA,MAAM,IAAI,GAAG;IACX,MAAM;AACR,CAAC,CAAC;AAeF,MAAM,OAAO,GAAG,CAAC,MAAe,EAAE,UAAkB,EAAE,EAAE;IACtD,MAAM,SAAS,GAAG,MAAM,CAAC,WAAW,CAAC,SAAS,CAAC;IAC/C,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC;IACxC,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS,IAAI,IAAI,CAAC;IAC9C,MAAM,iBAAiB,GAAG,SAAS,CAAC,iBAAiB,IAAI,IAAI,CAAC;IAE9D,IAAI,QAA0B,CAAC;IAC/B,SAAS,CAAC,MAAM,GAAG;;QACjB,MAAM,OAAO,SAAG,IAAI,CAAC,OAAO,mCAAI,IAAI,CAAC;QACrC,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,UAAU,EAAE,CAAC;SACvB;QACD,QAAQ,GAAG,IAAI,gBAAgB,CAAC,GAAG,EAAE;YACnC,iBAAiB,CAAC,IAAI,CACpB,IAAI,EACJ,UAAU,EACV,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,CACjC,CAAC;YACF,MAAM,CAAC,UAAU,CAAC,GAAG,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC;QACxD,CAAC,CAAC,CAAC;QACH,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE;YACxB,eAAe,EAAE,CAAC,UAAU,CAAC;YAC7B,UAAU,EAAE,IAAI;SACjB,CAAC,CAAC;QACH,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC,CAAC;IACF,SAAS,CAAC,SAAS,GAAG;QACpB,QAAQ,CAAC,UAAU,EAAE,CAAC;QACtB,OAAO,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF;;;GAGG;AACU,QAAA,KAAK,GAAG,CAAC,OAAsB,EAAE,EAAE,CAAC,CAC/C,MAAM,EACN,UAAkB,EAClB,EAAE;IACF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,IAAI,IAAI,CAAC;IACrC,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,QAAQ,EAAE;QACtC,KAAK;;YACH,IAAI,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC;YAErC,MAAM,OAAO,SAAG,IAAI,CAAC,OAAO,mCAAI,IAAI,CAAC;YACrC,MAAM,CAAC,cAAc,CAAC,IAAI,EAAE,UAAU,EAAE;gBACtC,GAAG,EAAE;oBACH,aAAa,GAAG,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC,CAAC;oBAC/D,OAAO,aAAa,CAAC;gBACvB,CAAC;gBACD,GAAG,CAAC,KAAK;oBACP,OAAO,CAAC,YAAY,CAAC,UAAU,CAAC,WAAW,EAAE,EAAE,KAAK,CAAC,CAAC;oBACtD,aAAa,GAAG,KAAK,CAAC;gBACxB,CAAC;gBACD,YAAY,EAAE,IAAI;aACnB,CAAC,CAAC;YACH,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC;QACD,YAAY,EAAE,IAAI;KACnB,CAAC,CAAC;IAEH,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,EAAE;QACpB,OAAO,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;KAC7B;AACH,CAAC,CAAC;AAEF;;;GAGG;AACU,QAAA,QAAQ,GAAG,CAAC,OAAwB,EAAE,EAAE;IACnD,OAAO,CAAC,MAAgB,EAAE,EAAE;QAC1B,MAAM,CAAC,SAAS,CAAC,GAAG,OAAO,CAAC;IAC9B,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/src/index.ts
CHANGED
|
@@ -98,9 +98,18 @@ export const Modifier = (options: ModifierOptions) => {
|
|
|
98
98
|
};
|
|
99
99
|
};
|
|
100
100
|
|
|
101
|
-
|
|
101
|
+
/**
|
|
102
|
+
* Decorator @CustomAttribute
|
|
103
|
+
* Accepts parameter options with selector and registry
|
|
104
|
+
*/
|
|
102
105
|
export const CustomAttribute = Modifier;
|
|
106
|
+
/**
|
|
107
|
+
* Decorator @Directive
|
|
108
|
+
* Accepts parameter options with selector and registry
|
|
109
|
+
*/
|
|
110
|
+
export const Directive = Modifier;
|
|
103
111
|
|
|
112
|
+
/* */
|
|
104
113
|
export abstract class Attribute<T = {}> {
|
|
105
114
|
public static options: ModifierOptions;
|
|
106
115
|
public element?: HTMLElement;
|
|
@@ -130,12 +139,102 @@ export abstract class Attribute<T = {}> {
|
|
|
130
139
|
}
|
|
131
140
|
}
|
|
132
141
|
|
|
142
|
+
/**
|
|
143
|
+
* Media query Attribute
|
|
144
|
+
* for performance reasons it is key value pair
|
|
145
|
+
*/
|
|
146
|
+
export const MediaMatchers = new Map([
|
|
147
|
+
['screen and (max-width: 599px)', 'xs'],
|
|
148
|
+
['screen and (min-width: 600px) and (max-width: 959px)', 'sm'],
|
|
149
|
+
['screen and (min-width: 960px) and (max-width: 1279px)', 'md'],
|
|
150
|
+
['screen and (min-width: 1280px) and (max-width: 1919px)', 'lg'],
|
|
151
|
+
['screen and (min-width: 1920px) and (max-width: 5000px)', 'xl'],
|
|
152
|
+
['screen and (max-width: 959px)', 'lt-md'],
|
|
153
|
+
['screen and (max-width: 1279px)', 'lt-lg'],
|
|
154
|
+
['screen and (max-width: 1919px)', 'lt-xl'],
|
|
155
|
+
['screen and (min-width: 600px)', 'gt-xs'],
|
|
156
|
+
['screen and (min-width: 960px)', 'gt-sm'],
|
|
157
|
+
['screen and (min-width: 1280px)', 'gt-md'],
|
|
158
|
+
['screen and (min-width: 1920px)', 'gt-lg']
|
|
159
|
+
]);
|
|
160
|
+
type MediaEvent = MediaQueryList | MediaQueryListEvent;
|
|
161
|
+
export type EnterMediaQueryAttributes = [MediaEvent, Attr];
|
|
162
|
+
export type ExitMediaQueryAttributes = [MediaEvent, string];
|
|
163
|
+
|
|
164
|
+
export interface OnUpdateMediaQuery {
|
|
165
|
+
OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
|
|
166
|
+
OnExitMediaQuery(tuple: [MediaEvent, string]): void;
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
export const Breakpoints = [...MediaMatchers.values()];
|
|
170
|
+
|
|
171
|
+
export const createFiltersFromSelector = (selector: string) => [
|
|
172
|
+
...Breakpoints.map(breakpoint => `${selector}.${breakpoint}`),
|
|
173
|
+
selector
|
|
174
|
+
];
|
|
175
|
+
|
|
176
|
+
export abstract class MediaQueryAttribute<T> extends Attribute<T>
|
|
177
|
+
implements OnUpdateMediaQuery {
|
|
178
|
+
prevValue: string;
|
|
179
|
+
originalValue: string;
|
|
180
|
+
|
|
181
|
+
private matchers: Map<MediaQueryList, MediaQueryList> = new Map();
|
|
182
|
+
private cachedAttributes: Map<string, Attr> = new Map();
|
|
183
|
+
|
|
184
|
+
listener = (event: MediaQueryList | MediaQueryListEvent) => {
|
|
185
|
+
const key = `${this.selector.toLowerCase()}.${MediaMatchers.get(
|
|
186
|
+
event.media
|
|
187
|
+
)}`;
|
|
188
|
+
const attribute = this.cachedAttributes.get(key);
|
|
189
|
+
|
|
190
|
+
if (event.matches && attribute) {
|
|
191
|
+
return this.OnEnterMediaQuery([event, attribute]);
|
|
192
|
+
}
|
|
193
|
+
return this.OnExitMediaQuery([event, key]);
|
|
194
|
+
};
|
|
195
|
+
|
|
196
|
+
OnInit() {
|
|
197
|
+
if (this.OnEnterMediaQuery || this.OnExitMediaQuery) {
|
|
198
|
+
this.originalValue = this.value;
|
|
199
|
+
for (const query of MediaMatchers.keys()) {
|
|
200
|
+
const matcher = window.matchMedia(query);
|
|
201
|
+
|
|
202
|
+
const attr = Object.values(this.element.attributes).find(
|
|
203
|
+
v =>
|
|
204
|
+
v.name ===
|
|
205
|
+
`${this.selector.toLowerCase()}.${MediaMatchers.get(query)}`
|
|
206
|
+
);
|
|
207
|
+
|
|
208
|
+
if (attr) {
|
|
209
|
+
this.cachedAttributes.set(attr.name, attr);
|
|
210
|
+
matcher.addEventListener('change', this.listener);
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
if (attr && matcher.matches) {
|
|
214
|
+
this.listener(matcher);
|
|
215
|
+
}
|
|
216
|
+
this.matchers.set(matcher, matcher);
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
OnDestroy() {
|
|
222
|
+
for (const matcher of this.matchers.values()) {
|
|
223
|
+
matcher.removeEventListener('change', this.listener);
|
|
224
|
+
}
|
|
225
|
+
this.cachedAttributes.clear();
|
|
226
|
+
this.matchers.clear();
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
abstract OnEnterMediaQuery(tuple: [MediaEvent, Attr]): void;
|
|
230
|
+
abstract OnExitMediaQuery(tuple: [MediaEvent, string]): void;
|
|
231
|
+
}
|
|
232
|
+
|
|
233
|
+
/* Media query Attribute END */
|
|
234
|
+
|
|
133
235
|
export class CustomAttributeRegistry {
|
|
134
236
|
private _attrMap: Map<string, Constructor<Attribute>> = new Map();
|
|
135
|
-
private _elementMap:
|
|
136
|
-
HTMLElement,
|
|
137
|
-
Map<string, Attribute>
|
|
138
|
-
> = new WeakMap();
|
|
237
|
+
private _elementMap: Map<HTMLElement, Map<string, Attribute>> = new Map();
|
|
139
238
|
private observer: MutationObserver;
|
|
140
239
|
|
|
141
240
|
constructor(private parent: HTMLElement) {
|
|
@@ -192,6 +291,15 @@ export class CustomAttributeRegistry {
|
|
|
192
291
|
|
|
193
292
|
unsubscribe() {
|
|
194
293
|
this.observer?.disconnect();
|
|
294
|
+
const values = [...this._elementMap.values()];
|
|
295
|
+
for (const elModifiers of values) {
|
|
296
|
+
const modifiers = [...elModifiers.values()];
|
|
297
|
+
for (const modifier of modifiers) {
|
|
298
|
+
modifier.OnDestroy();
|
|
299
|
+
}
|
|
300
|
+
elModifiers.clear();
|
|
301
|
+
}
|
|
302
|
+
this._elementMap.clear();
|
|
195
303
|
}
|
|
196
304
|
|
|
197
305
|
private upgradeAttribute(attrName: string, doc?: HTMLElement) {
|