@taiga-ui/kit 2.25.0 → 2.26.0
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/bundles/taiga-ui-kit-components-carousel.umd.js +581 -0
- package/bundles/taiga-ui-kit-components-carousel.umd.js.map +1 -0
- package/bundles/taiga-ui-kit-components-carousel.umd.min.js +16 -0
- package/bundles/taiga-ui-kit-components-carousel.umd.min.js.map +1 -0
- package/bundles/taiga-ui-kit-components-tree.umd.js +62 -51
- package/bundles/taiga-ui-kit-components-tree.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components-tree.umd.min.js +2 -2
- package/bundles/taiga-ui-kit-components-tree.umd.min.js.map +1 -1
- package/bundles/taiga-ui-kit-components.umd.js +12 -4
- package/bundles/taiga-ui-kit-components.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-components.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-directives-highlight.umd.js +6 -1
- package/bundles/taiga-ui-kit-directives-highlight.umd.js.map +1 -1
- package/bundles/taiga-ui-kit-directives-highlight.umd.min.js +1 -1
- package/bundles/taiga-ui-kit-directives-highlight.umd.min.js.map +1 -1
- package/components/carousel/carousel-buttons.directive.d.ts +4 -0
- package/components/carousel/carousel-draggable.directive.d.ts +16 -0
- package/components/carousel/carousel-scroller.directive.d.ts +17 -0
- package/components/carousel/carousel.component.d.ts +18 -0
- package/components/carousel/carousel.directive.d.ts +18 -0
- package/components/carousel/carousel.module.d.ts +2 -0
- package/components/carousel/index.d.ts +6 -0
- package/components/carousel/package.json +13 -0
- package/components/carousel/taiga-ui-kit-components-carousel.d.ts +4 -0
- package/components/carousel/taiga-ui-kit-components-carousel.metadata.json +1 -0
- package/components/index.d.ts +1 -0
- package/components/taiga-ui-kit-components.metadata.json +1 -1
- package/components/tree/components/tree/tree.component.d.ts +6 -1
- package/components/tree/taiga-ui-kit-components-tree.metadata.json +1 -1
- package/directives/highlight/highlight.directive.d.ts +1 -0
- package/directives/highlight/taiga-ui-kit-directives-highlight.metadata.json +1 -1
- package/esm2015/components/carousel/carousel-buttons.directive.js +24 -0
- package/esm2015/components/carousel/carousel-draggable.directive.js +67 -0
- package/esm2015/components/carousel/carousel-scroller.directive.js +76 -0
- package/esm2015/components/carousel/carousel.component.js +87 -0
- package/esm2015/components/carousel/carousel.directive.js +65 -0
- package/esm2015/components/carousel/carousel.module.js +34 -0
- package/esm2015/components/carousel/index.js +7 -0
- package/esm2015/components/carousel/taiga-ui-kit-components-carousel.js +5 -0
- package/esm2015/components/index.js +2 -1
- package/esm2015/components/tree/components/tree/tree.component.js +15 -2
- package/esm2015/components/tree/components/tree-item/tree-item.component.js +2 -2
- package/esm2015/components/tree/components/tree-item-content/tree-item-content.component.js +2 -3
- package/esm2015/directives/highlight/highlight.directive.js +7 -2
- package/esm5/components/carousel/carousel-buttons.directive.js +27 -0
- package/esm5/components/carousel/carousel-draggable.directive.js +73 -0
- package/esm5/components/carousel/carousel-scroller.directive.js +82 -0
- package/esm5/components/carousel/carousel.component.js +90 -0
- package/esm5/components/carousel/carousel.directive.js +82 -0
- package/esm5/components/carousel/carousel.module.js +37 -0
- package/esm5/components/carousel/index.js +7 -0
- package/esm5/components/carousel/taiga-ui-kit-components-carousel.js +5 -0
- package/esm5/components/index.js +2 -1
- package/esm5/components/tree/components/tree/tree.component.js +15 -2
- package/esm5/components/tree/components/tree-item/tree-item.component.js +2 -2
- package/esm5/components/tree/components/tree-item-content/tree-item-content.component.js +2 -3
- package/esm5/directives/highlight/highlight.directive.js +7 -2
- package/fesm2015/taiga-ui-kit-components-carousel.js +323 -0
- package/fesm2015/taiga-ui-kit-components-carousel.js.map +1 -0
- package/fesm2015/taiga-ui-kit-components-tree.js +54 -43
- package/fesm2015/taiga-ui-kit-components-tree.js.map +1 -1
- package/fesm2015/taiga-ui-kit-components.js +1 -0
- package/fesm2015/taiga-ui-kit-components.js.map +1 -1
- package/fesm2015/taiga-ui-kit-directives-highlight.js +6 -1
- package/fesm2015/taiga-ui-kit-directives-highlight.js.map +1 -1
- package/fesm5/taiga-ui-kit-components-carousel.js +361 -0
- package/fesm5/taiga-ui-kit-components-carousel.js.map +1 -0
- package/fesm5/taiga-ui-kit-components-tree.js +63 -52
- package/fesm5/taiga-ui-kit-components-tree.js.map +1 -1
- package/fesm5/taiga-ui-kit-components.js +1 -0
- package/fesm5/taiga-ui-kit-components.js.map +1 -1
- package/fesm5/taiga-ui-kit-directives-highlight.js +6 -1
- package/fesm5/taiga-ui-kit-directives-highlight.js.map +1 -1
- package/package.json +6 -5
|
@@ -0,0 +1,581 @@
|
|
|
1
|
+
(function (global, factory) {
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@ng-web-apis/intersection-observer'), require('@taiga-ui/cdk'), require('rxjs'), require('rxjs/operators'), require('@ng-web-apis/common'), require('@angular/common'), require('@taiga-ui/kit/directives'), require('@taiga-ui/core'), require('@tinkoff/ng-event-plugins')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('@taiga-ui/kit/components/carousel', ['exports', '@angular/core', '@ng-web-apis/intersection-observer', '@taiga-ui/cdk', 'rxjs', 'rxjs/operators', '@ng-web-apis/common', '@angular/common', '@taiga-ui/kit/directives', '@taiga-ui/core', '@tinkoff/ng-event-plugins'], factory) :
|
|
4
|
+
(global = global || self, factory((global['taiga-ui'] = global['taiga-ui'] || {}, global['taiga-ui'].kit = global['taiga-ui'].kit || {}, global['taiga-ui'].kit.components = global['taiga-ui'].kit.components || {}, global['taiga-ui'].kit.components.carousel = {}), global.ng.core, global.intersectionObserver, global.cdk, global.rxjs, global.rxjs.operators, global.common, global.ng.common, global['taiga-ui'].kit.directives, global.core$1, global.ngEventPlugins));
|
|
5
|
+
}(this, (function (exports, core, intersectionObserver, cdk, rxjs, operators, common, common$1, directives, core$1, ngEventPlugins) { 'use strict';
|
|
6
|
+
|
|
7
|
+
/*! *****************************************************************************
|
|
8
|
+
Copyright (c) Microsoft Corporation.
|
|
9
|
+
|
|
10
|
+
Permission to use, copy, modify, and/or distribute this software for any
|
|
11
|
+
purpose with or without fee is hereby granted.
|
|
12
|
+
|
|
13
|
+
THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
14
|
+
REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
15
|
+
AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
16
|
+
INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
17
|
+
LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
18
|
+
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
19
|
+
PERFORMANCE OF THIS SOFTWARE.
|
|
20
|
+
***************************************************************************** */
|
|
21
|
+
/* global Reflect, Promise */
|
|
22
|
+
|
|
23
|
+
var extendStatics = function(d, b) {
|
|
24
|
+
extendStatics = Object.setPrototypeOf ||
|
|
25
|
+
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
|
26
|
+
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
|
27
|
+
return extendStatics(d, b);
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
function __extends(d, b) {
|
|
31
|
+
extendStatics(d, b);
|
|
32
|
+
function __() { this.constructor = d; }
|
|
33
|
+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
var __assign = function() {
|
|
37
|
+
__assign = Object.assign || function __assign(t) {
|
|
38
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
39
|
+
s = arguments[i];
|
|
40
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
41
|
+
}
|
|
42
|
+
return t;
|
|
43
|
+
};
|
|
44
|
+
return __assign.apply(this, arguments);
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
function __rest(s, e) {
|
|
48
|
+
var t = {};
|
|
49
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
50
|
+
t[p] = s[p];
|
|
51
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
52
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
53
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
54
|
+
t[p[i]] = s[p[i]];
|
|
55
|
+
}
|
|
56
|
+
return t;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
function __decorate(decorators, target, key, desc) {
|
|
60
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
61
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
62
|
+
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
63
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
function __param(paramIndex, decorator) {
|
|
67
|
+
return function (target, key) { decorator(target, key, paramIndex); }
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
function __metadata(metadataKey, metadataValue) {
|
|
71
|
+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(metadataKey, metadataValue);
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
function __awaiter(thisArg, _arguments, P, generator) {
|
|
75
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
76
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
77
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
78
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
79
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
80
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
function __generator(thisArg, body) {
|
|
85
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
86
|
+
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
87
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
88
|
+
function step(op) {
|
|
89
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
90
|
+
while (_) try {
|
|
91
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
92
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
93
|
+
switch (op[0]) {
|
|
94
|
+
case 0: case 1: t = op; break;
|
|
95
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
96
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
97
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
98
|
+
default:
|
|
99
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
100
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
101
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
102
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
103
|
+
if (t[2]) _.ops.pop();
|
|
104
|
+
_.trys.pop(); continue;
|
|
105
|
+
}
|
|
106
|
+
op = body.call(thisArg, _);
|
|
107
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
108
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
function __createBinding(o, m, k, k2) {
|
|
113
|
+
if (k2 === undefined) k2 = k;
|
|
114
|
+
o[k2] = m[k];
|
|
115
|
+
}
|
|
116
|
+
|
|
117
|
+
function __exportStar(m, exports) {
|
|
118
|
+
for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) exports[p] = m[p];
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
function __values(o) {
|
|
122
|
+
var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
|
|
123
|
+
if (m) return m.call(o);
|
|
124
|
+
if (o && typeof o.length === "number") return {
|
|
125
|
+
next: function () {
|
|
126
|
+
if (o && i >= o.length) o = void 0;
|
|
127
|
+
return { value: o && o[i++], done: !o };
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
function __read(o, n) {
|
|
134
|
+
var m = typeof Symbol === "function" && o[Symbol.iterator];
|
|
135
|
+
if (!m) return o;
|
|
136
|
+
var i = m.call(o), r, ar = [], e;
|
|
137
|
+
try {
|
|
138
|
+
while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
|
|
139
|
+
}
|
|
140
|
+
catch (error) { e = { error: error }; }
|
|
141
|
+
finally {
|
|
142
|
+
try {
|
|
143
|
+
if (r && !r.done && (m = i["return"])) m.call(i);
|
|
144
|
+
}
|
|
145
|
+
finally { if (e) throw e.error; }
|
|
146
|
+
}
|
|
147
|
+
return ar;
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
function __spread() {
|
|
151
|
+
for (var ar = [], i = 0; i < arguments.length; i++)
|
|
152
|
+
ar = ar.concat(__read(arguments[i]));
|
|
153
|
+
return ar;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
function __spreadArrays() {
|
|
157
|
+
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
|
|
158
|
+
for (var r = Array(s), k = 0, i = 0; i < il; i++)
|
|
159
|
+
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
|
|
160
|
+
r[k] = a[j];
|
|
161
|
+
return r;
|
|
162
|
+
};
|
|
163
|
+
|
|
164
|
+
function __await(v) {
|
|
165
|
+
return this instanceof __await ? (this.v = v, this) : new __await(v);
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
function __asyncGenerator(thisArg, _arguments, generator) {
|
|
169
|
+
if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
|
|
170
|
+
var g = generator.apply(thisArg, _arguments || []), i, q = [];
|
|
171
|
+
return i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i;
|
|
172
|
+
function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }
|
|
173
|
+
function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }
|
|
174
|
+
function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }
|
|
175
|
+
function fulfill(value) { resume("next", value); }
|
|
176
|
+
function reject(value) { resume("throw", value); }
|
|
177
|
+
function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
function __asyncDelegator(o) {
|
|
181
|
+
var i, p;
|
|
182
|
+
return i = {}, verb("next"), verb("throw", function (e) { throw e; }), verb("return"), i[Symbol.iterator] = function () { return this; }, i;
|
|
183
|
+
function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === "return" } : f ? f(v) : v; } : f; }
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
function __asyncValues(o) {
|
|
187
|
+
if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
|
|
188
|
+
var m = o[Symbol.asyncIterator], i;
|
|
189
|
+
return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
|
|
190
|
+
function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
|
|
191
|
+
function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
function __makeTemplateObject(cooked, raw) {
|
|
195
|
+
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
|
|
196
|
+
return cooked;
|
|
197
|
+
};
|
|
198
|
+
|
|
199
|
+
function __importStar(mod) {
|
|
200
|
+
if (mod && mod.__esModule) return mod;
|
|
201
|
+
var result = {};
|
|
202
|
+
if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
|
|
203
|
+
result.default = mod;
|
|
204
|
+
return result;
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
function __importDefault(mod) {
|
|
208
|
+
return (mod && mod.__esModule) ? mod : { default: mod };
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
function __classPrivateFieldGet(receiver, privateMap) {
|
|
212
|
+
if (!privateMap.has(receiver)) {
|
|
213
|
+
throw new TypeError("attempted to get private field on non-instance");
|
|
214
|
+
}
|
|
215
|
+
return privateMap.get(receiver);
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
function __classPrivateFieldSet(receiver, privateMap, value) {
|
|
219
|
+
if (!privateMap.has(receiver)) {
|
|
220
|
+
throw new TypeError("attempted to set private field on non-instance");
|
|
221
|
+
}
|
|
222
|
+
privateMap.set(receiver, value);
|
|
223
|
+
return value;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
var TuiCarouselDirective = /** @class */ (function (_super) {
|
|
227
|
+
__extends(TuiCarouselDirective, _super);
|
|
228
|
+
function TuiCarouselDirective(destroy$, elementRef, visible$) {
|
|
229
|
+
var _this = _super.call(this, function (subscriber) { return _this.output$.subscribe(subscriber); }) || this;
|
|
230
|
+
_this.destroy$ = destroy$;
|
|
231
|
+
_this.elementRef = elementRef;
|
|
232
|
+
_this.visible$ = visible$;
|
|
233
|
+
_this.index$ = new rxjs.BehaviorSubject(NaN);
|
|
234
|
+
_this.duration$ = new rxjs.BehaviorSubject(0);
|
|
235
|
+
_this.running$ = rxjs.merge(cdk.typedFromEvent(_this.elementRef.nativeElement, 'mouseenter').pipe(operators.mapTo(false)), cdk.typedFromEvent(_this.elementRef.nativeElement, 'mouseleave').pipe(operators.mapTo(true)), _this.visible$).pipe(operators.takeUntil(_this.destroy$), operators.shareReplay(1));
|
|
236
|
+
_this.output$ = rxjs.combineLatest([
|
|
237
|
+
_this.index$.pipe(operators.filter(function (v) { return !isNaN(v); })),
|
|
238
|
+
_this.duration$,
|
|
239
|
+
]).pipe(operators.switchMap(function (_a) {
|
|
240
|
+
var _b = __read(_a, 2), index = _b[0], duration = _b[1];
|
|
241
|
+
return duration
|
|
242
|
+
? rxjs.interval(duration).pipe(operators.withLatestFrom(_this.running$), operators.filter(function (_a) {
|
|
243
|
+
var _b = __read(_a, 2), _ = _b[0], running = _b[1];
|
|
244
|
+
return running;
|
|
245
|
+
}), operators.scan(function (acc) { return ++acc; }, index), operators.startWith(index))
|
|
246
|
+
: rxjs.of(index);
|
|
247
|
+
}), operators.distinctUntilChanged());
|
|
248
|
+
// So that initial position is scrolled to instantly
|
|
249
|
+
_this.inited = false;
|
|
250
|
+
return _this;
|
|
251
|
+
}
|
|
252
|
+
Object.defineProperty(TuiCarouselDirective.prototype, "index", {
|
|
253
|
+
set: function (index) {
|
|
254
|
+
this.index$.next(index);
|
|
255
|
+
},
|
|
256
|
+
enumerable: true,
|
|
257
|
+
configurable: true
|
|
258
|
+
});
|
|
259
|
+
Object.defineProperty(TuiCarouselDirective.prototype, "duration", {
|
|
260
|
+
set: function (duration) {
|
|
261
|
+
this.duration$.next(duration);
|
|
262
|
+
},
|
|
263
|
+
enumerable: true,
|
|
264
|
+
configurable: true
|
|
265
|
+
});
|
|
266
|
+
TuiCarouselDirective.prototype.ngOnInit = function () {
|
|
267
|
+
if (isNaN(this.index$.value)) {
|
|
268
|
+
this.index$.next(0);
|
|
269
|
+
}
|
|
270
|
+
};
|
|
271
|
+
TuiCarouselDirective.prototype.prev = function () {
|
|
272
|
+
this.index$.next(this.index$.value - 1);
|
|
273
|
+
};
|
|
274
|
+
TuiCarouselDirective.prototype.next = function () {
|
|
275
|
+
this.index$.next(this.index$.value + 1);
|
|
276
|
+
};
|
|
277
|
+
TuiCarouselDirective.ctorParameters = function () { return [
|
|
278
|
+
{ type: rxjs.Observable, decorators: [{ type: core.Inject, args: [cdk.TuiDestroyService,] }] },
|
|
279
|
+
{ type: core.ElementRef, decorators: [{ type: core.Inject, args: [core.ElementRef,] }] },
|
|
280
|
+
{ type: rxjs.Observable, decorators: [{ type: core.Inject, args: [common.PAGE_VISIBILITY,] }] }
|
|
281
|
+
]; };
|
|
282
|
+
__decorate([
|
|
283
|
+
core.Input()
|
|
284
|
+
], TuiCarouselDirective.prototype, "index", null);
|
|
285
|
+
__decorate([
|
|
286
|
+
core.Input()
|
|
287
|
+
], TuiCarouselDirective.prototype, "duration", null);
|
|
288
|
+
TuiCarouselDirective = __decorate([
|
|
289
|
+
core.Directive({
|
|
290
|
+
selector: 'tui-carousel',
|
|
291
|
+
exportAs: 'tui-carousel',
|
|
292
|
+
providers: [cdk.TuiDestroyService],
|
|
293
|
+
}),
|
|
294
|
+
__param(0, core.Inject(cdk.TuiDestroyService)),
|
|
295
|
+
__param(1, core.Inject(core.ElementRef)),
|
|
296
|
+
__param(2, core.Inject(common.PAGE_VISIBILITY))
|
|
297
|
+
], TuiCarouselDirective);
|
|
298
|
+
return TuiCarouselDirective;
|
|
299
|
+
}(rxjs.Observable));
|
|
300
|
+
|
|
301
|
+
// @dynamic
|
|
302
|
+
var TuiCarouselDraggableDirective = /** @class */ (function (_super) {
|
|
303
|
+
__extends(TuiCarouselDraggableDirective, _super);
|
|
304
|
+
function TuiCarouselDraggableDirective(documentRef, isMobile, elementRef, pan$) {
|
|
305
|
+
var _this = _super.call(this, function (subscriber) { return _this.transform$.subscribe(subscriber); }) || this;
|
|
306
|
+
_this.documentRef = documentRef;
|
|
307
|
+
_this.isMobile = isMobile;
|
|
308
|
+
_this.elementRef = elementRef;
|
|
309
|
+
_this.pan$ = pan$;
|
|
310
|
+
_this.transform$ = _this.isMobile
|
|
311
|
+
? rxjs.EMPTY
|
|
312
|
+
: _this.pan$.pipe(operators.filter(function () { return _this.draggable; }), operators.scan(function (acc, _a) {
|
|
313
|
+
var _b = __read(_a, 1), cur = _b[0];
|
|
314
|
+
return acc + cur;
|
|
315
|
+
}, 0), operators.takeUntil(cdk.typedFromEvent(_this.documentRef, 'mouseup').pipe(operators.delay(0))), operators.map(function (x) { return "translateX(" + cdk.clamp(x, _this.min, _this.max) + "px)"; }), operators.endWith(null), operators.repeat());
|
|
316
|
+
_this.min = -Infinity;
|
|
317
|
+
_this.max = Infinity;
|
|
318
|
+
_this.draggable = true;
|
|
319
|
+
_this.transitioned = false;
|
|
320
|
+
return _this;
|
|
321
|
+
}
|
|
322
|
+
TuiCarouselDraggableDirective.prototype.onMouseDown = function () {
|
|
323
|
+
var _a = this.elementRef.nativeElement, scrollLeft = _a.scrollLeft, scrollWidth = _a.scrollWidth, clientWidth = _a.clientWidth;
|
|
324
|
+
this.max = scrollLeft;
|
|
325
|
+
this.min = clientWidth - Math.round(scrollWidth) + Math.round(scrollLeft);
|
|
326
|
+
this.transitioned = true;
|
|
327
|
+
};
|
|
328
|
+
TuiCarouselDraggableDirective.prototype.onTransitionEnd = function (target) {
|
|
329
|
+
if (this.elementRef.nativeElement.firstElementChild === target) {
|
|
330
|
+
this.transitioned = false;
|
|
331
|
+
}
|
|
332
|
+
};
|
|
333
|
+
TuiCarouselDraggableDirective.ctorParameters = function () { return [
|
|
334
|
+
{ type: Document, decorators: [{ type: core.Inject, args: [common$1.DOCUMENT,] }] },
|
|
335
|
+
{ type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_MOBILE,] }] },
|
|
336
|
+
{ type: core.ElementRef, decorators: [{ type: core.Inject, args: [intersectionObserver.INTERSECTION_ROOT,] }] },
|
|
337
|
+
{ type: rxjs.Observable, decorators: [{ type: core.Inject, args: [cdk.TuiPanService,] }] }
|
|
338
|
+
]; };
|
|
339
|
+
__decorate([
|
|
340
|
+
core.Input(),
|
|
341
|
+
core.HostBinding('class._draggable'),
|
|
342
|
+
cdk.tuiDefaultProp()
|
|
343
|
+
], TuiCarouselDraggableDirective.prototype, "draggable", void 0);
|
|
344
|
+
__decorate([
|
|
345
|
+
core.HostBinding('class._transitioned')
|
|
346
|
+
], TuiCarouselDraggableDirective.prototype, "transitioned", void 0);
|
|
347
|
+
__decorate([
|
|
348
|
+
core.HostListener('mousedown.silent')
|
|
349
|
+
], TuiCarouselDraggableDirective.prototype, "onMouseDown", null);
|
|
350
|
+
__decorate([
|
|
351
|
+
core.HostListener('transitionend', ['$event.target'])
|
|
352
|
+
], TuiCarouselDraggableDirective.prototype, "onTransitionEnd", null);
|
|
353
|
+
TuiCarouselDraggableDirective = __decorate([
|
|
354
|
+
core.Directive({
|
|
355
|
+
selector: 'tui-carousel[draggable]',
|
|
356
|
+
providers: [cdk.TuiPanService],
|
|
357
|
+
}),
|
|
358
|
+
__param(0, core.Inject(common$1.DOCUMENT)),
|
|
359
|
+
__param(1, core.Inject(cdk.TUI_IS_MOBILE)),
|
|
360
|
+
__param(2, core.Inject(intersectionObserver.INTERSECTION_ROOT)),
|
|
361
|
+
__param(3, core.Inject(cdk.TuiPanService))
|
|
362
|
+
], TuiCarouselDraggableDirective);
|
|
363
|
+
return TuiCarouselDraggableDirective;
|
|
364
|
+
}(rxjs.Observable));
|
|
365
|
+
|
|
366
|
+
var TuiCarouselComponent = /** @class */ (function () {
|
|
367
|
+
function TuiCarouselComponent(transform$, index$) {
|
|
368
|
+
var _this = this;
|
|
369
|
+
this.transform$ = transform$;
|
|
370
|
+
this.index$ = index$;
|
|
371
|
+
this.intersected$ = new rxjs.Subject();
|
|
372
|
+
this.itemsCount = 1;
|
|
373
|
+
this.index = 0;
|
|
374
|
+
this.indexChange = new core.EventEmitter();
|
|
375
|
+
this.manual$ = this.index$.pipe(operators.map(function (index) { return _this.loopback(index); }));
|
|
376
|
+
this.attached = false;
|
|
377
|
+
this.items = cdk.EMPTY_QUERY;
|
|
378
|
+
}
|
|
379
|
+
TuiCarouselComponent.prototype.getStyle = function (itemsCount) {
|
|
380
|
+
var percent = 100 / itemsCount + "%";
|
|
381
|
+
return {
|
|
382
|
+
flexBasis: percent,
|
|
383
|
+
minWidth: percent,
|
|
384
|
+
maxWidth: percent,
|
|
385
|
+
};
|
|
386
|
+
};
|
|
387
|
+
TuiCarouselComponent.prototype.onIntersection = function (_a, index) {
|
|
388
|
+
var intersectionRatio = _a.intersectionRatio, intersectionRect = _a.intersectionRect, rootBounds = _a.rootBounds;
|
|
389
|
+
if (!this.attached ||
|
|
390
|
+
!intersectionRatio ||
|
|
391
|
+
intersectionRatio === 1 ||
|
|
392
|
+
// Phantom intersections due to width wobble on drag
|
|
393
|
+
intersectionRect.left > Number(rootBounds === null || rootBounds === void 0 ? void 0 : rootBounds.left)) {
|
|
394
|
+
return;
|
|
395
|
+
}
|
|
396
|
+
this.indexChange.emit(index - Math.floor(this.itemsCount / 2));
|
|
397
|
+
};
|
|
398
|
+
TuiCarouselComponent.prototype.onPresent = function (attached) {
|
|
399
|
+
this.attached = attached;
|
|
400
|
+
};
|
|
401
|
+
TuiCarouselComponent.prototype.loopback = function (index) {
|
|
402
|
+
var safe = this.items.length || index + 1;
|
|
403
|
+
var remainder = index % safe;
|
|
404
|
+
return remainder < 0 ? remainder + this.items.length : remainder;
|
|
405
|
+
};
|
|
406
|
+
TuiCarouselComponent.ctorParameters = function () { return [
|
|
407
|
+
{ type: rxjs.Observable, decorators: [{ type: core.Optional }, { type: core.Inject, args: [TuiCarouselDraggableDirective,] }] },
|
|
408
|
+
{ type: rxjs.Observable, decorators: [{ type: core.Inject, args: [TuiCarouselDirective,] }] }
|
|
409
|
+
]; };
|
|
410
|
+
__decorate([
|
|
411
|
+
core.Input(),
|
|
412
|
+
cdk.tuiDefaultProp()
|
|
413
|
+
], TuiCarouselComponent.prototype, "itemsCount", void 0);
|
|
414
|
+
__decorate([
|
|
415
|
+
core.Input(),
|
|
416
|
+
cdk.tuiDefaultProp()
|
|
417
|
+
], TuiCarouselComponent.prototype, "index", void 0);
|
|
418
|
+
__decorate([
|
|
419
|
+
core.Output()
|
|
420
|
+
], TuiCarouselComponent.prototype, "indexChange", void 0);
|
|
421
|
+
__decorate([
|
|
422
|
+
core.ContentChildren(cdk.TuiItemDirective, { read: core.TemplateRef })
|
|
423
|
+
], TuiCarouselComponent.prototype, "items", void 0);
|
|
424
|
+
__decorate([
|
|
425
|
+
cdk.tuiPure
|
|
426
|
+
], TuiCarouselComponent.prototype, "getStyle", null);
|
|
427
|
+
TuiCarouselComponent = __decorate([
|
|
428
|
+
core.Component({
|
|
429
|
+
selector: 'tui-carousel',
|
|
430
|
+
template: "<ng-container *ngIf=\"items.changes | async\"></ng-container>\n<div\n *ngIf=\"{\n manual: manual$ | async,\n intersected: indexChange | async\n } as state\"\n waIntersectionObserver\n waIntersectionThreshold=\"0,1\"\n waIntersectionRootMargin=\"100px 100000px 100px -51%\"\n class=\"t-items\"\n [class.t-items_visible]=\"attached\"\n [style.transform]=\"transform$ | async\"\n (tuiPresentChange)=\"onPresent($event)\"\n>\n <div\n *ngFor=\"let item of items; let i = index\"\n tuiCarouselScroller\n class=\"t-item\"\n [scroll]=\"attached && i === state.manual && i !== state.intersected\"\n [index]=\"i\"\n [current]=\"state.intersected\"\n [ngStyle]=\"getStyle(itemsCount)\"\n (waIntersectionObservee)=\"onIntersection($event[0], i)\"\n >\n <ng-container [ngTemplateOutlet]=\"item\"></ng-container>\n </div>\n</div>\n<div class=\"t-content\">\n <ng-content></ng-content>\n</div>\n",
|
|
431
|
+
changeDetection: core.ChangeDetectionStrategy.OnPush,
|
|
432
|
+
providers: [
|
|
433
|
+
{
|
|
434
|
+
provide: intersectionObserver.INTERSECTION_ROOT,
|
|
435
|
+
useExisting: core.ElementRef,
|
|
436
|
+
},
|
|
437
|
+
],
|
|
438
|
+
styles: [":host{scrollbar-width:none;-ms-overflow-style:none;position:relative;display:block;overflow:auto;overscroll-behavior-x:none;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory}:host::-webkit-scrollbar,:host::-webkit-scrollbar-thumb{background:0 0;width:0;height:0}:host._transitioned{-ms-scroll-snap-type:none;scroll-snap-type:none}:host._draggable{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host._draggable:hover{cursor:-webkit-grab;cursor:grab}:host._draggable:active{cursor:-webkit-grabbing;cursor:grabbing}.t-items{display:flex;align-items:center;visibility:hidden}.t-items_visible{visibility:visible}.t-items:not([style*=transform]){transition-property:transform;transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out}.t-item{padding:0 1.25rem;flex:1;min-width:100%;max-width:100%;box-sizing:border-box;scroll-snap-align:start;scroll-snap-stop:always}.t-content{position:sticky;left:0;display:flex;justify-content:center}"]
|
|
439
|
+
}),
|
|
440
|
+
__param(0, core.Optional()),
|
|
441
|
+
__param(0, core.Inject(TuiCarouselDraggableDirective)),
|
|
442
|
+
__param(1, core.Inject(TuiCarouselDirective))
|
|
443
|
+
], TuiCarouselComponent);
|
|
444
|
+
return TuiCarouselComponent;
|
|
445
|
+
}());
|
|
446
|
+
|
|
447
|
+
// TODO: remove in ivy compilation
|
|
448
|
+
var CAROUSEL_BUTTON_OPTIONS = {
|
|
449
|
+
appearance: "secondary" /* Secondary */,
|
|
450
|
+
shape: 'rounded',
|
|
451
|
+
size: 'm',
|
|
452
|
+
};
|
|
453
|
+
var TuiCarouselButtonsDirective = /** @class */ (function () {
|
|
454
|
+
function TuiCarouselButtonsDirective() {
|
|
455
|
+
}
|
|
456
|
+
TuiCarouselButtonsDirective = __decorate([
|
|
457
|
+
core.Directive({
|
|
458
|
+
selector: '[tuiCarouselButtons]',
|
|
459
|
+
providers: [
|
|
460
|
+
{
|
|
461
|
+
provide: core$1.TUI_BUTTON_OPTIONS,
|
|
462
|
+
useValue: CAROUSEL_BUTTON_OPTIONS,
|
|
463
|
+
},
|
|
464
|
+
],
|
|
465
|
+
})
|
|
466
|
+
], TuiCarouselButtonsDirective);
|
|
467
|
+
return TuiCarouselButtonsDirective;
|
|
468
|
+
}());
|
|
469
|
+
|
|
470
|
+
function shouldScroll() {
|
|
471
|
+
var _a;
|
|
472
|
+
return !this.isMobile && !!((_a = this.draggable) === null || _a === void 0 ? void 0 : _a.draggable) && this.index === this.current;
|
|
473
|
+
}
|
|
474
|
+
// @dynamic
|
|
475
|
+
var TuiCarouselScrollerDirective = /** @class */ (function () {
|
|
476
|
+
function TuiCarouselScrollerDirective(draggable, isMobile, directive, elementRef, root) {
|
|
477
|
+
this.draggable = draggable;
|
|
478
|
+
this.isMobile = isMobile;
|
|
479
|
+
this.directive = directive;
|
|
480
|
+
this.elementRef = elementRef;
|
|
481
|
+
this.root = root;
|
|
482
|
+
this.index = 0;
|
|
483
|
+
this.current = 0;
|
|
484
|
+
}
|
|
485
|
+
Object.defineProperty(TuiCarouselScrollerDirective.prototype, "scroll", {
|
|
486
|
+
set: function (scroll) {
|
|
487
|
+
if (scroll) {
|
|
488
|
+
this.scrollTo(this.directive.inited ? 'smooth' : 'auto');
|
|
489
|
+
}
|
|
490
|
+
},
|
|
491
|
+
enumerable: true,
|
|
492
|
+
configurable: true
|
|
493
|
+
});
|
|
494
|
+
TuiCarouselScrollerDirective.prototype.onMouseUp = function (_e) {
|
|
495
|
+
var left = this.root.nativeElement.getBoundingClientRect().left;
|
|
496
|
+
var rect = this.elementRef.nativeElement.getBoundingClientRect();
|
|
497
|
+
var parentElement = this.elementRef.nativeElement.parentElement;
|
|
498
|
+
parentElement.style.transform = "translateX(" + (rect.left - left) + "px)";
|
|
499
|
+
this.scrollTo();
|
|
500
|
+
};
|
|
501
|
+
TuiCarouselScrollerDirective.prototype.scrollTo = function (behavior) {
|
|
502
|
+
if (behavior === void 0) { behavior = 'auto'; }
|
|
503
|
+
this.directive.inited = true;
|
|
504
|
+
this.root.nativeElement.scrollTo({
|
|
505
|
+
left: this.elementRef.nativeElement.offsetLeft,
|
|
506
|
+
behavior: behavior,
|
|
507
|
+
});
|
|
508
|
+
};
|
|
509
|
+
TuiCarouselScrollerDirective.ctorParameters = function () { return [
|
|
510
|
+
{ type: TuiCarouselDraggableDirective, decorators: [{ type: core.Optional }, { type: core.Inject, args: [TuiCarouselDraggableDirective,] }] },
|
|
511
|
+
{ type: Boolean, decorators: [{ type: core.Inject, args: [cdk.TUI_IS_MOBILE,] }] },
|
|
512
|
+
{ type: TuiCarouselDirective, decorators: [{ type: core.Inject, args: [TuiCarouselDirective,] }] },
|
|
513
|
+
{ type: core.ElementRef, decorators: [{ type: core.Inject, args: [core.ElementRef,] }] },
|
|
514
|
+
{ type: core.ElementRef, decorators: [{ type: core.Inject, args: [intersectionObserver.INTERSECTION_ROOT,] }] }
|
|
515
|
+
]; };
|
|
516
|
+
__decorate([
|
|
517
|
+
core.Input()
|
|
518
|
+
], TuiCarouselScrollerDirective.prototype, "scroll", null);
|
|
519
|
+
__decorate([
|
|
520
|
+
core.Input()
|
|
521
|
+
], TuiCarouselScrollerDirective.prototype, "index", void 0);
|
|
522
|
+
__decorate([
|
|
523
|
+
core.Input()
|
|
524
|
+
], TuiCarouselScrollerDirective.prototype, "current", void 0);
|
|
525
|
+
__decorate([
|
|
526
|
+
core.HostListener('document:mouseup.init', ['$event']),
|
|
527
|
+
core.HostListener('document:mouseup.silent', ['$event']),
|
|
528
|
+
ngEventPlugins.shouldCall(shouldScroll)
|
|
529
|
+
], TuiCarouselScrollerDirective.prototype, "onMouseUp", null);
|
|
530
|
+
TuiCarouselScrollerDirective = __decorate([
|
|
531
|
+
core.Directive({
|
|
532
|
+
selector: '[tuiCarouselScroller]',
|
|
533
|
+
}),
|
|
534
|
+
__param(0, core.Optional()),
|
|
535
|
+
__param(0, core.Inject(TuiCarouselDraggableDirective)),
|
|
536
|
+
__param(1, core.Inject(cdk.TUI_IS_MOBILE)),
|
|
537
|
+
__param(2, core.Inject(TuiCarouselDirective)),
|
|
538
|
+
__param(3, core.Inject(core.ElementRef)),
|
|
539
|
+
__param(4, core.Inject(intersectionObserver.INTERSECTION_ROOT))
|
|
540
|
+
], TuiCarouselScrollerDirective);
|
|
541
|
+
return TuiCarouselScrollerDirective;
|
|
542
|
+
}());
|
|
543
|
+
|
|
544
|
+
var TuiCarouselModule = /** @class */ (function () {
|
|
545
|
+
function TuiCarouselModule() {
|
|
546
|
+
}
|
|
547
|
+
TuiCarouselModule = __decorate([
|
|
548
|
+
core.NgModule({
|
|
549
|
+
imports: [common$1.CommonModule, intersectionObserver.IntersectionObserverModule, cdk.TuiItemModule, directives.TuiPresentModule],
|
|
550
|
+
declarations: [
|
|
551
|
+
TuiCarouselComponent,
|
|
552
|
+
TuiCarouselDirective,
|
|
553
|
+
TuiCarouselScrollerDirective,
|
|
554
|
+
TuiCarouselDraggableDirective,
|
|
555
|
+
TuiCarouselButtonsDirective,
|
|
556
|
+
],
|
|
557
|
+
exports: [
|
|
558
|
+
TuiCarouselComponent,
|
|
559
|
+
TuiCarouselDirective,
|
|
560
|
+
TuiCarouselButtonsDirective,
|
|
561
|
+
TuiCarouselDraggableDirective,
|
|
562
|
+
cdk.TuiItemDirective,
|
|
563
|
+
],
|
|
564
|
+
})
|
|
565
|
+
], TuiCarouselModule);
|
|
566
|
+
return TuiCarouselModule;
|
|
567
|
+
}());
|
|
568
|
+
|
|
569
|
+
exports.CAROUSEL_BUTTON_OPTIONS = CAROUSEL_BUTTON_OPTIONS;
|
|
570
|
+
exports.TuiCarouselButtonsDirective = TuiCarouselButtonsDirective;
|
|
571
|
+
exports.TuiCarouselComponent = TuiCarouselComponent;
|
|
572
|
+
exports.TuiCarouselDirective = TuiCarouselDirective;
|
|
573
|
+
exports.TuiCarouselDraggableDirective = TuiCarouselDraggableDirective;
|
|
574
|
+
exports.TuiCarouselModule = TuiCarouselModule;
|
|
575
|
+
exports.TuiCarouselScrollerDirective = TuiCarouselScrollerDirective;
|
|
576
|
+
exports.shouldScroll = shouldScroll;
|
|
577
|
+
|
|
578
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
579
|
+
|
|
580
|
+
})));
|
|
581
|
+
//# sourceMappingURL=taiga-ui-kit-components-carousel.umd.js.map
|