@eva/plugin-a11y 1.2.7 → 1.2.8-fix.1

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.
Files changed (2) hide show
  1. package/package.json +3 -3
  2. package/dist/miniprogram.js +0 -631
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eva/plugin-a11y",
3
- "version": "1.2.7",
3
+ "version": "1.2.8-fix.1",
4
4
  "description": "@eva/plugin-a11y",
5
5
  "main": "index.js",
6
6
  "module": "dist/plugin-a11y.esm.js",
@@ -18,9 +18,9 @@
18
18
  "license": "MIT",
19
19
  "homepage": "https://eva.js.org",
20
20
  "dependencies": {
21
- "@eva/eva.js": "1.2.7",
21
+ "@eva/eva.js": "1.2.8-fix.1",
22
22
  "@eva/inspector-decorator": "^0.0.5",
23
- "@eva/plugin-renderer": "1.2.7",
23
+ "@eva/plugin-renderer": "1.2.8-fix.1",
24
24
  "eventemitter3": "^3.1.2"
25
25
  }
26
26
  }
@@ -1,631 +0,0 @@
1
- function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
-
3
- import { documentAlias, windowAlias } from '@eva/miniprogram-adapter';
4
- import { __extends, __decorate, __awaiter, __generator, __values, __assign } from 'tslib';
5
- import { Component, OBSERVER_TYPE, decorators, System } from '@eva/eva.js/dist/miniprogram';
6
- import { RendererSystem } from '@eva/plugin-renderer/dist/miniprogram';
7
- import { type, step } from '@eva/inspector-decorator';
8
-
9
- function uuid(len) {
10
- var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
11
- var uuid = [];
12
- var radix = chars.length;
13
-
14
- for (var i = 0; i < len; i++) {
15
- uuid[i] = chars[0 | Math.random() * radix];
16
- }
17
-
18
- return uuid.join('');
19
- }
20
-
21
- var setStyle = function setStyle(element, style) {
22
- var width = style.width,
23
- height = style.height,
24
- position = style.position,
25
- _a = style.left,
26
- left = _a === void 0 ? 0 : _a,
27
- _b = style.top,
28
- top = _b === void 0 ? 0 : _b,
29
- zIndex = style.zIndex,
30
- pointerEvents = style.pointerEvents,
31
- background = style.background;
32
- element.style.width = width + "px";
33
- element.style.height = height + "px";
34
- element.style.position = position;
35
- element.style.left = "" + left;
36
- element.style.top = "" + top;
37
- element.style.zIndex = "" + zIndex;
38
- element.style.pointerEvents = pointerEvents;
39
- element.style.background = background;
40
- element.style.border = 'none';
41
- element.style.overflow = 'hidden';
42
- };
43
-
44
- var setTransform = function setTransform(element, transform, ratioX, ratioY) {
45
- var worldTransform = transform.worldTransform;
46
- var a = worldTransform.a,
47
- b = worldTransform.b,
48
- c = worldTransform.c,
49
- d = worldTransform.d,
50
- tx = worldTransform.tx,
51
- ty = worldTransform.ty;
52
- var matrix = "matrix(" + a + ", " + b + ", " + c + ", " + d + ", " + tx * ratioX + ", " + ty * ratioY + ")";
53
- element.style.transform = "" + matrix;
54
- element.style.webkitTransform = "" + matrix;
55
- element.style.transformOrigin = 'left top';
56
- element.style.webkitTransformOrigin = 'left top';
57
- };
58
-
59
- var A11y = function (_super) {
60
- __extends(A11y, _super);
61
-
62
- function A11y(param) {
63
- var _this = _super.call(this) || this;
64
-
65
- _extends(_this, param);
66
-
67
- var _a = param.hint,
68
- hint = _a === void 0 ? '' : _a,
69
- event = param.event,
70
- _b = param.delay,
71
- delay = _b === void 0 ? 0 : _b,
72
- _c = param.attr,
73
- attr = _c === void 0 ? {} : _c,
74
- _d = param.role,
75
- role = _d === void 0 ? '' : _d,
76
- _e = param.props,
77
- props = _e === void 0 ? {} : _e,
78
- _f = param.state,
79
- state = _f === void 0 ? {} : _f;
80
- _this.hint = hint;
81
- _this.event = event;
82
- _this.delay = delay;
83
- _this.attr = attr;
84
- _this.role = role;
85
- _this.props = props;
86
- _this.state = state;
87
- _this.a11yId = "_" + uuid(6);
88
- return _this;
89
- }
90
-
91
- A11y.componentName = 'A11y';
92
-
93
- __decorate([type('boolean')], A11y.prototype, "interactive", void 0);
94
-
95
- __decorate([type('string')], A11y.prototype, "hint", void 0);
96
-
97
- __decorate([type('number'), step(1)], A11y.prototype, "delay", void 0);
98
-
99
- __decorate([type('string')], A11y.prototype, "role", void 0);
100
-
101
- __decorate([type('string')], A11y.prototype, "a11yId", void 0);
102
-
103
- return A11y;
104
- }(Component);
105
-
106
- var A11y$1 = A11y;
107
- var POSITION = 'absolute';
108
- var ZINDEX = 3;
109
- var A11yActivate;
110
-
111
- (function (A11yActivate) {
112
- A11yActivate[A11yActivate["ENABLE"] = 0] = "ENABLE";
113
- A11yActivate[A11yActivate["DISABLE"] = 1] = "DISABLE";
114
- A11yActivate[A11yActivate["CHECK"] = 2] = "CHECK";
115
- })(A11yActivate || (A11yActivate = {}));
116
-
117
- var PointerEvents;
118
-
119
- (function (PointerEvents) {
120
- PointerEvents["NONE"] = "none";
121
- PointerEvents["AUTO"] = "auto";
122
- })(PointerEvents || (PointerEvents = {}));
123
-
124
- var MaskBackground;
125
-
126
- (function (MaskBackground) {
127
- MaskBackground["DEBUG"] = "rgba(255,0,0,0.5)";
128
- MaskBackground["NONE"] = "transparent";
129
- })(MaskBackground || (MaskBackground = {}));
130
-
131
- var ElementType;
132
-
133
- (function (ElementType) {
134
- ElementType["BUTTON"] = "button";
135
- ElementType["DIV"] = "div";
136
- })(ElementType || (ElementType = {}));
137
-
138
- var notAttr = ['hint', 'event', 'delay', 'attr', 'role', 'props', 'state', 'a11yId', 'name'];
139
-
140
- var getEventFunc = function getEventFunc(event, gameObject, e) {
141
- var _this = this;
142
-
143
- ['touchstart', 'touchend', 'tap'].forEach(function (name) {
144
- event.emit(name, {
145
- stopPropagation: function stopPropagation() {
146
- return e.stopPropagation();
147
- },
148
- data: {
149
- position: _this.eventPosition
150
- },
151
- gameObject: gameObject
152
- });
153
- });
154
- };
155
-
156
- var A11ySystem = function (_super) {
157
- __extends(A11ySystem, _super);
158
-
159
- function A11ySystem(opt) {
160
- var _this = _super.call(this, opt) || this;
161
-
162
- _this.cache = new Map();
163
- _this.eventCache = new Map();
164
- _this.zIndex = ZINDEX;
165
- return _this;
166
- }
167
-
168
- Object.defineProperty(A11ySystem.prototype, "ratioX", {
169
- get: function get() {
170
- if (this._ratioX) {
171
- return this._ratioX;
172
- } else {
173
- var success = this.setRatio();
174
-
175
- if (success) {
176
- return this._ratioX;
177
- } else {
178
- return 0;
179
- }
180
- }
181
- },
182
- enumerable: false,
183
- configurable: true
184
- });
185
- Object.defineProperty(A11ySystem.prototype, "ratioY", {
186
- get: function get() {
187
- if (this._ratioY) {
188
- return this._ratioY;
189
- } else {
190
- var success = this.setRatio();
191
-
192
- if (success) {
193
- return this._ratioY;
194
- } else {
195
- return 0;
196
- }
197
- }
198
- },
199
- enumerable: false,
200
- configurable: true
201
- });
202
-
203
- A11ySystem.prototype.init = function (opt) {
204
- if (opt === void 0) {
205
- opt = {};
206
- }
207
-
208
- return __awaiter(this, void 0, void 0, function () {
209
- var _a, activate, _b, delay, _c, checkA11yOpen, zIndex, _d, _e, div;
210
-
211
- return __generator(this, function (_f) {
212
- switch (_f.label) {
213
- case 0:
214
- _a = opt.activate, activate = _a === void 0 ? A11yActivate.CHECK : _a, _b = opt.delay, delay = _b === void 0 ? 100 : _b, _c = opt.checkA11yOpen, checkA11yOpen = _c === void 0 ? function () {
215
- return Promise.resolve(false);
216
- } : _c, zIndex = opt.zIndex;
217
- this.delay = delay;
218
- this.zIndex = zIndex || this.zIndex;
219
- _d = activate;
220
-
221
- switch (_d) {
222
- case A11yActivate.CHECK:
223
- return [3, 1];
224
-
225
- case A11yActivate.DISABLE:
226
- return [3, 5];
227
-
228
- case A11yActivate.ENABLE:
229
- return [3, 6];
230
- }
231
-
232
- return [3, 7];
233
-
234
- case 1:
235
- _f.trys.push([1, 3,, 4]);
236
-
237
- _e = this;
238
- return [4, checkA11yOpen()];
239
-
240
- case 2:
241
- _e.activate = _f.sent();
242
- return [3, 4];
243
-
244
- case 3:
245
- _f.sent();
246
-
247
- this.activate = false;
248
- return [3, 4];
249
-
250
- case 4:
251
- return [3, 7];
252
-
253
- case 5:
254
- this.activate = false;
255
- return [3, 7];
256
-
257
- case 6:
258
- this.activate = true;
259
- return [3, 7];
260
-
261
- case 7:
262
- this.debug = opt.debug || false;
263
-
264
- if (this.debug) {
265
- this.activate = true;
266
- }
267
-
268
- if (!this.activate) return [2];
269
- div = documentAlias.createElement('div');
270
- this.div = div;
271
-
272
- if (this.game.canvas.parentNode) {
273
- this.game.canvas.parentNode.insertBefore(this.div, this.game.canvas);
274
- }
275
-
276
- return [2];
277
- }
278
- });
279
- });
280
- };
281
-
282
- A11ySystem.prototype.setRatio = function () {
283
- var _a = this.getCanvasBoundingClientRect(),
284
- width = _a.width,
285
- height = _a.height;
286
-
287
- var _b = this.getRenderRect(),
288
- renderWidth = _b.renderWidth,
289
- renderHeight = _b.renderHeight;
290
-
291
- this._ratioX = width / renderWidth;
292
- this._ratioY = height / renderHeight;
293
-
294
- if (width || height) {
295
- this.initDiv();
296
- return true;
297
- } else {
298
- return false;
299
- }
300
- };
301
-
302
- A11ySystem.prototype.getRenderRect = function () {
303
- var _a = this.game.getSystem(RendererSystem).params,
304
- params = _a === void 0 ? {
305
- width: 300,
306
- height: 300
307
- } : _a;
308
- var renderHeight = params.height,
309
- renderWidth = params.width;
310
- return {
311
- renderWidth: renderWidth,
312
- renderHeight: renderHeight
313
- };
314
- };
315
-
316
- A11ySystem.prototype.getCanvasBoundingClientRect = function () {
317
- var _a = this.game.canvas.getBoundingClientRect(),
318
- width = _a.width,
319
- height = _a.height,
320
- left = _a.left,
321
- top = _a.top;
322
-
323
- return {
324
- width: width,
325
- height: height,
326
- left: left,
327
- top: top
328
- };
329
- };
330
-
331
- A11ySystem.prototype.initDiv = function () {
332
- var _this = this;
333
-
334
- var pageXOffset = windowAlias.pageXOffset,
335
- pageYOffset = windowAlias.pageYOffset;
336
-
337
- var _a = this.getCanvasBoundingClientRect(),
338
- width = _a.width,
339
- height = _a.height,
340
- left = _a.left,
341
- top = _a.top;
342
-
343
- var style = {
344
- width: width,
345
- height: height,
346
- left: left + pageXOffset + "px",
347
- top: top + pageYOffset + "px",
348
- position: POSITION,
349
- zIndex: this.zIndex,
350
- pointerEvents: PointerEvents.NONE,
351
- background: MaskBackground.NONE
352
- };
353
- setStyle(this.div, style);
354
- this.div.addEventListener('click', function (e) {
355
- var currentTarget = e.currentTarget;
356
-
357
- var _a = currentTarget.getBoundingClientRect(),
358
- left = _a.left,
359
- top = _a.top;
360
-
361
- var x = (e.pageX - left) / _this.ratioX;
362
- var y = (e.pageY - top) / _this.ratioY;
363
- _this.eventPosition = {
364
- x: x,
365
- y: y
366
- };
367
- }, true);
368
- };
369
-
370
- A11ySystem.prototype.update = function () {
371
- return __awaiter(this, void 0, void 0, function () {
372
- var changes, changes_1, changes_1_1, changed;
373
-
374
- var e_1, _a;
375
-
376
- return __generator(this, function (_b) {
377
- changes = this.componentObserver.clear();
378
-
379
- if (!this.activate) {
380
- return [2];
381
- }
382
-
383
- try {
384
- for (changes_1 = __values(changes), changes_1_1 = changes_1.next(); !changes_1_1.done; changes_1_1 = changes_1.next()) {
385
- changed = changes_1_1.value;
386
-
387
- switch (changed.type) {
388
- case OBSERVER_TYPE.ADD:
389
- changed.componentName === 'Event' && this.addEvent(changed.gameObject);
390
- changed.componentName === 'A11y' && this.add(changed);
391
- break;
392
-
393
- case OBSERVER_TYPE.CHANGE:
394
- changed.componentName === 'Transform' && this.transformChange(changed);
395
- changed.componentName === 'A11y' && this.change(changed);
396
- break;
397
-
398
- case OBSERVER_TYPE.REMOVE:
399
- changed.componentName === 'Event' && this.removeEvent(changed);
400
- changed.componentName === 'A11y' && this.remove(changed);
401
- }
402
- }
403
- } catch (e_1_1) {
404
- e_1 = {
405
- error: e_1_1
406
- };
407
- } finally {
408
- try {
409
- if (changes_1_1 && !changes_1_1.done && (_a = changes_1.return)) _a.call(changes_1);
410
- } finally {
411
- if (e_1) throw e_1.error;
412
- }
413
- }
414
-
415
- return [2];
416
- });
417
- });
418
- };
419
-
420
- A11ySystem.prototype.change = function (changed) {
421
- var component = changed.component;
422
-
423
- if (changed.prop.prop[0] === 'hint') {
424
- var dom = this.cache.get(component.a11yId);
425
- dom === null || dom === void 0 ? void 0 : dom.setAttribute('aria-label', component.hint);
426
- dom && this.setPosition(dom, changed.gameObject.transform);
427
- }
428
- };
429
-
430
- A11ySystem.prototype.remove = function (changed) {
431
- var component = changed.component;
432
- if (!component) return;
433
- var a11yId = component.a11yId;
434
- var element = this.div.querySelector("#" + a11yId);
435
- element && this.div.removeChild(element);
436
- this.cache.delete(a11yId);
437
- };
438
-
439
- A11ySystem.prototype.add = function (changed) {
440
- var _this = this;
441
-
442
- if (!this.activate) return;
443
- var component = changed.component;
444
- var gameObject = changed.gameObject;
445
- var delay = component.delay,
446
- id = component.a11yId;
447
- var event = component.event;
448
- if (!gameObject) return;
449
- var transform = gameObject.transform;
450
- if (!transform) return;
451
- var element = documentAlias.createElement('div');
452
- this.cache.set(id, element);
453
-
454
- if (!event) {
455
- event = gameObject.getComponent('Event');
456
- }
457
-
458
- setTimeout(function () {
459
- _this.setPosition(element, transform);
460
-
461
- _this.setA11yAttr(element, component);
462
-
463
- if (event) {
464
- _this.addEvent(gameObject);
465
- }
466
-
467
- if (gameObject.scene) {
468
- _this.div.appendChild(element);
469
- }
470
- }, delay || this.delay);
471
- };
472
-
473
- A11ySystem.prototype.transformChange = function (changed) {
474
- var component = changed.component;
475
- var gameObject = changed.gameObject;
476
- var a11yComponent = gameObject.getComponent(A11y$1);
477
- if (!a11yComponent) return;
478
- var a11yId = a11yComponent.a11yId;
479
-
480
- if (!component.inScene) {
481
- var dom = this.div.querySelector("#" + a11yId);
482
- dom && this.div.removeChild(dom);
483
- } else {
484
- if (this.cache.has(a11yId)) {
485
- var addDom = this.cache.get(a11yId);
486
- addDom && this.div.appendChild(addDom);
487
- }
488
- }
489
- };
490
-
491
- A11ySystem.prototype.setEvent = function (element, event, gameObject, id) {
492
- if (!event) {
493
- return;
494
- }
495
-
496
- var func = getEventFunc.bind(this, event, gameObject);
497
- this.eventCache.set(id, func);
498
- element.addEventListener('click', func);
499
- };
500
-
501
- A11ySystem.prototype.addEvent = function (gameObject) {
502
- var a11y = gameObject.getComponent(A11y$1);
503
- if (!a11y) return;
504
- var event = gameObject.getComponent('Event');
505
- if (!event) return;
506
- var element = this.cache.get(a11y.a11yId);
507
- element && this.setEvent(element, event, gameObject, a11y.a11yId);
508
- };
509
-
510
- A11ySystem.prototype.removeEvent = function (changed) {
511
- var gameObject = changed.gameObject;
512
- var a11y = gameObject.getComponent(A11y$1);
513
- if (!a11y) return;
514
- var event = changed.component;
515
- if (!event) return;
516
- var a11yId = a11y.a11yId;
517
- var func = this.eventCache.get(a11yId);
518
- var element = this.cache.get(a11yId);
519
- element && element.removeEventListener('click', func);
520
- };
521
-
522
- A11ySystem.prototype.setA11yAttr = function (element, component) {
523
- var e_2, _a, e_3, _b, e_4, _c;
524
-
525
- var hint = component.hint,
526
- _d = component.props,
527
- props = _d === void 0 ? {} : _d,
528
- _e = component.state,
529
- state = _e === void 0 ? {} : _e,
530
- role = component.role,
531
- id = component.a11yId;
532
- var realRole = role || 'text';
533
- element.setAttribute('role', realRole);
534
- element.setAttribute('aria-label', hint);
535
- element.id = id;
536
- var ariaProps = Object.keys(props);
537
-
538
- try {
539
- for (var ariaProps_1 = __values(ariaProps), ariaProps_1_1 = ariaProps_1.next(); !ariaProps_1_1.done; ariaProps_1_1 = ariaProps_1.next()) {
540
- var key = ariaProps_1_1.value;
541
- element.setAttribute(key, props[key]);
542
- }
543
- } catch (e_2_1) {
544
- e_2 = {
545
- error: e_2_1
546
- };
547
- } finally {
548
- try {
549
- if (ariaProps_1_1 && !ariaProps_1_1.done && (_a = ariaProps_1.return)) _a.call(ariaProps_1);
550
- } finally {
551
- if (e_2) throw e_2.error;
552
- }
553
- }
554
-
555
- var ariaState = Object.keys(state);
556
-
557
- try {
558
- for (var ariaState_1 = __values(ariaState), ariaState_1_1 = ariaState_1.next(); !ariaState_1_1.done; ariaState_1_1 = ariaState_1.next()) {
559
- var key = ariaState_1_1.value;
560
- element.setAttribute(key, state[key]);
561
- }
562
- } catch (e_3_1) {
563
- e_3 = {
564
- error: e_3_1
565
- };
566
- } finally {
567
- try {
568
- if (ariaState_1_1 && !ariaState_1_1.done && (_b = ariaState_1.return)) _b.call(ariaState_1);
569
- } finally {
570
- if (e_3) throw e_3.error;
571
- }
572
- }
573
-
574
- try {
575
- for (var _f = __values(Object.keys(component)), _g = _f.next(); !_g.done; _g = _f.next()) {
576
- var key = _g.value;
577
-
578
- if (typeof component[key] === 'string' && notAttr.indexOf(key) === -1 && key.indexOf('_') !== 1) {
579
- element.setAttribute(key, component[key]);
580
- }
581
- }
582
- } catch (e_4_1) {
583
- e_4 = {
584
- error: e_4_1
585
- };
586
- } finally {
587
- try {
588
- if (_g && !_g.done && (_c = _f.return)) _c.call(_f);
589
- } finally {
590
- if (e_4) throw e_4.error;
591
- }
592
- }
593
- };
594
-
595
- A11ySystem.prototype.setPosition = function (element, transform) {
596
- var _a = transform.size,
597
- width = _a.width,
598
- height = _a.height;
599
- var style = {
600
- width: width === 0 ? 1 : width * this.ratioX,
601
- height: height === 0 ? 1 : height * this.ratioY,
602
- position: POSITION,
603
- zIndex: this.zIndex,
604
- pointerEvents: PointerEvents.AUTO,
605
- background: this.debug ? MaskBackground.DEBUG : MaskBackground.NONE
606
- };
607
-
608
- var transformProps = __assign({}, transform);
609
-
610
- setStyle(element, style);
611
- setTransform(element, transformProps, this.ratioX, this.ratioY);
612
- };
613
-
614
- A11ySystem.prototype.onDestroy = function () {
615
- this.div.parentElement.removeChild(this.div);
616
- this.cache = null;
617
- this.eventCache = null;
618
- this.div = null;
619
- };
620
-
621
- A11ySystem.systemName = 'A11ySystem';
622
- A11ySystem = __decorate([decorators.componentObserver({
623
- A11y: ['hint'],
624
- Transform: ['inScene'],
625
- Event: []
626
- })], A11ySystem);
627
- return A11ySystem;
628
- }(System);
629
-
630
- var A11ySystem$1 = A11ySystem;
631
- export { A11y$1 as A11y, A11yActivate, A11ySystem$1 as A11ySystem };