@acorex/components 6.1.2 → 6.1.3

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 (40) hide show
  1. package/calendar/src/calendar.module.d.ts +2 -3
  2. package/esm2020/calendar/src/calendar.component.mjs +3 -4
  3. package/esm2020/calendar/src/calendar.module.mjs +3 -4
  4. package/esm2020/form/src/validation-rule.widget.mjs +4 -3
  5. package/esm2020/mixin/src/value-mixin.class.mjs +1 -2
  6. package/fesm2015/acorex-components-calendar.mjs +4 -6
  7. package/fesm2015/acorex-components-calendar.mjs.map +1 -1
  8. package/fesm2015/acorex-components-form.mjs +3 -2
  9. package/fesm2015/acorex-components-form.mjs.map +1 -1
  10. package/fesm2015/acorex-components-mixin.mjs +0 -1
  11. package/fesm2015/acorex-components-mixin.mjs.map +1 -1
  12. package/fesm2020/acorex-components-calendar.mjs +4 -6
  13. package/fesm2020/acorex-components-calendar.mjs.map +1 -1
  14. package/fesm2020/acorex-components-form.mjs +3 -2
  15. package/fesm2020/acorex-components-form.mjs.map +1 -1
  16. package/fesm2020/acorex-components-mixin.mjs +0 -1
  17. package/fesm2020/acorex-components-mixin.mjs.map +1 -1
  18. package/package.json +2 -22
  19. package/carousel/index.d.ts +0 -5
  20. package/carousel/public-api.d.ts +0 -7
  21. package/carousel/src/carousel-arrows.component.d.ts +0 -16
  22. package/carousel/src/carousel-item.component.d.ts +0 -8
  23. package/carousel/src/carousel-pager.component.d.ts +0 -22
  24. package/carousel/src/carousel-splidejs.class.d.ts +0 -18
  25. package/carousel/src/carousel.class.d.ts +0 -71
  26. package/carousel/src/carousel.component.d.ts +0 -111
  27. package/carousel/src/carousel.module.d.ts +0 -11
  28. package/esm2020/carousel/acorex-components-carousel.mjs +0 -5
  29. package/esm2020/carousel/public-api.mjs +0 -8
  30. package/esm2020/carousel/src/carousel-arrows.component.mjs +0 -80
  31. package/esm2020/carousel/src/carousel-item.component.mjs +0 -21
  32. package/esm2020/carousel/src/carousel-pager.component.mjs +0 -74
  33. package/esm2020/carousel/src/carousel-splidejs.class.mjs +0 -91
  34. package/esm2020/carousel/src/carousel.class.mjs +0 -10
  35. package/esm2020/carousel/src/carousel.component.mjs +0 -438
  36. package/esm2020/carousel/src/carousel.module.mjs +0 -24
  37. package/fesm2015/acorex-components-carousel.mjs +0 -726
  38. package/fesm2015/acorex-components-carousel.mjs.map +0 -1
  39. package/fesm2020/acorex-components-carousel.mjs +0 -722
  40. package/fesm2020/acorex-components-carousel.mjs.map +0 -1
