xv-webcomponents 1.16.4 → 1.16.6-qa.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/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/xv-accordion-v2_45.cjs.entry.js +3021 -255
- package/dist/cjs/xv-header-next.cjs.entry.js +1 -1
- package/dist/cjs/xv-mega-menu-next.cjs.entry.js +2 -2
- package/dist/cjs/xv-webcomponents.cjs.js +1 -1
- package/dist/collection/components/xv-data-table/_vars.js +1 -0
- package/dist/collection/components/xv-data-table/xv-data-table-row/xv-data-table-row.css +42 -0
- package/dist/collection/components/xv-data-table/xv-data-table-row/xv-data-table-row.js +23 -10
- package/dist/collection/components/xv-data-table/xv-data-table.js +170 -1
- package/dist/collection/components/xv-datepicker/xv-datepicker.js +6 -4
- package/dist/collection/components/xv-dropdown/xv-dropdown-item/xv-dropdown-item.js +1 -1
- package/dist/collection/components/xv-dropdown/xv-dropdown.js +1 -1
- package/dist/collection/components/xv-file-uploader/xv-file-uploader.js +1 -1
- package/dist/collection/components/xv-footer/xv-footer.js +1 -1
- package/dist/collection/components/xv-header/xv-header.js +1 -1
- package/dist/collection/components/xv-header-next/xv-header-next.js +1 -1
- package/dist/collection/components/xv-image-viewer/xv-image-viewer.js +1 -1
- package/dist/collection/components/xv-link/xv-link.js +1 -1
- package/dist/collection/components/xv-mega-menu/xv-mega-menu.js +2 -2
- package/dist/collection/components/xv-mega-menu-next/xv-mega-menu-next.js +2 -2
- package/dist/collection/components/xv-modal/xv-modal.js +1 -1
- package/dist/collection/components/xv-notification/xv-notification.js +1 -1
- package/dist/collection/components/xv-number-input/xv-number-input.js +2 -2
- package/dist/collection/components/xv-overflow-menu/xv-overflow-menu-item/xv-overflow-menu-item.js +1 -1
- package/dist/collection/components/xv-overflow-menu/xv-overflow-menu.js +2 -2
- package/dist/collection/components/xv-pagination/xv-pagination.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator-item/xv-progress-indicator-item.js +1 -1
- package/dist/collection/components/xv-progress-indicator/xv-progress-indicator.js +1 -1
- package/dist/collection/components/xv-radio/xv-radio.js +2 -2
- package/dist/collection/components/xv-slider/xv-slider.js +1 -1
- package/dist/collection/components/xv-table/xv-table-cell/xv-table-cell.js +1 -1
- package/dist/collection/components/xv-table/xv-table-expand/xv-table-expand.js +1 -1
- package/dist/collection/components/xv-table/xv-table-row/xv-table-row.js +1 -1
- package/dist/collection/components/xv-table/xv-table.js +1 -1
- package/dist/collection/components/xv-tabs/xv-tab/xv-tab.js +1 -1
- package/dist/collection/components/xv-tag/xv-tag.js +1 -1
- package/dist/collection/components/xv-tag-combobox/xv-tag-combobox.js +2 -2
- package/dist/collection/components/xv-text-input/xv-text-input.js +2 -2
- package/dist/collection/components/xv-textarea/xv-textarea.js +2 -2
- package/dist/collection/components/xv-tile/xv-tile.js +2 -2
- package/dist/collection/components/xv-toggle/xv-toggle.js +1 -1
- package/dist/collection/components/xv-toggle-tip/xv-toggle-tip.js +1 -1
- package/dist/collection/components/xv-tooltip/xv-tooltip.js +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/xv-accordion-v2_45.entry.js +2823 -57
- package/dist/esm/xv-header-next.entry.js +1 -1
- package/dist/esm/xv-mega-menu-next.entry.js +2 -2
- package/dist/esm/xv-webcomponents.js +1 -1
- package/dist/types/components/xv-data-table/_vars.d.ts +5 -0
- package/dist/types/components/xv-data-table/xv-data-table-row/xv-data-table-row.d.ts +2 -0
- package/dist/types/components/xv-data-table/xv-data-table.d.ts +17 -0
- package/dist/types/components.d.ts +34 -2
- package/dist/xv-webcomponents/{p-c87b62cb.entry.js → p-1b5a4f4c.entry.js} +1 -1
- package/dist/xv-webcomponents/{p-877bab0c.entry.js → p-50f8cd72.entry.js} +1 -1
- package/dist/xv-webcomponents/p-c43cd74e.entry.js +8 -0
- package/dist/xv-webcomponents/xv-webcomponents.esm.js +1 -1
- package/package.json +4 -2
- package/dist/xv-webcomponents/p-d8f4b7d3.entry.js +0 -1
|
@@ -269,20 +269,2776 @@ const XvCheckbox = class {
|
|
|
269
269
|
};
|
|
270
270
|
XvCheckbox.style = xvCheckboxCss();
|
|
271
271
|
|
|
272
|
+
/**!
|
|
273
|
+
* Sortable 1.15.7
|
|
274
|
+
* @author RubaXa <trash@rubaxa.org>
|
|
275
|
+
* @author owenm <owen23355@gmail.com>
|
|
276
|
+
* @license MIT
|
|
277
|
+
*/
|
|
278
|
+
function _defineProperty(e, r, t) {
|
|
279
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
280
|
+
value: t,
|
|
281
|
+
enumerable: true,
|
|
282
|
+
configurable: true,
|
|
283
|
+
writable: true
|
|
284
|
+
}) : e[r] = t, e;
|
|
285
|
+
}
|
|
286
|
+
function _extends() {
|
|
287
|
+
return _extends = Object.assign ? Object.assign.bind() : function (n) {
|
|
288
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
289
|
+
var t = arguments[e];
|
|
290
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
291
|
+
}
|
|
292
|
+
return n;
|
|
293
|
+
}, _extends.apply(null, arguments);
|
|
294
|
+
}
|
|
295
|
+
function ownKeys(e, r) {
|
|
296
|
+
var t = Object.keys(e);
|
|
297
|
+
if (Object.getOwnPropertySymbols) {
|
|
298
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
299
|
+
r && (o = o.filter(function (r) {
|
|
300
|
+
return Object.getOwnPropertyDescriptor(e, r).enumerable;
|
|
301
|
+
})), t.push.apply(t, o);
|
|
302
|
+
}
|
|
303
|
+
return t;
|
|
304
|
+
}
|
|
305
|
+
function _objectSpread2(e) {
|
|
306
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
307
|
+
var t = null != arguments[r] ? arguments[r] : {};
|
|
308
|
+
r % 2 ? ownKeys(Object(t), true).forEach(function (r) {
|
|
309
|
+
_defineProperty(e, r, t[r]);
|
|
310
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
|
|
311
|
+
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
|
|
312
|
+
});
|
|
313
|
+
}
|
|
314
|
+
return e;
|
|
315
|
+
}
|
|
316
|
+
function _objectWithoutProperties(e, t) {
|
|
317
|
+
if (null == e) return {};
|
|
318
|
+
var o,
|
|
319
|
+
r,
|
|
320
|
+
i = _objectWithoutPropertiesLoose(e, t);
|
|
321
|
+
if (Object.getOwnPropertySymbols) {
|
|
322
|
+
var n = Object.getOwnPropertySymbols(e);
|
|
323
|
+
for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
324
|
+
}
|
|
325
|
+
return i;
|
|
326
|
+
}
|
|
327
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
328
|
+
if (null == r) return {};
|
|
329
|
+
var t = {};
|
|
330
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
331
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
332
|
+
t[n] = r[n];
|
|
333
|
+
}
|
|
334
|
+
return t;
|
|
335
|
+
}
|
|
336
|
+
function _toPrimitive(t, r) {
|
|
337
|
+
if ("object" != typeof t || !t) return t;
|
|
338
|
+
var e = t[Symbol.toPrimitive];
|
|
339
|
+
if (void 0 !== e) {
|
|
340
|
+
var i = e.call(t, r);
|
|
341
|
+
if ("object" != typeof i) return i;
|
|
342
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
343
|
+
}
|
|
344
|
+
return ("string" === r ? String : Number)(t);
|
|
345
|
+
}
|
|
346
|
+
function _toPropertyKey(t) {
|
|
347
|
+
var i = _toPrimitive(t, "string");
|
|
348
|
+
return "symbol" == typeof i ? i : i + "";
|
|
349
|
+
}
|
|
350
|
+
function _typeof(o) {
|
|
351
|
+
"@babel/helpers - typeof";
|
|
352
|
+
|
|
353
|
+
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
|
|
354
|
+
return typeof o;
|
|
355
|
+
} : function (o) {
|
|
356
|
+
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
357
|
+
}, _typeof(o);
|
|
358
|
+
}
|
|
359
|
+
|
|
360
|
+
var version = "1.15.7";
|
|
361
|
+
|
|
362
|
+
function userAgent(pattern) {
|
|
363
|
+
if (typeof window !== 'undefined' && window.navigator) {
|
|
364
|
+
return !! /*@__PURE__*/navigator.userAgent.match(pattern);
|
|
365
|
+
}
|
|
366
|
+
}
|
|
367
|
+
var IE11OrLess = userAgent(/(?:Trident.*rv[ :]?11\.|msie|iemobile|Windows Phone)/i);
|
|
368
|
+
var Edge = userAgent(/Edge/i);
|
|
369
|
+
var FireFox = userAgent(/firefox/i);
|
|
370
|
+
var Safari = userAgent(/safari/i) && !userAgent(/chrome/i) && !userAgent(/android/i);
|
|
371
|
+
var IOS = userAgent(/iP(ad|od|hone)/i);
|
|
372
|
+
var ChromeForAndroid = userAgent(/chrome/i) && userAgent(/android/i);
|
|
373
|
+
|
|
374
|
+
var captureMode = {
|
|
375
|
+
capture: false,
|
|
376
|
+
passive: false
|
|
377
|
+
};
|
|
378
|
+
function on(el, event, fn) {
|
|
379
|
+
el.addEventListener(event, fn, !IE11OrLess && captureMode);
|
|
380
|
+
}
|
|
381
|
+
function off(el, event, fn) {
|
|
382
|
+
el.removeEventListener(event, fn, !IE11OrLess && captureMode);
|
|
383
|
+
}
|
|
384
|
+
function matches( /**HTMLElement*/el, /**String*/selector) {
|
|
385
|
+
if (!selector) return;
|
|
386
|
+
selector[0] === '>' && (selector = selector.substring(1));
|
|
387
|
+
if (el) {
|
|
388
|
+
try {
|
|
389
|
+
if (el.matches) {
|
|
390
|
+
return el.matches(selector);
|
|
391
|
+
} else if (el.msMatchesSelector) {
|
|
392
|
+
return el.msMatchesSelector(selector);
|
|
393
|
+
} else if (el.webkitMatchesSelector) {
|
|
394
|
+
return el.webkitMatchesSelector(selector);
|
|
395
|
+
}
|
|
396
|
+
} catch (_) {
|
|
397
|
+
return false;
|
|
398
|
+
}
|
|
399
|
+
}
|
|
400
|
+
return false;
|
|
401
|
+
}
|
|
402
|
+
function getParentOrHost(el) {
|
|
403
|
+
return el.host && el !== document && el.host.nodeType && el.host !== el ? el.host : el.parentNode;
|
|
404
|
+
}
|
|
405
|
+
function closest( /**HTMLElement*/el, /**String*/selector, /**HTMLElement*/ctx, includeCTX) {
|
|
406
|
+
if (el) {
|
|
407
|
+
ctx = ctx || document;
|
|
408
|
+
do {
|
|
409
|
+
if (selector != null && (selector[0] === '>' ? el.parentNode === ctx && matches(el, selector) : matches(el, selector)) || includeCTX && el === ctx) {
|
|
410
|
+
return el;
|
|
411
|
+
}
|
|
412
|
+
if (el === ctx) break;
|
|
413
|
+
/* jshint boss:true */
|
|
414
|
+
} while (el = getParentOrHost(el));
|
|
415
|
+
}
|
|
416
|
+
return null;
|
|
417
|
+
}
|
|
418
|
+
var R_SPACE = /\s+/g;
|
|
419
|
+
function toggleClass(el, name, state) {
|
|
420
|
+
if (el && name) {
|
|
421
|
+
if (el.classList) {
|
|
422
|
+
el.classList[state ? 'add' : 'remove'](name);
|
|
423
|
+
} else {
|
|
424
|
+
var className = (' ' + el.className + ' ').replace(R_SPACE, ' ').replace(' ' + name + ' ', ' ');
|
|
425
|
+
el.className = (className + (state ? ' ' + name : '')).replace(R_SPACE, ' ');
|
|
426
|
+
}
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
function css(el, prop, val) {
|
|
430
|
+
var style = el && el.style;
|
|
431
|
+
if (style) {
|
|
432
|
+
if (val === void 0) {
|
|
433
|
+
if (document.defaultView && document.defaultView.getComputedStyle) {
|
|
434
|
+
val = document.defaultView.getComputedStyle(el, '');
|
|
435
|
+
} else if (el.currentStyle) {
|
|
436
|
+
val = el.currentStyle;
|
|
437
|
+
}
|
|
438
|
+
return prop === void 0 ? val : val[prop];
|
|
439
|
+
} else {
|
|
440
|
+
if (!(prop in style) && prop.indexOf('webkit') === -1) {
|
|
441
|
+
prop = '-webkit-' + prop;
|
|
442
|
+
}
|
|
443
|
+
style[prop] = val + (typeof val === 'string' ? '' : 'px');
|
|
444
|
+
}
|
|
445
|
+
}
|
|
446
|
+
}
|
|
447
|
+
function matrix(el, selfOnly) {
|
|
448
|
+
var appliedTransforms = '';
|
|
449
|
+
if (typeof el === 'string') {
|
|
450
|
+
appliedTransforms = el;
|
|
451
|
+
} else {
|
|
452
|
+
do {
|
|
453
|
+
var transform = css(el, 'transform');
|
|
454
|
+
if (transform && transform !== 'none') {
|
|
455
|
+
appliedTransforms = transform + ' ' + appliedTransforms;
|
|
456
|
+
}
|
|
457
|
+
/* jshint boss:true */
|
|
458
|
+
} while (!selfOnly && (el = el.parentNode));
|
|
459
|
+
}
|
|
460
|
+
var matrixFn = window.DOMMatrix || window.WebKitCSSMatrix || window.CSSMatrix || window.MSCSSMatrix;
|
|
461
|
+
/*jshint -W056 */
|
|
462
|
+
return matrixFn && new matrixFn(appliedTransforms);
|
|
463
|
+
}
|
|
464
|
+
function find(ctx, tagName, iterator) {
|
|
465
|
+
if (ctx) {
|
|
466
|
+
var list = ctx.getElementsByTagName(tagName),
|
|
467
|
+
i = 0,
|
|
468
|
+
n = list.length;
|
|
469
|
+
if (iterator) {
|
|
470
|
+
for (; i < n; i++) {
|
|
471
|
+
iterator(list[i], i);
|
|
472
|
+
}
|
|
473
|
+
}
|
|
474
|
+
return list;
|
|
475
|
+
}
|
|
476
|
+
return [];
|
|
477
|
+
}
|
|
478
|
+
function getWindowScrollingElement() {
|
|
479
|
+
var scrollingElement = document.scrollingElement;
|
|
480
|
+
if (scrollingElement) {
|
|
481
|
+
return scrollingElement;
|
|
482
|
+
} else {
|
|
483
|
+
return document.documentElement;
|
|
484
|
+
}
|
|
485
|
+
}
|
|
486
|
+
|
|
487
|
+
/**
|
|
488
|
+
* Returns the "bounding client rect" of given element
|
|
489
|
+
* @param {HTMLElement} el The element whose boundingClientRect is wanted
|
|
490
|
+
* @param {[Boolean]} relativeToContainingBlock Whether the rect should be relative to the containing block of (including) the container
|
|
491
|
+
* @param {[Boolean]} relativeToNonStaticParent Whether the rect should be relative to the relative parent of (including) the contaienr
|
|
492
|
+
* @param {[Boolean]} undoScale Whether the container's scale() should be undone
|
|
493
|
+
* @param {[HTMLElement]} container The parent the element will be placed in
|
|
494
|
+
* @return {Object} The boundingClientRect of el, with specified adjustments
|
|
495
|
+
*/
|
|
496
|
+
function getRect(el, relativeToContainingBlock, relativeToNonStaticParent, undoScale, container) {
|
|
497
|
+
if (!el.getBoundingClientRect && el !== window) return;
|
|
498
|
+
var elRect, top, left, bottom, right, height, width;
|
|
499
|
+
if (el !== window && el.parentNode && el !== getWindowScrollingElement()) {
|
|
500
|
+
elRect = el.getBoundingClientRect();
|
|
501
|
+
top = elRect.top;
|
|
502
|
+
left = elRect.left;
|
|
503
|
+
bottom = elRect.bottom;
|
|
504
|
+
right = elRect.right;
|
|
505
|
+
height = elRect.height;
|
|
506
|
+
width = elRect.width;
|
|
507
|
+
} else {
|
|
508
|
+
top = 0;
|
|
509
|
+
left = 0;
|
|
510
|
+
bottom = window.innerHeight;
|
|
511
|
+
right = window.innerWidth;
|
|
512
|
+
height = window.innerHeight;
|
|
513
|
+
width = window.innerWidth;
|
|
514
|
+
}
|
|
515
|
+
if ((relativeToContainingBlock || relativeToNonStaticParent) && el !== window) {
|
|
516
|
+
// Adjust for translate()
|
|
517
|
+
container = container || el.parentNode;
|
|
518
|
+
|
|
519
|
+
// solves #1123 (see: https://stackoverflow.com/a/37953806/6088312)
|
|
520
|
+
// Not needed on <= IE11
|
|
521
|
+
if (!IE11OrLess) {
|
|
522
|
+
do {
|
|
523
|
+
if (container && container.getBoundingClientRect && (css(container, 'transform') !== 'none' || relativeToNonStaticParent && css(container, 'position') !== 'static')) {
|
|
524
|
+
var containerRect = container.getBoundingClientRect();
|
|
525
|
+
|
|
526
|
+
// Set relative to edges of padding box of container
|
|
527
|
+
top -= containerRect.top + parseInt(css(container, 'border-top-width'));
|
|
528
|
+
left -= containerRect.left + parseInt(css(container, 'border-left-width'));
|
|
529
|
+
bottom = top + elRect.height;
|
|
530
|
+
right = left + elRect.width;
|
|
531
|
+
break;
|
|
532
|
+
}
|
|
533
|
+
/* jshint boss:true */
|
|
534
|
+
} while (container = container.parentNode);
|
|
535
|
+
}
|
|
536
|
+
}
|
|
537
|
+
if (undoScale && el !== window) {
|
|
538
|
+
// Adjust for scale()
|
|
539
|
+
var elMatrix = matrix(container || el),
|
|
540
|
+
scaleX = elMatrix && elMatrix.a,
|
|
541
|
+
scaleY = elMatrix && elMatrix.d;
|
|
542
|
+
if (elMatrix) {
|
|
543
|
+
top /= scaleY;
|
|
544
|
+
left /= scaleX;
|
|
545
|
+
width /= scaleX;
|
|
546
|
+
height /= scaleY;
|
|
547
|
+
bottom = top + height;
|
|
548
|
+
right = left + width;
|
|
549
|
+
}
|
|
550
|
+
}
|
|
551
|
+
return {
|
|
552
|
+
top: top,
|
|
553
|
+
left: left,
|
|
554
|
+
bottom: bottom,
|
|
555
|
+
right: right,
|
|
556
|
+
width: width,
|
|
557
|
+
height: height
|
|
558
|
+
};
|
|
559
|
+
}
|
|
560
|
+
|
|
561
|
+
/**
|
|
562
|
+
* Checks if a side of an element is scrolled past a side of its parents
|
|
563
|
+
* @param {HTMLElement} el The element who's side being scrolled out of view is in question
|
|
564
|
+
* @param {String} elSide Side of the element in question ('top', 'left', 'right', 'bottom')
|
|
565
|
+
* @param {String} parentSide Side of the parent in question ('top', 'left', 'right', 'bottom')
|
|
566
|
+
* @return {HTMLElement} The parent scroll element that the el's side is scrolled past, or null if there is no such element
|
|
567
|
+
*/
|
|
568
|
+
function isScrolledPast(el, elSide, parentSide) {
|
|
569
|
+
var parent = getParentAutoScrollElement(el, true),
|
|
570
|
+
elSideVal = getRect(el)[elSide];
|
|
571
|
+
|
|
572
|
+
/* jshint boss:true */
|
|
573
|
+
while (parent) {
|
|
574
|
+
var parentSideVal = getRect(parent)[parentSide],
|
|
575
|
+
visible = void 0;
|
|
576
|
+
{
|
|
577
|
+
visible = elSideVal >= parentSideVal;
|
|
578
|
+
}
|
|
579
|
+
if (!visible) return parent;
|
|
580
|
+
if (parent === getWindowScrollingElement()) break;
|
|
581
|
+
parent = getParentAutoScrollElement(parent, false);
|
|
582
|
+
}
|
|
583
|
+
return false;
|
|
584
|
+
}
|
|
585
|
+
|
|
586
|
+
/**
|
|
587
|
+
* Gets nth child of el, ignoring hidden children, sortable's elements (does not ignore clone if it's visible)
|
|
588
|
+
* and non-draggable elements
|
|
589
|
+
* @param {HTMLElement} el The parent element
|
|
590
|
+
* @param {Number} childNum The index of the child
|
|
591
|
+
* @param {Object} options Parent Sortable's options
|
|
592
|
+
* @return {HTMLElement} The child at index childNum, or null if not found
|
|
593
|
+
*/
|
|
594
|
+
function getChild(el, childNum, options, includeDragEl) {
|
|
595
|
+
var currentChild = 0,
|
|
596
|
+
i = 0,
|
|
597
|
+
children = el.children;
|
|
598
|
+
while (i < children.length) {
|
|
599
|
+
if (children[i].style.display !== 'none' && children[i] !== Sortable.ghost && (includeDragEl || children[i] !== Sortable.dragged) && closest(children[i], options.draggable, el, false)) {
|
|
600
|
+
if (currentChild === childNum) {
|
|
601
|
+
return children[i];
|
|
602
|
+
}
|
|
603
|
+
currentChild++;
|
|
604
|
+
}
|
|
605
|
+
i++;
|
|
606
|
+
}
|
|
607
|
+
return null;
|
|
608
|
+
}
|
|
609
|
+
|
|
610
|
+
/**
|
|
611
|
+
* Gets the last child in the el, ignoring ghostEl or invisible elements (clones)
|
|
612
|
+
* @param {HTMLElement} el Parent element
|
|
613
|
+
* @param {selector} selector Any other elements that should be ignored
|
|
614
|
+
* @return {HTMLElement} The last child, ignoring ghostEl
|
|
615
|
+
*/
|
|
616
|
+
function lastChild(el, selector) {
|
|
617
|
+
var last = el.lastElementChild;
|
|
618
|
+
while (last && (last === Sortable.ghost || css(last, 'display') === 'none' || selector && !matches(last, selector))) {
|
|
619
|
+
last = last.previousElementSibling;
|
|
620
|
+
}
|
|
621
|
+
return last || null;
|
|
622
|
+
}
|
|
623
|
+
|
|
624
|
+
/**
|
|
625
|
+
* Returns the index of an element within its parent for a selected set of
|
|
626
|
+
* elements
|
|
627
|
+
* @param {HTMLElement} el
|
|
628
|
+
* @param {selector} selector
|
|
629
|
+
* @return {number}
|
|
630
|
+
*/
|
|
631
|
+
function index(el, selector) {
|
|
632
|
+
var index = 0;
|
|
633
|
+
if (!el || !el.parentNode) {
|
|
634
|
+
return -1;
|
|
635
|
+
}
|
|
636
|
+
|
|
637
|
+
/* jshint boss:true */
|
|
638
|
+
while (el = el.previousElementSibling) {
|
|
639
|
+
if (el.nodeName.toUpperCase() !== 'TEMPLATE' && el !== Sortable.clone && (!selector || matches(el, selector))) {
|
|
640
|
+
index++;
|
|
641
|
+
}
|
|
642
|
+
}
|
|
643
|
+
return index;
|
|
644
|
+
}
|
|
645
|
+
|
|
646
|
+
/**
|
|
647
|
+
* Returns the scroll offset of the given element, added with all the scroll offsets of parent elements.
|
|
648
|
+
* The value is returned in real pixels.
|
|
649
|
+
* @param {HTMLElement} el
|
|
650
|
+
* @return {Array} Offsets in the format of [left, top]
|
|
651
|
+
*/
|
|
652
|
+
function getRelativeScrollOffset(el) {
|
|
653
|
+
var offsetLeft = 0,
|
|
654
|
+
offsetTop = 0,
|
|
655
|
+
winScroller = getWindowScrollingElement();
|
|
656
|
+
if (el) {
|
|
657
|
+
do {
|
|
658
|
+
var elMatrix = matrix(el),
|
|
659
|
+
scaleX = elMatrix.a,
|
|
660
|
+
scaleY = elMatrix.d;
|
|
661
|
+
offsetLeft += el.scrollLeft * scaleX;
|
|
662
|
+
offsetTop += el.scrollTop * scaleY;
|
|
663
|
+
} while (el !== winScroller && (el = el.parentNode));
|
|
664
|
+
}
|
|
665
|
+
return [offsetLeft, offsetTop];
|
|
666
|
+
}
|
|
667
|
+
|
|
668
|
+
/**
|
|
669
|
+
* Returns the index of the object within the given array
|
|
670
|
+
* @param {Array} arr Array that may or may not hold the object
|
|
671
|
+
* @param {Object} obj An object that has a key-value pair unique to and identical to a key-value pair in the object you want to find
|
|
672
|
+
* @return {Number} The index of the object in the array, or -1
|
|
673
|
+
*/
|
|
674
|
+
function indexOfObject(arr, obj) {
|
|
675
|
+
for (var i in arr) {
|
|
676
|
+
if (!arr.hasOwnProperty(i)) continue;
|
|
677
|
+
for (var key in obj) {
|
|
678
|
+
if (obj.hasOwnProperty(key) && obj[key] === arr[i][key]) return Number(i);
|
|
679
|
+
}
|
|
680
|
+
}
|
|
681
|
+
return -1;
|
|
682
|
+
}
|
|
683
|
+
function getParentAutoScrollElement(el, includeSelf) {
|
|
684
|
+
// skip to window
|
|
685
|
+
if (!el || !el.getBoundingClientRect) return getWindowScrollingElement();
|
|
686
|
+
var elem = el;
|
|
687
|
+
var gotSelf = false;
|
|
688
|
+
do {
|
|
689
|
+
// we don't need to get elem css if it isn't even overflowing in the first place (performance)
|
|
690
|
+
if (elem.clientWidth < elem.scrollWidth || elem.clientHeight < elem.scrollHeight) {
|
|
691
|
+
var elemCSS = css(elem);
|
|
692
|
+
if (elem.clientWidth < elem.scrollWidth && (elemCSS.overflowX == 'auto' || elemCSS.overflowX == 'scroll') || elem.clientHeight < elem.scrollHeight && (elemCSS.overflowY == 'auto' || elemCSS.overflowY == 'scroll')) {
|
|
693
|
+
if (!elem.getBoundingClientRect || elem === document.body) return getWindowScrollingElement();
|
|
694
|
+
if (gotSelf || includeSelf) return elem;
|
|
695
|
+
gotSelf = true;
|
|
696
|
+
}
|
|
697
|
+
}
|
|
698
|
+
/* jshint boss:true */
|
|
699
|
+
} while (elem = elem.parentNode);
|
|
700
|
+
return getWindowScrollingElement();
|
|
701
|
+
}
|
|
702
|
+
function extend(dst, src) {
|
|
703
|
+
if (dst && src) {
|
|
704
|
+
for (var key in src) {
|
|
705
|
+
if (src.hasOwnProperty(key)) {
|
|
706
|
+
dst[key] = src[key];
|
|
707
|
+
}
|
|
708
|
+
}
|
|
709
|
+
}
|
|
710
|
+
return dst;
|
|
711
|
+
}
|
|
712
|
+
function isRectEqual(rect1, rect2) {
|
|
713
|
+
return Math.round(rect1.top) === Math.round(rect2.top) && Math.round(rect1.left) === Math.round(rect2.left) && Math.round(rect1.height) === Math.round(rect2.height) && Math.round(rect1.width) === Math.round(rect2.width);
|
|
714
|
+
}
|
|
715
|
+
var _throttleTimeout;
|
|
716
|
+
function throttle(callback, ms) {
|
|
717
|
+
return function () {
|
|
718
|
+
if (!_throttleTimeout) {
|
|
719
|
+
var args = arguments,
|
|
720
|
+
_this = this;
|
|
721
|
+
if (args.length === 1) {
|
|
722
|
+
callback.call(_this, args[0]);
|
|
723
|
+
} else {
|
|
724
|
+
callback.apply(_this, args);
|
|
725
|
+
}
|
|
726
|
+
_throttleTimeout = setTimeout(function () {
|
|
727
|
+
_throttleTimeout = void 0;
|
|
728
|
+
}, ms);
|
|
729
|
+
}
|
|
730
|
+
};
|
|
731
|
+
}
|
|
732
|
+
function cancelThrottle() {
|
|
733
|
+
clearTimeout(_throttleTimeout);
|
|
734
|
+
_throttleTimeout = void 0;
|
|
735
|
+
}
|
|
736
|
+
function scrollBy(el, x, y) {
|
|
737
|
+
el.scrollLeft += x;
|
|
738
|
+
el.scrollTop += y;
|
|
739
|
+
}
|
|
740
|
+
function clone(el) {
|
|
741
|
+
var Polymer = window.Polymer;
|
|
742
|
+
var $ = window.jQuery || window.Zepto;
|
|
743
|
+
if (Polymer && Polymer.dom) {
|
|
744
|
+
return Polymer.dom(el).cloneNode(true);
|
|
745
|
+
} else if ($) {
|
|
746
|
+
return $(el).clone(true)[0];
|
|
747
|
+
} else {
|
|
748
|
+
return el.cloneNode(true);
|
|
749
|
+
}
|
|
750
|
+
}
|
|
751
|
+
function getChildContainingRectFromElement(container, options, ghostEl) {
|
|
752
|
+
var rect = {};
|
|
753
|
+
Array.from(container.children).forEach(function (child) {
|
|
754
|
+
var _rect$left, _rect$top, _rect$right, _rect$bottom;
|
|
755
|
+
if (!closest(child, options.draggable, container, false) || child.animated || child === ghostEl) return;
|
|
756
|
+
var childRect = getRect(child);
|
|
757
|
+
rect.left = Math.min((_rect$left = rect.left) !== null && _rect$left !== void 0 ? _rect$left : Infinity, childRect.left);
|
|
758
|
+
rect.top = Math.min((_rect$top = rect.top) !== null && _rect$top !== void 0 ? _rect$top : Infinity, childRect.top);
|
|
759
|
+
rect.right = Math.max((_rect$right = rect.right) !== null && _rect$right !== void 0 ? _rect$right : -Infinity, childRect.right);
|
|
760
|
+
rect.bottom = Math.max((_rect$bottom = rect.bottom) !== null && _rect$bottom !== void 0 ? _rect$bottom : -Infinity, childRect.bottom);
|
|
761
|
+
});
|
|
762
|
+
rect.width = rect.right - rect.left;
|
|
763
|
+
rect.height = rect.bottom - rect.top;
|
|
764
|
+
rect.x = rect.left;
|
|
765
|
+
rect.y = rect.top;
|
|
766
|
+
return rect;
|
|
767
|
+
}
|
|
768
|
+
var expando = 'Sortable' + new Date().getTime();
|
|
769
|
+
|
|
770
|
+
function AnimationStateManager() {
|
|
771
|
+
var animationStates = [],
|
|
772
|
+
animationCallbackId;
|
|
773
|
+
return {
|
|
774
|
+
captureAnimationState: function captureAnimationState() {
|
|
775
|
+
animationStates = [];
|
|
776
|
+
if (!this.options.animation) return;
|
|
777
|
+
var children = [].slice.call(this.el.children);
|
|
778
|
+
children.forEach(function (child) {
|
|
779
|
+
if (css(child, 'display') === 'none' || child === Sortable.ghost) return;
|
|
780
|
+
animationStates.push({
|
|
781
|
+
target: child,
|
|
782
|
+
rect: getRect(child)
|
|
783
|
+
});
|
|
784
|
+
var fromRect = _objectSpread2({}, animationStates[animationStates.length - 1].rect);
|
|
785
|
+
|
|
786
|
+
// If animating: compensate for current animation
|
|
787
|
+
if (child.thisAnimationDuration) {
|
|
788
|
+
var childMatrix = matrix(child, true);
|
|
789
|
+
if (childMatrix) {
|
|
790
|
+
fromRect.top -= childMatrix.f;
|
|
791
|
+
fromRect.left -= childMatrix.e;
|
|
792
|
+
}
|
|
793
|
+
}
|
|
794
|
+
child.fromRect = fromRect;
|
|
795
|
+
});
|
|
796
|
+
},
|
|
797
|
+
addAnimationState: function addAnimationState(state) {
|
|
798
|
+
animationStates.push(state);
|
|
799
|
+
},
|
|
800
|
+
removeAnimationState: function removeAnimationState(target) {
|
|
801
|
+
animationStates.splice(indexOfObject(animationStates, {
|
|
802
|
+
target: target
|
|
803
|
+
}), 1);
|
|
804
|
+
},
|
|
805
|
+
animateAll: function animateAll(callback) {
|
|
806
|
+
var _this = this;
|
|
807
|
+
if (!this.options.animation) {
|
|
808
|
+
clearTimeout(animationCallbackId);
|
|
809
|
+
if (typeof callback === 'function') callback();
|
|
810
|
+
return;
|
|
811
|
+
}
|
|
812
|
+
var animating = false,
|
|
813
|
+
animationTime = 0;
|
|
814
|
+
animationStates.forEach(function (state) {
|
|
815
|
+
var time = 0,
|
|
816
|
+
target = state.target,
|
|
817
|
+
fromRect = target.fromRect,
|
|
818
|
+
toRect = getRect(target),
|
|
819
|
+
prevFromRect = target.prevFromRect,
|
|
820
|
+
prevToRect = target.prevToRect,
|
|
821
|
+
animatingRect = state.rect,
|
|
822
|
+
targetMatrix = matrix(target, true);
|
|
823
|
+
if (targetMatrix) {
|
|
824
|
+
// Compensate for current animation
|
|
825
|
+
toRect.top -= targetMatrix.f;
|
|
826
|
+
toRect.left -= targetMatrix.e;
|
|
827
|
+
}
|
|
828
|
+
target.toRect = toRect;
|
|
829
|
+
if (target.thisAnimationDuration) {
|
|
830
|
+
// Could also check if animatingRect is between fromRect and toRect
|
|
831
|
+
if (isRectEqual(prevFromRect, toRect) && !isRectEqual(fromRect, toRect) &&
|
|
832
|
+
// Make sure animatingRect is on line between toRect & fromRect
|
|
833
|
+
(animatingRect.top - toRect.top) / (animatingRect.left - toRect.left) === (fromRect.top - toRect.top) / (fromRect.left - toRect.left)) {
|
|
834
|
+
// If returning to same place as started from animation and on same axis
|
|
835
|
+
time = calculateRealTime(animatingRect, prevFromRect, prevToRect, _this.options);
|
|
836
|
+
}
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
// if fromRect != toRect: animate
|
|
840
|
+
if (!isRectEqual(toRect, fromRect)) {
|
|
841
|
+
target.prevFromRect = fromRect;
|
|
842
|
+
target.prevToRect = toRect;
|
|
843
|
+
if (!time) {
|
|
844
|
+
time = _this.options.animation;
|
|
845
|
+
}
|
|
846
|
+
_this.animate(target, animatingRect, toRect, time);
|
|
847
|
+
}
|
|
848
|
+
if (time) {
|
|
849
|
+
animating = true;
|
|
850
|
+
animationTime = Math.max(animationTime, time);
|
|
851
|
+
clearTimeout(target.animationResetTimer);
|
|
852
|
+
target.animationResetTimer = setTimeout(function () {
|
|
853
|
+
target.animationTime = 0;
|
|
854
|
+
target.prevFromRect = null;
|
|
855
|
+
target.fromRect = null;
|
|
856
|
+
target.prevToRect = null;
|
|
857
|
+
target.thisAnimationDuration = null;
|
|
858
|
+
}, time);
|
|
859
|
+
target.thisAnimationDuration = time;
|
|
860
|
+
}
|
|
861
|
+
});
|
|
862
|
+
clearTimeout(animationCallbackId);
|
|
863
|
+
if (!animating) {
|
|
864
|
+
if (typeof callback === 'function') callback();
|
|
865
|
+
} else {
|
|
866
|
+
animationCallbackId = setTimeout(function () {
|
|
867
|
+
if (typeof callback === 'function') callback();
|
|
868
|
+
}, animationTime);
|
|
869
|
+
}
|
|
870
|
+
animationStates = [];
|
|
871
|
+
},
|
|
872
|
+
animate: function animate(target, currentRect, toRect, duration) {
|
|
873
|
+
if (duration) {
|
|
874
|
+
css(target, 'transition', '');
|
|
875
|
+
css(target, 'transform', '');
|
|
876
|
+
var elMatrix = matrix(this.el),
|
|
877
|
+
scaleX = elMatrix && elMatrix.a,
|
|
878
|
+
scaleY = elMatrix && elMatrix.d,
|
|
879
|
+
translateX = (currentRect.left - toRect.left) / (scaleX || 1),
|
|
880
|
+
translateY = (currentRect.top - toRect.top) / (scaleY || 1);
|
|
881
|
+
target.animatingX = !!translateX;
|
|
882
|
+
target.animatingY = !!translateY;
|
|
883
|
+
css(target, 'transform', 'translate3d(' + translateX + 'px,' + translateY + 'px,0)');
|
|
884
|
+
this.forRepaintDummy = repaint(target); // repaint
|
|
885
|
+
|
|
886
|
+
css(target, 'transition', 'transform ' + duration + 'ms' + (this.options.easing ? ' ' + this.options.easing : ''));
|
|
887
|
+
css(target, 'transform', 'translate3d(0,0,0)');
|
|
888
|
+
typeof target.animated === 'number' && clearTimeout(target.animated);
|
|
889
|
+
target.animated = setTimeout(function () {
|
|
890
|
+
css(target, 'transition', '');
|
|
891
|
+
css(target, 'transform', '');
|
|
892
|
+
target.animated = false;
|
|
893
|
+
target.animatingX = false;
|
|
894
|
+
target.animatingY = false;
|
|
895
|
+
}, duration);
|
|
896
|
+
}
|
|
897
|
+
}
|
|
898
|
+
};
|
|
899
|
+
}
|
|
900
|
+
function repaint(target) {
|
|
901
|
+
return target.offsetWidth;
|
|
902
|
+
}
|
|
903
|
+
function calculateRealTime(animatingRect, fromRect, toRect, options) {
|
|
904
|
+
return Math.sqrt(Math.pow(fromRect.top - animatingRect.top, 2) + Math.pow(fromRect.left - animatingRect.left, 2)) / Math.sqrt(Math.pow(fromRect.top - toRect.top, 2) + Math.pow(fromRect.left - toRect.left, 2)) * options.animation;
|
|
905
|
+
}
|
|
906
|
+
|
|
907
|
+
var plugins = [];
|
|
908
|
+
var defaults = {
|
|
909
|
+
initializeByDefault: true
|
|
910
|
+
};
|
|
911
|
+
var PluginManager = {
|
|
912
|
+
mount: function mount(plugin) {
|
|
913
|
+
// Set default static properties
|
|
914
|
+
for (var option in defaults) {
|
|
915
|
+
if (defaults.hasOwnProperty(option) && !(option in plugin)) {
|
|
916
|
+
plugin[option] = defaults[option];
|
|
917
|
+
}
|
|
918
|
+
}
|
|
919
|
+
plugins.forEach(function (p) {
|
|
920
|
+
if (p.pluginName === plugin.pluginName) {
|
|
921
|
+
throw "Sortable: Cannot mount plugin ".concat(plugin.pluginName, " more than once");
|
|
922
|
+
}
|
|
923
|
+
});
|
|
924
|
+
plugins.push(plugin);
|
|
925
|
+
},
|
|
926
|
+
pluginEvent: function pluginEvent(eventName, sortable, evt) {
|
|
927
|
+
var _this = this;
|
|
928
|
+
this.eventCanceled = false;
|
|
929
|
+
evt.cancel = function () {
|
|
930
|
+
_this.eventCanceled = true;
|
|
931
|
+
};
|
|
932
|
+
var eventNameGlobal = eventName + 'Global';
|
|
933
|
+
plugins.forEach(function (plugin) {
|
|
934
|
+
if (!sortable[plugin.pluginName]) return;
|
|
935
|
+
// Fire global events if it exists in this sortable
|
|
936
|
+
if (sortable[plugin.pluginName][eventNameGlobal]) {
|
|
937
|
+
sortable[plugin.pluginName][eventNameGlobal](_objectSpread2({
|
|
938
|
+
sortable: sortable
|
|
939
|
+
}, evt));
|
|
940
|
+
}
|
|
941
|
+
|
|
942
|
+
// Only fire plugin event if plugin is enabled in this sortable,
|
|
943
|
+
// and plugin has event defined
|
|
944
|
+
if (sortable.options[plugin.pluginName] && sortable[plugin.pluginName][eventName]) {
|
|
945
|
+
sortable[plugin.pluginName][eventName](_objectSpread2({
|
|
946
|
+
sortable: sortable
|
|
947
|
+
}, evt));
|
|
948
|
+
}
|
|
949
|
+
});
|
|
950
|
+
},
|
|
951
|
+
initializePlugins: function initializePlugins(sortable, el, defaults, options) {
|
|
952
|
+
plugins.forEach(function (plugin) {
|
|
953
|
+
var pluginName = plugin.pluginName;
|
|
954
|
+
if (!sortable.options[pluginName] && !plugin.initializeByDefault) return;
|
|
955
|
+
var initialized = new plugin(sortable, el, sortable.options);
|
|
956
|
+
initialized.sortable = sortable;
|
|
957
|
+
initialized.options = sortable.options;
|
|
958
|
+
sortable[pluginName] = initialized;
|
|
959
|
+
|
|
960
|
+
// Add default options from plugin
|
|
961
|
+
_extends(defaults, initialized.defaults);
|
|
962
|
+
});
|
|
963
|
+
for (var option in sortable.options) {
|
|
964
|
+
if (!sortable.options.hasOwnProperty(option)) continue;
|
|
965
|
+
var modified = this.modifyOption(sortable, option, sortable.options[option]);
|
|
966
|
+
if (typeof modified !== 'undefined') {
|
|
967
|
+
sortable.options[option] = modified;
|
|
968
|
+
}
|
|
969
|
+
}
|
|
970
|
+
},
|
|
971
|
+
getEventProperties: function getEventProperties(name, sortable) {
|
|
972
|
+
var eventProperties = {};
|
|
973
|
+
plugins.forEach(function (plugin) {
|
|
974
|
+
if (typeof plugin.eventProperties !== 'function') return;
|
|
975
|
+
_extends(eventProperties, plugin.eventProperties.call(sortable[plugin.pluginName], name));
|
|
976
|
+
});
|
|
977
|
+
return eventProperties;
|
|
978
|
+
},
|
|
979
|
+
modifyOption: function modifyOption(sortable, name, value) {
|
|
980
|
+
var modifiedValue;
|
|
981
|
+
plugins.forEach(function (plugin) {
|
|
982
|
+
// Plugin must exist on the Sortable
|
|
983
|
+
if (!sortable[plugin.pluginName]) return;
|
|
984
|
+
|
|
985
|
+
// If static option listener exists for this option, call in the context of the Sortable's instance of this plugin
|
|
986
|
+
if (plugin.optionListeners && typeof plugin.optionListeners[name] === 'function') {
|
|
987
|
+
modifiedValue = plugin.optionListeners[name].call(sortable[plugin.pluginName], value);
|
|
988
|
+
}
|
|
989
|
+
});
|
|
990
|
+
return modifiedValue;
|
|
991
|
+
}
|
|
992
|
+
};
|
|
993
|
+
|
|
994
|
+
function dispatchEvent(_ref) {
|
|
995
|
+
var sortable = _ref.sortable,
|
|
996
|
+
rootEl = _ref.rootEl,
|
|
997
|
+
name = _ref.name,
|
|
998
|
+
targetEl = _ref.targetEl,
|
|
999
|
+
cloneEl = _ref.cloneEl,
|
|
1000
|
+
toEl = _ref.toEl,
|
|
1001
|
+
fromEl = _ref.fromEl,
|
|
1002
|
+
oldIndex = _ref.oldIndex,
|
|
1003
|
+
newIndex = _ref.newIndex,
|
|
1004
|
+
oldDraggableIndex = _ref.oldDraggableIndex,
|
|
1005
|
+
newDraggableIndex = _ref.newDraggableIndex,
|
|
1006
|
+
originalEvent = _ref.originalEvent,
|
|
1007
|
+
putSortable = _ref.putSortable,
|
|
1008
|
+
extraEventProperties = _ref.extraEventProperties;
|
|
1009
|
+
sortable = sortable || rootEl && rootEl[expando];
|
|
1010
|
+
if (!sortable) return;
|
|
1011
|
+
var evt,
|
|
1012
|
+
options = sortable.options,
|
|
1013
|
+
onName = 'on' + name.charAt(0).toUpperCase() + name.substr(1);
|
|
1014
|
+
// Support for new CustomEvent feature
|
|
1015
|
+
if (window.CustomEvent && !IE11OrLess && !Edge) {
|
|
1016
|
+
evt = new CustomEvent(name, {
|
|
1017
|
+
bubbles: true,
|
|
1018
|
+
cancelable: true
|
|
1019
|
+
});
|
|
1020
|
+
} else {
|
|
1021
|
+
evt = document.createEvent('Event');
|
|
1022
|
+
evt.initEvent(name, true, true);
|
|
1023
|
+
}
|
|
1024
|
+
evt.to = toEl || rootEl;
|
|
1025
|
+
evt.from = fromEl || rootEl;
|
|
1026
|
+
evt.item = targetEl || rootEl;
|
|
1027
|
+
evt.clone = cloneEl;
|
|
1028
|
+
evt.oldIndex = oldIndex;
|
|
1029
|
+
evt.newIndex = newIndex;
|
|
1030
|
+
evt.oldDraggableIndex = oldDraggableIndex;
|
|
1031
|
+
evt.newDraggableIndex = newDraggableIndex;
|
|
1032
|
+
evt.originalEvent = originalEvent;
|
|
1033
|
+
evt.pullMode = putSortable ? putSortable.lastPutMode : undefined;
|
|
1034
|
+
var allEventProperties = _objectSpread2(_objectSpread2({}, extraEventProperties), PluginManager.getEventProperties(name, sortable));
|
|
1035
|
+
for (var option in allEventProperties) {
|
|
1036
|
+
evt[option] = allEventProperties[option];
|
|
1037
|
+
}
|
|
1038
|
+
if (rootEl) {
|
|
1039
|
+
rootEl.dispatchEvent(evt);
|
|
1040
|
+
}
|
|
1041
|
+
if (options[onName]) {
|
|
1042
|
+
options[onName].call(sortable, evt);
|
|
1043
|
+
}
|
|
1044
|
+
}
|
|
1045
|
+
|
|
1046
|
+
var _excluded = ["evt"];
|
|
1047
|
+
var pluginEvent = function pluginEvent(eventName, sortable) {
|
|
1048
|
+
var _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
|
|
1049
|
+
originalEvent = _ref.evt,
|
|
1050
|
+
data = _objectWithoutProperties(_ref, _excluded);
|
|
1051
|
+
PluginManager.pluginEvent.bind(Sortable)(eventName, sortable, _objectSpread2({
|
|
1052
|
+
dragEl: dragEl,
|
|
1053
|
+
parentEl: parentEl,
|
|
1054
|
+
ghostEl: ghostEl,
|
|
1055
|
+
rootEl: rootEl,
|
|
1056
|
+
nextEl: nextEl,
|
|
1057
|
+
lastDownEl: lastDownEl,
|
|
1058
|
+
cloneEl: cloneEl,
|
|
1059
|
+
cloneHidden: cloneHidden,
|
|
1060
|
+
dragStarted: moved,
|
|
1061
|
+
putSortable: putSortable,
|
|
1062
|
+
activeSortable: Sortable.active,
|
|
1063
|
+
originalEvent: originalEvent,
|
|
1064
|
+
oldIndex: oldIndex,
|
|
1065
|
+
oldDraggableIndex: oldDraggableIndex,
|
|
1066
|
+
newIndex: newIndex,
|
|
1067
|
+
newDraggableIndex: newDraggableIndex,
|
|
1068
|
+
hideGhostForTarget: _hideGhostForTarget,
|
|
1069
|
+
unhideGhostForTarget: _unhideGhostForTarget,
|
|
1070
|
+
cloneNowHidden: function cloneNowHidden() {
|
|
1071
|
+
cloneHidden = true;
|
|
1072
|
+
},
|
|
1073
|
+
cloneNowShown: function cloneNowShown() {
|
|
1074
|
+
cloneHidden = false;
|
|
1075
|
+
},
|
|
1076
|
+
dispatchSortableEvent: function dispatchSortableEvent(name) {
|
|
1077
|
+
_dispatchEvent({
|
|
1078
|
+
sortable: sortable,
|
|
1079
|
+
name: name,
|
|
1080
|
+
originalEvent: originalEvent
|
|
1081
|
+
});
|
|
1082
|
+
}
|
|
1083
|
+
}, data));
|
|
1084
|
+
};
|
|
1085
|
+
function _dispatchEvent(info) {
|
|
1086
|
+
dispatchEvent(_objectSpread2({
|
|
1087
|
+
putSortable: putSortable,
|
|
1088
|
+
cloneEl: cloneEl,
|
|
1089
|
+
targetEl: dragEl,
|
|
1090
|
+
rootEl: rootEl,
|
|
1091
|
+
oldIndex: oldIndex,
|
|
1092
|
+
oldDraggableIndex: oldDraggableIndex,
|
|
1093
|
+
newIndex: newIndex,
|
|
1094
|
+
newDraggableIndex: newDraggableIndex
|
|
1095
|
+
}, info));
|
|
1096
|
+
}
|
|
1097
|
+
var dragEl,
|
|
1098
|
+
parentEl,
|
|
1099
|
+
ghostEl,
|
|
1100
|
+
rootEl,
|
|
1101
|
+
nextEl,
|
|
1102
|
+
lastDownEl,
|
|
1103
|
+
cloneEl,
|
|
1104
|
+
cloneHidden,
|
|
1105
|
+
oldIndex,
|
|
1106
|
+
newIndex,
|
|
1107
|
+
oldDraggableIndex,
|
|
1108
|
+
newDraggableIndex,
|
|
1109
|
+
activeGroup,
|
|
1110
|
+
putSortable,
|
|
1111
|
+
awaitingDragStarted = false,
|
|
1112
|
+
ignoreNextClick = false,
|
|
1113
|
+
sortables = [],
|
|
1114
|
+
tapEvt,
|
|
1115
|
+
touchEvt,
|
|
1116
|
+
lastDx,
|
|
1117
|
+
lastDy,
|
|
1118
|
+
tapDistanceLeft,
|
|
1119
|
+
tapDistanceTop,
|
|
1120
|
+
moved,
|
|
1121
|
+
lastTarget,
|
|
1122
|
+
lastDirection,
|
|
1123
|
+
pastFirstInvertThresh = false,
|
|
1124
|
+
isCircumstantialInvert = false,
|
|
1125
|
+
targetMoveDistance,
|
|
1126
|
+
// For positioning ghost absolutely
|
|
1127
|
+
ghostRelativeParent,
|
|
1128
|
+
ghostRelativeParentInitialScroll = [],
|
|
1129
|
+
// (left, top)
|
|
1130
|
+
|
|
1131
|
+
_silent = false,
|
|
1132
|
+
savedInputChecked = [];
|
|
1133
|
+
|
|
1134
|
+
/** @const */
|
|
1135
|
+
var documentExists = typeof document !== 'undefined',
|
|
1136
|
+
PositionGhostAbsolutely = IOS,
|
|
1137
|
+
CSSFloatProperty = Edge || IE11OrLess ? 'cssFloat' : 'float',
|
|
1138
|
+
// This will not pass for IE9, because IE9 DnD only works on anchors
|
|
1139
|
+
supportDraggable = documentExists && !ChromeForAndroid && !IOS && 'draggable' in document.createElement('div'),
|
|
1140
|
+
supportCssPointerEvents = function () {
|
|
1141
|
+
if (!documentExists) return;
|
|
1142
|
+
// false when <= IE11
|
|
1143
|
+
if (IE11OrLess) {
|
|
1144
|
+
return false;
|
|
1145
|
+
}
|
|
1146
|
+
var el = document.createElement('x');
|
|
1147
|
+
el.style.cssText = 'pointer-events:auto';
|
|
1148
|
+
return el.style.pointerEvents === 'auto';
|
|
1149
|
+
}(),
|
|
1150
|
+
_detectDirection = function _detectDirection(el, options) {
|
|
1151
|
+
var elCSS = css(el),
|
|
1152
|
+
elWidth = parseInt(elCSS.width) - parseInt(elCSS.paddingLeft) - parseInt(elCSS.paddingRight) - parseInt(elCSS.borderLeftWidth) - parseInt(elCSS.borderRightWidth),
|
|
1153
|
+
child1 = getChild(el, 0, options),
|
|
1154
|
+
child2 = getChild(el, 1, options),
|
|
1155
|
+
firstChildCSS = child1 && css(child1),
|
|
1156
|
+
secondChildCSS = child2 && css(child2),
|
|
1157
|
+
firstChildWidth = firstChildCSS && parseInt(firstChildCSS.marginLeft) + parseInt(firstChildCSS.marginRight) + getRect(child1).width,
|
|
1158
|
+
secondChildWidth = secondChildCSS && parseInt(secondChildCSS.marginLeft) + parseInt(secondChildCSS.marginRight) + getRect(child2).width;
|
|
1159
|
+
if (elCSS.display === 'flex') {
|
|
1160
|
+
return elCSS.flexDirection === 'column' || elCSS.flexDirection === 'column-reverse' ? 'vertical' : 'horizontal';
|
|
1161
|
+
}
|
|
1162
|
+
if (elCSS.display === 'grid') {
|
|
1163
|
+
return elCSS.gridTemplateColumns.split(' ').length <= 1 ? 'vertical' : 'horizontal';
|
|
1164
|
+
}
|
|
1165
|
+
if (child1 && firstChildCSS["float"] && firstChildCSS["float"] !== 'none') {
|
|
1166
|
+
var touchingSideChild2 = firstChildCSS["float"] === 'left' ? 'left' : 'right';
|
|
1167
|
+
return child2 && (secondChildCSS.clear === 'both' || secondChildCSS.clear === touchingSideChild2) ? 'vertical' : 'horizontal';
|
|
1168
|
+
}
|
|
1169
|
+
return child1 && (firstChildCSS.display === 'block' || firstChildCSS.display === 'flex' || firstChildCSS.display === 'table' || firstChildCSS.display === 'grid' || firstChildWidth >= elWidth && elCSS[CSSFloatProperty] === 'none' || child2 && elCSS[CSSFloatProperty] === 'none' && firstChildWidth + secondChildWidth > elWidth) ? 'vertical' : 'horizontal';
|
|
1170
|
+
},
|
|
1171
|
+
_dragElInRowColumn = function _dragElInRowColumn(dragRect, targetRect, vertical) {
|
|
1172
|
+
var dragElS1Opp = vertical ? dragRect.left : dragRect.top,
|
|
1173
|
+
dragElS2Opp = vertical ? dragRect.right : dragRect.bottom,
|
|
1174
|
+
dragElOppLength = vertical ? dragRect.width : dragRect.height,
|
|
1175
|
+
targetS1Opp = vertical ? targetRect.left : targetRect.top,
|
|
1176
|
+
targetS2Opp = vertical ? targetRect.right : targetRect.bottom,
|
|
1177
|
+
targetOppLength = vertical ? targetRect.width : targetRect.height;
|
|
1178
|
+
return dragElS1Opp === targetS1Opp || dragElS2Opp === targetS2Opp || dragElS1Opp + dragElOppLength / 2 === targetS1Opp + targetOppLength / 2;
|
|
1179
|
+
},
|
|
1180
|
+
/**
|
|
1181
|
+
* Detects first nearest empty sortable to X and Y position using emptyInsertThreshold.
|
|
1182
|
+
* @param {Number} x X position
|
|
1183
|
+
* @param {Number} y Y position
|
|
1184
|
+
* @return {HTMLElement} Element of the first found nearest Sortable
|
|
1185
|
+
*/
|
|
1186
|
+
_detectNearestEmptySortable = function _detectNearestEmptySortable(x, y) {
|
|
1187
|
+
var ret;
|
|
1188
|
+
sortables.some(function (sortable) {
|
|
1189
|
+
var threshold = sortable[expando].options.emptyInsertThreshold;
|
|
1190
|
+
if (!threshold || lastChild(sortable)) return;
|
|
1191
|
+
var rect = getRect(sortable),
|
|
1192
|
+
insideHorizontally = x >= rect.left - threshold && x <= rect.right + threshold,
|
|
1193
|
+
insideVertically = y >= rect.top - threshold && y <= rect.bottom + threshold;
|
|
1194
|
+
if (insideHorizontally && insideVertically) {
|
|
1195
|
+
return ret = sortable;
|
|
1196
|
+
}
|
|
1197
|
+
});
|
|
1198
|
+
return ret;
|
|
1199
|
+
},
|
|
1200
|
+
_prepareGroup = function _prepareGroup(options) {
|
|
1201
|
+
function toFn(value, pull) {
|
|
1202
|
+
return function (to, from, dragEl, evt) {
|
|
1203
|
+
var sameGroup = to.options.group.name && from.options.group.name && to.options.group.name === from.options.group.name;
|
|
1204
|
+
if (value == null && (pull || sameGroup)) {
|
|
1205
|
+
// Default pull value
|
|
1206
|
+
// Default pull and put value if same group
|
|
1207
|
+
return true;
|
|
1208
|
+
} else if (value == null || value === false) {
|
|
1209
|
+
return false;
|
|
1210
|
+
} else if (pull && value === 'clone') {
|
|
1211
|
+
return value;
|
|
1212
|
+
} else if (typeof value === 'function') {
|
|
1213
|
+
return toFn(value(to, from, dragEl, evt), pull)(to, from, dragEl, evt);
|
|
1214
|
+
} else {
|
|
1215
|
+
var otherGroup = (pull ? to : from).options.group.name;
|
|
1216
|
+
return value === true || typeof value === 'string' && value === otherGroup || value.join && value.indexOf(otherGroup) > -1;
|
|
1217
|
+
}
|
|
1218
|
+
};
|
|
1219
|
+
}
|
|
1220
|
+
var group = {};
|
|
1221
|
+
var originalGroup = options.group;
|
|
1222
|
+
if (!originalGroup || _typeof(originalGroup) != 'object') {
|
|
1223
|
+
originalGroup = {
|
|
1224
|
+
name: originalGroup
|
|
1225
|
+
};
|
|
1226
|
+
}
|
|
1227
|
+
group.name = originalGroup.name;
|
|
1228
|
+
group.checkPull = toFn(originalGroup.pull, true);
|
|
1229
|
+
group.checkPut = toFn(originalGroup.put);
|
|
1230
|
+
group.revertClone = originalGroup.revertClone;
|
|
1231
|
+
options.group = group;
|
|
1232
|
+
},
|
|
1233
|
+
_hideGhostForTarget = function _hideGhostForTarget() {
|
|
1234
|
+
if (!supportCssPointerEvents && ghostEl) {
|
|
1235
|
+
css(ghostEl, 'display', 'none');
|
|
1236
|
+
}
|
|
1237
|
+
},
|
|
1238
|
+
_unhideGhostForTarget = function _unhideGhostForTarget() {
|
|
1239
|
+
if (!supportCssPointerEvents && ghostEl) {
|
|
1240
|
+
css(ghostEl, 'display', '');
|
|
1241
|
+
}
|
|
1242
|
+
};
|
|
1243
|
+
|
|
1244
|
+
// #1184 fix - Prevent click event on fallback if dragged but item not changed position
|
|
1245
|
+
if (documentExists && !ChromeForAndroid) {
|
|
1246
|
+
document.addEventListener('click', function (evt) {
|
|
1247
|
+
if (ignoreNextClick) {
|
|
1248
|
+
evt.preventDefault();
|
|
1249
|
+
evt.stopPropagation && evt.stopPropagation();
|
|
1250
|
+
evt.stopImmediatePropagation && evt.stopImmediatePropagation();
|
|
1251
|
+
ignoreNextClick = false;
|
|
1252
|
+
return false;
|
|
1253
|
+
}
|
|
1254
|
+
}, true);
|
|
1255
|
+
}
|
|
1256
|
+
var nearestEmptyInsertDetectEvent = function nearestEmptyInsertDetectEvent(evt) {
|
|
1257
|
+
if (dragEl) {
|
|
1258
|
+
evt = evt.touches ? evt.touches[0] : evt;
|
|
1259
|
+
var nearest = _detectNearestEmptySortable(evt.clientX, evt.clientY);
|
|
1260
|
+
if (nearest) {
|
|
1261
|
+
// Create imitation event
|
|
1262
|
+
var event = {};
|
|
1263
|
+
for (var i in evt) {
|
|
1264
|
+
if (evt.hasOwnProperty(i)) {
|
|
1265
|
+
event[i] = evt[i];
|
|
1266
|
+
}
|
|
1267
|
+
}
|
|
1268
|
+
event.target = event.rootEl = nearest;
|
|
1269
|
+
event.preventDefault = void 0;
|
|
1270
|
+
event.stopPropagation = void 0;
|
|
1271
|
+
nearest[expando]._onDragOver(event);
|
|
1272
|
+
}
|
|
1273
|
+
}
|
|
1274
|
+
};
|
|
1275
|
+
var _checkOutsideTargetEl = function _checkOutsideTargetEl(evt) {
|
|
1276
|
+
if (dragEl) {
|
|
1277
|
+
dragEl.parentNode[expando]._isOutsideThisEl(evt.target);
|
|
1278
|
+
}
|
|
1279
|
+
};
|
|
1280
|
+
|
|
1281
|
+
/**
|
|
1282
|
+
* @class Sortable
|
|
1283
|
+
* @param {HTMLElement} el
|
|
1284
|
+
* @param {Object} [options]
|
|
1285
|
+
*/
|
|
1286
|
+
function Sortable(el, options) {
|
|
1287
|
+
if (!(el && el.nodeType && el.nodeType === 1)) {
|
|
1288
|
+
throw "Sortable: `el` must be an HTMLElement, not ".concat({}.toString.call(el));
|
|
1289
|
+
}
|
|
1290
|
+
this.el = el; // root element
|
|
1291
|
+
this.options = options = _extends({}, options);
|
|
1292
|
+
|
|
1293
|
+
// Export instance
|
|
1294
|
+
el[expando] = this;
|
|
1295
|
+
var defaults = {
|
|
1296
|
+
group: null,
|
|
1297
|
+
sort: true,
|
|
1298
|
+
disabled: false,
|
|
1299
|
+
store: null,
|
|
1300
|
+
handle: null,
|
|
1301
|
+
draggable: /^[uo]l$/i.test(el.nodeName) ? '>li' : '>*',
|
|
1302
|
+
swapThreshold: 1,
|
|
1303
|
+
// percentage; 0 <= x <= 1
|
|
1304
|
+
invertSwap: false,
|
|
1305
|
+
// invert always
|
|
1306
|
+
invertedSwapThreshold: null,
|
|
1307
|
+
// will be set to same as swapThreshold if default
|
|
1308
|
+
removeCloneOnHide: true,
|
|
1309
|
+
direction: function direction() {
|
|
1310
|
+
return _detectDirection(el, this.options);
|
|
1311
|
+
},
|
|
1312
|
+
ghostClass: 'sortable-ghost',
|
|
1313
|
+
chosenClass: 'sortable-chosen',
|
|
1314
|
+
dragClass: 'sortable-drag',
|
|
1315
|
+
ignore: 'a, img',
|
|
1316
|
+
filter: null,
|
|
1317
|
+
preventOnFilter: true,
|
|
1318
|
+
animation: 0,
|
|
1319
|
+
easing: null,
|
|
1320
|
+
setData: function setData(dataTransfer, dragEl) {
|
|
1321
|
+
dataTransfer.setData('Text', dragEl.textContent);
|
|
1322
|
+
},
|
|
1323
|
+
dropBubble: false,
|
|
1324
|
+
dragoverBubble: false,
|
|
1325
|
+
dataIdAttr: 'data-id',
|
|
1326
|
+
delay: 0,
|
|
1327
|
+
delayOnTouchOnly: false,
|
|
1328
|
+
touchStartThreshold: (Number.parseInt ? Number : window).parseInt(window.devicePixelRatio, 10) || 1,
|
|
1329
|
+
forceFallback: false,
|
|
1330
|
+
fallbackClass: 'sortable-fallback',
|
|
1331
|
+
fallbackOnBody: false,
|
|
1332
|
+
fallbackTolerance: 0,
|
|
1333
|
+
fallbackOffset: {
|
|
1334
|
+
x: 0,
|
|
1335
|
+
y: 0
|
|
1336
|
+
},
|
|
1337
|
+
// Disabled on Safari: #1571; Enabled on Safari IOS: #2244
|
|
1338
|
+
supportPointer: Sortable.supportPointer !== false && 'PointerEvent' in window && (!Safari || IOS),
|
|
1339
|
+
emptyInsertThreshold: 5
|
|
1340
|
+
};
|
|
1341
|
+
PluginManager.initializePlugins(this, el, defaults);
|
|
1342
|
+
|
|
1343
|
+
// Set default options
|
|
1344
|
+
for (var name in defaults) {
|
|
1345
|
+
!(name in options) && (options[name] = defaults[name]);
|
|
1346
|
+
}
|
|
1347
|
+
_prepareGroup(options);
|
|
1348
|
+
|
|
1349
|
+
// Bind all private methods
|
|
1350
|
+
for (var fn in this) {
|
|
1351
|
+
if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
|
|
1352
|
+
this[fn] = this[fn].bind(this);
|
|
1353
|
+
}
|
|
1354
|
+
}
|
|
1355
|
+
|
|
1356
|
+
// Setup drag mode
|
|
1357
|
+
this.nativeDraggable = options.forceFallback ? false : supportDraggable;
|
|
1358
|
+
if (this.nativeDraggable) {
|
|
1359
|
+
// Touch start threshold cannot be greater than the native dragstart threshold
|
|
1360
|
+
this.options.touchStartThreshold = 1;
|
|
1361
|
+
}
|
|
1362
|
+
|
|
1363
|
+
// Bind events
|
|
1364
|
+
if (options.supportPointer) {
|
|
1365
|
+
on(el, 'pointerdown', this._onTapStart);
|
|
1366
|
+
} else {
|
|
1367
|
+
on(el, 'mousedown', this._onTapStart);
|
|
1368
|
+
on(el, 'touchstart', this._onTapStart);
|
|
1369
|
+
}
|
|
1370
|
+
if (this.nativeDraggable) {
|
|
1371
|
+
on(el, 'dragover', this);
|
|
1372
|
+
on(el, 'dragenter', this);
|
|
1373
|
+
}
|
|
1374
|
+
sortables.push(this.el);
|
|
1375
|
+
|
|
1376
|
+
// Restore sorting
|
|
1377
|
+
options.store && options.store.get && this.sort(options.store.get(this) || []);
|
|
1378
|
+
|
|
1379
|
+
// Add animation state manager
|
|
1380
|
+
_extends(this, AnimationStateManager());
|
|
1381
|
+
}
|
|
1382
|
+
Sortable.prototype = /** @lends Sortable.prototype */{
|
|
1383
|
+
constructor: Sortable,
|
|
1384
|
+
_isOutsideThisEl: function _isOutsideThisEl(target) {
|
|
1385
|
+
if (!this.el.contains(target) && target !== this.el) {
|
|
1386
|
+
lastTarget = null;
|
|
1387
|
+
}
|
|
1388
|
+
},
|
|
1389
|
+
_getDirection: function _getDirection(evt, target) {
|
|
1390
|
+
return typeof this.options.direction === 'function' ? this.options.direction.call(this, evt, target, dragEl) : this.options.direction;
|
|
1391
|
+
},
|
|
1392
|
+
_onTapStart: function _onTapStart( /** Event|TouchEvent */evt) {
|
|
1393
|
+
if (!evt.cancelable) return;
|
|
1394
|
+
var _this = this,
|
|
1395
|
+
el = this.el,
|
|
1396
|
+
options = this.options,
|
|
1397
|
+
preventOnFilter = options.preventOnFilter,
|
|
1398
|
+
type = evt.type,
|
|
1399
|
+
touch = evt.touches && evt.touches[0] || evt.pointerType && evt.pointerType === 'touch' && evt,
|
|
1400
|
+
target = (touch || evt).target,
|
|
1401
|
+
originalTarget = evt.target.shadowRoot && (evt.path && evt.path[0] || evt.composedPath && evt.composedPath()[0]) || target,
|
|
1402
|
+
filter = options.filter;
|
|
1403
|
+
_saveInputCheckedState(el);
|
|
1404
|
+
|
|
1405
|
+
// Don't trigger start event when an element is been dragged, otherwise the evt.oldindex always wrong when set option.group.
|
|
1406
|
+
if (dragEl) {
|
|
1407
|
+
return;
|
|
1408
|
+
}
|
|
1409
|
+
if (/mousedown|pointerdown/.test(type) && evt.button !== 0 || options.disabled) {
|
|
1410
|
+
return; // only left button and enabled
|
|
1411
|
+
}
|
|
1412
|
+
|
|
1413
|
+
// cancel dnd if original target is content editable
|
|
1414
|
+
if (originalTarget.isContentEditable) {
|
|
1415
|
+
return;
|
|
1416
|
+
}
|
|
1417
|
+
|
|
1418
|
+
// Safari ignores further event handling after mousedown
|
|
1419
|
+
if (!this.nativeDraggable && Safari && target && target.tagName.toUpperCase() === 'SELECT') {
|
|
1420
|
+
return;
|
|
1421
|
+
}
|
|
1422
|
+
target = closest(target, options.draggable, el, false);
|
|
1423
|
+
if (target && target.animated) {
|
|
1424
|
+
return;
|
|
1425
|
+
}
|
|
1426
|
+
if (lastDownEl === target) {
|
|
1427
|
+
// Ignoring duplicate `down`
|
|
1428
|
+
return;
|
|
1429
|
+
}
|
|
1430
|
+
|
|
1431
|
+
// Get the index of the dragged element within its parent
|
|
1432
|
+
oldIndex = index(target);
|
|
1433
|
+
oldDraggableIndex = index(target, options.draggable);
|
|
1434
|
+
|
|
1435
|
+
// Check filter
|
|
1436
|
+
if (typeof filter === 'function') {
|
|
1437
|
+
if (filter.call(this, evt, target, this)) {
|
|
1438
|
+
_dispatchEvent({
|
|
1439
|
+
sortable: _this,
|
|
1440
|
+
rootEl: originalTarget,
|
|
1441
|
+
name: 'filter',
|
|
1442
|
+
targetEl: target,
|
|
1443
|
+
toEl: el,
|
|
1444
|
+
fromEl: el
|
|
1445
|
+
});
|
|
1446
|
+
pluginEvent('filter', _this, {
|
|
1447
|
+
evt: evt
|
|
1448
|
+
});
|
|
1449
|
+
preventOnFilter && evt.preventDefault();
|
|
1450
|
+
return; // cancel dnd
|
|
1451
|
+
}
|
|
1452
|
+
} else if (filter) {
|
|
1453
|
+
filter = filter.split(',').some(function (criteria) {
|
|
1454
|
+
criteria = closest(originalTarget, criteria.trim(), el, false);
|
|
1455
|
+
if (criteria) {
|
|
1456
|
+
_dispatchEvent({
|
|
1457
|
+
sortable: _this,
|
|
1458
|
+
rootEl: criteria,
|
|
1459
|
+
name: 'filter',
|
|
1460
|
+
targetEl: target,
|
|
1461
|
+
fromEl: el,
|
|
1462
|
+
toEl: el
|
|
1463
|
+
});
|
|
1464
|
+
pluginEvent('filter', _this, {
|
|
1465
|
+
evt: evt
|
|
1466
|
+
});
|
|
1467
|
+
return true;
|
|
1468
|
+
}
|
|
1469
|
+
});
|
|
1470
|
+
if (filter) {
|
|
1471
|
+
preventOnFilter && evt.preventDefault();
|
|
1472
|
+
return; // cancel dnd
|
|
1473
|
+
}
|
|
1474
|
+
}
|
|
1475
|
+
if (options.handle && !closest(originalTarget, options.handle, el, false)) {
|
|
1476
|
+
return;
|
|
1477
|
+
}
|
|
1478
|
+
|
|
1479
|
+
// Prepare `dragstart`
|
|
1480
|
+
this._prepareDragStart(evt, touch, target);
|
|
1481
|
+
},
|
|
1482
|
+
_prepareDragStart: function _prepareDragStart( /** Event */evt, /** Touch */touch, /** HTMLElement */target) {
|
|
1483
|
+
var _this = this,
|
|
1484
|
+
el = _this.el,
|
|
1485
|
+
options = _this.options,
|
|
1486
|
+
ownerDocument = el.ownerDocument,
|
|
1487
|
+
dragStartFn;
|
|
1488
|
+
if (target && !dragEl && target.parentNode === el) {
|
|
1489
|
+
var dragRect = getRect(target);
|
|
1490
|
+
rootEl = el;
|
|
1491
|
+
dragEl = target;
|
|
1492
|
+
parentEl = dragEl.parentNode;
|
|
1493
|
+
nextEl = dragEl.nextSibling;
|
|
1494
|
+
lastDownEl = target;
|
|
1495
|
+
activeGroup = options.group;
|
|
1496
|
+
Sortable.dragged = dragEl;
|
|
1497
|
+
tapEvt = {
|
|
1498
|
+
target: dragEl,
|
|
1499
|
+
clientX: (touch || evt).clientX,
|
|
1500
|
+
clientY: (touch || evt).clientY
|
|
1501
|
+
};
|
|
1502
|
+
tapDistanceLeft = tapEvt.clientX - dragRect.left;
|
|
1503
|
+
tapDistanceTop = tapEvt.clientY - dragRect.top;
|
|
1504
|
+
this._lastX = (touch || evt).clientX;
|
|
1505
|
+
this._lastY = (touch || evt).clientY;
|
|
1506
|
+
dragEl.style['will-change'] = 'all';
|
|
1507
|
+
dragStartFn = function dragStartFn() {
|
|
1508
|
+
pluginEvent('delayEnded', _this, {
|
|
1509
|
+
evt: evt
|
|
1510
|
+
});
|
|
1511
|
+
if (Sortable.eventCanceled) {
|
|
1512
|
+
_this._onDrop();
|
|
1513
|
+
return;
|
|
1514
|
+
}
|
|
1515
|
+
// Delayed drag has been triggered
|
|
1516
|
+
// we can re-enable the events: touchmove/mousemove
|
|
1517
|
+
_this._disableDelayedDragEvents();
|
|
1518
|
+
if (!FireFox && _this.nativeDraggable) {
|
|
1519
|
+
dragEl.draggable = true;
|
|
1520
|
+
}
|
|
1521
|
+
|
|
1522
|
+
// Bind the events: dragstart/dragend
|
|
1523
|
+
_this._triggerDragStart(evt, touch);
|
|
1524
|
+
|
|
1525
|
+
// Drag start event
|
|
1526
|
+
_dispatchEvent({
|
|
1527
|
+
sortable: _this,
|
|
1528
|
+
name: 'choose',
|
|
1529
|
+
originalEvent: evt
|
|
1530
|
+
});
|
|
1531
|
+
|
|
1532
|
+
// Chosen item
|
|
1533
|
+
toggleClass(dragEl, options.chosenClass, true);
|
|
1534
|
+
};
|
|
1535
|
+
|
|
1536
|
+
// Disable "draggable"
|
|
1537
|
+
options.ignore.split(',').forEach(function (criteria) {
|
|
1538
|
+
find(dragEl, criteria.trim(), _disableDraggable);
|
|
1539
|
+
});
|
|
1540
|
+
on(ownerDocument, 'dragover', nearestEmptyInsertDetectEvent);
|
|
1541
|
+
on(ownerDocument, 'mousemove', nearestEmptyInsertDetectEvent);
|
|
1542
|
+
on(ownerDocument, 'touchmove', nearestEmptyInsertDetectEvent);
|
|
1543
|
+
if (options.supportPointer) {
|
|
1544
|
+
on(ownerDocument, 'pointerup', _this._onDrop);
|
|
1545
|
+
// Native D&D triggers pointercancel
|
|
1546
|
+
!this.nativeDraggable && on(ownerDocument, 'pointercancel', _this._onDrop);
|
|
1547
|
+
} else {
|
|
1548
|
+
on(ownerDocument, 'mouseup', _this._onDrop);
|
|
1549
|
+
on(ownerDocument, 'touchend', _this._onDrop);
|
|
1550
|
+
on(ownerDocument, 'touchcancel', _this._onDrop);
|
|
1551
|
+
}
|
|
1552
|
+
|
|
1553
|
+
// Make dragEl draggable (must be before delay for FireFox)
|
|
1554
|
+
if (FireFox && this.nativeDraggable) {
|
|
1555
|
+
this.options.touchStartThreshold = 4;
|
|
1556
|
+
dragEl.draggable = true;
|
|
1557
|
+
}
|
|
1558
|
+
pluginEvent('delayStart', this, {
|
|
1559
|
+
evt: evt
|
|
1560
|
+
});
|
|
1561
|
+
|
|
1562
|
+
// Delay is impossible for native DnD in Edge or IE
|
|
1563
|
+
if (options.delay && (!options.delayOnTouchOnly || touch) && (!this.nativeDraggable || !(Edge || IE11OrLess))) {
|
|
1564
|
+
if (Sortable.eventCanceled) {
|
|
1565
|
+
this._onDrop();
|
|
1566
|
+
return;
|
|
1567
|
+
}
|
|
1568
|
+
// If the user moves the pointer or let go the click or touch
|
|
1569
|
+
// before the delay has been reached:
|
|
1570
|
+
// disable the delayed drag
|
|
1571
|
+
if (options.supportPointer) {
|
|
1572
|
+
on(ownerDocument, 'pointerup', _this._disableDelayedDrag);
|
|
1573
|
+
on(ownerDocument, 'pointercancel', _this._disableDelayedDrag);
|
|
1574
|
+
} else {
|
|
1575
|
+
on(ownerDocument, 'mouseup', _this._disableDelayedDrag);
|
|
1576
|
+
on(ownerDocument, 'touchend', _this._disableDelayedDrag);
|
|
1577
|
+
on(ownerDocument, 'touchcancel', _this._disableDelayedDrag);
|
|
1578
|
+
}
|
|
1579
|
+
on(ownerDocument, 'mousemove', _this._delayedDragTouchMoveHandler);
|
|
1580
|
+
on(ownerDocument, 'touchmove', _this._delayedDragTouchMoveHandler);
|
|
1581
|
+
options.supportPointer && on(ownerDocument, 'pointermove', _this._delayedDragTouchMoveHandler);
|
|
1582
|
+
_this._dragStartTimer = setTimeout(dragStartFn, options.delay);
|
|
1583
|
+
} else {
|
|
1584
|
+
dragStartFn();
|
|
1585
|
+
}
|
|
1586
|
+
}
|
|
1587
|
+
},
|
|
1588
|
+
_delayedDragTouchMoveHandler: function _delayedDragTouchMoveHandler( /** TouchEvent|PointerEvent **/e) {
|
|
1589
|
+
var touch = e.touches ? e.touches[0] : e;
|
|
1590
|
+
if (Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) >= Math.floor(this.options.touchStartThreshold / (this.nativeDraggable && window.devicePixelRatio || 1))) {
|
|
1591
|
+
this._disableDelayedDrag();
|
|
1592
|
+
}
|
|
1593
|
+
},
|
|
1594
|
+
_disableDelayedDrag: function _disableDelayedDrag() {
|
|
1595
|
+
dragEl && _disableDraggable(dragEl);
|
|
1596
|
+
clearTimeout(this._dragStartTimer);
|
|
1597
|
+
this._disableDelayedDragEvents();
|
|
1598
|
+
},
|
|
1599
|
+
_disableDelayedDragEvents: function _disableDelayedDragEvents() {
|
|
1600
|
+
var ownerDocument = this.el.ownerDocument;
|
|
1601
|
+
off(ownerDocument, 'mouseup', this._disableDelayedDrag);
|
|
1602
|
+
off(ownerDocument, 'touchend', this._disableDelayedDrag);
|
|
1603
|
+
off(ownerDocument, 'touchcancel', this._disableDelayedDrag);
|
|
1604
|
+
off(ownerDocument, 'pointerup', this._disableDelayedDrag);
|
|
1605
|
+
off(ownerDocument, 'pointercancel', this._disableDelayedDrag);
|
|
1606
|
+
off(ownerDocument, 'mousemove', this._delayedDragTouchMoveHandler);
|
|
1607
|
+
off(ownerDocument, 'touchmove', this._delayedDragTouchMoveHandler);
|
|
1608
|
+
off(ownerDocument, 'pointermove', this._delayedDragTouchMoveHandler);
|
|
1609
|
+
},
|
|
1610
|
+
_triggerDragStart: function _triggerDragStart( /** Event */evt, /** Touch */touch) {
|
|
1611
|
+
touch = touch || evt.pointerType == 'touch' && evt;
|
|
1612
|
+
if (!this.nativeDraggable || touch) {
|
|
1613
|
+
if (this.options.supportPointer) {
|
|
1614
|
+
on(document, 'pointermove', this._onTouchMove);
|
|
1615
|
+
} else if (touch) {
|
|
1616
|
+
on(document, 'touchmove', this._onTouchMove);
|
|
1617
|
+
} else {
|
|
1618
|
+
on(document, 'mousemove', this._onTouchMove);
|
|
1619
|
+
}
|
|
1620
|
+
} else {
|
|
1621
|
+
on(dragEl, 'dragend', this);
|
|
1622
|
+
on(rootEl, 'dragstart', this._onDragStart);
|
|
1623
|
+
}
|
|
1624
|
+
try {
|
|
1625
|
+
if (document.selection) {
|
|
1626
|
+
_nextTick(function () {
|
|
1627
|
+
document.selection.empty();
|
|
1628
|
+
});
|
|
1629
|
+
} else {
|
|
1630
|
+
window.getSelection().removeAllRanges();
|
|
1631
|
+
}
|
|
1632
|
+
} catch (err) {}
|
|
1633
|
+
},
|
|
1634
|
+
_dragStarted: function _dragStarted(fallback, evt) {
|
|
1635
|
+
awaitingDragStarted = false;
|
|
1636
|
+
if (rootEl && dragEl) {
|
|
1637
|
+
pluginEvent('dragStarted', this, {
|
|
1638
|
+
evt: evt
|
|
1639
|
+
});
|
|
1640
|
+
if (this.nativeDraggable) {
|
|
1641
|
+
on(document, 'dragover', _checkOutsideTargetEl);
|
|
1642
|
+
}
|
|
1643
|
+
var options = this.options;
|
|
1644
|
+
|
|
1645
|
+
// Apply effect
|
|
1646
|
+
!fallback && toggleClass(dragEl, options.dragClass, false);
|
|
1647
|
+
toggleClass(dragEl, options.ghostClass, true);
|
|
1648
|
+
Sortable.active = this;
|
|
1649
|
+
fallback && this._appendGhost();
|
|
1650
|
+
|
|
1651
|
+
// Drag start event
|
|
1652
|
+
_dispatchEvent({
|
|
1653
|
+
sortable: this,
|
|
1654
|
+
name: 'start',
|
|
1655
|
+
originalEvent: evt
|
|
1656
|
+
});
|
|
1657
|
+
} else {
|
|
1658
|
+
this._nulling();
|
|
1659
|
+
}
|
|
1660
|
+
},
|
|
1661
|
+
_emulateDragOver: function _emulateDragOver() {
|
|
1662
|
+
if (touchEvt) {
|
|
1663
|
+
this._lastX = touchEvt.clientX;
|
|
1664
|
+
this._lastY = touchEvt.clientY;
|
|
1665
|
+
_hideGhostForTarget();
|
|
1666
|
+
var target = document.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
|
|
1667
|
+
var parent = target;
|
|
1668
|
+
while (target && target.shadowRoot) {
|
|
1669
|
+
target = target.shadowRoot.elementFromPoint(touchEvt.clientX, touchEvt.clientY);
|
|
1670
|
+
if (target === parent) break;
|
|
1671
|
+
parent = target;
|
|
1672
|
+
}
|
|
1673
|
+
dragEl.parentNode[expando]._isOutsideThisEl(target);
|
|
1674
|
+
if (parent) {
|
|
1675
|
+
do {
|
|
1676
|
+
if (parent[expando]) {
|
|
1677
|
+
var inserted = void 0;
|
|
1678
|
+
inserted = parent[expando]._onDragOver({
|
|
1679
|
+
clientX: touchEvt.clientX,
|
|
1680
|
+
clientY: touchEvt.clientY,
|
|
1681
|
+
target: target,
|
|
1682
|
+
rootEl: parent
|
|
1683
|
+
});
|
|
1684
|
+
if (inserted && !this.options.dragoverBubble) {
|
|
1685
|
+
break;
|
|
1686
|
+
}
|
|
1687
|
+
}
|
|
1688
|
+
target = parent; // store last element
|
|
1689
|
+
}
|
|
1690
|
+
/* jshint boss:true */ while (parent = getParentOrHost(parent));
|
|
1691
|
+
}
|
|
1692
|
+
_unhideGhostForTarget();
|
|
1693
|
+
}
|
|
1694
|
+
},
|
|
1695
|
+
_onTouchMove: function _onTouchMove( /**TouchEvent*/evt) {
|
|
1696
|
+
if (tapEvt) {
|
|
1697
|
+
var options = this.options,
|
|
1698
|
+
fallbackTolerance = options.fallbackTolerance,
|
|
1699
|
+
fallbackOffset = options.fallbackOffset,
|
|
1700
|
+
touch = evt.touches ? evt.touches[0] : evt,
|
|
1701
|
+
ghostMatrix = ghostEl && matrix(ghostEl, true),
|
|
1702
|
+
scaleX = ghostEl && ghostMatrix && ghostMatrix.a,
|
|
1703
|
+
scaleY = ghostEl && ghostMatrix && ghostMatrix.d,
|
|
1704
|
+
relativeScrollOffset = PositionGhostAbsolutely && ghostRelativeParent && getRelativeScrollOffset(ghostRelativeParent),
|
|
1705
|
+
dx = (touch.clientX - tapEvt.clientX + fallbackOffset.x) / (scaleX || 1) + (relativeScrollOffset ? relativeScrollOffset[0] - ghostRelativeParentInitialScroll[0] : 0) / (scaleX || 1),
|
|
1706
|
+
dy = (touch.clientY - tapEvt.clientY + fallbackOffset.y) / (scaleY || 1) + (relativeScrollOffset ? relativeScrollOffset[1] - ghostRelativeParentInitialScroll[1] : 0) / (scaleY || 1);
|
|
1707
|
+
|
|
1708
|
+
// only set the status to dragging, when we are actually dragging
|
|
1709
|
+
if (!Sortable.active && !awaitingDragStarted) {
|
|
1710
|
+
if (fallbackTolerance && Math.max(Math.abs(touch.clientX - this._lastX), Math.abs(touch.clientY - this._lastY)) < fallbackTolerance) {
|
|
1711
|
+
return;
|
|
1712
|
+
}
|
|
1713
|
+
this._onDragStart(evt, true);
|
|
1714
|
+
}
|
|
1715
|
+
if (ghostEl) {
|
|
1716
|
+
if (ghostMatrix) {
|
|
1717
|
+
ghostMatrix.e += dx - (lastDx || 0);
|
|
1718
|
+
ghostMatrix.f += dy - (lastDy || 0);
|
|
1719
|
+
} else {
|
|
1720
|
+
ghostMatrix = {
|
|
1721
|
+
a: 1,
|
|
1722
|
+
b: 0,
|
|
1723
|
+
c: 0,
|
|
1724
|
+
d: 1,
|
|
1725
|
+
e: dx,
|
|
1726
|
+
f: dy
|
|
1727
|
+
};
|
|
1728
|
+
}
|
|
1729
|
+
var cssMatrix = "matrix(".concat(ghostMatrix.a, ",").concat(ghostMatrix.b, ",").concat(ghostMatrix.c, ",").concat(ghostMatrix.d, ",").concat(ghostMatrix.e, ",").concat(ghostMatrix.f, ")");
|
|
1730
|
+
css(ghostEl, 'webkitTransform', cssMatrix);
|
|
1731
|
+
css(ghostEl, 'mozTransform', cssMatrix);
|
|
1732
|
+
css(ghostEl, 'msTransform', cssMatrix);
|
|
1733
|
+
css(ghostEl, 'transform', cssMatrix);
|
|
1734
|
+
lastDx = dx;
|
|
1735
|
+
lastDy = dy;
|
|
1736
|
+
touchEvt = touch;
|
|
1737
|
+
}
|
|
1738
|
+
evt.cancelable && evt.preventDefault();
|
|
1739
|
+
}
|
|
1740
|
+
},
|
|
1741
|
+
_appendGhost: function _appendGhost() {
|
|
1742
|
+
// Bug if using scale(): https://stackoverflow.com/questions/2637058
|
|
1743
|
+
// Not being adjusted for
|
|
1744
|
+
if (!ghostEl) {
|
|
1745
|
+
var container = this.options.fallbackOnBody ? document.body : rootEl,
|
|
1746
|
+
rect = getRect(dragEl, true, PositionGhostAbsolutely, true, container),
|
|
1747
|
+
options = this.options;
|
|
1748
|
+
|
|
1749
|
+
// Position absolutely
|
|
1750
|
+
if (PositionGhostAbsolutely) {
|
|
1751
|
+
// Get relatively positioned parent
|
|
1752
|
+
ghostRelativeParent = container;
|
|
1753
|
+
while (css(ghostRelativeParent, 'position') === 'static' && css(ghostRelativeParent, 'transform') === 'none' && ghostRelativeParent !== document) {
|
|
1754
|
+
ghostRelativeParent = ghostRelativeParent.parentNode;
|
|
1755
|
+
}
|
|
1756
|
+
if (ghostRelativeParent !== document.body && ghostRelativeParent !== document.documentElement) {
|
|
1757
|
+
if (ghostRelativeParent === document) ghostRelativeParent = getWindowScrollingElement();
|
|
1758
|
+
rect.top += ghostRelativeParent.scrollTop;
|
|
1759
|
+
rect.left += ghostRelativeParent.scrollLeft;
|
|
1760
|
+
} else {
|
|
1761
|
+
ghostRelativeParent = getWindowScrollingElement();
|
|
1762
|
+
}
|
|
1763
|
+
ghostRelativeParentInitialScroll = getRelativeScrollOffset(ghostRelativeParent);
|
|
1764
|
+
}
|
|
1765
|
+
ghostEl = dragEl.cloneNode(true);
|
|
1766
|
+
toggleClass(ghostEl, options.ghostClass, false);
|
|
1767
|
+
toggleClass(ghostEl, options.fallbackClass, true);
|
|
1768
|
+
toggleClass(ghostEl, options.dragClass, true);
|
|
1769
|
+
css(ghostEl, 'transition', '');
|
|
1770
|
+
css(ghostEl, 'transform', '');
|
|
1771
|
+
css(ghostEl, 'box-sizing', 'border-box');
|
|
1772
|
+
css(ghostEl, 'margin', 0);
|
|
1773
|
+
css(ghostEl, 'top', rect.top);
|
|
1774
|
+
css(ghostEl, 'left', rect.left);
|
|
1775
|
+
css(ghostEl, 'width', rect.width);
|
|
1776
|
+
css(ghostEl, 'height', rect.height);
|
|
1777
|
+
css(ghostEl, 'opacity', '0.8');
|
|
1778
|
+
css(ghostEl, 'position', PositionGhostAbsolutely ? 'absolute' : 'fixed');
|
|
1779
|
+
css(ghostEl, 'zIndex', '100000');
|
|
1780
|
+
css(ghostEl, 'pointerEvents', 'none');
|
|
1781
|
+
Sortable.ghost = ghostEl;
|
|
1782
|
+
container.appendChild(ghostEl);
|
|
1783
|
+
|
|
1784
|
+
// Set transform-origin
|
|
1785
|
+
css(ghostEl, 'transform-origin', tapDistanceLeft / parseInt(ghostEl.style.width) * 100 + '% ' + tapDistanceTop / parseInt(ghostEl.style.height) * 100 + '%');
|
|
1786
|
+
}
|
|
1787
|
+
},
|
|
1788
|
+
_onDragStart: function _onDragStart( /**Event*/evt, /**boolean*/fallback) {
|
|
1789
|
+
var _this = this;
|
|
1790
|
+
var dataTransfer = evt.dataTransfer;
|
|
1791
|
+
var options = _this.options;
|
|
1792
|
+
pluginEvent('dragStart', this, {
|
|
1793
|
+
evt: evt
|
|
1794
|
+
});
|
|
1795
|
+
if (Sortable.eventCanceled) {
|
|
1796
|
+
this._onDrop();
|
|
1797
|
+
return;
|
|
1798
|
+
}
|
|
1799
|
+
pluginEvent('setupClone', this);
|
|
1800
|
+
if (!Sortable.eventCanceled) {
|
|
1801
|
+
cloneEl = clone(dragEl);
|
|
1802
|
+
cloneEl.removeAttribute("id");
|
|
1803
|
+
cloneEl.draggable = false;
|
|
1804
|
+
cloneEl.style['will-change'] = '';
|
|
1805
|
+
this._hideClone();
|
|
1806
|
+
toggleClass(cloneEl, this.options.chosenClass, false);
|
|
1807
|
+
Sortable.clone = cloneEl;
|
|
1808
|
+
}
|
|
1809
|
+
|
|
1810
|
+
// #1143: IFrame support workaround
|
|
1811
|
+
_this.cloneId = _nextTick(function () {
|
|
1812
|
+
pluginEvent('clone', _this);
|
|
1813
|
+
if (Sortable.eventCanceled) return;
|
|
1814
|
+
if (!_this.options.removeCloneOnHide) {
|
|
1815
|
+
rootEl.insertBefore(cloneEl, dragEl);
|
|
1816
|
+
}
|
|
1817
|
+
_this._hideClone();
|
|
1818
|
+
_dispatchEvent({
|
|
1819
|
+
sortable: _this,
|
|
1820
|
+
name: 'clone'
|
|
1821
|
+
});
|
|
1822
|
+
});
|
|
1823
|
+
!fallback && toggleClass(dragEl, options.dragClass, true);
|
|
1824
|
+
|
|
1825
|
+
// Set proper drop events
|
|
1826
|
+
if (fallback) {
|
|
1827
|
+
ignoreNextClick = true;
|
|
1828
|
+
_this._loopId = setInterval(_this._emulateDragOver, 50);
|
|
1829
|
+
} else {
|
|
1830
|
+
// Undo what was set in _prepareDragStart before drag started
|
|
1831
|
+
off(document, 'mouseup', _this._onDrop);
|
|
1832
|
+
off(document, 'touchend', _this._onDrop);
|
|
1833
|
+
off(document, 'touchcancel', _this._onDrop);
|
|
1834
|
+
if (dataTransfer) {
|
|
1835
|
+
dataTransfer.effectAllowed = 'move';
|
|
1836
|
+
options.setData && options.setData.call(_this, dataTransfer, dragEl);
|
|
1837
|
+
}
|
|
1838
|
+
on(document, 'drop', _this);
|
|
1839
|
+
|
|
1840
|
+
// #1276 fix:
|
|
1841
|
+
css(dragEl, 'transform', 'translateZ(0)');
|
|
1842
|
+
}
|
|
1843
|
+
awaitingDragStarted = true;
|
|
1844
|
+
_this._dragStartId = _nextTick(_this._dragStarted.bind(_this, fallback, evt));
|
|
1845
|
+
on(document, 'selectstart', _this);
|
|
1846
|
+
moved = true;
|
|
1847
|
+
window.getSelection().removeAllRanges();
|
|
1848
|
+
if (Safari) {
|
|
1849
|
+
css(document.body, 'user-select', 'none');
|
|
1850
|
+
}
|
|
1851
|
+
},
|
|
1852
|
+
// Returns true - if no further action is needed (either inserted or another condition)
|
|
1853
|
+
_onDragOver: function _onDragOver( /**Event*/evt) {
|
|
1854
|
+
var el = this.el,
|
|
1855
|
+
target = evt.target,
|
|
1856
|
+
dragRect,
|
|
1857
|
+
targetRect,
|
|
1858
|
+
revert,
|
|
1859
|
+
options = this.options,
|
|
1860
|
+
group = options.group,
|
|
1861
|
+
activeSortable = Sortable.active,
|
|
1862
|
+
isOwner = activeGroup === group,
|
|
1863
|
+
canSort = options.sort,
|
|
1864
|
+
fromSortable = putSortable || activeSortable,
|
|
1865
|
+
vertical,
|
|
1866
|
+
_this = this,
|
|
1867
|
+
completedFired = false;
|
|
1868
|
+
if (_silent) return;
|
|
1869
|
+
function dragOverEvent(name, extra) {
|
|
1870
|
+
pluginEvent(name, _this, _objectSpread2({
|
|
1871
|
+
evt: evt,
|
|
1872
|
+
isOwner: isOwner,
|
|
1873
|
+
axis: vertical ? 'vertical' : 'horizontal',
|
|
1874
|
+
revert: revert,
|
|
1875
|
+
dragRect: dragRect,
|
|
1876
|
+
targetRect: targetRect,
|
|
1877
|
+
canSort: canSort,
|
|
1878
|
+
fromSortable: fromSortable,
|
|
1879
|
+
target: target,
|
|
1880
|
+
completed: completed,
|
|
1881
|
+
onMove: function onMove(target, after) {
|
|
1882
|
+
return _onMove(rootEl, el, dragEl, dragRect, target, getRect(target), evt, after);
|
|
1883
|
+
},
|
|
1884
|
+
changed: changed
|
|
1885
|
+
}, extra));
|
|
1886
|
+
}
|
|
1887
|
+
|
|
1888
|
+
// Capture animation state
|
|
1889
|
+
function capture() {
|
|
1890
|
+
dragOverEvent('dragOverAnimationCapture');
|
|
1891
|
+
_this.captureAnimationState();
|
|
1892
|
+
if (_this !== fromSortable) {
|
|
1893
|
+
fromSortable.captureAnimationState();
|
|
1894
|
+
}
|
|
1895
|
+
}
|
|
1896
|
+
|
|
1897
|
+
// Return invocation when dragEl is inserted (or completed)
|
|
1898
|
+
function completed(insertion) {
|
|
1899
|
+
dragOverEvent('dragOverCompleted', {
|
|
1900
|
+
insertion: insertion
|
|
1901
|
+
});
|
|
1902
|
+
if (insertion) {
|
|
1903
|
+
// Clones must be hidden before folding animation to capture dragRectAbsolute properly
|
|
1904
|
+
if (isOwner) {
|
|
1905
|
+
activeSortable._hideClone();
|
|
1906
|
+
} else {
|
|
1907
|
+
activeSortable._showClone(_this);
|
|
1908
|
+
}
|
|
1909
|
+
if (_this !== fromSortable) {
|
|
1910
|
+
// Set ghost class to new sortable's ghost class
|
|
1911
|
+
toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : activeSortable.options.ghostClass, false);
|
|
1912
|
+
toggleClass(dragEl, options.ghostClass, true);
|
|
1913
|
+
}
|
|
1914
|
+
if (putSortable !== _this && _this !== Sortable.active) {
|
|
1915
|
+
putSortable = _this;
|
|
1916
|
+
} else if (_this === Sortable.active && putSortable) {
|
|
1917
|
+
putSortable = null;
|
|
1918
|
+
}
|
|
1919
|
+
|
|
1920
|
+
// Animation
|
|
1921
|
+
if (fromSortable === _this) {
|
|
1922
|
+
_this._ignoreWhileAnimating = target;
|
|
1923
|
+
}
|
|
1924
|
+
_this.animateAll(function () {
|
|
1925
|
+
dragOverEvent('dragOverAnimationComplete');
|
|
1926
|
+
_this._ignoreWhileAnimating = null;
|
|
1927
|
+
});
|
|
1928
|
+
if (_this !== fromSortable) {
|
|
1929
|
+
fromSortable.animateAll();
|
|
1930
|
+
fromSortable._ignoreWhileAnimating = null;
|
|
1931
|
+
}
|
|
1932
|
+
}
|
|
1933
|
+
|
|
1934
|
+
// Null lastTarget if it is not inside a previously swapped element
|
|
1935
|
+
if (target === dragEl && !dragEl.animated || target === el && !target.animated) {
|
|
1936
|
+
lastTarget = null;
|
|
1937
|
+
}
|
|
1938
|
+
|
|
1939
|
+
// no bubbling and not fallback
|
|
1940
|
+
if (!options.dragoverBubble && !evt.rootEl && target !== document) {
|
|
1941
|
+
dragEl.parentNode[expando]._isOutsideThisEl(evt.target);
|
|
1942
|
+
|
|
1943
|
+
// Do not detect for empty insert if already inserted
|
|
1944
|
+
!insertion && nearestEmptyInsertDetectEvent(evt);
|
|
1945
|
+
}
|
|
1946
|
+
!options.dragoverBubble && evt.stopPropagation && evt.stopPropagation();
|
|
1947
|
+
return completedFired = true;
|
|
1948
|
+
}
|
|
1949
|
+
|
|
1950
|
+
// Call when dragEl has been inserted
|
|
1951
|
+
function changed() {
|
|
1952
|
+
newIndex = index(dragEl);
|
|
1953
|
+
newDraggableIndex = index(dragEl, options.draggable);
|
|
1954
|
+
_dispatchEvent({
|
|
1955
|
+
sortable: _this,
|
|
1956
|
+
name: 'change',
|
|
1957
|
+
toEl: el,
|
|
1958
|
+
newIndex: newIndex,
|
|
1959
|
+
newDraggableIndex: newDraggableIndex,
|
|
1960
|
+
originalEvent: evt
|
|
1961
|
+
});
|
|
1962
|
+
}
|
|
1963
|
+
if (evt.preventDefault !== void 0) {
|
|
1964
|
+
evt.cancelable && evt.preventDefault();
|
|
1965
|
+
}
|
|
1966
|
+
target = closest(target, options.draggable, el, true);
|
|
1967
|
+
dragOverEvent('dragOver');
|
|
1968
|
+
if (Sortable.eventCanceled) return completedFired;
|
|
1969
|
+
if (dragEl.contains(evt.target) || target.animated && target.animatingX && target.animatingY || _this._ignoreWhileAnimating === target) {
|
|
1970
|
+
return completed(false);
|
|
1971
|
+
}
|
|
1972
|
+
ignoreNextClick = false;
|
|
1973
|
+
if (activeSortable && !options.disabled && (isOwner ? canSort || (revert = parentEl !== rootEl) // Reverting item into the original list
|
|
1974
|
+
: putSortable === this || (this.lastPutMode = activeGroup.checkPull(this, activeSortable, dragEl, evt)) && group.checkPut(this, activeSortable, dragEl, evt))) {
|
|
1975
|
+
vertical = this._getDirection(evt, target) === 'vertical';
|
|
1976
|
+
dragRect = getRect(dragEl);
|
|
1977
|
+
dragOverEvent('dragOverValid');
|
|
1978
|
+
if (Sortable.eventCanceled) return completedFired;
|
|
1979
|
+
if (revert) {
|
|
1980
|
+
parentEl = rootEl; // actualization
|
|
1981
|
+
capture();
|
|
1982
|
+
this._hideClone();
|
|
1983
|
+
dragOverEvent('revert');
|
|
1984
|
+
if (!Sortable.eventCanceled) {
|
|
1985
|
+
if (nextEl) {
|
|
1986
|
+
rootEl.insertBefore(dragEl, nextEl);
|
|
1987
|
+
} else {
|
|
1988
|
+
rootEl.appendChild(dragEl);
|
|
1989
|
+
}
|
|
1990
|
+
}
|
|
1991
|
+
return completed(true);
|
|
1992
|
+
}
|
|
1993
|
+
var elLastChild = lastChild(el, options.draggable);
|
|
1994
|
+
if (!elLastChild || _ghostIsLast(evt, vertical, this) && !elLastChild.animated) {
|
|
1995
|
+
// Insert to end of list
|
|
1996
|
+
|
|
1997
|
+
// If already at end of list: Do not insert
|
|
1998
|
+
if (elLastChild === dragEl) {
|
|
1999
|
+
return completed(false);
|
|
2000
|
+
}
|
|
2001
|
+
|
|
2002
|
+
// if there is a last element, it is the target
|
|
2003
|
+
if (elLastChild && el === evt.target) {
|
|
2004
|
+
target = elLastChild;
|
|
2005
|
+
}
|
|
2006
|
+
if (target) {
|
|
2007
|
+
targetRect = getRect(target);
|
|
2008
|
+
}
|
|
2009
|
+
if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, !!target) !== false) {
|
|
2010
|
+
capture();
|
|
2011
|
+
if (elLastChild && elLastChild.nextSibling) {
|
|
2012
|
+
// the last draggable element is not the last node
|
|
2013
|
+
el.insertBefore(dragEl, elLastChild.nextSibling);
|
|
2014
|
+
} else {
|
|
2015
|
+
el.appendChild(dragEl);
|
|
2016
|
+
}
|
|
2017
|
+
parentEl = el; // actualization
|
|
2018
|
+
|
|
2019
|
+
changed();
|
|
2020
|
+
return completed(true);
|
|
2021
|
+
}
|
|
2022
|
+
} else if (elLastChild && _ghostIsFirst(evt, vertical, this)) {
|
|
2023
|
+
// Insert to start of list
|
|
2024
|
+
var firstChild = getChild(el, 0, options, true);
|
|
2025
|
+
if (firstChild === dragEl) {
|
|
2026
|
+
return completed(false);
|
|
2027
|
+
}
|
|
2028
|
+
target = firstChild;
|
|
2029
|
+
targetRect = getRect(target);
|
|
2030
|
+
if (_onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, false) !== false) {
|
|
2031
|
+
capture();
|
|
2032
|
+
el.insertBefore(dragEl, firstChild);
|
|
2033
|
+
parentEl = el; // actualization
|
|
2034
|
+
|
|
2035
|
+
changed();
|
|
2036
|
+
return completed(true);
|
|
2037
|
+
}
|
|
2038
|
+
} else if (target.parentNode === el) {
|
|
2039
|
+
targetRect = getRect(target);
|
|
2040
|
+
var direction = 0,
|
|
2041
|
+
targetBeforeFirstSwap,
|
|
2042
|
+
differentLevel = dragEl.parentNode !== el,
|
|
2043
|
+
differentRowCol = !_dragElInRowColumn(dragEl.animated && dragEl.toRect || dragRect, target.animated && target.toRect || targetRect, vertical),
|
|
2044
|
+
side1 = vertical ? 'top' : 'left',
|
|
2045
|
+
scrolledPastTop = isScrolledPast(target, 'top', 'top') || isScrolledPast(dragEl, 'top', 'top'),
|
|
2046
|
+
scrollBefore = scrolledPastTop ? scrolledPastTop.scrollTop : void 0;
|
|
2047
|
+
if (lastTarget !== target) {
|
|
2048
|
+
targetBeforeFirstSwap = targetRect[side1];
|
|
2049
|
+
pastFirstInvertThresh = false;
|
|
2050
|
+
isCircumstantialInvert = !differentRowCol && options.invertSwap || differentLevel;
|
|
2051
|
+
}
|
|
2052
|
+
direction = _getSwapDirection(evt, target, targetRect, vertical, differentRowCol ? 1 : options.swapThreshold, options.invertedSwapThreshold == null ? options.swapThreshold : options.invertedSwapThreshold, isCircumstantialInvert, lastTarget === target);
|
|
2053
|
+
var sibling;
|
|
2054
|
+
if (direction !== 0) {
|
|
2055
|
+
// Check if target is beside dragEl in respective direction (ignoring hidden elements)
|
|
2056
|
+
var dragIndex = index(dragEl);
|
|
2057
|
+
do {
|
|
2058
|
+
dragIndex -= direction;
|
|
2059
|
+
sibling = parentEl.children[dragIndex];
|
|
2060
|
+
} while (sibling && (css(sibling, 'display') === 'none' || sibling === ghostEl));
|
|
2061
|
+
}
|
|
2062
|
+
// If dragEl is already beside target: Do not insert
|
|
2063
|
+
if (direction === 0 || sibling === target) {
|
|
2064
|
+
return completed(false);
|
|
2065
|
+
}
|
|
2066
|
+
lastTarget = target;
|
|
2067
|
+
lastDirection = direction;
|
|
2068
|
+
var nextSibling = target.nextElementSibling,
|
|
2069
|
+
after = false;
|
|
2070
|
+
after = direction === 1;
|
|
2071
|
+
var moveVector = _onMove(rootEl, el, dragEl, dragRect, target, targetRect, evt, after);
|
|
2072
|
+
if (moveVector !== false) {
|
|
2073
|
+
if (moveVector === 1 || moveVector === -1) {
|
|
2074
|
+
after = moveVector === 1;
|
|
2075
|
+
}
|
|
2076
|
+
_silent = true;
|
|
2077
|
+
setTimeout(_unsilent, 30);
|
|
2078
|
+
capture();
|
|
2079
|
+
if (after && !nextSibling) {
|
|
2080
|
+
el.appendChild(dragEl);
|
|
2081
|
+
} else {
|
|
2082
|
+
target.parentNode.insertBefore(dragEl, after ? nextSibling : target);
|
|
2083
|
+
}
|
|
2084
|
+
|
|
2085
|
+
// Undo chrome's scroll adjustment (has no effect on other browsers)
|
|
2086
|
+
if (scrolledPastTop) {
|
|
2087
|
+
scrollBy(scrolledPastTop, 0, scrollBefore - scrolledPastTop.scrollTop);
|
|
2088
|
+
}
|
|
2089
|
+
parentEl = dragEl.parentNode; // actualization
|
|
2090
|
+
|
|
2091
|
+
// must be done before animation
|
|
2092
|
+
if (targetBeforeFirstSwap !== undefined && !isCircumstantialInvert) {
|
|
2093
|
+
targetMoveDistance = Math.abs(targetBeforeFirstSwap - getRect(target)[side1]);
|
|
2094
|
+
}
|
|
2095
|
+
changed();
|
|
2096
|
+
return completed(true);
|
|
2097
|
+
}
|
|
2098
|
+
}
|
|
2099
|
+
if (el.contains(dragEl)) {
|
|
2100
|
+
return completed(false);
|
|
2101
|
+
}
|
|
2102
|
+
}
|
|
2103
|
+
return false;
|
|
2104
|
+
},
|
|
2105
|
+
_ignoreWhileAnimating: null,
|
|
2106
|
+
_offMoveEvents: function _offMoveEvents() {
|
|
2107
|
+
off(document, 'mousemove', this._onTouchMove);
|
|
2108
|
+
off(document, 'touchmove', this._onTouchMove);
|
|
2109
|
+
off(document, 'pointermove', this._onTouchMove);
|
|
2110
|
+
off(document, 'dragover', nearestEmptyInsertDetectEvent);
|
|
2111
|
+
off(document, 'mousemove', nearestEmptyInsertDetectEvent);
|
|
2112
|
+
off(document, 'touchmove', nearestEmptyInsertDetectEvent);
|
|
2113
|
+
},
|
|
2114
|
+
_offUpEvents: function _offUpEvents() {
|
|
2115
|
+
var ownerDocument = this.el.ownerDocument;
|
|
2116
|
+
off(ownerDocument, 'mouseup', this._onDrop);
|
|
2117
|
+
off(ownerDocument, 'touchend', this._onDrop);
|
|
2118
|
+
off(ownerDocument, 'pointerup', this._onDrop);
|
|
2119
|
+
off(ownerDocument, 'pointercancel', this._onDrop);
|
|
2120
|
+
off(ownerDocument, 'touchcancel', this._onDrop);
|
|
2121
|
+
off(document, 'selectstart', this);
|
|
2122
|
+
},
|
|
2123
|
+
_onDrop: function _onDrop( /**Event*/evt) {
|
|
2124
|
+
var el = this.el,
|
|
2125
|
+
options = this.options;
|
|
2126
|
+
|
|
2127
|
+
// Get the index of the dragged element within its parent
|
|
2128
|
+
newIndex = index(dragEl);
|
|
2129
|
+
newDraggableIndex = index(dragEl, options.draggable);
|
|
2130
|
+
pluginEvent('drop', this, {
|
|
2131
|
+
evt: evt
|
|
2132
|
+
});
|
|
2133
|
+
parentEl = dragEl && dragEl.parentNode;
|
|
2134
|
+
|
|
2135
|
+
// Get again after plugin event
|
|
2136
|
+
newIndex = index(dragEl);
|
|
2137
|
+
newDraggableIndex = index(dragEl, options.draggable);
|
|
2138
|
+
if (Sortable.eventCanceled) {
|
|
2139
|
+
this._nulling();
|
|
2140
|
+
return;
|
|
2141
|
+
}
|
|
2142
|
+
awaitingDragStarted = false;
|
|
2143
|
+
isCircumstantialInvert = false;
|
|
2144
|
+
pastFirstInvertThresh = false;
|
|
2145
|
+
clearInterval(this._loopId);
|
|
2146
|
+
clearTimeout(this._dragStartTimer);
|
|
2147
|
+
_cancelNextTick(this.cloneId);
|
|
2148
|
+
_cancelNextTick(this._dragStartId);
|
|
2149
|
+
|
|
2150
|
+
// Unbind events
|
|
2151
|
+
if (this.nativeDraggable) {
|
|
2152
|
+
off(document, 'drop', this);
|
|
2153
|
+
off(el, 'dragstart', this._onDragStart);
|
|
2154
|
+
}
|
|
2155
|
+
this._offMoveEvents();
|
|
2156
|
+
this._offUpEvents();
|
|
2157
|
+
if (Safari) {
|
|
2158
|
+
css(document.body, 'user-select', '');
|
|
2159
|
+
}
|
|
2160
|
+
css(dragEl, 'transform', '');
|
|
2161
|
+
if (evt) {
|
|
2162
|
+
if (moved) {
|
|
2163
|
+
evt.cancelable && evt.preventDefault();
|
|
2164
|
+
!options.dropBubble && evt.stopPropagation();
|
|
2165
|
+
}
|
|
2166
|
+
ghostEl && ghostEl.parentNode && ghostEl.parentNode.removeChild(ghostEl);
|
|
2167
|
+
if (rootEl === parentEl || putSortable && putSortable.lastPutMode !== 'clone') {
|
|
2168
|
+
// Remove clone(s)
|
|
2169
|
+
cloneEl && cloneEl.parentNode && cloneEl.parentNode.removeChild(cloneEl);
|
|
2170
|
+
}
|
|
2171
|
+
if (dragEl) {
|
|
2172
|
+
if (this.nativeDraggable) {
|
|
2173
|
+
off(dragEl, 'dragend', this);
|
|
2174
|
+
}
|
|
2175
|
+
_disableDraggable(dragEl);
|
|
2176
|
+
dragEl.style['will-change'] = '';
|
|
2177
|
+
|
|
2178
|
+
// Remove classes
|
|
2179
|
+
// ghostClass is added in dragStarted
|
|
2180
|
+
if (moved && !awaitingDragStarted) {
|
|
2181
|
+
toggleClass(dragEl, putSortable ? putSortable.options.ghostClass : this.options.ghostClass, false);
|
|
2182
|
+
}
|
|
2183
|
+
toggleClass(dragEl, this.options.chosenClass, false);
|
|
2184
|
+
|
|
2185
|
+
// Drag stop event
|
|
2186
|
+
_dispatchEvent({
|
|
2187
|
+
sortable: this,
|
|
2188
|
+
name: 'unchoose',
|
|
2189
|
+
toEl: parentEl,
|
|
2190
|
+
newIndex: null,
|
|
2191
|
+
newDraggableIndex: null,
|
|
2192
|
+
originalEvent: evt
|
|
2193
|
+
});
|
|
2194
|
+
if (rootEl !== parentEl) {
|
|
2195
|
+
if (newIndex >= 0) {
|
|
2196
|
+
// Add event
|
|
2197
|
+
_dispatchEvent({
|
|
2198
|
+
rootEl: parentEl,
|
|
2199
|
+
name: 'add',
|
|
2200
|
+
toEl: parentEl,
|
|
2201
|
+
fromEl: rootEl,
|
|
2202
|
+
originalEvent: evt
|
|
2203
|
+
});
|
|
2204
|
+
|
|
2205
|
+
// Remove event
|
|
2206
|
+
_dispatchEvent({
|
|
2207
|
+
sortable: this,
|
|
2208
|
+
name: 'remove',
|
|
2209
|
+
toEl: parentEl,
|
|
2210
|
+
originalEvent: evt
|
|
2211
|
+
});
|
|
2212
|
+
|
|
2213
|
+
// drag from one list and drop into another
|
|
2214
|
+
_dispatchEvent({
|
|
2215
|
+
rootEl: parentEl,
|
|
2216
|
+
name: 'sort',
|
|
2217
|
+
toEl: parentEl,
|
|
2218
|
+
fromEl: rootEl,
|
|
2219
|
+
originalEvent: evt
|
|
2220
|
+
});
|
|
2221
|
+
_dispatchEvent({
|
|
2222
|
+
sortable: this,
|
|
2223
|
+
name: 'sort',
|
|
2224
|
+
toEl: parentEl,
|
|
2225
|
+
originalEvent: evt
|
|
2226
|
+
});
|
|
2227
|
+
}
|
|
2228
|
+
putSortable && putSortable.save();
|
|
2229
|
+
} else {
|
|
2230
|
+
if (newIndex !== oldIndex) {
|
|
2231
|
+
if (newIndex >= 0) {
|
|
2232
|
+
// drag & drop within the same list
|
|
2233
|
+
_dispatchEvent({
|
|
2234
|
+
sortable: this,
|
|
2235
|
+
name: 'update',
|
|
2236
|
+
toEl: parentEl,
|
|
2237
|
+
originalEvent: evt
|
|
2238
|
+
});
|
|
2239
|
+
_dispatchEvent({
|
|
2240
|
+
sortable: this,
|
|
2241
|
+
name: 'sort',
|
|
2242
|
+
toEl: parentEl,
|
|
2243
|
+
originalEvent: evt
|
|
2244
|
+
});
|
|
2245
|
+
}
|
|
2246
|
+
}
|
|
2247
|
+
}
|
|
2248
|
+
if (Sortable.active) {
|
|
2249
|
+
/* jshint eqnull:true */
|
|
2250
|
+
if (newIndex == null || newIndex === -1) {
|
|
2251
|
+
newIndex = oldIndex;
|
|
2252
|
+
newDraggableIndex = oldDraggableIndex;
|
|
2253
|
+
}
|
|
2254
|
+
_dispatchEvent({
|
|
2255
|
+
sortable: this,
|
|
2256
|
+
name: 'end',
|
|
2257
|
+
toEl: parentEl,
|
|
2258
|
+
originalEvent: evt
|
|
2259
|
+
});
|
|
2260
|
+
|
|
2261
|
+
// Save sorting
|
|
2262
|
+
this.save();
|
|
2263
|
+
}
|
|
2264
|
+
}
|
|
2265
|
+
}
|
|
2266
|
+
this._nulling();
|
|
2267
|
+
},
|
|
2268
|
+
_nulling: function _nulling() {
|
|
2269
|
+
pluginEvent('nulling', this);
|
|
2270
|
+
rootEl = dragEl = parentEl = ghostEl = nextEl = cloneEl = lastDownEl = cloneHidden = tapEvt = touchEvt = moved = newIndex = newDraggableIndex = oldIndex = oldDraggableIndex = lastTarget = lastDirection = putSortable = activeGroup = Sortable.dragged = Sortable.ghost = Sortable.clone = Sortable.active = null;
|
|
2271
|
+
var el = this.el;
|
|
2272
|
+
savedInputChecked.forEach(function (checkEl) {
|
|
2273
|
+
if (el.contains(checkEl)) {
|
|
2274
|
+
checkEl.checked = true;
|
|
2275
|
+
}
|
|
2276
|
+
});
|
|
2277
|
+
savedInputChecked.length = lastDx = lastDy = 0;
|
|
2278
|
+
},
|
|
2279
|
+
handleEvent: function handleEvent( /**Event*/evt) {
|
|
2280
|
+
switch (evt.type) {
|
|
2281
|
+
case 'drop':
|
|
2282
|
+
case 'dragend':
|
|
2283
|
+
this._onDrop(evt);
|
|
2284
|
+
break;
|
|
2285
|
+
case 'dragenter':
|
|
2286
|
+
case 'dragover':
|
|
2287
|
+
if (dragEl) {
|
|
2288
|
+
this._onDragOver(evt);
|
|
2289
|
+
_globalDragOver(evt);
|
|
2290
|
+
}
|
|
2291
|
+
break;
|
|
2292
|
+
case 'selectstart':
|
|
2293
|
+
evt.preventDefault();
|
|
2294
|
+
break;
|
|
2295
|
+
}
|
|
2296
|
+
},
|
|
2297
|
+
/**
|
|
2298
|
+
* Serializes the item into an array of string.
|
|
2299
|
+
* @returns {String[]}
|
|
2300
|
+
*/
|
|
2301
|
+
toArray: function toArray() {
|
|
2302
|
+
var order = [],
|
|
2303
|
+
el,
|
|
2304
|
+
children = this.el.children,
|
|
2305
|
+
i = 0,
|
|
2306
|
+
n = children.length,
|
|
2307
|
+
options = this.options;
|
|
2308
|
+
for (; i < n; i++) {
|
|
2309
|
+
el = children[i];
|
|
2310
|
+
if (closest(el, options.draggable, this.el, false)) {
|
|
2311
|
+
order.push(el.getAttribute(options.dataIdAttr) || _generateId(el));
|
|
2312
|
+
}
|
|
2313
|
+
}
|
|
2314
|
+
return order;
|
|
2315
|
+
},
|
|
2316
|
+
/**
|
|
2317
|
+
* Sorts the elements according to the array.
|
|
2318
|
+
* @param {String[]} order order of the items
|
|
2319
|
+
*/
|
|
2320
|
+
sort: function sort(order, useAnimation) {
|
|
2321
|
+
var items = {},
|
|
2322
|
+
rootEl = this.el;
|
|
2323
|
+
this.toArray().forEach(function (id, i) {
|
|
2324
|
+
var el = rootEl.children[i];
|
|
2325
|
+
if (closest(el, this.options.draggable, rootEl, false)) {
|
|
2326
|
+
items[id] = el;
|
|
2327
|
+
}
|
|
2328
|
+
}, this);
|
|
2329
|
+
useAnimation && this.captureAnimationState();
|
|
2330
|
+
order.forEach(function (id) {
|
|
2331
|
+
if (items[id]) {
|
|
2332
|
+
rootEl.removeChild(items[id]);
|
|
2333
|
+
rootEl.appendChild(items[id]);
|
|
2334
|
+
}
|
|
2335
|
+
});
|
|
2336
|
+
useAnimation && this.animateAll();
|
|
2337
|
+
},
|
|
2338
|
+
/**
|
|
2339
|
+
* Save the current sorting
|
|
2340
|
+
*/
|
|
2341
|
+
save: function save() {
|
|
2342
|
+
var store = this.options.store;
|
|
2343
|
+
store && store.set && store.set(this);
|
|
2344
|
+
},
|
|
2345
|
+
/**
|
|
2346
|
+
* For each element in the set, get the first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree.
|
|
2347
|
+
* @param {HTMLElement} el
|
|
2348
|
+
* @param {String} [selector] default: `options.draggable`
|
|
2349
|
+
* @returns {HTMLElement|null}
|
|
2350
|
+
*/
|
|
2351
|
+
closest: function closest$1(el, selector) {
|
|
2352
|
+
return closest(el, selector || this.options.draggable, this.el, false);
|
|
2353
|
+
},
|
|
2354
|
+
/**
|
|
2355
|
+
* Set/get option
|
|
2356
|
+
* @param {string} name
|
|
2357
|
+
* @param {*} [value]
|
|
2358
|
+
* @returns {*}
|
|
2359
|
+
*/
|
|
2360
|
+
option: function option(name, value) {
|
|
2361
|
+
var options = this.options;
|
|
2362
|
+
if (value === void 0) {
|
|
2363
|
+
return options[name];
|
|
2364
|
+
} else {
|
|
2365
|
+
var modifiedValue = PluginManager.modifyOption(this, name, value);
|
|
2366
|
+
if (typeof modifiedValue !== 'undefined') {
|
|
2367
|
+
options[name] = modifiedValue;
|
|
2368
|
+
} else {
|
|
2369
|
+
options[name] = value;
|
|
2370
|
+
}
|
|
2371
|
+
if (name === 'group') {
|
|
2372
|
+
_prepareGroup(options);
|
|
2373
|
+
}
|
|
2374
|
+
}
|
|
2375
|
+
},
|
|
2376
|
+
/**
|
|
2377
|
+
* Destroy
|
|
2378
|
+
*/
|
|
2379
|
+
destroy: function destroy() {
|
|
2380
|
+
pluginEvent('destroy', this);
|
|
2381
|
+
var el = this.el;
|
|
2382
|
+
el[expando] = null;
|
|
2383
|
+
off(el, 'mousedown', this._onTapStart);
|
|
2384
|
+
off(el, 'touchstart', this._onTapStart);
|
|
2385
|
+
off(el, 'pointerdown', this._onTapStart);
|
|
2386
|
+
if (this.nativeDraggable) {
|
|
2387
|
+
off(el, 'dragover', this);
|
|
2388
|
+
off(el, 'dragenter', this);
|
|
2389
|
+
}
|
|
2390
|
+
// Remove draggable attributes
|
|
2391
|
+
Array.prototype.forEach.call(el.querySelectorAll('[draggable]'), function (el) {
|
|
2392
|
+
el.removeAttribute('draggable');
|
|
2393
|
+
});
|
|
2394
|
+
this._onDrop();
|
|
2395
|
+
this._disableDelayedDragEvents();
|
|
2396
|
+
sortables.splice(sortables.indexOf(this.el), 1);
|
|
2397
|
+
this.el = el = null;
|
|
2398
|
+
},
|
|
2399
|
+
_hideClone: function _hideClone() {
|
|
2400
|
+
if (!cloneHidden) {
|
|
2401
|
+
pluginEvent('hideClone', this);
|
|
2402
|
+
if (Sortable.eventCanceled) return;
|
|
2403
|
+
css(cloneEl, 'display', 'none');
|
|
2404
|
+
if (this.options.removeCloneOnHide && cloneEl.parentNode) {
|
|
2405
|
+
cloneEl.parentNode.removeChild(cloneEl);
|
|
2406
|
+
}
|
|
2407
|
+
cloneHidden = true;
|
|
2408
|
+
}
|
|
2409
|
+
},
|
|
2410
|
+
_showClone: function _showClone(putSortable) {
|
|
2411
|
+
if (putSortable.lastPutMode !== 'clone') {
|
|
2412
|
+
this._hideClone();
|
|
2413
|
+
return;
|
|
2414
|
+
}
|
|
2415
|
+
if (cloneHidden) {
|
|
2416
|
+
pluginEvent('showClone', this);
|
|
2417
|
+
if (Sortable.eventCanceled) return;
|
|
2418
|
+
|
|
2419
|
+
// show clone at dragEl or original position
|
|
2420
|
+
if (dragEl.parentNode == rootEl && !this.options.group.revertClone) {
|
|
2421
|
+
rootEl.insertBefore(cloneEl, dragEl);
|
|
2422
|
+
} else if (nextEl) {
|
|
2423
|
+
rootEl.insertBefore(cloneEl, nextEl);
|
|
2424
|
+
} else {
|
|
2425
|
+
rootEl.appendChild(cloneEl);
|
|
2426
|
+
}
|
|
2427
|
+
if (this.options.group.revertClone) {
|
|
2428
|
+
this.animate(dragEl, cloneEl);
|
|
2429
|
+
}
|
|
2430
|
+
css(cloneEl, 'display', '');
|
|
2431
|
+
cloneHidden = false;
|
|
2432
|
+
}
|
|
2433
|
+
}
|
|
2434
|
+
};
|
|
2435
|
+
function _globalDragOver( /**Event*/evt) {
|
|
2436
|
+
if (evt.dataTransfer) {
|
|
2437
|
+
evt.dataTransfer.dropEffect = 'move';
|
|
2438
|
+
}
|
|
2439
|
+
evt.cancelable && evt.preventDefault();
|
|
2440
|
+
}
|
|
2441
|
+
function _onMove(fromEl, toEl, dragEl, dragRect, targetEl, targetRect, originalEvent, willInsertAfter) {
|
|
2442
|
+
var evt,
|
|
2443
|
+
sortable = fromEl[expando],
|
|
2444
|
+
onMoveFn = sortable.options.onMove,
|
|
2445
|
+
retVal;
|
|
2446
|
+
// Support for new CustomEvent feature
|
|
2447
|
+
if (window.CustomEvent && !IE11OrLess && !Edge) {
|
|
2448
|
+
evt = new CustomEvent('move', {
|
|
2449
|
+
bubbles: true,
|
|
2450
|
+
cancelable: true
|
|
2451
|
+
});
|
|
2452
|
+
} else {
|
|
2453
|
+
evt = document.createEvent('Event');
|
|
2454
|
+
evt.initEvent('move', true, true);
|
|
2455
|
+
}
|
|
2456
|
+
evt.to = toEl;
|
|
2457
|
+
evt.from = fromEl;
|
|
2458
|
+
evt.dragged = dragEl;
|
|
2459
|
+
evt.draggedRect = dragRect;
|
|
2460
|
+
evt.related = targetEl || toEl;
|
|
2461
|
+
evt.relatedRect = targetRect || getRect(toEl);
|
|
2462
|
+
evt.willInsertAfter = willInsertAfter;
|
|
2463
|
+
evt.originalEvent = originalEvent;
|
|
2464
|
+
fromEl.dispatchEvent(evt);
|
|
2465
|
+
if (onMoveFn) {
|
|
2466
|
+
retVal = onMoveFn.call(sortable, evt, originalEvent);
|
|
2467
|
+
}
|
|
2468
|
+
return retVal;
|
|
2469
|
+
}
|
|
2470
|
+
function _disableDraggable(el) {
|
|
2471
|
+
el.draggable = false;
|
|
2472
|
+
}
|
|
2473
|
+
function _unsilent() {
|
|
2474
|
+
_silent = false;
|
|
2475
|
+
}
|
|
2476
|
+
function _ghostIsFirst(evt, vertical, sortable) {
|
|
2477
|
+
var firstElRect = getRect(getChild(sortable.el, 0, sortable.options, true));
|
|
2478
|
+
var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl);
|
|
2479
|
+
var spacer = 10;
|
|
2480
|
+
return vertical ? evt.clientX < childContainingRect.left - spacer || evt.clientY < firstElRect.top && evt.clientX < firstElRect.right : evt.clientY < childContainingRect.top - spacer || evt.clientY < firstElRect.bottom && evt.clientX < firstElRect.left;
|
|
2481
|
+
}
|
|
2482
|
+
function _ghostIsLast(evt, vertical, sortable) {
|
|
2483
|
+
var lastElRect = getRect(lastChild(sortable.el, sortable.options.draggable));
|
|
2484
|
+
var childContainingRect = getChildContainingRectFromElement(sortable.el, sortable.options, ghostEl);
|
|
2485
|
+
var spacer = 10;
|
|
2486
|
+
return vertical ? evt.clientX > childContainingRect.right + spacer || evt.clientY > lastElRect.bottom && evt.clientX > lastElRect.left : evt.clientY > childContainingRect.bottom + spacer || evt.clientX > lastElRect.right && evt.clientY > lastElRect.top;
|
|
2487
|
+
}
|
|
2488
|
+
function _getSwapDirection(evt, target, targetRect, vertical, swapThreshold, invertedSwapThreshold, invertSwap, isLastTarget) {
|
|
2489
|
+
var mouseOnAxis = vertical ? evt.clientY : evt.clientX,
|
|
2490
|
+
targetLength = vertical ? targetRect.height : targetRect.width,
|
|
2491
|
+
targetS1 = vertical ? targetRect.top : targetRect.left,
|
|
2492
|
+
targetS2 = vertical ? targetRect.bottom : targetRect.right,
|
|
2493
|
+
invert = false;
|
|
2494
|
+
if (!invertSwap) {
|
|
2495
|
+
// Never invert or create dragEl shadow when target movemenet causes mouse to move past the end of regular swapThreshold
|
|
2496
|
+
if (isLastTarget && targetMoveDistance < targetLength * swapThreshold) {
|
|
2497
|
+
// multiplied only by swapThreshold because mouse will already be inside target by (1 - threshold) * targetLength / 2
|
|
2498
|
+
// check if past first invert threshold on side opposite of lastDirection
|
|
2499
|
+
if (!pastFirstInvertThresh && (lastDirection === 1 ? mouseOnAxis > targetS1 + targetLength * invertedSwapThreshold / 2 : mouseOnAxis < targetS2 - targetLength * invertedSwapThreshold / 2)) {
|
|
2500
|
+
// past first invert threshold, do not restrict inverted threshold to dragEl shadow
|
|
2501
|
+
pastFirstInvertThresh = true;
|
|
2502
|
+
}
|
|
2503
|
+
if (!pastFirstInvertThresh) {
|
|
2504
|
+
// dragEl shadow (target move distance shadow)
|
|
2505
|
+
if (lastDirection === 1 ? mouseOnAxis < targetS1 + targetMoveDistance // over dragEl shadow
|
|
2506
|
+
: mouseOnAxis > targetS2 - targetMoveDistance) {
|
|
2507
|
+
return -lastDirection;
|
|
2508
|
+
}
|
|
2509
|
+
} else {
|
|
2510
|
+
invert = true;
|
|
2511
|
+
}
|
|
2512
|
+
} else {
|
|
2513
|
+
// Regular
|
|
2514
|
+
if (mouseOnAxis > targetS1 + targetLength * (1 - swapThreshold) / 2 && mouseOnAxis < targetS2 - targetLength * (1 - swapThreshold) / 2) {
|
|
2515
|
+
return _getInsertDirection(target);
|
|
2516
|
+
}
|
|
2517
|
+
}
|
|
2518
|
+
}
|
|
2519
|
+
invert = invert || invertSwap;
|
|
2520
|
+
if (invert) {
|
|
2521
|
+
// Invert of regular
|
|
2522
|
+
if (mouseOnAxis < targetS1 + targetLength * invertedSwapThreshold / 2 || mouseOnAxis > targetS2 - targetLength * invertedSwapThreshold / 2) {
|
|
2523
|
+
return mouseOnAxis > targetS1 + targetLength / 2 ? 1 : -1;
|
|
2524
|
+
}
|
|
2525
|
+
}
|
|
2526
|
+
return 0;
|
|
2527
|
+
}
|
|
2528
|
+
|
|
2529
|
+
/**
|
|
2530
|
+
* Gets the direction dragEl must be swapped relative to target in order to make it
|
|
2531
|
+
* seem that dragEl has been "inserted" into that element's position
|
|
2532
|
+
* @param {HTMLElement} target The target whose position dragEl is being inserted at
|
|
2533
|
+
* @return {Number} Direction dragEl must be swapped
|
|
2534
|
+
*/
|
|
2535
|
+
function _getInsertDirection(target) {
|
|
2536
|
+
if (index(dragEl) < index(target)) {
|
|
2537
|
+
return 1;
|
|
2538
|
+
} else {
|
|
2539
|
+
return -1;
|
|
2540
|
+
}
|
|
2541
|
+
}
|
|
2542
|
+
|
|
2543
|
+
/**
|
|
2544
|
+
* Generate id
|
|
2545
|
+
* @param {HTMLElement} el
|
|
2546
|
+
* @returns {String}
|
|
2547
|
+
* @private
|
|
2548
|
+
*/
|
|
2549
|
+
function _generateId(el) {
|
|
2550
|
+
var str = el.tagName + el.className + el.src + el.href + el.textContent,
|
|
2551
|
+
i = str.length,
|
|
2552
|
+
sum = 0;
|
|
2553
|
+
while (i--) {
|
|
2554
|
+
sum += str.charCodeAt(i);
|
|
2555
|
+
}
|
|
2556
|
+
return sum.toString(36);
|
|
2557
|
+
}
|
|
2558
|
+
function _saveInputCheckedState(root) {
|
|
2559
|
+
savedInputChecked.length = 0;
|
|
2560
|
+
var inputs = root.getElementsByTagName('input');
|
|
2561
|
+
var idx = inputs.length;
|
|
2562
|
+
while (idx--) {
|
|
2563
|
+
var el = inputs[idx];
|
|
2564
|
+
el.checked && savedInputChecked.push(el);
|
|
2565
|
+
}
|
|
2566
|
+
}
|
|
2567
|
+
function _nextTick(fn) {
|
|
2568
|
+
return setTimeout(fn, 0);
|
|
2569
|
+
}
|
|
2570
|
+
function _cancelNextTick(id) {
|
|
2571
|
+
return clearTimeout(id);
|
|
2572
|
+
}
|
|
2573
|
+
|
|
2574
|
+
// Fixed #973:
|
|
2575
|
+
if (documentExists) {
|
|
2576
|
+
on(document, 'touchmove', function (evt) {
|
|
2577
|
+
if ((Sortable.active || awaitingDragStarted) && evt.cancelable) {
|
|
2578
|
+
evt.preventDefault();
|
|
2579
|
+
}
|
|
2580
|
+
});
|
|
2581
|
+
}
|
|
2582
|
+
|
|
2583
|
+
// Export utils
|
|
2584
|
+
Sortable.utils = {
|
|
2585
|
+
on: on,
|
|
2586
|
+
off: off,
|
|
2587
|
+
css: css,
|
|
2588
|
+
find: find,
|
|
2589
|
+
is: function is(el, selector) {
|
|
2590
|
+
return !!closest(el, selector, el, false);
|
|
2591
|
+
},
|
|
2592
|
+
extend: extend,
|
|
2593
|
+
throttle: throttle,
|
|
2594
|
+
closest: closest,
|
|
2595
|
+
toggleClass: toggleClass,
|
|
2596
|
+
clone: clone,
|
|
2597
|
+
index: index,
|
|
2598
|
+
nextTick: _nextTick,
|
|
2599
|
+
cancelNextTick: _cancelNextTick,
|
|
2600
|
+
detectDirection: _detectDirection,
|
|
2601
|
+
getChild: getChild,
|
|
2602
|
+
expando: expando
|
|
2603
|
+
};
|
|
2604
|
+
|
|
2605
|
+
/**
|
|
2606
|
+
* Get the Sortable instance of an element
|
|
2607
|
+
* @param {HTMLElement} element The element
|
|
2608
|
+
* @return {Sortable|undefined} The instance of Sortable
|
|
2609
|
+
*/
|
|
2610
|
+
Sortable.get = function (element) {
|
|
2611
|
+
return element[expando];
|
|
2612
|
+
};
|
|
2613
|
+
|
|
2614
|
+
/**
|
|
2615
|
+
* Mount a plugin to Sortable
|
|
2616
|
+
* @param {...SortablePlugin|SortablePlugin[]} plugins Plugins being mounted
|
|
2617
|
+
*/
|
|
2618
|
+
Sortable.mount = function () {
|
|
2619
|
+
for (var _len = arguments.length, plugins = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
2620
|
+
plugins[_key] = arguments[_key];
|
|
2621
|
+
}
|
|
2622
|
+
if (plugins[0].constructor === Array) plugins = plugins[0];
|
|
2623
|
+
plugins.forEach(function (plugin) {
|
|
2624
|
+
if (!plugin.prototype || !plugin.prototype.constructor) {
|
|
2625
|
+
throw "Sortable: Mounted plugin must be a constructor function, not ".concat({}.toString.call(plugin));
|
|
2626
|
+
}
|
|
2627
|
+
if (plugin.utils) Sortable.utils = _objectSpread2(_objectSpread2({}, Sortable.utils), plugin.utils);
|
|
2628
|
+
PluginManager.mount(plugin);
|
|
2629
|
+
});
|
|
2630
|
+
};
|
|
2631
|
+
|
|
2632
|
+
/**
|
|
2633
|
+
* Create sortable instance
|
|
2634
|
+
* @param {HTMLElement} el
|
|
2635
|
+
* @param {Object} [options]
|
|
2636
|
+
*/
|
|
2637
|
+
Sortable.create = function (el, options) {
|
|
2638
|
+
return new Sortable(el, options);
|
|
2639
|
+
};
|
|
2640
|
+
|
|
2641
|
+
// Export
|
|
2642
|
+
Sortable.version = version;
|
|
2643
|
+
|
|
2644
|
+
var autoScrolls = [],
|
|
2645
|
+
scrollEl,
|
|
2646
|
+
scrollRootEl,
|
|
2647
|
+
scrolling = false,
|
|
2648
|
+
lastAutoScrollX,
|
|
2649
|
+
lastAutoScrollY,
|
|
2650
|
+
touchEvt$1,
|
|
2651
|
+
pointerElemChangedInterval;
|
|
2652
|
+
function AutoScrollPlugin() {
|
|
2653
|
+
function AutoScroll() {
|
|
2654
|
+
this.defaults = {
|
|
2655
|
+
scroll: true,
|
|
2656
|
+
forceAutoScrollFallback: false,
|
|
2657
|
+
scrollSensitivity: 30,
|
|
2658
|
+
scrollSpeed: 10,
|
|
2659
|
+
bubbleScroll: true
|
|
2660
|
+
};
|
|
2661
|
+
|
|
2662
|
+
// Bind all private methods
|
|
2663
|
+
for (var fn in this) {
|
|
2664
|
+
if (fn.charAt(0) === '_' && typeof this[fn] === 'function') {
|
|
2665
|
+
this[fn] = this[fn].bind(this);
|
|
2666
|
+
}
|
|
2667
|
+
}
|
|
2668
|
+
}
|
|
2669
|
+
AutoScroll.prototype = {
|
|
2670
|
+
dragStarted: function dragStarted(_ref) {
|
|
2671
|
+
var originalEvent = _ref.originalEvent;
|
|
2672
|
+
if (this.sortable.nativeDraggable) {
|
|
2673
|
+
on(document, 'dragover', this._handleAutoScroll);
|
|
2674
|
+
} else {
|
|
2675
|
+
if (this.options.supportPointer) {
|
|
2676
|
+
on(document, 'pointermove', this._handleFallbackAutoScroll);
|
|
2677
|
+
} else if (originalEvent.touches) {
|
|
2678
|
+
on(document, 'touchmove', this._handleFallbackAutoScroll);
|
|
2679
|
+
} else {
|
|
2680
|
+
on(document, 'mousemove', this._handleFallbackAutoScroll);
|
|
2681
|
+
}
|
|
2682
|
+
}
|
|
2683
|
+
},
|
|
2684
|
+
dragOverCompleted: function dragOverCompleted(_ref2) {
|
|
2685
|
+
var originalEvent = _ref2.originalEvent;
|
|
2686
|
+
// For when bubbling is canceled and using fallback (fallback 'touchmove' always reached)
|
|
2687
|
+
if (!this.options.dragOverBubble && !originalEvent.rootEl) {
|
|
2688
|
+
this._handleAutoScroll(originalEvent);
|
|
2689
|
+
}
|
|
2690
|
+
},
|
|
2691
|
+
drop: function drop() {
|
|
2692
|
+
if (this.sortable.nativeDraggable) {
|
|
2693
|
+
off(document, 'dragover', this._handleAutoScroll);
|
|
2694
|
+
} else {
|
|
2695
|
+
off(document, 'pointermove', this._handleFallbackAutoScroll);
|
|
2696
|
+
off(document, 'touchmove', this._handleFallbackAutoScroll);
|
|
2697
|
+
off(document, 'mousemove', this._handleFallbackAutoScroll);
|
|
2698
|
+
}
|
|
2699
|
+
clearPointerElemChangedInterval();
|
|
2700
|
+
clearAutoScrolls();
|
|
2701
|
+
cancelThrottle();
|
|
2702
|
+
},
|
|
2703
|
+
nulling: function nulling() {
|
|
2704
|
+
touchEvt$1 = scrollRootEl = scrollEl = scrolling = pointerElemChangedInterval = lastAutoScrollX = lastAutoScrollY = null;
|
|
2705
|
+
autoScrolls.length = 0;
|
|
2706
|
+
},
|
|
2707
|
+
_handleFallbackAutoScroll: function _handleFallbackAutoScroll(evt) {
|
|
2708
|
+
this._handleAutoScroll(evt, true);
|
|
2709
|
+
},
|
|
2710
|
+
_handleAutoScroll: function _handleAutoScroll(evt, fallback) {
|
|
2711
|
+
var _this = this;
|
|
2712
|
+
var x = (evt.touches ? evt.touches[0] : evt).clientX,
|
|
2713
|
+
y = (evt.touches ? evt.touches[0] : evt).clientY,
|
|
2714
|
+
elem = document.elementFromPoint(x, y);
|
|
2715
|
+
touchEvt$1 = evt;
|
|
2716
|
+
|
|
2717
|
+
// IE does not seem to have native autoscroll,
|
|
2718
|
+
// Edge's autoscroll seems too conditional,
|
|
2719
|
+
// MACOS Safari does not have autoscroll,
|
|
2720
|
+
// Firefox and Chrome are good
|
|
2721
|
+
if (fallback || this.options.forceAutoScrollFallback || Edge || IE11OrLess || Safari) {
|
|
2722
|
+
autoScroll(evt, this.options, elem, fallback);
|
|
2723
|
+
|
|
2724
|
+
// Listener for pointer element change
|
|
2725
|
+
var ogElemScroller = getParentAutoScrollElement(elem, true);
|
|
2726
|
+
if (scrolling && (!pointerElemChangedInterval || x !== lastAutoScrollX || y !== lastAutoScrollY)) {
|
|
2727
|
+
pointerElemChangedInterval && clearPointerElemChangedInterval();
|
|
2728
|
+
// Detect for pointer elem change, emulating native DnD behaviour
|
|
2729
|
+
pointerElemChangedInterval = setInterval(function () {
|
|
2730
|
+
var newElem = getParentAutoScrollElement(document.elementFromPoint(x, y), true);
|
|
2731
|
+
if (newElem !== ogElemScroller) {
|
|
2732
|
+
ogElemScroller = newElem;
|
|
2733
|
+
clearAutoScrolls();
|
|
2734
|
+
}
|
|
2735
|
+
autoScroll(evt, _this.options, newElem, fallback);
|
|
2736
|
+
}, 10);
|
|
2737
|
+
lastAutoScrollX = x;
|
|
2738
|
+
lastAutoScrollY = y;
|
|
2739
|
+
}
|
|
2740
|
+
} else {
|
|
2741
|
+
// if DnD is enabled (and browser has good autoscrolling), first autoscroll will already scroll, so get parent autoscroll of first autoscroll
|
|
2742
|
+
if (!this.options.bubbleScroll || getParentAutoScrollElement(elem, true) === getWindowScrollingElement()) {
|
|
2743
|
+
clearAutoScrolls();
|
|
2744
|
+
return;
|
|
2745
|
+
}
|
|
2746
|
+
autoScroll(evt, this.options, getParentAutoScrollElement(elem, false), false);
|
|
2747
|
+
}
|
|
2748
|
+
}
|
|
2749
|
+
};
|
|
2750
|
+
return _extends(AutoScroll, {
|
|
2751
|
+
pluginName: 'scroll',
|
|
2752
|
+
initializeByDefault: true
|
|
2753
|
+
});
|
|
2754
|
+
}
|
|
2755
|
+
function clearAutoScrolls() {
|
|
2756
|
+
autoScrolls.forEach(function (autoScroll) {
|
|
2757
|
+
clearInterval(autoScroll.pid);
|
|
2758
|
+
});
|
|
2759
|
+
autoScrolls = [];
|
|
2760
|
+
}
|
|
2761
|
+
function clearPointerElemChangedInterval() {
|
|
2762
|
+
clearInterval(pointerElemChangedInterval);
|
|
2763
|
+
}
|
|
2764
|
+
var autoScroll = throttle(function (evt, options, rootEl, isFallback) {
|
|
2765
|
+
// Bug: https://bugzilla.mozilla.org/show_bug.cgi?id=505521
|
|
2766
|
+
if (!options.scroll) return;
|
|
2767
|
+
var x = (evt.touches ? evt.touches[0] : evt).clientX,
|
|
2768
|
+
y = (evt.touches ? evt.touches[0] : evt).clientY,
|
|
2769
|
+
sens = options.scrollSensitivity,
|
|
2770
|
+
speed = options.scrollSpeed,
|
|
2771
|
+
winScroller = getWindowScrollingElement();
|
|
2772
|
+
var scrollThisInstance = false,
|
|
2773
|
+
scrollCustomFn;
|
|
2774
|
+
|
|
2775
|
+
// New scroll root, set scrollEl
|
|
2776
|
+
if (scrollRootEl !== rootEl) {
|
|
2777
|
+
scrollRootEl = rootEl;
|
|
2778
|
+
clearAutoScrolls();
|
|
2779
|
+
scrollEl = options.scroll;
|
|
2780
|
+
scrollCustomFn = options.scrollFn;
|
|
2781
|
+
if (scrollEl === true) {
|
|
2782
|
+
scrollEl = getParentAutoScrollElement(rootEl, true);
|
|
2783
|
+
}
|
|
2784
|
+
}
|
|
2785
|
+
var layersOut = 0;
|
|
2786
|
+
var currentParent = scrollEl;
|
|
2787
|
+
do {
|
|
2788
|
+
var el = currentParent,
|
|
2789
|
+
rect = getRect(el),
|
|
2790
|
+
top = rect.top,
|
|
2791
|
+
bottom = rect.bottom,
|
|
2792
|
+
left = rect.left,
|
|
2793
|
+
right = rect.right,
|
|
2794
|
+
width = rect.width,
|
|
2795
|
+
height = rect.height,
|
|
2796
|
+
canScrollX = void 0,
|
|
2797
|
+
canScrollY = void 0,
|
|
2798
|
+
scrollWidth = el.scrollWidth,
|
|
2799
|
+
scrollHeight = el.scrollHeight,
|
|
2800
|
+
elCSS = css(el),
|
|
2801
|
+
scrollPosX = el.scrollLeft,
|
|
2802
|
+
scrollPosY = el.scrollTop;
|
|
2803
|
+
if (el === winScroller) {
|
|
2804
|
+
canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll' || elCSS.overflowX === 'visible');
|
|
2805
|
+
canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll' || elCSS.overflowY === 'visible');
|
|
2806
|
+
} else {
|
|
2807
|
+
canScrollX = width < scrollWidth && (elCSS.overflowX === 'auto' || elCSS.overflowX === 'scroll');
|
|
2808
|
+
canScrollY = height < scrollHeight && (elCSS.overflowY === 'auto' || elCSS.overflowY === 'scroll');
|
|
2809
|
+
}
|
|
2810
|
+
var vx = canScrollX && (Math.abs(right - x) <= sens && scrollPosX + width < scrollWidth) - (Math.abs(left - x) <= sens && !!scrollPosX);
|
|
2811
|
+
var vy = canScrollY && (Math.abs(bottom - y) <= sens && scrollPosY + height < scrollHeight) - (Math.abs(top - y) <= sens && !!scrollPosY);
|
|
2812
|
+
if (!autoScrolls[layersOut]) {
|
|
2813
|
+
for (var i = 0; i <= layersOut; i++) {
|
|
2814
|
+
if (!autoScrolls[i]) {
|
|
2815
|
+
autoScrolls[i] = {};
|
|
2816
|
+
}
|
|
2817
|
+
}
|
|
2818
|
+
}
|
|
2819
|
+
if (autoScrolls[layersOut].vx != vx || autoScrolls[layersOut].vy != vy || autoScrolls[layersOut].el !== el) {
|
|
2820
|
+
autoScrolls[layersOut].el = el;
|
|
2821
|
+
autoScrolls[layersOut].vx = vx;
|
|
2822
|
+
autoScrolls[layersOut].vy = vy;
|
|
2823
|
+
clearInterval(autoScrolls[layersOut].pid);
|
|
2824
|
+
if (vx != 0 || vy != 0) {
|
|
2825
|
+
scrollThisInstance = true;
|
|
2826
|
+
/* jshint loopfunc:true */
|
|
2827
|
+
autoScrolls[layersOut].pid = setInterval(function () {
|
|
2828
|
+
// emulate drag over during autoscroll (fallback), emulating native DnD behaviour
|
|
2829
|
+
if (isFallback && this.layer === 0) {
|
|
2830
|
+
Sortable.active._onTouchMove(touchEvt$1); // To move ghost if it is positioned absolutely
|
|
2831
|
+
}
|
|
2832
|
+
var scrollOffsetY = autoScrolls[this.layer].vy ? autoScrolls[this.layer].vy * speed : 0;
|
|
2833
|
+
var scrollOffsetX = autoScrolls[this.layer].vx ? autoScrolls[this.layer].vx * speed : 0;
|
|
2834
|
+
if (typeof scrollCustomFn === 'function') {
|
|
2835
|
+
if (scrollCustomFn.call(Sortable.dragged.parentNode[expando], scrollOffsetX, scrollOffsetY, evt, touchEvt$1, autoScrolls[this.layer].el) !== 'continue') {
|
|
2836
|
+
return;
|
|
2837
|
+
}
|
|
2838
|
+
}
|
|
2839
|
+
scrollBy(autoScrolls[this.layer].el, scrollOffsetX, scrollOffsetY);
|
|
2840
|
+
}.bind({
|
|
2841
|
+
layer: layersOut
|
|
2842
|
+
}), 24);
|
|
2843
|
+
}
|
|
2844
|
+
}
|
|
2845
|
+
layersOut++;
|
|
2846
|
+
} while (options.bubbleScroll && currentParent !== winScroller && (currentParent = getParentAutoScrollElement(currentParent, false)));
|
|
2847
|
+
scrolling = scrollThisInstance; // in case another function catches scrolling as false in between when it is not
|
|
2848
|
+
}, 30);
|
|
2849
|
+
|
|
2850
|
+
var drop = function drop(_ref) {
|
|
2851
|
+
var originalEvent = _ref.originalEvent,
|
|
2852
|
+
putSortable = _ref.putSortable,
|
|
2853
|
+
dragEl = _ref.dragEl,
|
|
2854
|
+
activeSortable = _ref.activeSortable,
|
|
2855
|
+
dispatchSortableEvent = _ref.dispatchSortableEvent,
|
|
2856
|
+
hideGhostForTarget = _ref.hideGhostForTarget,
|
|
2857
|
+
unhideGhostForTarget = _ref.unhideGhostForTarget;
|
|
2858
|
+
if (!originalEvent) return;
|
|
2859
|
+
var toSortable = putSortable || activeSortable;
|
|
2860
|
+
hideGhostForTarget();
|
|
2861
|
+
var touch = originalEvent.changedTouches && originalEvent.changedTouches.length ? originalEvent.changedTouches[0] : originalEvent;
|
|
2862
|
+
var target = document.elementFromPoint(touch.clientX, touch.clientY);
|
|
2863
|
+
unhideGhostForTarget();
|
|
2864
|
+
if (toSortable && !toSortable.el.contains(target)) {
|
|
2865
|
+
dispatchSortableEvent('spill');
|
|
2866
|
+
this.onSpill({
|
|
2867
|
+
dragEl: dragEl,
|
|
2868
|
+
putSortable: putSortable
|
|
2869
|
+
});
|
|
2870
|
+
}
|
|
2871
|
+
};
|
|
2872
|
+
function Revert() {}
|
|
2873
|
+
Revert.prototype = {
|
|
2874
|
+
startIndex: null,
|
|
2875
|
+
dragStart: function dragStart(_ref2) {
|
|
2876
|
+
var oldDraggableIndex = _ref2.oldDraggableIndex;
|
|
2877
|
+
this.startIndex = oldDraggableIndex;
|
|
2878
|
+
},
|
|
2879
|
+
onSpill: function onSpill(_ref3) {
|
|
2880
|
+
var dragEl = _ref3.dragEl,
|
|
2881
|
+
putSortable = _ref3.putSortable;
|
|
2882
|
+
this.sortable.captureAnimationState();
|
|
2883
|
+
if (putSortable) {
|
|
2884
|
+
putSortable.captureAnimationState();
|
|
2885
|
+
}
|
|
2886
|
+
var nextSibling = getChild(this.sortable.el, this.startIndex, this.options);
|
|
2887
|
+
if (nextSibling) {
|
|
2888
|
+
this.sortable.el.insertBefore(dragEl, nextSibling);
|
|
2889
|
+
} else {
|
|
2890
|
+
this.sortable.el.appendChild(dragEl);
|
|
2891
|
+
}
|
|
2892
|
+
this.sortable.animateAll();
|
|
2893
|
+
if (putSortable) {
|
|
2894
|
+
putSortable.animateAll();
|
|
2895
|
+
}
|
|
2896
|
+
},
|
|
2897
|
+
drop: drop
|
|
2898
|
+
};
|
|
2899
|
+
_extends(Revert, {
|
|
2900
|
+
pluginName: 'revertOnSpill'
|
|
2901
|
+
});
|
|
2902
|
+
function Remove() {}
|
|
2903
|
+
Remove.prototype = {
|
|
2904
|
+
onSpill: function onSpill(_ref4) {
|
|
2905
|
+
var dragEl = _ref4.dragEl,
|
|
2906
|
+
putSortable = _ref4.putSortable;
|
|
2907
|
+
var parentSortable = putSortable || this.sortable;
|
|
2908
|
+
parentSortable.captureAnimationState();
|
|
2909
|
+
dragEl.parentNode && dragEl.parentNode.removeChild(dragEl);
|
|
2910
|
+
parentSortable.animateAll();
|
|
2911
|
+
},
|
|
2912
|
+
drop: drop
|
|
2913
|
+
};
|
|
2914
|
+
_extends(Remove, {
|
|
2915
|
+
pluginName: 'removeOnSpill'
|
|
2916
|
+
});
|
|
2917
|
+
|
|
2918
|
+
Sortable.mount(new AutoScrollPlugin());
|
|
2919
|
+
Sortable.mount(Remove, Revert);
|
|
2920
|
+
|
|
2921
|
+
const XV_DATA_TABLE_TAG = 'xv-data-table';
|
|
2922
|
+
const XV_DATA_TABLE_ROW_TAG = 'xv-data-table-row';
|
|
2923
|
+
const XV_ROW_DRAG_HANDLE_CLASS = 'xv-row-drag-handle';
|
|
2924
|
+
|
|
272
2925
|
const xvDataTableCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{--xv-data-table-min-height:51.11px;--xv-data-table-border-width:1px;--xv-data-table-border-color:var(--border-subtle-01, #D1D1D1);--xv-data-table-padding-x:var(--spacing-05, 16px);--xv-data-table-padding-y:var(--spacing-05, 16px);--xv-data-table-row-bg:transparent;width:inherit;text-align:left;color:var(--text-primary, #333);font-family:var(--ff-body, Tahoma);font-size:var(--fz-md, 14px);line-height:18px;letter-spacing:0.16px}@media screen and (max-width: 1180px){:host{display:block;position:relative;overflow-x:auto;scrollbar-width:thin;scrollbar-color:var(--layer-accent-03) transparent}:host ::slotted([slot=title]),:host>table{min-width:1180px}}:host .bar{position:sticky;left:0;z-index:10}:host .bar_batch{position:absolute;bottom:0;left:0;right:0;pointer-events:unset;user-select:unset;z-index:2;background-color:var(--interactive-01, #273435);color:var(--text-on-color, #fff);border-radius:3px 3px 0 0;display:flex;align-items:center}:host .bar_toolbar{z-index:1;border-radius:3px 3px 0 0}:host ::slotted([slot=title]){margin:0 !important;color:var(--text-primary, #333) !important;font-family:var(--ff-heading, "Gill Sans") !important;font-size:var(--fz-xl, 21px) !important;text-align:left;font-style:normal !important;font-weight:400 !important;line-height:normal !important;padding:var(--spacing-05) var(--spacing-05) var(--spacing-06) !important}:host ::slotted([slot=toolbar]){margin-bottom:var(--spacing-03)}:host>table{width:inherit;border-collapse:collapse;table-layout:fixed;border-left:1px solid var(--xv-data-table-border-color);border-right:1px solid var(--xv-data-table-border-color)}:host>caption{display:contents}:host .loading{z-index:10;display:flex;align-items:center;justify-content:center;min-height:var(--xv-data-table-min-height, 51.11px);position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(255, 255, 255, 0.8)}:host([block]){width:100%}:host([block])>table{table-layout:fixed}:host([size=xs]){--xv-data-table-padding-x:var(--spacing-02, 4px);--xv-data-table-padding-y:var(--spacing-02, 4px)}:host([size=sm]){--xv-data-table-padding-x:var(--spacing-04, 12px);--xv-data-table-padding-y:var(--spacing-03, 8px)}:host([size=md]){--xv-data-table-padding-x:var(--spacing-05, 16px);--xv-data-table-padding-y:var(--spacing-05, 16px)}:host([size=lg]){--xv-data-table-padding-x:var(--spacing-05, 16px);--xv-data-table-padding-y:var(--spacing-06, 24px)}:host([size=xl]){--xv-data-table-padding-x:var(--spacing-06, 24px);--xv-data-table-padding-y:var(--spacing-07, 32px)}`;
|
|
273
2926
|
|
|
274
2927
|
const XvDataTable = class {
|
|
275
2928
|
constructor(hostRef) {
|
|
276
2929
|
registerInstance(this, hostRef);
|
|
2930
|
+
this.reorderChange = createEvent(this, "reorderChange", 7);
|
|
277
2931
|
this.size = SIZE_VAR.MD;
|
|
278
2932
|
this.columnWidths = [];
|
|
279
2933
|
this.multiple = true;
|
|
280
2934
|
this.hover = false;
|
|
2935
|
+
this.reorderable = false;
|
|
2936
|
+
this.reorderHandle = 'icon';
|
|
2937
|
+
this.dragPrevSibling = null;
|
|
2938
|
+
this.dragStartBodyIndex = -1;
|
|
2939
|
+
this.initSortable = () => {
|
|
2940
|
+
if (this.sortable)
|
|
2941
|
+
return;
|
|
2942
|
+
const options = {
|
|
2943
|
+
animation: 150,
|
|
2944
|
+
easing: 'cubic-bezier(0.4, 0, 0.2, 1)',
|
|
2945
|
+
draggable: XV_DATA_TABLE_ROW_TAG,
|
|
2946
|
+
filter: this.sortableFilter,
|
|
2947
|
+
preventOnFilter: false,
|
|
2948
|
+
ghostClass: 'xv-row-ghost',
|
|
2949
|
+
chosenClass: 'xv-row-chosen',
|
|
2950
|
+
dragClass: 'xv-row-drag',
|
|
2951
|
+
fallbackOnBody: true,
|
|
2952
|
+
onStart: (evt) => {
|
|
2953
|
+
var _a;
|
|
2954
|
+
const item = evt.item;
|
|
2955
|
+
(_a = item.close) === null || _a === void 0 ? void 0 : _a.call(item);
|
|
2956
|
+
this.dragPrevSibling = item.previousElementSibling;
|
|
2957
|
+
this.dragStartBodyIndex = this.getBodyRowIndex(item);
|
|
2958
|
+
},
|
|
2959
|
+
onEnd: (evt) => {
|
|
2960
|
+
const item = evt.item;
|
|
2961
|
+
const to = this.getBodyRowIndex(item);
|
|
2962
|
+
const from = this.dragStartBodyIndex;
|
|
2963
|
+
this.revertDom(item);
|
|
2964
|
+
this.dragPrevSibling = null;
|
|
2965
|
+
this.dragStartBodyIndex = -1;
|
|
2966
|
+
if (from < 0 || to < 0 || from === to)
|
|
2967
|
+
return;
|
|
2968
|
+
this.reorderChange.emit({ from, to });
|
|
2969
|
+
},
|
|
2970
|
+
};
|
|
2971
|
+
this.sortable = new Sortable(this.el, options);
|
|
2972
|
+
};
|
|
2973
|
+
this.sortableFilter = (evt, target) => {
|
|
2974
|
+
var _a, _b, _c, _d;
|
|
2975
|
+
const slot = (_a = target === null || target === void 0 ? void 0 : target.getAttribute) === null || _a === void 0 ? void 0 : _a.call(target, 'slot');
|
|
2976
|
+
if (slot === 'header' || slot === 'footer')
|
|
2977
|
+
return true;
|
|
2978
|
+
const row = target;
|
|
2979
|
+
if ((row === null || row === void 0 ? void 0 : row.header) || (row === null || row === void 0 ? void 0 : row.footer) || (row === null || row === void 0 ? void 0 : row.group))
|
|
2980
|
+
return true;
|
|
2981
|
+
if (this.reorderHandle === 'icon') {
|
|
2982
|
+
const path = (_d = (_c = (_b = evt).composedPath) === null || _c === void 0 ? void 0 : _c.call(_b)) !== null && _d !== void 0 ? _d : [];
|
|
2983
|
+
const onHandle = path.some((n) => {
|
|
2984
|
+
var _a, _b;
|
|
2985
|
+
const el = n;
|
|
2986
|
+
return (_b = (_a = el === null || el === void 0 ? void 0 : el.classList) === null || _a === void 0 ? void 0 : _a.contains) === null || _b === void 0 ? void 0 : _b.call(_a, XV_ROW_DRAG_HANDLE_CLASS);
|
|
2987
|
+
});
|
|
2988
|
+
if (!onHandle)
|
|
2989
|
+
return true;
|
|
2990
|
+
}
|
|
2991
|
+
return false;
|
|
2992
|
+
};
|
|
2993
|
+
this.destroySortable = () => {
|
|
2994
|
+
var _a;
|
|
2995
|
+
(_a = this.sortable) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
2996
|
+
this.sortable = undefined;
|
|
2997
|
+
};
|
|
2998
|
+
this.revertDom = (item) => {
|
|
2999
|
+
if (this.dragPrevSibling && this.dragPrevSibling.parentNode === this.el) {
|
|
3000
|
+
this.dragPrevSibling.after(item);
|
|
3001
|
+
}
|
|
3002
|
+
else {
|
|
3003
|
+
this.el.insertBefore(item, this.el.firstChild);
|
|
3004
|
+
}
|
|
3005
|
+
};
|
|
3006
|
+
this.getBodyRowIndex = (item) => {
|
|
3007
|
+
const bodyRows = Array.from(this.el.children).filter((c) => c.tagName.toLowerCase() === XV_DATA_TABLE_ROW_TAG && !c.hasAttribute('slot'));
|
|
3008
|
+
return bodyRows.indexOf(item);
|
|
3009
|
+
};
|
|
3010
|
+
}
|
|
3011
|
+
componentDidLoad() {
|
|
3012
|
+
if (this.reorderable)
|
|
3013
|
+
this.initSortable();
|
|
3014
|
+
}
|
|
3015
|
+
disconnectedCallback() {
|
|
3016
|
+
this.destroySortable();
|
|
3017
|
+
}
|
|
3018
|
+
reorderableChanged(newVal) {
|
|
3019
|
+
if (newVal)
|
|
3020
|
+
this.initSortable();
|
|
3021
|
+
else
|
|
3022
|
+
this.destroySortable();
|
|
3023
|
+
}
|
|
3024
|
+
reorderHandleChanged() {
|
|
3025
|
+
if (!this.reorderable)
|
|
3026
|
+
return;
|
|
3027
|
+
this.destroySortable();
|
|
3028
|
+
this.initSortable();
|
|
281
3029
|
}
|
|
282
3030
|
render() {
|
|
283
|
-
return (h(Host, { key: '
|
|
3031
|
+
return (h(Host, { key: '46b0c11ca4a13dbded5d7b5e3e44650f370a8711', class: "xv-data-table" }, h("caption", { key: 'aebf6cae0ea46563440ba971624635fa8cbadb72' }, h("slot", { key: 'af920f9c9705d1811c3980201c5bc4f9bb0bc84c', name: "title" })), h("div", { key: '89c886de25873e4d514e77572be7ca6de329f096', class: "bar" }, h("div", { key: '688b92cfc93878847e6925e3120ef3f59696cafd', class: "bar_batch" }, h("slot", { key: '8909114bda82194459f0338a23db76b527a1fe5a', name: "batch" })), h("div", { key: '555c3b65badfd9645767e89714a9d2c97dc9f7c1', class: "bar_toolbar" }, h("slot", { key: '9946f62bd101f59e3622321dfe86efaff2c0574b', name: "toolbar" }))), h("table", { key: 'a998f83af603ceef8b26667b117eeee99627ed54', role: "table" }, this.columnWidths.length > 0 && (h("colgroup", { key: '3e46d94f2ed815a4980928f65fefe724d39cd23c' }, this.columnWidths.map((width = 'auto') => h("col", { style: { width } })))), h("thead", { key: 'cb1a3b8db2ef9acbf1258e927612f092b8cf9a74' }, h("slot", { key: '9f18a1f0c2e08be4e6234f6b92184673afb6deb9', name: "header" })), h("tbody", { key: 'deb98974530349fb5d07edbc64e5d41de7a1ff64' }, h("slot", { key: 'a9c85de5cdcd0aee2685003775797ef70f0a08f9' })), h("tfoot", { key: '0e94add0841b8dfe2c47fc50c6ac0e517a8e55af' }, h("slot", { key: 'd7c33b811006d6b8bac137bded4a9c44a7ea0dc0', name: "footer" }))), !!this.loading && (h("div", { key: 'a699818d55901f79fabefbd33f5c97f9058fb348', class: "loading" }, h("xv-loader-v2", { key: 'e8a137029a7f418fe82a21aff761d9c737d05310', size: SIZE_VAR.LG })))));
|
|
284
3032
|
}
|
|
285
3033
|
get el() { return getElement(this); }
|
|
3034
|
+
static get watchers() { return {
|
|
3035
|
+
"reorderable": [{
|
|
3036
|
+
"reorderableChanged": 0
|
|
3037
|
+
}],
|
|
3038
|
+
"reorderHandle": [{
|
|
3039
|
+
"reorderHandleChanged": 0
|
|
3040
|
+
}]
|
|
3041
|
+
}; }
|
|
286
3042
|
};
|
|
287
3043
|
XvDataTable.style = xvDataTableCss();
|
|
288
3044
|
|
|
@@ -327,9 +3083,6 @@ const XvDataTableCell = class {
|
|
|
327
3083
|
};
|
|
328
3084
|
XvDataTableCell.style = xvDataTableCellCss();
|
|
329
3085
|
|
|
330
|
-
const XV_DATA_TABLE_TAG = 'xv-data-table';
|
|
331
|
-
const XV_DATA_TABLE_ROW_TAG = 'xv-data-table-row';
|
|
332
|
-
|
|
333
3086
|
const xvDataTableCollapseCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host([collapsed]){display:none}:host([expanded]){display:contents}`;
|
|
334
3087
|
|
|
335
3088
|
const XvDataTableCollapse = class {
|
|
@@ -355,7 +3108,7 @@ const XvDataTableCollapse = class {
|
|
|
355
3108
|
};
|
|
356
3109
|
XvDataTableCollapse.style = xvDataTableCollapseCss();
|
|
357
3110
|
|
|
358
|
-
const xvDataTableRowCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:table-row;background-color:var(--xv-data-table-row-bg, transparent);transition:0.2s ease-in-out background-color}:host .cell-control{font-size:8px;max-width:16px;position:relative;padding-left:calc(var(--xv-data-table-padding-x) + var(--xv-data-table-padding-x) + 10px + 1em);overflow:visible}:host .cell-control_collapse{font-size:inherit;width:1em;height:1em;margin:0;padding:0;position:absolute;overflow:visible;background-color:transparent;outline:none;top:calc(50% - 0.7em);left:var(--xv-data-table-padding-x);display:inline-flex;border-top:none;border-left:none;border-right:2px solid var(--icon-primary, #333);border-bottom:2px solid var(--icon-primary, #333);transform:rotate(45deg);transform-origin:center center;transition:0.2s ease-in-out transform, 0.2s ease-in-out opacity;cursor:pointer;box-sizing:content-box}:host .cell-control_collapse:active{opacity:0.4}:host .cell-control_collapse.open{transform:rotate(-135deg)}:host .cell-control_checkbox{display:flex}:host(.hover:not(.header):hover){background-color:var(--layer-hover-01, #E9E9E9)}:host(.checked){background-color:var(--layer-selected-02, #E3E3E3)}:host(.hover.checked:hover){background-color:var(--layer-selected-hover-02, #DADADA)}:host(.group:not(.checked)){background-color:var(--layer-accent-01, #F7F7F7)}:host(.hover.group:not(.checked):hover){background-color:var(--layer-accent-hover-01, #E3E3E3)}:host(.header),:host(.footer),:host(.footer:hover),:host(.footer.hover),:host(.footer.hover:hover){background-color:var(--layer-accent-02, #E3E3E3)}:host(.disabled:not(.header):not(.footer)){opacity:0.5;cursor:not-allowed;user-select:none}`;
|
|
3111
|
+
const xvDataTableRowCss = () => `.xv-container{width:100%;max-width:1170px;margin-inline:auto}@media (min-width: 576px){.xv-container{max-width:540px}}@media (min-width: 768px){.xv-container{max-width:720px}}@media (min-width: 992px){.xv-container{max-width:960px;padding-inline:var(--bs-gutter-x, 0.75rem)}}@media (min-width: 1200px){.xv-container{max-width:1140px}}@media (min-width: 1400px){.xv-container{max-width:1320px}}.xv-tooltip[role=tooltip]{position:absolute;background-color:var(--background-inverse, #333333);color:var(--text-on-color);padding:var(--spacing-03) var(--spacing-04);border-radius:3px;font-size:var(--fz-sm);z-index:999;min-width:min(150px, 90vw);max-width:min(400px, 90vw)}.xv-tooltip[role=tooltip]::after{content:"";position:absolute;width:0;height:0;border-style:solid}.xv-tooltip[role=tooltip][data-popper-placement=top]::after{bottom:-5px;left:50%;transform:translateX(-50%);border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-start]::after{bottom:-5px;left:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=top-end]::after{bottom:-5px;right:12px;border-width:5px 5px 0 5px;border-color:var(--background-inverse, black) transparent transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom]::after{top:-5px;left:50%;transform:translateX(-50%);border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-start]::after{top:-5px;left:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=bottom-end]::after{top:-5px;right:12px;border-width:0 5px 5px 5px;border-color:transparent transparent var(--background-inverse, black) transparent}.xv-tooltip[role=tooltip][data-popper-placement=left]::after{top:50%;right:-5px;transform:translateY(-50%);border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-start]::after{top:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=left-end]::after{bottom:12px;right:-5px;border-width:5px 0 5px 5px;border-color:transparent transparent transparent var(--background-inverse, black)}.xv-tooltip[role=tooltip][data-popper-placement=right]::after{top:50%;left:-5px;transform:translateY(-50%);border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-start]::after{top:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}.xv-tooltip[role=tooltip][data-popper-placement=right-end]::after{bottom:12px;left:-5px;border-width:5px 5px 5px 0;border-color:transparent var(--background-inverse, black) transparent transparent}:host{display:table-row;background-color:var(--xv-data-table-row-bg, transparent);transition:0.2s ease-in-out background-color}:host .cell-control{font-size:8px;max-width:16px;position:relative;padding-left:calc(var(--xv-data-table-padding-x) + var(--xv-data-table-padding-x) + 10px + 1em);overflow:visible}:host .cell-control_collapse{font-size:inherit;width:1em;height:1em;margin:0;padding:0;position:absolute;overflow:visible;background-color:transparent;outline:none;top:calc(50% - 0.7em);left:var(--xv-data-table-padding-x);display:inline-flex;border-top:none;border-left:none;border-right:2px solid var(--icon-primary, #333);border-bottom:2px solid var(--icon-primary, #333);transform:rotate(45deg);transform-origin:center center;transition:0.2s ease-in-out transform, 0.2s ease-in-out opacity;cursor:pointer;box-sizing:content-box}:host .cell-control_collapse:active{opacity:0.4}:host .cell-control_collapse.open{transform:rotate(-135deg)}:host .cell-control_checkbox{display:flex}:host .cell-control_drag{position:absolute;top:50%;left:var(--xv-data-table-padding-x);transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;padding:4px;line-height:0;color:var(--icon-secondary, #6f6f6f);cursor:grab;touch-action:none;transition:0.15s ease-in-out color}:host .cell-control_drag:hover{color:var(--icon-primary, #333)}:host .cell-control_drag:active{cursor:grabbing}:host(.reorder-row){cursor:grab}:host(.reorder-row):active{cursor:grabbing}:host(.xv-row-ghost){opacity:0.4;background-color:var(--layer-accent-01, #F7F7F7)}:host(.xv-row-chosen){background-color:var(--layer-hover-01, #E9E9E9)}:host(.xv-row-drag){box-shadow:0 4px 12px rgba(0, 0, 0, 0.12);cursor:grabbing}:host(.hover:not(.header):hover){background-color:var(--layer-hover-01, #E9E9E9)}:host(.checked){background-color:var(--layer-selected-02, #E3E3E3)}:host(.hover.checked:hover){background-color:var(--layer-selected-hover-02, #DADADA)}:host(.group:not(.checked)){background-color:var(--layer-accent-01, #F7F7F7)}:host(.hover.group:not(.checked):hover){background-color:var(--layer-accent-hover-01, #E3E3E3)}:host(.header),:host(.footer),:host(.footer:hover),:host(.footer.hover),:host(.footer.hover:hover){background-color:var(--layer-accent-02, #E3E3E3)}:host(.disabled:not(.header):not(.footer)){opacity:0.5;cursor:not-allowed;user-select:none}`;
|
|
359
3112
|
|
|
360
3113
|
const XvDataTableRow = class {
|
|
361
3114
|
constructor(hostRef) {
|
|
@@ -371,6 +3124,8 @@ const XvDataTableRow = class {
|
|
|
371
3124
|
this.readonly = false;
|
|
372
3125
|
this.required = false;
|
|
373
3126
|
this.collapsed = false;
|
|
3127
|
+
this.reorderable = false;
|
|
3128
|
+
this.reorderHandleMode = 'icon';
|
|
374
3129
|
this.collapseClick = async () => {
|
|
375
3130
|
var _a;
|
|
376
3131
|
if (!this.collapse || !this.collapseEl)
|
|
@@ -389,15 +3144,18 @@ const XvDataTableRow = class {
|
|
|
389
3144
|
await ((_a = this.collapseEl) === null || _a === void 0 ? void 0 : _a.setCollapsed(this.collapsed));
|
|
390
3145
|
};
|
|
391
3146
|
this.setInitialState = () => {
|
|
392
|
-
var _a;
|
|
3147
|
+
var _a, _b, _c;
|
|
393
3148
|
if (this.collapse && !this.collapseEl) {
|
|
394
3149
|
this.collapseEl = this.el.parentElement.querySelector(`xv-data-table-collapse${this.collapse}`);
|
|
395
3150
|
this.collapsed = (_a = this.collapseEl) === null || _a === void 0 ? void 0 : _a.hasAttribute('collapsed');
|
|
396
3151
|
}
|
|
3152
|
+
const table = this.el.closest(XV_DATA_TABLE_TAG);
|
|
397
3153
|
if (!this.hover) {
|
|
398
|
-
|
|
399
|
-
this.hover = table.hasAttribute('hover');
|
|
3154
|
+
this.hover = (_b = table === null || table === void 0 ? void 0 : table.hasAttribute('hover')) !== null && _b !== void 0 ? _b : false;
|
|
400
3155
|
}
|
|
3156
|
+
const isDirectChild = this.el.parentElement === table;
|
|
3157
|
+
this.reorderable = isDirectChild && ((_c = table === null || table === void 0 ? void 0 : table.hasAttribute('reorderable')) !== null && _c !== void 0 ? _c : false);
|
|
3158
|
+
this.reorderHandleMode = (table === null || table === void 0 ? void 0 : table.getAttribute('reorder-handle')) || 'icon';
|
|
401
3159
|
};
|
|
402
3160
|
this.checkedChangeHandle = ({ detail: checked }) => {
|
|
403
3161
|
if (!checked && this.partial)
|
|
@@ -422,14 +3180,20 @@ const XvDataTableRow = class {
|
|
|
422
3180
|
await this.collapseEl.setCollapsed(true);
|
|
423
3181
|
}
|
|
424
3182
|
render() {
|
|
425
|
-
|
|
3183
|
+
const isHeader = this.el.slot === 'header' || !!this.header;
|
|
3184
|
+
const isFooter = this.el.slot === 'footer' || !!this.footer;
|
|
3185
|
+
const isGroup = !!this.collapse || !!this.group;
|
|
3186
|
+
const isDraggableRow = this.reorderable && !isHeader && !isFooter && !this.group;
|
|
3187
|
+
const showHandleCell = this.reorderable && this.reorderHandleMode === 'icon';
|
|
3188
|
+
return (h(Host, { key: '74ea5e91d4423b4f5751fcaf5bce50e11843805c', role: "row", part: "xv-row", class: {
|
|
426
3189
|
checked: this.checked,
|
|
427
3190
|
hover: this.hover,
|
|
428
3191
|
disabled: this.disabled,
|
|
429
|
-
group:
|
|
430
|
-
header:
|
|
431
|
-
footer:
|
|
432
|
-
|
|
3192
|
+
group: isGroup,
|
|
3193
|
+
header: isHeader,
|
|
3194
|
+
footer: isFooter,
|
|
3195
|
+
'reorder-row': isDraggableRow && this.reorderHandleMode === 'row',
|
|
3196
|
+
} }, showHandleCell && (h("xv-data-table-cell", { key: '806087b882248f7f1317a3ad23c64f3e0d550d76', width: "16px", class: "cell-control cell-control--drag" }, isDraggableRow && (h("span", { key: 'ad6ab54599047674f535397f705bf78f5169e3fc', class: `cell-control_drag ${XV_ROW_DRAG_HANDLE_CLASS}`, "aria-label": "Drag to reorder" }, h("svg", { key: 'b6c038a701bf7b24f3639eca9c772c46485b6007', viewBox: "0 0 8 14", width: "8", height: "14", fill: "currentColor", "aria-hidden": "true" }, h("circle", { key: '6a036769cc49e19fb5cf53d41b03d9822c057857', cx: "2", cy: "2", r: "1.2" }), h("circle", { key: '20b8ee5561fe23f75db9b9d98e1c7211b43986dc', cx: "6", cy: "2", r: "1.2" }), h("circle", { key: '6f685e7cb62f3093d51b92be0519841aac132a41', cx: "2", cy: "7", r: "1.2" }), h("circle", { key: 'e93f642c885bb32dd68fd7ffe38c528b0f06f5e6', cx: "6", cy: "7", r: "1.2" }), h("circle", { key: '4ed95d06db9caff9b7f672be9faba43c62b5f10e', cx: "2", cy: "12", r: "1.2" }), h("circle", { key: 'ad4574700d5497d8dd2b050a438ebe45c9d0554a', cx: "6", cy: "12", r: "1.2" })))))), (!!this.variant || this.collapsable) && (h("xv-data-table-cell", { key: '96bc6bb3c9b05147940691f57b222e3b984d4597', width: !!this.variant ? '16px' : '0', class: "cell-control" }, !!this.collapse && (h("button", { key: '79c7b71873a2f07decb6fc71fb8842b8f94f7f4d', class: { 'cell-control_collapse': true, open: !this.collapsed }, onClick: this.collapseClick })), this.variant === 'checkbox' && (h("xv-checkbox-v2", { key: '950ab4b841ea1c1f71ca968db8c3e88827a420e1', name: this.name, partial: this.partial, checked: this.checked || this.partial, disabled: this.disabled, readonly: this.readonly, required: this.required, onEventChange: this.checkedChangeHandle, class: "cell-control_checkbox" })))), h("slot", { key: 'aa156d42a6c407d7fe213d165d8a4abab3b3aed8', onSlotchange: this.setInitialState })));
|
|
433
3197
|
}
|
|
434
3198
|
get el() { return getElement(this); }
|
|
435
3199
|
};
|
|
@@ -77484,8 +80248,10 @@ const XvDatepicker = class {
|
|
|
77484
80248
|
get isPrevDisabled() {
|
|
77485
80249
|
if (!this.minDate)
|
|
77486
80250
|
return false;
|
|
77487
|
-
|
|
77488
|
-
|
|
80251
|
+
// disable only when the WHOLE previous month is before min — its end must
|
|
80252
|
+
// be compared, otherwise a mid-month min blocks navigating to its own month
|
|
80253
|
+
const prevMonthEnd = dateFns.endOfMonth(dateFns.addMonths(this.month, -1));
|
|
80254
|
+
return dateFns.isBefore(prevMonthEnd, this.minDate);
|
|
77489
80255
|
}
|
|
77490
80256
|
get isNextDisabled() {
|
|
77491
80257
|
if (!this.maxDate)
|
|
@@ -77577,12 +80343,12 @@ const XvDatepicker = class {
|
|
|
77577
80343
|
}
|
|
77578
80344
|
render() {
|
|
77579
80345
|
const [start, end] = this.value;
|
|
77580
|
-
return (h(Host, { key: '
|
|
80346
|
+
return (h(Host, { key: '4e1b7968bb670a8fc361c929fcffb804622abcfd', class: { disabled: !!this.disabled }, tabindex: this.disabled ? '-1' : undefined }, h("div", { key: '9a9f2dc31c4d48f5a78ffe904ebbac1c47902c02', "aria-controls": "popover", class: "control" }, this.label && h("label", { key: 'e46e942c45de9d58f6bf131d8f9bf68edc9aeef2', class: "control_label" }, this.label), h("div", { key: '71eb87432754769fe562ed71137d6df64183772d', class: {
|
|
77581
80347
|
'control_field': true,
|
|
77582
80348
|
loading: this.loading,
|
|
77583
80349
|
error: !!this.error || !!this.localError,
|
|
77584
80350
|
warning: this.warning !== undefined,
|
|
77585
|
-
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '
|
|
80351
|
+
}, onClick: this.handleOpen, ref: (el) => (this.controlEl = el) }, h("input", { key: '0908d3af22f8aaf8c5407a8b66ac56c3a34b7d24', lang: "de", type: "date", name: "start", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: start ? dateFns.format(start, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'start'), onBlur: (e) => this.handleBlur(e, 'start'), onKeyDown: (e) => this.handleKeydown(e, 'start') }), this.variant === 'range' && (h("input", { key: '1841a2f65ddb657e0aeff38cc34e90c01019815b', lang: "de", type: "date", name: "end", disabled: this.loading || this.disabled, readonly: this.readonly || this.variant === 'range', min: this.min, max: this.max, value: end ? dateFns.format(end, DEF_FORMAT) : '', onChange: (e) => this.handleChange(e, 'end'), onBlur: (e) => this.handleBlur(e, 'end'), onKeyDown: (e) => this.handleKeydown(e, 'end') }))), (this.helper || this.error || this.warning || this.localError) && (h("div", { key: '13766133adfab4a2ce2c4e038871699d360f22ce' }, this.helper && h("p", { key: '274c7dfcc09ef35b9f0cdbba8454c2fc385370f7', class: "control_message helper" }, this.helper), (this.error || this.warning || this.localError) && (h("p", { key: '3ed6f0c1f53f15c22e60fabf5f476bb663b8d24c', class: { control_message: true, error: !!this.error || !!this.localError } }, this.error || this.localError || this.warning))))), h("div", { key: '5762ec14597d9418dfbd04a31db44d299aa88625', role: "dialog", class: { popover: true, open: this.open }, ref: (el) => (this.popoverEl = el) }, h("div", { key: '8ad3a1e6c31b982755f7b82b7cb16644c4f23f38', class: "header" }, h("xv-button-v2", { key: 'db4d454e82ca8ec26fcf4f291ac21146dcb14a3b', tabindex: this.open ? undefined : '-1', disabled: this.isPrevDisabled, variant: "ghost", onClick: this.prevMonth }, h("span", { key: 'e80d1efac41ea1e4aa7aa83a22cd5f7d9db40553', slot: "icon-left", class: "header_icon prev" })), h("p", { key: '37505645ea5e5181a0797560aeada8b0f22ef92e', class: "header_date" }, dateFns.format(this.month, 'LLLL', { locale: localeExports.de }), h("input", { key: 'b3ccae4078f4ce61ec85a79abe16a4c406553f6f', tabindex: this.open ? undefined : '-1', type: "number", value: this.month.getFullYear(), onInput: this.handleYearChange, onBlur: this.handleYearBlur })), h("xv-button-v2", { key: '8ece0927ba0dc434765a7b2fea50ad1420913cbe', tabindex: this.open ? undefined : '-1', disabled: this.isNextDisabled, variant: "ghost", onClick: this.nextMonth }, h("span", { key: 'b471b2d6137c5c52f5089d821225d21c93cb1f4d', slot: "icon-left", class: "header_icon next" }))), h("div", { key: 'd7de53d7865a5c033fb0e5e2c416eee8dff3b60a', class: "week" }, h("p", { key: '8d4d8b3b9e42c040435d2e6813aa96bcaca2144d', class: "week_day" }), WEEK.map((day) => h("p", { class: "week_day" }, day, "."))), h("div", { key: '63b91609bc0e2709952f8b66b20997b16b960260', class: "week" }, this.days.map((day, idx) => (h(Fragment, null, idx % 7 === 0 && (h("button", { tabindex: this.open ? undefined : '-1', disabled: true, class: "week_day disabled" }, day.week)), h("button", { tabindex: this.open ? undefined : '-1', onClick: () => this.handleSetDate(day), disabled: day.disabled, class: {
|
|
77586
80352
|
'week_day': true,
|
|
77587
80353
|
inRange: this.variant === 'range' && dateFns.isWithinInterval(day.date, { start, end }),
|
|
77588
80354
|
isToday: day.isToday,
|
|
@@ -77760,7 +80526,7 @@ const XvDropdown = class {
|
|
|
77760
80526
|
}
|
|
77761
80527
|
/* endregion Search methods */
|
|
77762
80528
|
render() {
|
|
77763
|
-
return (h(Host, { key: '
|
|
80529
|
+
return (h(Host, { key: 'fd9278225b7c1e0499f11a43b447b792ffecbecf', class: { 'xv-dropdown': true, [this.variant]: !!this.variant }, role: "combobox", size: this.size, open: this.open, error: !!this.error, disabled: this.disabled, tabindex: (this.disabled || this.readonly) ? -1 : false }, (this.label || this.info) && (h("label", { key: '4e1e6dd506e7c0ca12f24717a4ac0c507ed77150', class: "label" }, h("slot", { key: '7a7f9d886c871616a0214264fc012495b77d48a8', name: "label" }, this.label), this.info && h("xv-tooltip-v2", { key: '97b64ef9259c2924fa9cc388e029775f22d67f77', class: "label_info", message: this.info }))), h("div", { key: '57aa25e912aa840bbe049fa30248315ad1962f79', class: { "xv-dropdown-control control": true, readonly: !!this.readonly }, onClick: this.handleOpen }, (this.multiple && this.selectedMap.size > 0) && (h("xv-tag-v2", { key: 'ccdd67146706bde7a0b1d68db1033700262db1ad', class: "control_count", onCloseClick: this.clearHandle, closeable: !this.required, bg: "var(--background-inverse)", color: "var(--icon-inverse)" }, this.selectedMap.size)), this.selected.length ? (h("p", { class: "control_value" }, this.selected.join(', '))) : (h("p", { class: "control_placeholder" }, this.placeholder || '')), this._renderIcon(), h("svg", { key: '2594b21e9b9150a1d50099603b964177d467fb7b', class: "control_arrow", focusable: "false", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor", "aria-hidden": "true", width: "16", height: "16", viewBox: "0 0 16 16" }, h("path", { key: 'df82db7fb2c6a43e97484b5f8f987bd9f0aaae90', d: "M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z" }))), this.open && h("div", { key: '841b3935e0140289491a79711c5a81f3d838cb6e', class: "options" }, this.search && (h("div", { key: '836c860255c81b585525a7aa0a15ed4e9c4153b8', class: "options_search" }, h("xv-text-input-v2", { key: '24e362915e2b2137fe4b96073b4f358e757e68e1', type: "search", block: true, autocomplete: "off", size: this.size, value: this.searchQuery, placeholder: this.searchPlaceholder, onValueChange: this.handleSearchInput }))), h("slot", { key: "xv-dropdown-options" })), (this.helper || typeof this.error === 'string' || this.warning) && (h("p", { key: '4e2e576aaeb17740cf79c045edbe19c48eb4c346', class: "helper" }, this.error || this.warning || this.helper))));
|
|
77764
80530
|
}
|
|
77765
80531
|
componentDidLoad() {
|
|
77766
80532
|
this.syncOpenState();
|
|
@@ -77820,7 +80586,7 @@ const XvDropdownItem = class {
|
|
|
77820
80586
|
});
|
|
77821
80587
|
}
|
|
77822
80588
|
render() {
|
|
77823
|
-
return (h(Host, { key: '
|
|
80589
|
+
return (h(Host, { key: '355cf1fe5be6d5fda5fd30f6a892b2591d94b36b', class: "xv-dropdown-item", value: this.value, role: "option", tabindex: this.disabled ? -1 : false }, this.multiple && (h("xv-checkbox-v2", { key: '957c7fe39439b9ce115176e5c4c609635f0aa482', class: "multiple-check", size: this.size, checked: this.selected, disabled: this.disabled })), h("slot", { key: '75a513ed8ca0e9e6bea629a9fb0c5673965a960a' }), (!this.multiple && this.selected) && h("span", { key: '3368c59f452b9cdcb5fdf8ccbd4ea918ba0bb45e', class: "checkmark far fa-check" })));
|
|
77824
80590
|
}
|
|
77825
80591
|
componentWillLoad() {
|
|
77826
80592
|
if (!this.value)
|
|
@@ -77924,7 +80690,7 @@ const XvFileUploader = class {
|
|
|
77924
80690
|
}
|
|
77925
80691
|
}
|
|
77926
80692
|
render() {
|
|
77927
|
-
return (h(Host, { key: '
|
|
80693
|
+
return (h(Host, { key: '4dcf9f36c770aab56b19334a8cf8e71da5264195', class: { 'upload-wrapper': true, [`uploader-${this.size}`]: true, disabled: !!this.disabled, error: !!this.error } }, this.label && h("label", { key: 'bfce6e9fab5884fcaf6b221251caa5dd5f896f3a', class: "label" }, this.label), this.description && h("p", { key: '21fa2b5e9ca8aeb2be2c405878fba66bb012f825', class: "description" }, this.description), this.variant === 'button' ? (h("xv-button-v2", { class: "uploadBtn", variant: this.buttonVariant, disabled: this.disabled, onClick: () => this.fileInput.click() }, this.addText || 'Dateien auswählen')) : (h("div", { class: { 'drop-zone': true, active: this.dragActive }, onDrop: this.onDrop, onDragOver: this.onDragOver, onDragLeave: this.onDragLeave, onClick: () => this.fileInput.click() }, this.addText || 'Dateien hierher ziehen oder darauf klicken, um eine Datei auszuwählen.')), h("input", { key: '1a41f2dc19ab2176d63edaeb1973daf753ac28fb', ref: el => (this.fileInput = el), type: "file", hidden: true, onChange: this.onFileSelect, multiple: this.multiple, accept: this.accept.join(',') }), this.error && h("p", { key: '67b83e7841948fea6ec34ba51cd838561039e1ff', class: "global-error" }, this.error), h("ul", { key: 'fbdb04a04604f64a995d6c8044c04fcf566c7e01', class: "file-list" }, this.files.map((file, index) => {
|
|
77928
80694
|
var _a, _b;
|
|
77929
80695
|
return (h("li", { class: { file: true, withError: !!(((_a = this.errors) === null || _a === void 0 ? void 0 : _a[index]) || ((_b = this.errorMessages) === null || _b === void 0 ? void 0 : _b[index])) } }, h("div", { class: "file_container" }, h("span", { class: "file_container_name" }, file.name), this._renderLoaderState(index)), this._renderError(index)));
|
|
77930
80696
|
}))));
|
|
@@ -77996,7 +80762,7 @@ const Xvfooter = class {
|
|
|
77996
80762
|
render() {
|
|
77997
80763
|
const { categories, socials, logo, legalLinks, payments, partners, advantages } = this.data || {};
|
|
77998
80764
|
const hasDataLength = ((categories === null || categories === void 0 ? void 0 : categories.length) || (partners === null || partners === void 0 ? void 0 : partners.length) || (payments === null || payments === void 0 ? void 0 : payments.length) || (socials === null || socials === void 0 ? void 0 : socials.length));
|
|
77999
|
-
return (h("footer", { key: '
|
|
80765
|
+
return (h("footer", { key: '31f496895b343c1b5a26cf04a73acd82df4c0305', class: "xv-footer" }, (advantages === null || advantages === void 0 ? void 0 : advantages.length) > 0 && (h("div", { key: 'd1203c0a5596c41106c1433b4b7c4ae5432250ef', class: "xv-footer-advantages" }, h("div", { key: '288c8cc9b0507063e260a40dc105723eb59f5f1a', class: "xv-container" }, this._renderFooterList(advantages, { itemWithLabel: true })))), hasDataLength && (h("div", { key: '188b4a11d3f1b9f713b866157d21ac70b130781b', class: "xv-container" }, h("div", { key: 'f8c737d868c94a9502cd106597ac9fb006ee2075', class: "xv-footer__grid xv-footer-y-spacing" }, h("div", { key: '78e68d0fb11fc0a3e5f75cef4caa24078f9768f4', class: "xv-footer__col-main" }, h("ul", { key: 'ce1b2c7b2c98e490d44f670f745c9d6ed1579c4b', class: "xv-footer-categories" }, categories === null || categories === void 0 ? void 0 : categories.map((category) => (h("li", null, h("p", { class: "xv-label-02" }, category.label), h("ul", { class: "xv-footer-routes" }, category.routes.map((item) => (h("li", null, h("a", { class: "xv-body-compact-02", href: item.href, target: item.target }, item.label)))))))))), h("div", { key: '0d2f0a95a3435e9817c21e1eddf7372da1566404', class: "xv-footer__col-sidebar" }, this._renderFooterList(partners, { label: 'crossvertise Partner' }), this._renderFooterList(payments, { label: 'Bequem und sicher bezahlen' }), this._renderFooterList(socials, { label: 'Folgen Sie uns', isRow: true }))))), (legalLinks === null || legalLinks === void 0 ? void 0 : legalLinks.length) > 0 && (h("div", { key: '771aabeac7888753cf561f9d6ef04561aeb1816c', class: "xv-footer-legal" }, h("div", { key: '31e92aa6c324e23d1f99b041360861741829e255', class: "xv-container" }, h("div", { key: '9e615547872c8a9fa75e76c0890430f82e8b5024', class: "xv-footer-legal-row" }, logo && (h("a", { key: 'f5c932dc0d29b25642f2da6fa74bd43a29359f3f', class: "xv-footer-logo", href: logo.href, target: logo.target }, logo.label && h("span", { key: '737eecddab96349fec709c4c5609d83e87d0e560', class: "xv-label-02" }, logo.label), h("img", { key: 'f5e64947742cfd5f9e79adffb14d5c7e7d0dc66e', loading: "lazy", src: logo.image, alt: logo.label }))), h("ul", { key: 'b05632d176a3a60f0c6b698d0958b8546ba0867f' }, legalLinks.map((item) => {
|
|
78000
80766
|
if (item.label === 'Cookie Einstellungen') {
|
|
78001
80767
|
return h("li", null, h("a", { class: "xv-helper-text-02", onClick: this.openCookieSettings }, item.label));
|
|
78002
80768
|
}
|
|
@@ -78182,7 +80948,7 @@ const XvHeader = class {
|
|
|
78182
80948
|
render() {
|
|
78183
80949
|
var _a, _b, _c, _d, _e;
|
|
78184
80950
|
const isXvBrand = (((_a = this.metaNav) === null || _a === void 0 ? void 0 : _a['WhitelabelName']) || 'Xv') === 'Xv';
|
|
78185
|
-
return (h("header", { key: '
|
|
80951
|
+
return (h("header", { key: '4e04b78a99212bc5fdfbda41aa2f2f6a88175c48', class: "header" }, h("div", { key: 'd9966301c1616fcaec060e50fa29f81a3198227b', class: "header-wrapper" }, h("div", { key: '9256f6a7b31da73fff32ac2d95bee384e64496d2', class: "xv-container" }, h("div", { key: 'f9927a5b1d283fecfc57014c35676c5a3cf47d9f', class: "header-top" }, h("div", { key: 'fbd79ec4e41e203b0c7d8e37085633a6ab3ee466', class: "header-top--left" }, h("xv-button-v2", { key: '8d4e4f298e2f708e06a90a7c9a21ab578a43a7a3', class: "menu-btn", variant: "ghost", onClick: this.toggleMobMenu }, h("i", { key: '33aa5177581c5f8b47ec0c435a896b25e2305316', slot: "icon-left", class: { 'fa': true, 'fa-times': this.mobMenuOpen, 'fa-bars': !this.mobMenuOpen } })), this.metaNav && (h("a", { key: '1fca5d3cd0638145f34f9bdc6c6446e75f1fffdc', href: `${window.location.origin}/` }, h("picture", { key: 'a51179dd4e7b0a60d5e9a458660d23501b4d152b' }, h("source", { key: 'faef9c5ca3f5e6355862eedcb447a4975b14463b', srcSet: ((_b = this.metaNav) === null || _b === void 0 ? void 0 : _b.LogoUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo.svg', media: "(min-width: 990px)" }), h("img", { key: '83c80fb99185fceb3d6559bcd59b44e3bbaeb689', src: ((_c = this.metaNav) === null || _c === void 0 ? void 0 : _c.LogoSmallUrl) || 'https://www.crossvertise.com/ResourcePackages/Bootstrap/assets/dist/images/logo-small.svg', onError: this.logoFallback, loading: "lazy", alt: "Crossvertise" })))), this.orgUnit && (h("xv-link-v2", { key: '32b8ca9c78c50df7fac9a5f816fb75db96af1df5', class: "header-top--orgUnit", variant: "standalone", href: "/de-de/mycrossvertise" }, this.orgUnit))), h("ul", { key: '67a88b216fff8353188ce1b684b2e644dbb5c34a', class: "header-top--right" }, this._renderSearch(), this._renderImpersonationInfo(), !((_d = this.metaNav) === null || _d === void 0 ? void 0 : _d.IsManager) && isXvBrand && (h("li", { key: '5895fae5c1da7e8ac325c03b07c55e8c522d5d76' }, h("xv-link-v2", { key: '3ed95ee7d3bb9d250cc80f51265a45cdcbc879ae', variant: "ghost", href: "https://www.crossvertise.com/ueber-uns/kontakt" }, h("xv-button-v2", { key: 'fd3201859e31efb6767110a648f79b571ba9412e', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: 'a357cf1fc11f5df20c06ba7bba688760e730795d', class: "header-icon far fa-envelope" }), h("span", { key: '2958ee2e9b503b5a9eda1db721474d452bfc14d9', class: "header-label xv-body-02" }, "Kontakt"))))), this._renderNotifications(), this._renderAccount(), !((_e = this.metaNav) === null || _e === void 0 ? void 0 : _e.IsManager) && isXvBrand && (h("li", { key: '8e0d0ade405003a63512d7c736f4dd2e3aa65a3a' }, h("xv-link-v2", { key: '152ab5e9e8e13a1261de664f95d1ed10a4572d01', variant: "ghost", href: "https://help.crossvertise.com" }, h("xv-button-v2", { key: '641f8fca24c2bef017ba11494e76063731df1c9b', variant: "ghost", size: SIZE_VAR.MD }, h("i", { key: '2dab2659e3010e1cca36be982c14bfafa27f2a69', class: "header-icon far fa-question-circle" }), h("span", { key: '4c919f58a513e136311a30ac6367f5134171c109', class: "header-label xv-body-02" }, "Hilfe"))))), this._renderShoppingCart()))), h("div", { key: '35dc7801ae8b2b21b14a2f6d54c72d21aa6da9d2', class: "header-wrapper--bg" }, h("div", { key: '058fcec87bf3e1b7a9263f5e8d108b9d6d82857a', class: "xv-container" }, h("xv-mega-menu", { key: '43293fa89e5e9629847c47cd582425cf53fbb875', open: this.mobMenuOpen, onOpenChange: this.closeMobMenu })))), h("xv-login-modal", { key: 'f21b968eba5252c0acfb1963482da8e2d31a3ab0', visible: this.showLoginModal, onClose: () => this.showLoginModal = false })));
|
|
78186
80952
|
}
|
|
78187
80953
|
get el() { return getElement(this); }
|
|
78188
80954
|
};
|
|
@@ -78227,7 +80993,7 @@ const XvImageViewer = class {
|
|
|
78227
80993
|
}
|
|
78228
80994
|
}
|
|
78229
80995
|
render() {
|
|
78230
|
-
return (h(Host, { key: '
|
|
80996
|
+
return (h(Host, { key: '18892e8e88de15de5654ef75ff85cbd99206e1a8', class: "image-wrapper" }, this.loaded ? (h("img", { src: this.src, alt: this.alt, class: "image", onClick: this.handleClick })) : h("xv-loader-v2", { class: "loading" }, this.placeholder), this.isFullscreen && (h("div", { key: '8f0aa7e798837d055c1b4c195f6cca2bd4c3a8cb', class: "fullscreen-overlay", onClick: this.closeFullscreen }, !this.fullscreenLoaded && h("xv-loader-v2", { key: '07851163ab07dccf30f82ad96b47965308950f5c', class: "loading", size: SIZE_VAR.LG }, this.placeholder), h("img", { key: '1a56f060df6768a603b80f3a1d816edb14147745', src: this.fullscreenSrc || this.src, alt: this.alt, class: {
|
|
78231
80997
|
'fullscreen-image': true,
|
|
78232
80998
|
loaded: this.fullscreenLoaded,
|
|
78233
80999
|
} })))));
|
|
@@ -78252,7 +81018,7 @@ const XvLink = class {
|
|
|
78252
81018
|
e.stopPropagation();
|
|
78253
81019
|
}
|
|
78254
81020
|
render() {
|
|
78255
|
-
return (h(Host, { key: '
|
|
81021
|
+
return (h(Host, { key: '016e3dbb068768af7f3b1009a9ff4a41e7fe7e29', class: { [`xv-link_${this.variant}`]: true, disabled: !!this.disabled } }, h("a", { key: 'a3773aa9d56f67db1c8e38fb094ee182911eac2a', href: this.href, onClick: this.preventLinkHandler.bind(this), class: { 'xv-link': true, 'xv-link_disabled': !!this.disabled, [this.size]: !!this.size }, target: this.target }, h("slot", { key: '43cfd1a0bd21e3a06d626ebc1c011c0b97cb754b', name: "icon-left" }), h("slot", { key: '358556f640189ab282f907f16b1a9973561e7fe6' }), h("slot", { key: '252e9302928e87c88d502c7b513301333843cab0', name: "icon-right" }))));
|
|
78256
81022
|
}
|
|
78257
81023
|
};
|
|
78258
81024
|
XvLink.style = xvLinkCss();
|
|
@@ -78420,7 +81186,7 @@ const XvMegaMenu = class {
|
|
|
78420
81186
|
void this.fetchMenuData();
|
|
78421
81187
|
}
|
|
78422
81188
|
render() {
|
|
78423
|
-
return (h(Host, { key: '
|
|
81189
|
+
return (h(Host, { key: 'b112b87e38c1534cd5313e6c71fdc96f6fc8f515' }, h("nav", { key: 'e2ce585ac7dcce8e7abf628be7eb635948985a4f', class: { 'xv-menu': true, open: this.open } }, this.menuLoading && (h("div", { key: 'f72304e9a5310914bad2c5f2160d4b408dba6c80', class: { 'xv-menu-loader': true, open: this.open } }, h("xv-loader-v2", { key: '08be3cc31abc000d508825ae0cba715de7265ad4' }))), h("ul", { key: '651eb649457fbab1f3bac968f55702fd5b2219f9', class: { menu: true, open: this.open } }, this.menuItems.map((menuItem) => {
|
|
78424
81190
|
var _a, _b;
|
|
78425
81191
|
return (h("li", { class: { 'menu-item': true, active: menuItem.id === ((_a = this.activeItem) === null || _a === void 0 ? void 0 : _a.id) } }, menuItem.route ? (h("xv-link-v2", { variant: "ghost", href: menuItem.route.route }, h("p", { class: "menu-item-label" }, (_b = menuItem.route) === null || _b === void 0 ? void 0 : _b.label))) : (h(Fragment, null, h("p", { class: "menu-item-label", onClick: () => this.setActiveItem(menuItem) }, menuItem === null || menuItem === void 0 ? void 0 : menuItem.label), h("ul", { class: "menu-item-groups" }, menuItem.groups.map((group) => {
|
|
78426
81192
|
var _a;
|
|
@@ -78430,7 +81196,7 @@ const XvMegaMenu = class {
|
|
|
78430
81196
|
} }, h("div", { class: "group-menus" }, h("ul", { class: { 'group-menus-categories': true, inline: group.layout === 'inline' } }, group.categories.map((category) => (h("li", { class: "category" }, h("p", { class: "category-label" }, category.label), h("ul", { class: "category-routes" }, category.routes.map((route) => (h("li", { class: "route" }, h("xv-link-v2", { size: "lg", variant: "ghost", href: route.route || '#' }, route.label), route.tag && (h("xv-tag-v2", { class: "route-tag", size: "sm", color: "#161616", bg: "#E0E0E0" }, route.tag)))))))))), h("ul", { class: "group-menus-actions" }, group.actions.map((action) => (h("li", { class: "action" }, action.type === 'link' && (h("xv-link-v2", { variant: "standalone", href: action === null || action === void 0 ? void 0 : action.url }, action.label, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))), action.type === 'button' &&
|
|
78431
81197
|
h("xv-button-v2", { onClick: () => this.navActionClick(action), block: true, variant: "tertiary" }, action.label)))))), (group === null || group === void 0 ? void 0 : group.card) && (h("div", { class: "group-card" }, h("xv-card-v2", { media: this.applicationContext !== 'Komsa' ? group.card.image : undefined, variant: this.isMobile ? 'horizontal' : 'vertical' }, h("h5", { slot: "header", class: "group-card-title" }, group.card.title), h("p", { slot: "body", class: "group-card-desc" }, group.card.description), group.card.linkLabel && (h("xv-link-v2", { slot: "footer", variant: "standalone", href: group.card.linkUrl || '#' }, group.card.linkLabel, h("span", { class: "link-chevron", slot: "icon-right" }, "\u2192"))))))))));
|
|
78432
81198
|
}))))));
|
|
78433
|
-
}), h("li", { key: '
|
|
81199
|
+
}), h("li", { key: '9356ffcf87b9e622db21a01c40077e41169ea94e', class: "menu--right" }, h("slot", { key: 'ef5d8a0aaf0d44fd3eec9a68b91a642cb52d8555', name: "menu-right" })), this.open && (h("li", { key: '0710525eedf5b04ce377deba6a913af3a41b657a', class: "menu--backdrop", onClick: () => this.handleClose() }))))));
|
|
78434
81200
|
}
|
|
78435
81201
|
get el() { return getElement(this); }
|
|
78436
81202
|
};
|
|
@@ -78498,7 +81264,7 @@ const XvModal = class {
|
|
|
78498
81264
|
}
|
|
78499
81265
|
render() {
|
|
78500
81266
|
var _a;
|
|
78501
|
-
return (h(Host, { key: '
|
|
81267
|
+
return (h(Host, { key: '459334f664b6ef23356082e08e7a5d2a6b843467', role: "dialog", size: this.size, id: this.el.id }, h("slot", { key: 'ea874bc6a5b9de9a7b8bb88b66f9eca564265c3f', name: "trigger", onSlotchange: this.setupTrigger }), h("div", { key: '97aad0310e31ca98a5d96afcc4215f338af59685', class: { backdrop: true }, onClick: this.onBackdropClick }, h("div", { key: '22de437bedf74a0f540cb5a4fe12cb27f0adc459', class: "modal" }, h("button", { key: '0daeb0c0ae716f28b9ba87bd6a752b688e5849c6', class: "modal_close", onClick: this.closeModal.bind(this) }, "\u00D7"), h("div", { key: '61632aed290597cf833a1bbe38ccf70c031e3cc7', class: "modal_header" }, h("slot", { key: '41d051393e58db7bbe13e26309040750f4a3f182', name: "header" }, ((_a = this.el) === null || _a === void 0 ? void 0 : _a.title) && h("h5", { key: 'b1ad75b57fce071b11465a2a1941e73ee01aced8', class: "modal_header__title" }, this.el.title))), h("div", { key: 'ff17494529082dab14715cba727253655852f4f6', class: { 'modal_content': true, overflow: this.overflow } }, h("slot", { key: '9c8df6f31c4a2bf767317ab443c52bbf31c6b9f4' })), h("div", { key: 'be51d96a27f16833cf910b3876515f28e3ce30e0', class: "modal_footer" }, h("slot", { key: '43fa6135052faab628f3531d2d116df4e592f620', name: "footer" })), !!this.loading && (h("div", { key: '63379bfee79a569faecd6c90eb1447bc2d549f5f', class: "loading" }, h("xv-loader-v2", { key: '972b08c9ae0d135516cd2d46e4ad31168ad37c19', size: SIZE_VAR.LG })))))));
|
|
78502
81268
|
}
|
|
78503
81269
|
disconnectedCallback() {
|
|
78504
81270
|
this.removeTriggerListener();
|
|
@@ -78536,7 +81302,7 @@ const XvNotification = class {
|
|
|
78536
81302
|
};
|
|
78537
81303
|
}
|
|
78538
81304
|
render() {
|
|
78539
|
-
return (h(Host, { key: '
|
|
81305
|
+
return (h(Host, { key: 'adcd2d4a2e8e53164982ffb95de2682d2d833a1a', class: "xv-notification", type: this.variant }, this.renderIcon(this.variant), h("div", { key: 'c4b03ccfefcf2176eec5ce98263a65ca398c743a', class: "content" }, h("div", { key: 'f9eca551a35ddbaae8ca07f0059fca5f1a05b761', class: "content_wrapper" }, this.el.title && h("h5", { key: '7a1e4911679d5d1d45ef5a291f8a2071cf399cf8', class: "content_title" }, this.el.title), h("slot", { key: 'd23e3ec1a2b34cdee9cb20df306afe0f71e63170' })), h("slot", { key: 'd1e7d2df24c77f042e05353edf91565a5aa3828b', name: "footer" })), this.dismissible && h("button", { key: '53b218ecd5fefbc84557c0aab20f0a3015aa797e', class: "close", onClick: this.closeHandle })));
|
|
78540
81306
|
}
|
|
78541
81307
|
static get assetsDirs() { return ["xv-notification/icons"]; }
|
|
78542
81308
|
get el() { return getElement(this); }
|
|
@@ -78586,12 +81352,12 @@ const XvNumberInput = class {
|
|
|
78586
81352
|
this.valueChange.emit(this.value);
|
|
78587
81353
|
}
|
|
78588
81354
|
render() {
|
|
78589
|
-
return (h(Host, { key: '
|
|
81355
|
+
return (h(Host, { key: '7399237cc111a179efc8015c4a735591eaf58f47', class: { disabled: !!this.disabled } }, h("label", { key: 'a208140db3894262f1eca454aac4fe0f1f5dcd5b', class: "control" }, this.label && h("span", { key: 'f75f15839a0e6fdae658f3c8acdc89b817bddd4e', class: "control_label" }, this.label), h("div", { key: 'c46893c839e2c4d0ea1cc3cbe7b344b8d76d05ba', class: {
|
|
78590
81356
|
'control_input': true,
|
|
78591
81357
|
readonly: !!this.readonly,
|
|
78592
81358
|
error: !!this.error,
|
|
78593
81359
|
warning: !!this.warning
|
|
78594
|
-
} }, h("input", { key: '
|
|
81360
|
+
} }, h("input", { key: '84e546cca6541c13e3285525098b7a92c283927d', type: "number", placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value }), h("div", { key: '085c26dffcc68d09dfdfaa6bac4b9b8cfe75b5fc', class: "control_input__icons" }, this.loading ? (h("xv-loader-v2", { size: SIZE_VAR.XS })) : !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, h("xv-button-v2", { key: 'c3060dbc54a87aa58eef2ae870807048560dc196', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.decrement, "aria-label": "Decrease" }, h("span", { key: 'ea41fd15f042b101b73309e6a5d64e7493f947ef', slot: "icon-left", class: "status-icon" }, "\u2212")), h("hr", { key: '3a7acf4743c82b070c4218433759d3be364f1316' }), h("xv-button-v2", { key: '6508586d90c548fc39b8d3936b5aed6e9cca0aa2', size: this.size, variant: "ghost", disabled: this.disabled || this.readonly, onClick: this.increment, "aria-label": "Increase" }, h("span", { key: 'dd0f03bf3f5afc5e66b842625a23a71216017a6d', slot: "icon-left", class: "status-icon" }, "+"))))), this.helper && h("p", { key: '0aea5e60d957e5d81e3e88b99af84bb742d4a45b', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
78595
81361
|
}
|
|
78596
81362
|
static get formAssociated() { return true; }
|
|
78597
81363
|
};
|
|
@@ -78649,8 +81415,8 @@ const XvOverflowMenu = class {
|
|
|
78649
81415
|
}
|
|
78650
81416
|
}
|
|
78651
81417
|
render() {
|
|
78652
|
-
const button = (h("button", { key: '
|
|
78653
|
-
return (h(Host, { key: '
|
|
81418
|
+
const button = (h("button", { key: '65d10df68e12786c31afc40edc8c22ecfd0302cf', class: { btn: true, open: this.open }, onClick: this.onOpenToggle, disabled: this.disabled }, h("slot", { key: '97a5406ec0f76269a2e7bac68bf1a5f1632b8804', name: "trigger" }, h("svg", { key: '6d011f7fa6e4f17bf3e75609bd989fa9676e280b', xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 128 512" }, h("path", { key: 'e40d3dc7b5c672beb1be641e2327053d94c7cdde', d: "M64 368a48 48 0 1 0 0 96 48 48 0 1 0 0-96zm0-160a48 48 0 1 0 0 96 48 48 0 1 0 0-96zM112 96A48 48 0 1 0 16 96a48 48 0 1 0 96 0z" })))));
|
|
81419
|
+
return (h(Host, { key: 'a53abac823b5ddca6a0ccae9c174c54e5feb953d', class: "xv-overflow-menu", size: this.size, role: "menu", tabindex: -1 }, this.tooltip ? h("xv-tooltip-v2", { message: this.tooltip }, button) : button, h("div", { key: 'd426de907da491e9a7b5152b8ff4ebe0260cdbc4', class: { list: true, open: this.open, [`position-${this.position}`]: true } }, h("slot", { key: '855cfac0879de6781c8b78e04ed2e763fb6b472b' }))));
|
|
78654
81420
|
}
|
|
78655
81421
|
componentDidLoad() {
|
|
78656
81422
|
this.openChangeHandle();
|
|
@@ -78683,7 +81449,7 @@ const XvOverflowMenuItem = class {
|
|
|
78683
81449
|
this.itemClick.emit({ event, value: this.value });
|
|
78684
81450
|
}
|
|
78685
81451
|
render() {
|
|
78686
|
-
return (h(Host, { key: '
|
|
81452
|
+
return (h(Host, { key: '3d13f5e706f187f6fdc0a925df29ab9a3d185bbf', class: "xv-overflow-menu-item", role: "menuitem", disabled: this.disabled }, h("slot", { key: '9fd7ed9c9b5122ef15d92b34368187ac08dddafb' })));
|
|
78687
81453
|
}
|
|
78688
81454
|
};
|
|
78689
81455
|
XvOverflowMenuItem.style = xvOverflowMenuItemCss();
|
|
@@ -78781,7 +81547,7 @@ const XvPagination = class {
|
|
|
78781
81547
|
this.observer.disconnect();
|
|
78782
81548
|
}
|
|
78783
81549
|
render() {
|
|
78784
|
-
return (h(Host, { key: '
|
|
81550
|
+
return (h(Host, { key: 'c633c6ac9fe8914f9bb3450454d29deb4498f33c', class: { block: this.block, [this.currentVariant]: true, [this.size]: !!this.size } }, this.currentVariant === 'full' && (h("div", { key: '4689c4ed6f64a9b5dc2e3395d53b490a730e5ca5', class: "block" }, h("select", { key: '5f862add397fe7cede0dd669cf2cac3ee2faed24', class: "options-select", name: "options", onChange: this.handleItemsPerPageChange }, this.itemsPerPageOptions.map((v) => h("option", { value: v }, v))))), this.currentVariant === 'full' && (h("span", { key: 'cf3e2494f6de619c2c7f6022e399a73a3008f959', class: "block block_full" }, `${(this.page - 1) * this.itemsPerPage + 1} – ${Math.min(this.page * this.itemsPerPage, this.totalItems)} von ${this.totalItems} Einträgen`)), this.currentVariant === 'full' && (h("div", { key: 'ba7e56f791156055ed691c650538a4f96ea17fa7', class: "block" }, h("select", { key: '253e38124f969a044dae1bca9fcfec208d632e19', class: "options-select", name: "pages", onChange: this.handlePageSelectChange }, Array.from({ length: this.total }, (_, i) => (h("option", { selected: this.page === i + 1, value: i + 1 }, i + 1)))), h("span", { key: '7ea03075ea162fc9207dd9289a0a5ccef2843b04' }, "von ", this.total, " Seiten"))), this.currentVariant === 'compact' && h("span", { key: 'a9823279d3d3a75b87b00a191f751593b9b5e697', class: "block" }, "Seite ", this.page), h("xv-button-v2", { key: '231a8a4b65aed97f8da971985189db36a134bd7b', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page - 1), disabled: this.page <= 1 }, h("span", { key: 'dcbb692dbc819e659f257b96325b7db487c98eaf', slot: "icon-left", class: "icon icon_prev" })), this.currentVariant === 'regular' && (h("ul", { key: '5f8b4afeb3d9db94cee15be516a670456d433753', class: "list" }, this.visiblePagesWithDots.map((page) => (h("li", { class: { active: this.page === page } }, page === 'dots-start' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "start", onChange: this.handlePageSelectChange }, Array.from({ length: this.page - 3 }, (_, i) => (h("option", { value: i + 2 }, i + 2)))))) : page === 'dots-end' ? (h("div", { class: "list_dots" }, h("xv-button-v2", { variant: "ghost", size: this.size, tabindex: -1 }, h("span", { slot: "icon-left", class: "list_dots__icon" }, "...")), h("select", { name: "end", onChange: this.handlePageSelectChange }, Array.from({ length: this.total - (this.page + 2) }, (_, i) => (h("option", { value: i + this.page + 2 }, i + this.page + 2)))))) : (h("xv-button-v2", { variant: "ghost", size: this.size, disabled: this.page === page, onClick: () => this.handlePageChange(page) }, h("span", { class: "list_page", slot: "icon-left" }, page)))))))), h("xv-button-v2", { key: 'b38241f82c34e3f24c49b6b2afe1a221c23079b8', variant: "ghost", size: this.size, onClick: () => this.handlePageChange(this.page + 1), disabled: this.page >= this.total }, h("span", { key: '9a3f915b28dc8bb53079c8f66c7959e81163762f', slot: "icon-left", class: "icon icon_next" }))));
|
|
78785
81551
|
}
|
|
78786
81552
|
get el() { return getElement(this); }
|
|
78787
81553
|
};
|
|
@@ -78850,7 +81616,7 @@ const XvProgressIndicator = class {
|
|
|
78850
81616
|
this.updateChildItems();
|
|
78851
81617
|
}
|
|
78852
81618
|
render() {
|
|
78853
|
-
return (h(Host, { key: '
|
|
81619
|
+
return (h(Host, { key: 'bb40f89cb341b8eddf809abb091cf7e14ac76852', variant: this.variant, size: this.size, class: { 'xv-progress-indicator': true } }, h("slot", { key: '71e0cd0931a4173910094c6cd42f741052d54aba' })));
|
|
78854
81620
|
}
|
|
78855
81621
|
get el() { return getElement(this); }
|
|
78856
81622
|
static get watchers() { return {
|
|
@@ -78869,7 +81635,7 @@ const XvProgressIndicatorItem = class {
|
|
|
78869
81635
|
this.status = PROGRESS_ITEM_STATUS.NO_STARTED;
|
|
78870
81636
|
}
|
|
78871
81637
|
render() {
|
|
78872
|
-
return (h(Host, { key: '
|
|
81638
|
+
return (h(Host, { key: '36c3535224bef33c901f5ca306e8a51f7ec67b7d', status: this.status, class: { 'xv-progress-indicator-item': true } }, h("span", { key: '07f68ece4250da1fa1c6865b2109181b455233ac', class: "line" }), h("span", { key: '8b1a10b3492a8565a3ece85e0992844b4789f6ed', class: "icon" }, h("svg", { key: '9b4d63c32a8c8b2b4e48ffd48e1bc97e9d28911b', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 448 512" }, h("path", { key: 'a324fd9401d75744e6f6be34b087035561699c46', fill: "currentColor", d: "M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z" }))), h("p", { key: 'ced9d4b3685303b707ade7cfbb778e58bd76f354', class: "label" }, h("slot", { key: 'f016d1345554df36532f7521706a794c9cb6ed76' }))));
|
|
78873
81639
|
}
|
|
78874
81640
|
get el() { return getElement(this); }
|
|
78875
81641
|
};
|
|
@@ -78901,12 +81667,12 @@ const XvRadio = class {
|
|
|
78901
81667
|
}
|
|
78902
81668
|
}
|
|
78903
81669
|
render() {
|
|
78904
|
-
return (h("div", { key: '
|
|
81670
|
+
return (h("div", { key: 'd39b23f3c28a16df2d1e49adc9fd9f40d7db4f0c', class: {
|
|
78905
81671
|
'xv-radio': true,
|
|
78906
81672
|
'xv-radio--reverse': this.reverse,
|
|
78907
81673
|
'xv-radio--block': this.block,
|
|
78908
81674
|
[`xv-radio--size-${this.size}`]: !!this.size,
|
|
78909
|
-
} }, this.label && h("p", { key: '
|
|
81675
|
+
} }, this.label && h("p", { key: '80d31ae0a11efd2932ccce7cdc63bd4cadddc10f', class: "xv-radio_label" }, this.label), h("label", { key: '3c35adf7f54f0f9a851895617c2a37af4a169f47', class: { 'xv-radio_container': true, disabled: this.disabled } }, h("div", { key: '7d855ff448ad0e1f84cab925d6b878266370b9cb', class: { 'xv-radio_input': true, 'xv-radio_input--error': !!this.error || this.error === '' } }, h("input", { key: 'a294a52f28430bdba5655d4887e4e57134abe949', ref: el => (this.inputEl = el), type: "radio", name: this.name, value: this.value, checked: this.checked, readonly: this.readonly, disabled: this.disabled }), h("span", { key: 'b3027b89b304089daacff7e859b60e39deae808e', class: "xv-radio_input__mark" })), h("span", { key: '3b1fc2ad56bedc1eda7047e133ce73b23e1b1444', class: "xv-radio_container__label" }, h("slot", { key: '43e176a5689ec2e8c926a69f06e66e431353dfa2' }))), this.error && typeof this.error === 'string' && (h("span", { key: 'b0d2bbfb9631cdf6b8a8485939d2409b375a7440', class: "xv-radio_msg xv-radio_msg--error" }, h("span", { key: '7c5596328ed9442238432afd32d717e1091708e7', class: "xv-radio_msg__status", "aria-hidden": "true" }, "!"), this.error)), this.warning && typeof this.warning === 'string' && (h("span", { key: '5a436705b45a94e32e34f3c5719297b84a2d4a9a', class: "xv-radio_msg xv-radio_msg--warning" }, h("span", { key: '9673b716cbc485730743b3c28904cc78a1fb3ece', class: "xv-radio_msg__status", "aria-hidden": "true" }, "\u26A0"), this.warning)), h("slot", { key: 'e96ff6f8ace0779168cee761635845b6aa17b819', name: "info" })));
|
|
78910
81676
|
}
|
|
78911
81677
|
connectedCallback() {
|
|
78912
81678
|
var _a;
|
|
@@ -78990,7 +81756,7 @@ const XvSlider = class {
|
|
|
78990
81756
|
this.setValue(this.min);
|
|
78991
81757
|
}
|
|
78992
81758
|
render() {
|
|
78993
|
-
return (h(Host, { key: '
|
|
81759
|
+
return (h(Host, { key: 'ef456842d1d4c3df75f6c0cb544a1fae87a29dec', class: { disabled: this.disabled, readonly: this.readonly } }, this.label && h("label", { key: 'f0214585603c03787d7f6301b2ac819bf39aa787', class: "label" }, this.label), h("div", { key: '6292a5442f275217220fe4242eeb8ac6f6347d63', class: "control" }, h("span", { key: '3ab0b137d2c6751c0deb24fde8a03f5321de268d', class: "control_label" }, this.min), h("input", { key: 'a960716059163f3add2d400338aad3314f3b9e3e', type: "range", disabled: this.disabled || this.readonly, readonly: this.readonly, name: this.name, min: this.min, max: this.max, step: this.step, value: this.value, onInput: this.handleInput, style: { backgroundSize: `${((this.value - this.min) * 100) / (this.max - this.min)}% 100%` } }), h("span", { key: '47fda72522094ee1352c5723fac227bb501b6393', class: "control_label" }, this.max), !this.notEditable && (h("input", { key: '44b86c9b5a2fe3797fcb7a9fc3ceec327860a258', type: "number", disabled: this.disabled, readonly: this.readonly, name: `${this.name}-number-input`, step: this.step, min: this.min, max: this.max, value: this.value, onInput: this.handleNumberInput, onBlur: this.handleNumberBlur })))));
|
|
78994
81760
|
}
|
|
78995
81761
|
static get formAssociated() { return true; }
|
|
78996
81762
|
};
|
|
@@ -79005,7 +81771,7 @@ const XvTab = class {
|
|
|
79005
81771
|
this.loading = false;
|
|
79006
81772
|
}
|
|
79007
81773
|
render() {
|
|
79008
|
-
return (h(Host, { key: '
|
|
81774
|
+
return (h(Host, { key: 'a3a246e230762d73d3121fc7332944268ff98f51', disabled: this.disabled, name: this.name }, this.loading ? h("xv-loader-v2", { size: SIZE_VAR.LG }) : h("slot", null)));
|
|
79009
81775
|
}
|
|
79010
81776
|
};
|
|
79011
81777
|
XvTab.style = xvTabCss();
|
|
@@ -79045,7 +81811,7 @@ const XvTable = class {
|
|
|
79045
81811
|
.join(' ') + ' repeat(auto-fit, minmax(0, 1fr))');
|
|
79046
81812
|
}
|
|
79047
81813
|
render() {
|
|
79048
|
-
return (h(Host, { key: '
|
|
81814
|
+
return (h(Host, { key: '9165b2158fd6b349c668897732fddeca1020d4f6', class: { batchVisible: !!this.selectedCount } }, h("slot", { key: '942a4944c4a52526606ad86677c43bdae161c0bc', name: "title" }, !!this.el.title && h("h2", { key: '3ef51b8d693e8c9051e9e99d1a5b61fb0ed478fd', class: "xv-table-title" }, this.el.title)), h("slot", { key: '84f3f4d90446afc9e482d87c8b1a8933b3925674', name: "toolbar" }), h("div", { key: '380853357cdff87abaddcc332010510d6e43c224', class: "xv-table" }, h("div", { key: 'be7c3aa788d56981d09743940c282e947eebe77e', class: "batch-actions" }, h(Fragment, { key: 'ccab420ac3275c4164842c74f0b6722b502b04f4' }, h("div", { key: '93d9a2904b6ede48f75420f4ba54c23f852834bf', class: "batch-actions_content" }, h("slot", { key: '994048ab8173b5d2bde4814c97728eea50c17413', name: "batch" })), h("p", { key: 'bdf9db2d4a24ce565516b6737b58129522fc679a', class: "batch-actions_count" }, !!this.selectedCount && `${this.selectedCount} ${this.selectedCount === 1 ? 'Position ausgewählt' : 'Positionen ausgewählt'}`))), h("div", { key: 'b9e0fa25ddfd331c0a1096f4051ebf78aef7c80c', class: "xv-table_wrapper" }, h("slot", { key: '15d4da2a12dec31d44fcfe23013bf287576c0f5d' }), h("slot", { key: 'b95b04b5bf2e4beaf138b640e1487e3016413dac', name: "footer" })), !!this.loading && (h("div", { key: '17038219b16e52bc087fe6886ebe79df8f85d6cc', class: "xv-table_loading" }, h("xv-loader-v2", { key: '0b06ac0be73bb3c0ff8dccf7311e04ff591e35b6', size: SIZE_VAR.LG }))))));
|
|
79049
81815
|
}
|
|
79050
81816
|
componentWillLoad() {
|
|
79051
81817
|
this.setColsSizeTemplate();
|
|
@@ -79086,7 +81852,7 @@ const XvTableCell = class {
|
|
|
79086
81852
|
}
|
|
79087
81853
|
;
|
|
79088
81854
|
render() {
|
|
79089
|
-
return (h(Host, { key: '
|
|
81855
|
+
return (h(Host, { key: '831a54a37b0421da3e69c1cd19f41ed645027cc1' }, h("slot", { key: 'afd20a201d255060cca1f0f4257895cb7761143c' })));
|
|
79090
81856
|
}
|
|
79091
81857
|
get el() { return getElement(this); }
|
|
79092
81858
|
};
|
|
@@ -79107,7 +81873,7 @@ const XvTableExpand = class {
|
|
|
79107
81873
|
};
|
|
79108
81874
|
}
|
|
79109
81875
|
render() {
|
|
79110
|
-
return (h(Host, { key: '
|
|
81876
|
+
return (h(Host, { key: '3443d1d685a9dac874ed0127283f445a141c2982' }, h("button", { key: '7e43a26b0ec58090ff27cf0c10cab3260b2040c4', class: { 'expand-btn': true, open: this.open }, disabled: this.disabled, onClick: this.handleExpand }), h("slot", { key: 'aff47453aa4ac5a1d69cd5953b64ce51dd68ab9e', name: XV_EXPANDABLE_KEY }), h("div", { key: 'e5fd048f354a94272664110560a1d1b574f4fa15', class: { expandableContent: true, open: this.open } }, h("slot", { key: 'bf70da40879b37ececc8166bfd9d64f3584eef45' }))));
|
|
79111
81877
|
}
|
|
79112
81878
|
componentDidLoad() {
|
|
79113
81879
|
setAttr(this.el.parentElement, XV_EXPANDABLE_KEY, true);
|
|
@@ -79162,7 +81928,7 @@ const XvTableRow = class {
|
|
|
79162
81928
|
}
|
|
79163
81929
|
}
|
|
79164
81930
|
render() {
|
|
79165
|
-
return (h(Host, { key: '
|
|
81931
|
+
return (h(Host, { key: '3b825498d2a19ed5c5995a5a88dc690ed2488343' }, this.variant !== undefined && (h("xv-table-v2-cell", { key: 'd0523d6ff070d06e2e3f6d1043276ba5d45ad897', class: "cell-control" }, this.variant === 'checkbox' && (h("xv-checkbox-v2", { key: '4a48e8c6dd712b8c1d80114c8e7bc1a5cafba496', name: this.name, partial: this.partial, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly, onEventChange: this.checkHandle })), this.variant === 'radio' && (h("input", { key: '61f9b67b4d2445e2e95ccd5223f2c2da670d2037', type: "radio", name: this.name, checked: this.checked || this.partial, disabled: this.disabled, required: this.required, readonly: this.readonly })))), h("slot", { key: 'a285f068bbb1abb881d3b0558610c91e9a27e11b' })));
|
|
79166
81932
|
}
|
|
79167
81933
|
componentWillLoad() {
|
|
79168
81934
|
this.setInitialAttrs();
|
|
@@ -79520,12 +82286,12 @@ const XvTagCombobox = class {
|
|
|
79520
82286
|
const suggestionsVisible = this.open && this.filtered.length > 0;
|
|
79521
82287
|
const ariaOwns = suggestionsVisible ? `${this.uid}-listbox` : undefined;
|
|
79522
82288
|
const activedesc = this.highlighted >= 0 ? this.optionId(this.highlighted) : undefined;
|
|
79523
|
-
return (h(Host, { key: '
|
|
82289
|
+
return (h(Host, { key: '96495f25e8a105ea6a93b7e837e24ae6083f3d42', class: "xv-combobox", part: "root", size: this.size }, this.label && h("label", { key: 'bee7ba8b79541e0e98be5bd4b66a077ce16e4dd1', class: "label" }, this.label), h("div", { key: '920fc9e5876e55e3c243dcec19cb4ebbd066b4cc', class: {
|
|
79524
82290
|
'control': true,
|
|
79525
82291
|
'control--disabled': this.disabled,
|
|
79526
82292
|
'control--error': !!this.error,
|
|
79527
82293
|
'control--readonly': !!this.readonly,
|
|
79528
|
-
}, onClick: () => this.blockClick() }, h("div", { key: '
|
|
82294
|
+
}, onClick: () => this.blockClick() }, h("div", { key: 'f01b3d43dbe2a242016ff8480a5594c755839730', class: "control-chips", role: "list" }, this.selected.map((s, i) => (h("xv-tag-v2", { role: "listitem", part: "chip", "data-value": s.value, size: this.COMPARE_TAG_SIZE[this.size], disabled: this.disabled, bg: (s === null || s === void 0 ? void 0 : s.bg) || 'var(--layer-accent-01, #F7F7F7)', color: (s === null || s === void 0 ? void 0 : s.color) || 'var(--text-primary, #333)', closeable: !this.readonly, onCloseClick: ({ detail }) => this.removeTag(i, detail) }, s.label))), h("input", { key: '420992b83aaa3db4953efa56120fc4e3f9705c68', ref: (el) => (this.inputEl = el), class: "control-input", readonly: this.readonly, placeholder: this.selected.length ? '' : this.placeholder, value: this.inputValue, onInput: (e) => this.onInput(e), onKeyDown: (e) => this.onKeyDown(e), onFocus: () => { this.onOpen(); this.recomputeFiltered(); }, "aria-autocomplete": "list", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": ariaOwns, "aria-activedescendant": activedesc, disabled: this.disabled }))), this.error && typeof this.error === 'string' && (h("p", { key: 'db69212f73783866a0fde4bb74895c18d3b297eb', class: "message message--error" }, this.error)), this.warning && typeof this.warning === 'string' && (h("p", { key: 'b61a345f03e7d6dbcb2c15721362a651a27486bf', class: "message message--warning" }, this.warning)), suggestionsVisible && (h("ul", { key: '035b4037f2a86e1b153b9391a1d140111e0d0cb6', id: `${this.uid}-listbox`, class: "suggestions", role: "listbox", part: "listbox" }, this.filtered.map((opt, idx) => (h("li", { id: this.optionId(idx), class: { 'suggestions-opt': true, 'suggestions-opt--highlight': idx === this.highlighted }, role: "option", "aria-selected": idx === this.highlighted, onMouseEnter: () => this.onOptionMouseEnter(idx), onMouseDown: (ev) => ev.preventDefault(), onClick: () => this.selectOption(opt) }, h("div", { class: "suggestions-opt-content" }, opt.bg ? h("span", { class: "suggestions-opt-content--color", style: { background: opt.bg } }) : null, h("span", { class: "suggestions-opt-content--label" }, this.highlightLabel(opt.label).map((seg, i) => typeof seg === 'string' ? h("span", { key: i }, seg) : h("strong", { key: i }, seg.match)))))))))));
|
|
79529
82295
|
}
|
|
79530
82296
|
get host() { return getElement(this); }
|
|
79531
82297
|
static get watchers() { return {
|
|
@@ -79557,7 +82323,7 @@ const XvTag = class {
|
|
|
79557
82323
|
this.closeClick.emit(e);
|
|
79558
82324
|
}
|
|
79559
82325
|
render() {
|
|
79560
|
-
return (h(Host, { key: '
|
|
82326
|
+
return (h(Host, { key: '7ef853745a7840918420ece66e329f7c5b18a066', style: { color: this.color, background: this.bg }, class: `xv-tag ${this.disabled ? 'disabled' : ''} ${this.size}` }, h("div", { key: 'b00e04c91e626964a6b37180c2970be4f0a3155d', class: "xv-tag_content", part: "details-content" }, h("slot", { key: 'bb288888f2bff1d730283dadc9737128fd1ca7d8' })), this.closeable && (h("button", { key: 'e184830bf1ffd57caf9142ab9995efcbcd059611', onClick: this.closeHandler.bind(this), class: "xv-tag_close" }))));
|
|
79561
82327
|
}
|
|
79562
82328
|
};
|
|
79563
82329
|
XvTag.style = xvTagCss();
|
|
@@ -79591,13 +82357,13 @@ const XvTextInput = class {
|
|
|
79591
82357
|
};
|
|
79592
82358
|
}
|
|
79593
82359
|
render() {
|
|
79594
|
-
return (h(Host, { key: '
|
|
82360
|
+
return (h(Host, { key: '2e6fa4c7fd866857e104cc9eee8bd7f1e1000d36', class: { disabled: !!this.disabled } }, h("label", { key: '3818f53ff4444350d20e94df3ed8c333fa3afca9', class: "control" }, this.label && h("span", { key: '0b76eb49d4c63e9d17d67e1ae01976e356230957', class: "control_label" }, this.label), h("div", { key: 'cc0c3bdad84572f104188f06f4b7170e448e49a0', class: {
|
|
79595
82361
|
'control_input': true,
|
|
79596
82362
|
readonly: !!this.readonly,
|
|
79597
82363
|
[this.size]: true,
|
|
79598
82364
|
error: !!this.error,
|
|
79599
82365
|
warning: !!this.warning,
|
|
79600
|
-
} }, h("input", { key: '
|
|
82366
|
+
} }, h("input", { key: '3a24d98edc170e0b4e2ee9ebd5df39febb5952aa', autocomplete: this.autocomplete, type: (this.type === 'password' && this.isPasswordVisible && 'text') || this.type, placeholder: this.placeholder, disabled: this.disabled, readonly: this.readonly, onInput: this.handleInput, name: this.name, value: this.value }), h("div", { key: '874381befedbf3083074142d966fb6ad50e4f4df', class: "control_input__icons" }, this.loading && h("xv-loader-v2", { key: '1e444f92682c77c2eb38bb76b903247a1ddd0877', size: SIZE_VAR.XS }), !!this.error ? (h("span", { class: "status-icon error", "aria-hidden": "true" }, "!")) : !!this.warning ? (h("span", { class: "status-icon warning", "aria-hidden": "true" }, "\u26A0")) : null, this.type === 'password' && (h("button", { key: 'ff366b830506bf866c747094f9041a498dc9ff15', onClick: this.togglePassword, disabled: this.disabled, class: "status-icon" }, h("svg", { key: '911022c330c7d92838578a45e26d7ebd9da7fd62', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 640 512", width: 16, height: 16 }, this.isPasswordVisible ? (h("path", { fill: "currentColor", d: "M38.8 5.1C28.4-3.1 13.3-1.2 5.1 9.2S-1.2 34.7 9.2 42.9l592 464c10.4 8.2 25.5 6.3 33.7-4.1s6.3-25.5-4.1-33.7L525.6 386.7c39.6-40.6 66.4-86.1 79.9-118.4c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C465.5 68.8 400.8 32 320 32c-68.2 0-125 26.3-169.3 60.8L38.8 5.1zm151 118.3C226 97.7 269.5 80 320 80c65.2 0 118.8 29.6 159.9 67.7C518.4 183.5 545 226 558.6 256c-12.6 28-36.6 66.8-70.9 100.9l-53.8-42.2c9.1-17.6 14.2-37.5 14.2-58.7c0-70.7-57.3-128-128-128c-32.2 0-61.7 11.9-84.2 31.5l-46.1-36.1zM394.9 284.2l-81.5-63.9c4.2-8.5 6.6-18.2 6.6-28.3c0-5.5-.7-10.9-2-16c.7 0 1.3 0 2 0c44.2 0 80 35.8 80 80c0 9.9-1.8 19.4-5.1 28.2zm9.4 130.3C378.8 425.4 350.7 432 320 432c-65.2 0-118.8-29.6-159.9-67.7C121.6 328.5 95 286 81.4 256c8.3-18.4 21.5-41.5 39.4-64.8L83.1 161.5C60.3 191.2 44 220.8 34.5 243.7c-3.3 7.9-3.3 16.7 0 24.6c14.9 35.7 46.2 87.7 93 131.1C174.5 443.2 239.2 480 320 480c47.8 0 89.9-12.9 126.2-32.5l-41.9-33zM192 256c0 70.7 57.3 128 128 128c13.3 0 26.1-2 38.2-5.8L302 334c-23.5-5.4-43.1-21.2-53.7-42.3l-56.1-44.2c-.2 2.8-.3 5.6-.3 8.5z" })) : (h("path", { fill: "currentColor", d: "M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z" })))))))), this.helper && h("p", { key: '7a8b366d1ec3bd6fe1ccabacedbea7c72a740fd6', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
79601
82367
|
}
|
|
79602
82368
|
static get formAssociated() { return true; }
|
|
79603
82369
|
};
|
|
@@ -79634,12 +82400,12 @@ const XvTextarea = class {
|
|
|
79634
82400
|
this.value && this.internals.setFormValue(this.value);
|
|
79635
82401
|
}
|
|
79636
82402
|
render() {
|
|
79637
|
-
return (h(Host, { key: '
|
|
82403
|
+
return (h(Host, { key: '03e7ebffa73fe67ba9f853af4a1598d77711e687', class: { disabled: !!this.disabled } }, h("label", { key: 'e1329d2693ad53a17e26d20b6b6f91f24c17fb08', class: "control" }, (this.label || this.max) && (h("p", { key: '51f236a55bcc5d228247aa5df7ed780175790a39', class: "control_label" }, h("span", { key: '3212f353d07f9085e14a0a57357919d7b0d839c0' }, this.label, this.info && h("xv-tooltip-v2", { key: 'c3aa28ecdad09b8ec453027f7cad202d0cdcdec4', message: this.info })), this.max !== undefined && !this.counterHide && (h("span", { key: '0faf004149c127fde7540e492ecf8bd456aeaca7', class: "control_label__count" }, this.value.length || 0, "/", this.max)))), h("div", { key: 'dd412a7a38499fe6a04c23f62ac927cb2c0dcec3', class: {
|
|
79638
82404
|
'control_input': true,
|
|
79639
82405
|
readonly: !!this.readonly,
|
|
79640
82406
|
error: !!this.error,
|
|
79641
82407
|
warning: this.warning !== undefined,
|
|
79642
|
-
} }, h("textarea", { key: '
|
|
82408
|
+
} }, h("textarea", { key: '2dca7de68cf3eeaa7c6e01b9e00da26187bb39a1', class: { 'no-resize': !!this.noResize }, name: this.name, rows: this.rows, value: this.value, maxLength: this.max, disabled: this.disabled, readOnly: this.readonly, placeholder: this.placeholder, onInput: this.onInput }), h("div", { key: '88bc05fdb4ad329457b831bb02fba92d073f6953', class: "control_input__icons" }, this._renderIcon()))), this.helper && h("p", { key: 'e0174e4a3af8217a756f1433872a78bc41cffa8a', class: "message" }, this.helper), typeof this.error === 'string' ? (h("p", { class: "message error" }, this.error)) : typeof this.warning === 'string' ? (h("p", { class: "message warning" }, this.warning)) : null));
|
|
79643
82409
|
}
|
|
79644
82410
|
_renderIcon() {
|
|
79645
82411
|
if (this.loading)
|
|
@@ -79690,7 +82456,7 @@ const XvTile = class {
|
|
|
79690
82456
|
this.checked = !this.checked;
|
|
79691
82457
|
}
|
|
79692
82458
|
render() {
|
|
79693
|
-
return (h(Host, { key: '
|
|
82459
|
+
return (h(Host, { key: 'c6d00c040c1125441fbfbeeec787a49e6d96edd8', class: "xv-tile--host" }, h("label", { key: 'f2460110e9ff5be0fb97b8d3bf6a60be13d12aef', class: {
|
|
79694
82460
|
[this.el.className]: !!this.el.className,
|
|
79695
82461
|
'xv-tile': true,
|
|
79696
82462
|
[`xv-tile--variant-${this.variant}`]: !!this.variant,
|
|
@@ -79698,7 +82464,7 @@ const XvTile = class {
|
|
|
79698
82464
|
'xv-tile--disabled': !!this.disabled,
|
|
79699
82465
|
'selected': !!this.checked,
|
|
79700
82466
|
'xv-tile--error': !!this.error,
|
|
79701
|
-
} }, h("div", { key: '
|
|
82467
|
+
} }, h("div", { key: '03dfbbb5b4e64827f420499689d9c715bf9c1eda', class: "xv-tile_content" }, this.label && h("p", { key: '0ce8526939aa10dd81643297228f804ed7e06d8b', class: "xv-tile_content__title" }, this.label), h("slot", { key: '026f8d5af0ffc6f3b1c2b0ba46e571649ebe80a4' })), this.variant === 'selectable' && (h("div", { key: 'dacd8cffe17187119d1e2f3b27a47398104e9b8b', class: "xv-tile_control" }, this.multiple ? (h("input", { type: "checkbox", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })) : (h("input", { type: "radio", disabled: this.disabled || this.readonly, readonly: this.readonly, onChange: this.handleChange, name: this.name, value: this.value, checked: this.checked })))), (this.variant === 'clickable' || this.variant === 'expandable') && (h("div", { key: '198aec62cbc33730c39a32166684ac03d4f835ca', class: "xv-tile_footer" }, h("button", { key: '4add8f9f71e08e54c59ea48149a428dbb64e084d', class: { 'xv-tile_footer__icon': true, [`icon--${this.variant}`]: true, open: this.checked } }))), h("div", { key: 'ea222f9359fb28d26addec27522a51e83b23f9ae', class: { 'xv-tile_expandable': true, open: this.checked } }, h("slot", { key: 'af0520de5ba1d48d6c31ed11ea2e94e87b68afdd', name: "expandable" })))));
|
|
79702
82468
|
}
|
|
79703
82469
|
get el() { return getElement(this); }
|
|
79704
82470
|
};
|
|
@@ -79730,7 +82496,7 @@ const XvToggle = class {
|
|
|
79730
82496
|
};
|
|
79731
82497
|
}
|
|
79732
82498
|
render() {
|
|
79733
|
-
return (h(Host, { key: '
|
|
82499
|
+
return (h(Host, { key: 'a4c7db088862dcae9471dd95b2698af1f77d5017', class: { 'xv-toggle': true, disabled: this.disabled, readonly: !!this.readonly, block: !!this.block } }, this.label && h("span", { key: '962d886c27033e34c27f5422af41324ad626972e', class: "label" }, this.label), h("label", { key: '3ab94e6af077e0a3231390e348fd087db0b88de2', class: "control" }, h("slot", { key: '5df02cdcda6edcc2eaa155b99a8bd5ca18971955', name: "before" }), h("div", { key: 'a8fd1d667f83b5ac7eb9140101e98a2ef6b5b948', class: "control_input" }, h("input", { key: 'c36f9ee766631e89ddee7e5ded5f611a2100222f', type: "checkbox", readonly: this.readonly, name: this.name, value: this.value, checked: this.checked, disabled: this.disabled || this.readonly, onChange: this.onChange }), h("span", { key: '331bca3c9e61dce5a7bde5ce4fd1a49d961a1c62', class: "toggle" })), h("slot", { key: '0d5313bb74c80168f24152d161e96c885eb43b68', name: "after" }))));
|
|
79734
82500
|
}
|
|
79735
82501
|
static get formAssociated() { return true; }
|
|
79736
82502
|
};
|
|
@@ -79807,7 +82573,7 @@ const XvToggleTip = class {
|
|
|
79807
82573
|
}
|
|
79808
82574
|
;
|
|
79809
82575
|
render() {
|
|
79810
|
-
return (h(Host, { key: '
|
|
82576
|
+
return (h(Host, { key: 'ea323b0b30d9c64a8331cdcbe26604aae7514919', class: "xv-toggle-tip" }, h("div", { key: '755153ca241f3b6dbf4afd679e32f37e02cc6e06', class: { 'trigger': true, 'trigger--block': this.block }, role: "button", tabindex: "0", "aria-expanded": this.open ? 'true' : 'false', "aria-controls": "popover", onClick: () => this.setPopover(!this.open), ref: (el) => (this.triggerEl = el) }, h("slot", { key: 'de6c5bebb14b9527778583721613dbee8d31c7b9', name: "trigger" }, h("svg", { key: '422c8198fc6c2acbb7741eeb4fe80a836c513b79', class: "trigger_icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '27acc8437785b92f7e2863d8698e7883e4bd75c1', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))), h("div", { key: '02360fd327e3f87ed053a5ad739df8272812c9e5', class: { popover: true, autoSize: !!this.autoSize }, role: "tooltip", tabindex: "-1", ref: (el) => (this.popoverEl = el) }, h("div", { key: '854fdfebc92d0329104dab26f1971528a99bb1f5', class: "popover-tip", part: "tip", "data-popper-arrow": "" }), h("div", { key: '34dd98113ac8155556f800cd3fb79c57123bdae7', class: "popover-content" }, h("slot", { key: 'd00d4259e6eeddfac8ba57e370920ce551fe7687', name: "header" }), h("slot", { key: '5bf9adb4a8060ec40131010f256c5b26f47afe0e', name: "body" }), h("slot", { key: '76c01a0f68366f63708520716d2c6c5a37106cce', name: "footer" })))));
|
|
79811
82577
|
}
|
|
79812
82578
|
disconnectedCallback() {
|
|
79813
82579
|
this.destroyPopper();
|
|
@@ -79862,11 +82628,11 @@ const XvTooltip = class {
|
|
|
79862
82628
|
this.destroyTooltip();
|
|
79863
82629
|
}
|
|
79864
82630
|
render() {
|
|
79865
|
-
return (h(Host, { key: '
|
|
82631
|
+
return (h(Host, { key: '4ea241a9d4a49c933300886b7d8cf54321462452', role: "tooltip", class: {
|
|
79866
82632
|
'xv-tooltip-wrapper': true,
|
|
79867
82633
|
[`xv-tooltip-wrapper__block`]: !!this.block,
|
|
79868
82634
|
[`xv-tooltip-wrapper__dashed`]: !!this.dashed,
|
|
79869
|
-
} }, h("slot", { key: '
|
|
82635
|
+
} }, h("slot", { key: '3df199308449e2fea26fd538b72f52b3f08e012b' }, h("svg", { key: 'c10dcac4a351f1bcb7feadca1650abbe321526ba', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 512 512", width: 16, height: 16 }, h("path", { key: '6ba8aa00b18f4aa21531362f247db04de95c35ec', fill: "currentColor", d: "M256 48a208 208 0 1 1 0 416 208 208 0 1 1 0-416zm0 464A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM216 336c-13.3 0-24 10.7-24 24s10.7 24 24 24l80 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-8 0 0-88c0-13.3-10.7-24-24-24l-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l24 0 0 64-24 0zm40-144a32 32 0 1 0 0-64 32 32 0 1 0 0 64z" })))));
|
|
79870
82636
|
}
|
|
79871
82637
|
get el() { return getElement(this); }
|
|
79872
82638
|
};
|