@@ -1,722 +0,0 @@
1
- import * as i0 from '@angular/core';
2
- import { Injectable, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Output, Input, Optional, NgModule } from '@angular/core';
3
- import { AXBaseComponentMixin } from '@acorex/components/mixin';
4
- import { coerceNumberProperty, coerceBooleanProperty } from '@angular/cdk/coercion';
5
- import * as i2 from '@angular/common';
6
- import { CommonModule } from '@angular/common';
7
-
8
- class AXCarouselCore {
9
- }
10
- AXCarouselCore.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselCore, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
11
- AXCarouselCore.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselCore });
12
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselCore, decorators: [{
13
- type: Injectable
14
- }] });
15
-
16
- class AXCarouselSplideJS {
17
- constructor() {
18
- }
19
- mount(instance) {
20
- this._instance = instance;
21
- this._instance.host.classList.add('splide');
22
- this._instance.host.querySelector('.ax-carousel-list-container').classList.add('splide__track');
23
- const listElement = this._instance.host.querySelector('.ax-carousel-list');
24
- listElement?.classList.add('splide__list');
25
- //
26
- this.rebuild();
27
- this._instance.onItemsChanged.subscribe((items) => {
28
- items?.value?.forEach(i => i.classList.add('splide__slide'));
29
- this._ref.refresh();
30
- });
31
- this._instance.items = Array.from(listElement.querySelectorAll('ax-carousel-item'));
32
- this._instance.onOptionsChanged.subscribe(() => {
33
- this.rebuild();
34
- });
35
- }
36
- _emitOnSlideChanged(i) {
37
- const oldValue = this._instance.visibleIndex;
38
- this._instance.visibleIndex = i;
39
- this._instance.onSlideChanged.emit({
40
- component: this,
41
- htmlElement: this._instance.host,
42
- value: this._instance.visibleIndex,
43
- oldValue
44
- });
45
- }
46
- _getConfig() {
47
- return {
48
- autoplay: this._instance.autoplay,
49
- type: this._instance.loop && !this._instance.rewind ? 'loop' : 'slide',
50
- rewind: this._instance.rewind,
51
- gap: this._instance.gap,
52
- perPage: this._instance.perPage,
53
- perMove: this._instance.perMove,
54
- start: this._instance.visibleIndex,
55
- interval: this._instance.interval,
56
- direction: this._instance.vertical ? 'ttb' : (this._instance.rtl ? 'rtl' : 'ltr'),
57
- arrows: false,
58
- pagination: false,
59
- padding: this._instance.padding,
60
- autoWidth: this._instance.autoWidth,
61
- focus: this._instance.centered ? 'center' : this._instance.focus,
62
- height: this._instance.height,
63
- fixedHeight: this._instance.fixedHeight,
64
- heightRatio: this._instance.heightRatio,
65
- wheel: this._instance.wheel,
66
- width: this._instance.width,
67
- fixedWidth: this._instance.fixedWidth,
68
- drag: this._instance.drag,
69
- snap: this._instance.snap,
70
- breakpoints: this._instance.breakpoints,
71
- };
72
- }
73
- next() {
74
- this._ref.go('+');
75
- }
76
- last() {
77
- this._ref.go(this._ref.length - 1);
78
- }
79
- prev() {
80
- this._ref.go('-');
81
- }
82
- first() {
83
- this._ref.go(0);
84
- }
85
- goToSlide(index) {
86
- this._ref.go(index);
87
- }
88
- goToPage(index) {
89
- this._ref.go(`>${index}`);
90
- }
91
- destroy() {
92
- this._ref.destroy();
93
- }
94
- rebuild() {
95
- if (this._ref) {
96
- this._ref.off('move');
97
- this._ref.destroy();
98
- }
99
- //
100
- this._ref = new Splide(this._instance.host, this._getConfig());
101
- this._ref.mount();
102
- this._ref.on('move', this._emitOnSlideChanged.bind(this));
103
- this._emitOnSlideChanged(this._instance.visibleIndex);
104
- }
105
- }
106
-
107
- class AXCarouselComponent extends AXBaseComponentMixin {
108
- constructor(elementRef, zone, cdr, core) {
109
- super(elementRef, cdr);
110
- this.zone = zone;
111
- this.core = core;
112
- this.onOptionsChanged = new EventEmitter();
113
- this.onSlideChanged = new EventEmitter();
114
- this.perMoveChange = new EventEmitter();
115
- this._perMove = 1;
116
- this.focusChange = new EventEmitter();
117
- this._focus = 0;
118
- this.breakpointsChange = new EventEmitter();
119
- this.heightRatioChange = new EventEmitter();
120
- this._heightRatio = 0;
121
- this.heightChange = new EventEmitter();
122
- this._height = 'auto';
123
- this.fixedHeightChange = new EventEmitter();
124
- this._fixedHeight = '';
125
- this.widthChange = new EventEmitter();
126
- this._width = 'fit-content';
127
- this.fixedWidthChange = new EventEmitter();
128
- this._fixedWidth = '';
129
- this.perPageChange = new EventEmitter();
130
- this._perPage = 1;
131
- this.gap = 10;
132
- this.autoplayChange = new EventEmitter();
133
- this._autoplay = false;
134
- this.snapChange = new EventEmitter();
135
- this._snap = false;
136
- this.autoWidthChange = new EventEmitter();
137
- this._autoWidth = true;
138
- this.dragChange = new EventEmitter();
139
- this._drag = true;
140
- this.wheelChange = new EventEmitter();
141
- this._wheel = false;
142
- this.intervalChange = new EventEmitter();
143
- this._interval = 3000;
144
- this.paddingChange = new EventEmitter();
145
- this._padding = 0;
146
- this.centeredChange = new EventEmitter();
147
- this._centered = false;
148
- this.verticalChange = new EventEmitter();
149
- this._vertical = false;
150
- this.loopChange = new EventEmitter();
151
- this._loop = false;
152
- this.rewindChange = new EventEmitter();
153
- this._rewind = false;
154
- this._visibleIndex = 0;
155
- this.onItemsChanged = new EventEmitter();
156
- this._items = [];
157
- }
158
- get perMove() {
159
- return this._perMove;
160
- }
161
- set perMove(v) {
162
- const val = Math.max(1, coerceNumberProperty(v));
163
- if (val != this._perMove) {
164
- this._perMove = val;
165
- if (this._perMove > 1) {
166
- this._vertical = false;
167
- }
168
- this.perMoveChange.emit(this.perMove);
169
- this.onOptionsChanged.emit();
170
- }
171
- }
172
- get focus() {
173
- return this._focus;
174
- }
175
- set focus(v) {
176
- if (v != this._focus) {
177
- this._focus = v;
178
- this.paddingChange.emit(v);
179
- this.onOptionsChanged.emit();
180
- }
181
- }
182
- get breakpoints() {
183
- return this._breakpoints;
184
- }
185
- set breakpoints(v) {
186
- if (v != this._breakpoints) {
187
- this._breakpoints = v;
188
- this.paddingChange.emit(v);
189
- this.onOptionsChanged.emit();
190
- }
191
- }
192
- get heightRatio() {
193
- return this._heightRatio;
194
- }
195
- set heightRatio(v) {
196
- if (v != this._heightRatio) {
197
- this._heightRatio = v;
198
- this.paddingChange.emit(v);
199
- this.onOptionsChanged.emit();
200
- }
201
- }
202
- get height() {
203
- return this._height;
204
- }
205
- set height(v) {
206
- const val = v;
207
- if (val != this._height) {
208
- this._height = val;
209
- this.heightChange.emit(this.height);
210
- this.onOptionsChanged.emit();
211
- }
212
- }
213
- get fixedHeight() {
214
- return this._fixedHeight;
215
- }
216
- set fixedHeight(v) {
217
- const val = v;
218
- if (val != this._fixedHeight) {
219
- this._fixedHeight = val;
220
- this.fixedHeightChange.emit(this.fixedHeight);
221
- this.onOptionsChanged.emit();
222
- }
223
- }
224
- get width() {
225
- return this._width;
226
- }
227
- set width(v) {
228
- const val = v;
229
- if (val != this._width) {
230
- this._width = val;
231
- this.widthChange.emit(this.width);
232
- this.onOptionsChanged.emit();
233
- }
234
- }
235
- get fixedWidth() {
236
- return this._fixedWidth;
237
- }
238
- set fixedWidth(v) {
239
- const val = v;
240
- if (val != this._fixedWidth) {
241
- this._fixedWidth = val;
242
- this.fixedWidthChange.emit(this.fixedWidth);
243
- this.onOptionsChanged.emit();
244
- }
245
- }
246
- get perPage() {
247
- return this._perPage;
248
- }
249
- set perPage(v) {
250
- const val = v;
251
- if (val != this._perPage) {
252
- this._perPage = val;
253
- this.perPageChange.emit(this.perPage);
254
- this.onOptionsChanged.emit();
255
- }
256
- }
257
- get autoplay() {
258
- return this._autoplay;
259
- }
260
- set autoplay(v) {
261
- const val = coerceBooleanProperty(v);
262
- if (val != this._autoplay) {
263
- this._autoplay = val;
264
- this.autoplayChange.emit(this.autoplay);
265
- this.onOptionsChanged.emit();
266
- }
267
- }
268
- get snap() {
269
- return this._snap;
270
- }
271
- set snap(v) {
272
- const val = coerceBooleanProperty(v);
273
- if (val != this._snap) {
274
- this._snap = val;
275
- this.snapChange.emit(this.snap);
276
- this.onOptionsChanged.emit();
277
- }
278
- }
279
- get autoWidth() {
280
- return this._autoWidth;
281
- }
282
- set autoWidth(v) {
283
- const val = coerceBooleanProperty(v);
284
- if (val != this._autoWidth) {
285
- this._autoWidth = val;
286
- this.autoWidthChange.emit(this.autoWidth);
287
- this.onOptionsChanged.emit();
288
- }
289
- }
290
- get drag() {
291
- return this._drag;
292
- }
293
- set drag(v) {
294
- const val = v;
295
- if (val != this._drag) {
296
- this._drag = val;
297
- this.dragChange.emit(this.drag);
298
- this.onOptionsChanged.emit();
299
- }
300
- }
301
- get wheel() {
302
- return this._wheel;
303
- }
304
- set wheel(v) {
305
- const val = coerceBooleanProperty(v);
306
- if (val != this._wheel) {
307
- this._wheel = val;
308
- this.wheelChange.emit(this.wheel);
309
- this.onOptionsChanged.emit();
310
- }
311
- }
312
- get interval() {
313
- return this._interval;
314
- }
315
- set interval(v) {
316
- const val = coerceNumberProperty(v);
317
- if (val != this._interval) {
318
- this.intervalChange.emit(val);
319
- this.onOptionsChanged.emit();
320
- }
321
- }
322
- get padding() {
323
- return this._padding;
324
- }
325
- set padding(v) {
326
- if (v != this._padding) {
327
- this._padding = v;
328
- this.paddingChange.emit(v);
329
- this.onOptionsChanged.emit();
330
- }
331
- }
332
- get centered() {
333
- return this._centered;
334
- }
335
- set centered(v) {
336
- const val = coerceBooleanProperty(v);
337
- if (val != this._centered) {
338
- this._centered = val;
339
- if (this._centered) {
340
- this._rewind = false;
341
- }
342
- this.centeredChange.emit(this.centered);
343
- this.rewindChange.emit(this.rewind);
344
- this.onOptionsChanged.emit();
345
- }
346
- }
347
- get vertical() {
348
- return this._vertical;
349
- }
350
- set vertical(v) {
351
- const val = coerceBooleanProperty(v);
352
- if (val != this._vertical) {
353
- this._vertical = val;
354
- this.verticalChange.emit(this.vertical);
355
- this.onOptionsChanged.emit();
356
- }
357
- }
358
- get loop() {
359
- return this._loop;
360
- }
361
- set loop(v) {
362
- const val = coerceBooleanProperty(v);
363
- if (val != this._loop) {
364
- this._loop = val;
365
- if (this._loop) {
366
- this._rewind = false;
367
- }
368
- this.loopChange.emit(this.loop);
369
- this.rewindChange.emit(this.rewind);
370
- this.onOptionsChanged.emit();
371
- }
372
- }
373
- get rewind() {
374
- return this._rewind;
375
- }
376
- set rewind(v) {
377
- const val = coerceBooleanProperty(v);
378
- if (val != this._rewind) {
379
- this._rewind = val;
380
- if (this._rewind) {
381
- this._loop = false;
382
- this._centered = false;
383
- }
384
- this.rewindChange.emit(this.rewind);
385
- this.loopChange.emit(this.loop);
386
- this.centeredChange.emit(this.centered);
387
- this.onOptionsChanged.emit();
388
- }
389
- }
390
- get visibleIndex() {
391
- return this._visibleIndex;
392
- }
393
- set visibleIndex(v) {
394
- this._visibleIndex = v;
395
- }
396
- get items() {
397
- return this._items ?? [];
398
- }
399
- set items(v) {
400
- const oldValue = this.items.slice();
401
- this._items = v;
402
- this.onItemsChanged.emit({
403
- component: this,
404
- htmlElement: this._getHostElement(),
405
- oldValue,
406
- value: this.items
407
- });
408
- }
409
- onViewInit() {
410
- this.core.mount(this);
411
- }
412
- next() {
413
- this.core.next();
414
- }
415
- last() {
416
- this.core.last();
417
- }
418
- prev() {
419
- this.core.prev();
420
- }
421
- first() {
422
- this.core.first();
423
- }
424
- goToSlide(index) {
425
- this.core.goToSlide(index);
426
- }
427
- goToPage(index) {
428
- this.core.goToPage(index);
429
- }
430
- get host() {
431
- return this._getHostElement();
432
- }
433
- onDestroy() {
434
- this.core.destroy();
435
- }
436
- }
437
- AXCarouselComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: AXCarouselCore }], target: i0.ɵɵFactoryTarget.Component });
438
- AXCarouselComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCarouselComponent, selector: "ax-carousel", inputs: { perMove: "perMove", focus: "focus", breakpoints: "breakpoints", heightRatio: "heightRatio", height: "height", fixedHeight: "fixedHeight", width: "width", fixedWidth: "fixedWidth", perPage: "perPage", gap: "gap", autoplay: "autoplay", snap: "snap", autoWidth: "autoWidth", drag: "drag", wheel: "wheel", interval: "interval", padding: "padding", centered: "centered", vertical: "vertical", loop: "loop", rewind: "rewind" }, outputs: { onOptionsChanged: "onOptionsChanged", onSlideChanged: "onSlideChanged", perMoveChange: "perMoveChange", focusChange: "focusChange", breakpointsChange: "breakpointsChange", heightRatioChange: "heightRatioChange", heightChange: "heightChange", fixedHeightChange: "fixedHeightChange", widthChange: "widthChange", fixedWidthChange: "fixedWidthChange", perPageChange: "perPageChange", autoplayChange: "autoplayChange", snapChange: "snapChange", autoWidthChange: "autoWidthChange", dragChange: "dragChange", wheelChange: "wheelChange", intervalChange: "intervalChange", paddingChange: "paddingChange", centeredChange: "centeredChange", verticalChange: "verticalChange", loopChange: "loopChange", rewindChange: "rewindChange", onItemsChanged: "onItemsChanged" }, host: { classAttribute: "ax-carousel" }, providers: [{
439
- provide: AXCarouselCore,
440
- useClass: AXCarouselSplideJS
441
- }], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-carousel-list-container\">\r\n <div class=\"ax-carousel-list\">\r\n <ng-content select=\"ax-carousel-item\">\r\n </ng-content>\r\n </div>\r\n <ng-content select=\"ax-carousel-arrows\">\r\n </ng-content>\r\n</div>\r\n\r\n<ng-content select=\"ax-carousel-pager\">\r\n</ng-content>", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
442
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselComponent, decorators: [{
443
- type: Component,
444
- args: [{ selector: 'ax-carousel', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: { class: 'ax-carousel' }, providers: [{
445
- provide: AXCarouselCore,
446
- useClass: AXCarouselSplideJS
447
- }], template: "<div class=\"ax-carousel-list-container\">\r\n <div class=\"ax-carousel-list\">\r\n <ng-content select=\"ax-carousel-item\">\r\n </ng-content>\r\n </div>\r\n <ng-content select=\"ax-carousel-arrows\">\r\n </ng-content>\r\n</div>\r\n\r\n<ng-content select=\"ax-carousel-pager\">\r\n</ng-content>" }]
448
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: AXCarouselCore }]; }, propDecorators: { onOptionsChanged: [{
449
- type: Output
450
- }], onSlideChanged: [{
451
- type: Output
452
- }], perMoveChange: [{
453
- type: Output
454
- }], perMove: [{
455
- type: Input
456
- }], focusChange: [{
457
- type: Output
458
- }], focus: [{
459
- type: Input
460
- }], breakpointsChange: [{
461
- type: Output
462
- }], breakpoints: [{
463
- type: Input
464
- }], heightRatioChange: [{
465
- type: Output
466
- }], heightRatio: [{
467
- type: Input
468
- }], heightChange: [{
469
- type: Output
470
- }], height: [{
471
- type: Input
472
- }], fixedHeightChange: [{
473
- type: Output
474
- }], fixedHeight: [{
475
- type: Input
476
- }], widthChange: [{
477
- type: Output
478
- }], width: [{
479
- type: Input
480
- }], fixedWidthChange: [{
481
- type: Output
482
- }], fixedWidth: [{
483
- type: Input
484
- }], perPageChange: [{
485
- type: Output
486
- }], perPage: [{
487
- type: Input
488
- }], gap: [{
489
- type: Input
490
- }], autoplayChange: [{
491
- type: Output
492
- }], autoplay: [{
493
- type: Input
494
- }], snapChange: [{
495
- type: Output
496
- }], snap: [{
497
- type: Input
498
- }], autoWidthChange: [{
499
- type: Output
500
- }], autoWidth: [{
501
- type: Input
502
- }], dragChange: [{
503
- type: Output
504
- }], drag: [{
505
- type: Input
506
- }], wheelChange: [{
507
- type: Output
508
- }], wheel: [{
509
- type: Input
510
- }], intervalChange: [{
511
- type: Output
512
- }], interval: [{
513
- type: Input
514
- }], paddingChange: [{
515
- type: Output
516
- }], padding: [{
517
- type: Input
518
- }], centeredChange: [{
519
- type: Output
520
- }], centered: [{
521
- type: Input
522
- }], verticalChange: [{
523
- type: Output
524
- }], vertical: [{
525
- type: Input
526
- }], loopChange: [{
527
- type: Output
528
- }], loop: [{
529
- type: Input
530
- }], rewindChange: [{
531
- type: Output
532
- }], rewind: [{
533
- type: Input
534
- }], onItemsChanged: [{
535
- type: Output
536
- }] } });
537
-
538
- class AXCarouselArrowsComponent extends AXBaseComponentMixin {
539
- constructor(elementRef, cdr, parent) {
540
- super(elementRef, cdr);
541
- this.parent = parent;
542
- this.onNextClick = new EventEmitter();
543
- this.onPrevClick = new EventEmitter();
544
- }
545
- _handlePrevClick(e) {
546
- e.stopPropagation();
547
- this.parent.prev();
548
- }
549
- _handleNextClick(e) {
550
- e.stopPropagation();
551
- this.parent.next();
552
- }
553
- }
554
- AXCarouselArrowsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselArrowsComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXCarouselComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component });
555
- AXCarouselArrowsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCarouselArrowsComponent, selector: "ax-carousel-arrows", inputs: { class: "class" }, outputs: { onNextClick: "onNextClick", onPrevClick: "onPrevClick" }, host: { classAttribute: "ax-carousel-arrows" }, usesInheritance: true, ngImport: i0, template: `
556
- <button
557
- class="ax-carousel-arrow-prev"
558
- [ngClass]="{ 'ax-vertical-arrow ax-top-arrow': this.parent.vertical }"
559
- (click)="_handlePrevClick($event)"
560
- >
561
- <i class="ax-ic ax-ic-chevron ax-block rtl:ax-rotate-180 {{ class }}"></i>
562
- </button>
563
- <button
564
- class="ax-carousel-arrow-next"
565
- [ngClass]="{ 'ax-vertical-arrow ax-bottom-arrow': this.parent.vertical }"
566
- (click)="_handleNextClick($event)"
567
- >
568
- <i
569
- class="ax-ic ax-ic-chevron ax-block ax-rotate-180 rtl:ax-rotate-0 {{
570
- class
571
- }}"
572
- ></i>
573
- </button>
574
- `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
575
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselArrowsComponent, decorators: [{
576
- type: Component,
577
- args: [{
578
- selector: 'ax-carousel-arrows',
579
- template: `
580
- <button
581
- class="ax-carousel-arrow-prev"
582
- [ngClass]="{ 'ax-vertical-arrow ax-top-arrow': this.parent.vertical }"
583
- (click)="_handlePrevClick($event)"
584
- >
585
- <i class="ax-ic ax-ic-chevron ax-block rtl:ax-rotate-180 {{ class }}"></i>
586
- </button>
587
- <button
588
- class="ax-carousel-arrow-next"
589
- [ngClass]="{ 'ax-vertical-arrow ax-bottom-arrow': this.parent.vertical }"
590
- (click)="_handleNextClick($event)"
591
- >
592
- <i
593
- class="ax-ic ax-ic-chevron ax-block ax-rotate-180 rtl:ax-rotate-0 {{
594
- class
595
- }}"
596
- ></i>
597
- </button>
598
- `,
599
- changeDetection: ChangeDetectionStrategy.OnPush,
600
- encapsulation: ViewEncapsulation.None,
601
- host: { class: 'ax-carousel-arrows' },
602
- }]
603
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: AXCarouselComponent, decorators: [{
604
- type: Optional
605
- }] }]; }, propDecorators: { class: [{
606
- type: Input
607
- }], onNextClick: [{
608
- type: Output
609
- }], onPrevClick: [{
610
- type: Output
611
- }] } });
612
-
613
- class AXCarouselItemComponent extends AXBaseComponentMixin {
614
- constructor(elementRef, cdr) {
615
- super(elementRef, cdr);
616
- }
617
- }
618
- AXCarouselItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
619
- AXCarouselItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCarouselItemComponent, selector: "ax-carousel-item", host: { classAttribute: "ax-carousel-item" }, usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
620
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselItemComponent, decorators: [{
621
- type: Component,
622
- args: [{
623
- selector: 'ax-carousel-item',
624
- template: '<ng-content></ng-content>',
625
- changeDetection: ChangeDetectionStrategy.OnPush,
626
- encapsulation: ViewEncapsulation.None,
627
- host: { class: 'ax-carousel-item' }
628
- }]
629
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; } });
630
-
631
- class AXCarouselPagerComponent extends AXBaseComponentMixin {
632
- constructor(elementRef, cdr, _parent) {
633
- super(elementRef, cdr);
634
- this.cdr = cdr;
635
- this._parent = _parent;
636
- this._visibleIndex = 0;
637
- this._pageIndex = 0;
638
- this._size = 1;
639
- this._dots = [];
640
- this._subs = [];
641
- _parent.perPageChange.subscribe(c => {
642
- this._size = c;
643
- this._generateDots();
644
- });
645
- _parent.onSlideChanged.subscribe((c) => {
646
- this._visibleIndex = c.value;
647
- this._generateDots();
648
- });
649
- _parent.onItemsChanged.subscribe(c => {
650
- this._generateDots();
651
- });
652
- }
653
- onViewInit() {
654
- this._size = this._parent.perPage;
655
- this._visibleIndex = this._parent.visibleIndex;
656
- this._generateDots();
657
- }
658
- _generateDots() {
659
- this._dots = [...Array(Math.ceil(this._parent.items.length / this._size)).keys()];
660
- this._setPageIndex(this._findPageIndex(this._visibleIndex));
661
- this.cdr.detectChanges();
662
- }
663
- _handleClick(e, index) {
664
- e.stopPropagation();
665
- this._setPageIndex(index);
666
- this._parent.goToPage(index);
667
- }
668
- _setPageIndex(index) {
669
- this._pageIndex = index;
670
- this.cdr.detectChanges();
671
- }
672
- _findPageIndex(slideIndex) {
673
- return Math.min(Math.ceil(slideIndex / this._size), this._dots.length - 1);
674
- }
675
- onDestroy() {
676
- this._subs.forEach(s => {
677
- s.unsubscribe();
678
- });
679
- }
680
- }
681
- AXCarouselPagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselPagerComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: AXCarouselComponent }], target: i0.ɵɵFactoryTarget.Component });
682
- AXCarouselPagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.2", type: AXCarouselPagerComponent, selector: "ax-carousel-pager", host: { classAttribute: "ax-carousel-pager" }, usesInheritance: true, ngImport: i0, template: `
683
- <button *ngFor="let d of _dots;let i=index" [class.ax-state-active]="i==_pageIndex" (click)="_handleClick($event,i)">
684
- </button>
685
- `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
686
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselPagerComponent, decorators: [{
687
- type: Component,
688
- args: [{
689
- selector: 'ax-carousel-pager',
690
- template: `
691
- <button *ngFor="let d of _dots;let i=index" [class.ax-state-active]="i==_pageIndex" (click)="_handleClick($event,i)">
692
- </button>
693
- `,
694
- changeDetection: ChangeDetectionStrategy.OnPush,
695
- encapsulation: ViewEncapsulation.None,
696
- host: { class: 'ax-carousel-pager' }
697
- }]
698
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: AXCarouselComponent }]; } });
699
-
700
- const COMPONENT = [AXCarouselComponent, AXCarouselItemComponent, AXCarouselArrowsComponent, AXCarouselPagerComponent];
701
- const MODULES = [CommonModule];
702
- class AXCarouselModule {
703
- }
704
- AXCarouselModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
705
- AXCarouselModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselModule, declarations: [AXCarouselComponent, AXCarouselItemComponent, AXCarouselArrowsComponent, AXCarouselPagerComponent], imports: [CommonModule], exports: [AXCarouselComponent, AXCarouselItemComponent, AXCarouselArrowsComponent, AXCarouselPagerComponent] });
706
- AXCarouselModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselModule, imports: [MODULES] });
707
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.2", ngImport: i0, type: AXCarouselModule, decorators: [{
708
- type: NgModule,
709
- args: [{
710
- declarations: [...COMPONENT],
711
- imports: [...MODULES],
712
- exports: [...COMPONENT],
713
- providers: [],
714
- }]
715
- }] });
716
-
717
- /**
718
- * Generated bundle index. Do not edit.
719
- */
720
-
721
- export { AXCarouselArrowsComponent, AXCarouselComponent, AXCarouselCore, AXCarouselItemComponent, AXCarouselModule, AXCarouselPagerComponent, AXCarouselSplideJS };
722
- //# sourceMappingURL=acorex-components-carousel.mjs.map