@limetech/lime-elements
Version:
1,095 lines (1,077 loc) • 112 kB
JavaScript
import { r as registerInstance, c as createEvent, h, g as getElement } from './index-2714248e.js';
import { g as getIconName, a as getIconColor } from './get-icon-props-37514418.js';
import { i as isEqual } from './isEqual-6914cf54.js';
import { _ as __extends, a as __assign, g as __read, M as MDCFoundation, b as MDCComponent, m as matches, c as __values } from './ponyfill-9f1f6cd2.js';
import { a as applyPassive, b as MDCRippleFoundation, M as MDCRipple } from './component-a531729c.js';
import { S as SetCache, c as cacheHas } from './_baseIsEqual-bbfd3091.js';
import { a as arrayIncludes, b as arrayIncludesWith, c as baseRest, i as isArrayLikeObject, d as baseFlatten } from './_arrayIncludesWith-88fc9c98.js';
import { a as arrayMap } from './identity-87aa3962.js';
import { e as baseUnary } from './_getTag-c1badd82.js';
import './eq-8014c26f.js';
import './_getNative-4a92ccb2.js';
import './isFunction-2461489d.js';
import './isObject-c74e273c.js';
import './isArray-80298bc7.js';
import './_isIndex-6de44c7b.js';
import './isArrayLike-9bd93a57.js';
import './isObjectLike-38996507.js';
import './_defineProperty-f4721394.js';
/** Used as the size to enable large array optimizations. */
var LARGE_ARRAY_SIZE = 200;
/**
* The base implementation of methods like `_.difference` without support
* for excluding multiple arrays or iteratee shorthands.
*
* @private
* @param {Array} array The array to inspect.
* @param {Array} values The values to exclude.
* @param {Function} [iteratee] The iteratee invoked per element.
* @param {Function} [comparator] The comparator invoked per element.
* @returns {Array} Returns the new array of filtered values.
*/
function baseDifference(array, values, iteratee, comparator) {
var index = -1,
includes = arrayIncludes,
isCommon = true,
length = array.length,
result = [],
valuesLength = values.length;
if (!length) {
return result;
}
if (iteratee) {
values = arrayMap(values, baseUnary(iteratee));
}
if (comparator) {
includes = arrayIncludesWith;
isCommon = false;
}
else if (values.length >= LARGE_ARRAY_SIZE) {
includes = cacheHas;
isCommon = false;
values = new SetCache(values);
}
outer:
while (++index < length) {
var value = array[index],
computed = iteratee == null ? value : iteratee(value);
value = (comparator || value !== 0) ? value : 0;
if (isCommon && computed === computed) {
var valuesIndex = valuesLength;
while (valuesIndex--) {
if (values[valuesIndex] === computed) {
continue outer;
}
}
result.push(value);
}
else if (!includes(values, computed, comparator)) {
result.push(value);
}
}
return result;
}
/**
* Creates an array of `array` values not included in the other given arrays
* using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)
* for equality comparisons. The order and references of result values are
* determined by the first array.
*
* **Note:** Unlike `_.pullAll`, this method returns a new array.
*
* @static
* @memberOf _
* @since 0.1.0
* @category Array
* @param {Array} array The array to inspect.
* @param {...Array} [values] The values to exclude.
* @returns {Array} Returns the new array of filtered values.
* @see _.without, _.xor
* @example
*
* _.difference([2, 1], [2, 3]);
* // => [1]
*/
var difference = baseRest(function(array, values) {
return isArrayLikeObject(array)
? baseDifference(array, baseFlatten(values, 1, isArrayLikeObject, true))
: [];
});
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var cssClasses$2 = {
ANIMATING: 'mdc-tab-scroller--animating',
SCROLL_AREA_SCROLL: 'mdc-tab-scroller__scroll-area--scroll',
SCROLL_TEST: 'mdc-tab-scroller__test',
};
var strings$4 = {
AREA_SELECTOR: '.mdc-tab-scroller__scroll-area',
CONTENT_SELECTOR: '.mdc-tab-scroller__scroll-content',
};
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScrollerRTL = /** @class */ (function () {
function MDCTabScrollerRTL(adapter) {
this.adapter = adapter;
}
return MDCTabScrollerRTL;
}());
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScrollerRTLDefault = /** @class */ (function (_super) {
__extends(MDCTabScrollerRTLDefault, _super);
function MDCTabScrollerRTLDefault() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCTabScrollerRTLDefault.prototype.getScrollPositionRTL = function () {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var right = this.calculateScrollEdges().right;
// Scroll values on most browsers are ints instead of floats so we round
return Math.round(right - currentScrollLeft);
};
MDCTabScrollerRTLDefault.prototype.scrollToRTL = function (scrollX) {
var edges = this.calculateScrollEdges();
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(edges.right - scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: clampedScrollLeft - currentScrollLeft,
};
};
MDCTabScrollerRTLDefault.prototype.incrementScrollRTL = function (scrollX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(currentScrollLeft - scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: clampedScrollLeft - currentScrollLeft,
};
};
MDCTabScrollerRTLDefault.prototype.getAnimatingScrollPosition = function (scrollX) {
return scrollX;
};
MDCTabScrollerRTLDefault.prototype.calculateScrollEdges = function () {
var contentWidth = this.adapter.getScrollContentOffsetWidth();
var rootWidth = this.adapter.getScrollAreaOffsetWidth();
return {
left: 0,
right: contentWidth - rootWidth,
};
};
MDCTabScrollerRTLDefault.prototype.clampScrollValue = function (scrollX) {
var edges = this.calculateScrollEdges();
return Math.min(Math.max(edges.left, scrollX), edges.right);
};
return MDCTabScrollerRTLDefault;
}(MDCTabScrollerRTL));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScrollerRTLNegative = /** @class */ (function (_super) {
__extends(MDCTabScrollerRTLNegative, _super);
function MDCTabScrollerRTLNegative() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCTabScrollerRTLNegative.prototype.getScrollPositionRTL = function (translateX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
return Math.round(translateX - currentScrollLeft);
};
MDCTabScrollerRTLNegative.prototype.scrollToRTL = function (scrollX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(-scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: clampedScrollLeft - currentScrollLeft,
};
};
MDCTabScrollerRTLNegative.prototype.incrementScrollRTL = function (scrollX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(currentScrollLeft - scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: clampedScrollLeft - currentScrollLeft,
};
};
MDCTabScrollerRTLNegative.prototype.getAnimatingScrollPosition = function (scrollX, translateX) {
return scrollX - translateX;
};
MDCTabScrollerRTLNegative.prototype.calculateScrollEdges = function () {
var contentWidth = this.adapter.getScrollContentOffsetWidth();
var rootWidth = this.adapter.getScrollAreaOffsetWidth();
return {
left: rootWidth - contentWidth,
right: 0,
};
};
MDCTabScrollerRTLNegative.prototype.clampScrollValue = function (scrollX) {
var edges = this.calculateScrollEdges();
return Math.max(Math.min(edges.right, scrollX), edges.left);
};
return MDCTabScrollerRTLNegative;
}(MDCTabScrollerRTL));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScrollerRTLReverse = /** @class */ (function (_super) {
__extends(MDCTabScrollerRTLReverse, _super);
function MDCTabScrollerRTLReverse() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCTabScrollerRTLReverse.prototype.getScrollPositionRTL = function (translateX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
// Scroll values on most browsers are ints instead of floats so we round
return Math.round(currentScrollLeft - translateX);
};
MDCTabScrollerRTLReverse.prototype.scrollToRTL = function (scrollX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: currentScrollLeft - clampedScrollLeft,
};
};
MDCTabScrollerRTLReverse.prototype.incrementScrollRTL = function (scrollX) {
var currentScrollLeft = this.adapter.getScrollAreaScrollLeft();
var clampedScrollLeft = this.clampScrollValue(currentScrollLeft + scrollX);
return {
finalScrollPosition: clampedScrollLeft,
scrollDelta: currentScrollLeft - clampedScrollLeft,
};
};
MDCTabScrollerRTLReverse.prototype.getAnimatingScrollPosition = function (scrollX, translateX) {
return scrollX + translateX;
};
MDCTabScrollerRTLReverse.prototype.calculateScrollEdges = function () {
var contentWidth = this.adapter.getScrollContentOffsetWidth();
var rootWidth = this.adapter.getScrollAreaOffsetWidth();
return {
left: contentWidth - rootWidth,
right: 0,
};
};
MDCTabScrollerRTLReverse.prototype.clampScrollValue = function (scrollX) {
var edges = this.calculateScrollEdges();
return Math.min(Math.max(edges.right, scrollX), edges.left);
};
return MDCTabScrollerRTLReverse;
}(MDCTabScrollerRTL));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScrollerFoundation = /** @class */ (function (_super) {
__extends(MDCTabScrollerFoundation, _super);
function MDCTabScrollerFoundation(adapter) {
var _this = _super.call(this, __assign(__assign({}, MDCTabScrollerFoundation.defaultAdapter), adapter)) || this;
/**
* Controls whether we should handle the transitionend and interaction events during the animation.
*/
_this.isAnimating = false;
return _this;
}
Object.defineProperty(MDCTabScrollerFoundation, "cssClasses", {
get: function () {
return cssClasses$2;
},
enumerable: false,
configurable: true
});
Object.defineProperty(MDCTabScrollerFoundation, "strings", {
get: function () {
return strings$4;
},
enumerable: false,
configurable: true
});
Object.defineProperty(MDCTabScrollerFoundation, "defaultAdapter", {
get: function () {
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
return {
eventTargetMatchesSelector: function () { return false; },
addClass: function () { return undefined; },
removeClass: function () { return undefined; },
addScrollAreaClass: function () { return undefined; },
setScrollAreaStyleProperty: function () { return undefined; },
setScrollContentStyleProperty: function () { return undefined; },
getScrollContentStyleValue: function () { return ''; },
setScrollAreaScrollLeft: function () { return undefined; },
getScrollAreaScrollLeft: function () { return 0; },
getScrollContentOffsetWidth: function () { return 0; },
getScrollAreaOffsetWidth: function () { return 0; },
computeScrollAreaClientRect: function () {
return ({ top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 });
},
computeScrollContentClientRect: function () {
return ({ top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 });
},
computeHorizontalScrollbarHeight: function () { return 0; },
};
// tslint:enable:object-literal-sort-keys
},
enumerable: false,
configurable: true
});
MDCTabScrollerFoundation.prototype.init = function () {
// Compute horizontal scrollbar height on scroller with overflow initially hidden, then update overflow to scroll
// and immediately adjust bottom margin to avoid the scrollbar initially appearing before JS runs.
var horizontalScrollbarHeight = this.adapter.computeHorizontalScrollbarHeight();
this.adapter.setScrollAreaStyleProperty('margin-bottom', -horizontalScrollbarHeight + 'px');
this.adapter.addScrollAreaClass(MDCTabScrollerFoundation.cssClasses.SCROLL_AREA_SCROLL);
};
/**
* Computes the current visual scroll position
*/
MDCTabScrollerFoundation.prototype.getScrollPosition = function () {
if (this.isRTL()) {
return this.computeCurrentScrollPositionRTL();
}
var currentTranslateX = this.calculateCurrentTranslateX();
var scrollLeft = this.adapter.getScrollAreaScrollLeft();
return scrollLeft - currentTranslateX;
};
/**
* Handles interaction events that occur during transition
*/
MDCTabScrollerFoundation.prototype.handleInteraction = function () {
// Early exit if we aren't animating
if (!this.isAnimating) {
return;
}
// Prevent other event listeners from handling this event
this.stopScrollAnimation();
};
/**
* Handles the transitionend event
*/
MDCTabScrollerFoundation.prototype.handleTransitionEnd = function (evt) {
// Early exit if we aren't animating or the event was triggered by a different element.
var evtTarget = evt.target;
if (!this.isAnimating ||
!this.adapter.eventTargetMatchesSelector(evtTarget, MDCTabScrollerFoundation.strings.CONTENT_SELECTOR)) {
return;
}
this.isAnimating = false;
this.adapter.removeClass(MDCTabScrollerFoundation.cssClasses.ANIMATING);
};
/**
* Increment the scroll value by the scrollXIncrement using animation.
* @param scrollXIncrement The value by which to increment the scroll position
*/
MDCTabScrollerFoundation.prototype.incrementScroll = function (scrollXIncrement) {
// Early exit for non-operational increment values
if (scrollXIncrement === 0) {
return;
}
this.animate(this.getIncrementScrollOperation(scrollXIncrement));
};
/**
* Increment the scroll value by the scrollXIncrement without animation.
* @param scrollXIncrement The value by which to increment the scroll position
*/
MDCTabScrollerFoundation.prototype.incrementScrollImmediate = function (scrollXIncrement) {
// Early exit for non-operational increment values
if (scrollXIncrement === 0) {
return;
}
var operation = this.getIncrementScrollOperation(scrollXIncrement);
if (operation.scrollDelta === 0) {
return;
}
this.stopScrollAnimation();
this.adapter.setScrollAreaScrollLeft(operation.finalScrollPosition);
};
/**
* Scrolls to the given scrollX value
*/
MDCTabScrollerFoundation.prototype.scrollTo = function (scrollX) {
if (this.isRTL()) {
this.scrollToImplRTL(scrollX);
return;
}
this.scrollToImpl(scrollX);
};
/**
* @return Browser-specific {@link MDCTabScrollerRTL} instance.
*/
MDCTabScrollerFoundation.prototype.getRTLScroller = function () {
if (!this.rtlScrollerInstance) {
this.rtlScrollerInstance = this.rtlScrollerFactory();
}
return this.rtlScrollerInstance;
};
/**
* @return translateX value from a CSS matrix transform function string.
*/
MDCTabScrollerFoundation.prototype.calculateCurrentTranslateX = function () {
var transformValue = this.adapter.getScrollContentStyleValue('transform');
// Early exit if no transform is present
if (transformValue === 'none') {
return 0;
}
// The transform value comes back as a matrix transformation in the form
// of `matrix(a, b, c, d, tx, ty)`. We only care about tx (translateX) so
// we're going to grab all the parenthesized values, strip out tx, and
// parse it.
var match = /\((.+?)\)/.exec(transformValue);
if (!match) {
return 0;
}
var matrixParams = match[1];
// tslint:disable-next-line:ban-ts-ignore "Unused vars" should be a linter warning, not a compiler error.
// @ts-ignore These unused variables should retain their semantic names for clarity.
var _a = __read(matrixParams.split(','), 6), tx = _a[4];
return parseFloat(tx); // tslint:disable-line:ban
};
/**
* Calculates a safe scroll value that is > 0 and < the max scroll value
* @param scrollX The distance to scroll
*/
MDCTabScrollerFoundation.prototype.clampScrollValue = function (scrollX) {
var edges = this.calculateScrollEdges();
return Math.min(Math.max(edges.left, scrollX), edges.right);
};
MDCTabScrollerFoundation.prototype.computeCurrentScrollPositionRTL = function () {
var translateX = this.calculateCurrentTranslateX();
return this.getRTLScroller().getScrollPositionRTL(translateX);
};
MDCTabScrollerFoundation.prototype.calculateScrollEdges = function () {
var contentWidth = this.adapter.getScrollContentOffsetWidth();
var rootWidth = this.adapter.getScrollAreaOffsetWidth();
return {
left: 0,
right: contentWidth - rootWidth,
};
};
/**
* Internal scroll method
* @param scrollX The new scroll position
*/
MDCTabScrollerFoundation.prototype.scrollToImpl = function (scrollX) {
var currentScrollX = this.getScrollPosition();
var safeScrollX = this.clampScrollValue(scrollX);
var scrollDelta = safeScrollX - currentScrollX;
this.animate({
finalScrollPosition: safeScrollX,
scrollDelta: scrollDelta,
});
};
/**
* Internal RTL scroll method
* @param scrollX The new scroll position
*/
MDCTabScrollerFoundation.prototype.scrollToImplRTL = function (scrollX) {
var animation = this.getRTLScroller().scrollToRTL(scrollX);
this.animate(animation);
};
/**
* Internal method to compute the increment scroll operation values.
* @param scrollX The desired scroll position increment
* @return MDCTabScrollerAnimation with the sanitized values for performing the scroll operation.
*/
MDCTabScrollerFoundation.prototype.getIncrementScrollOperation = function (scrollX) {
if (this.isRTL()) {
return this.getRTLScroller().incrementScrollRTL(scrollX);
}
var currentScrollX = this.getScrollPosition();
var targetScrollX = scrollX + currentScrollX;
var safeScrollX = this.clampScrollValue(targetScrollX);
var scrollDelta = safeScrollX - currentScrollX;
return {
finalScrollPosition: safeScrollX,
scrollDelta: scrollDelta,
};
};
/**
* Animates the tab scrolling
* @param animation The animation to apply
*/
MDCTabScrollerFoundation.prototype.animate = function (animation) {
var _this = this;
// Early exit if translateX is 0, which means there's no animation to perform
if (animation.scrollDelta === 0) {
return;
}
this.stopScrollAnimation();
// This animation uses the FLIP approach.
// Read more here: https://aerotwist.com/blog/flip-your-animations/
this.adapter.setScrollAreaScrollLeft(animation.finalScrollPosition);
this.adapter.setScrollContentStyleProperty('transform', "translateX(" + animation.scrollDelta + "px)");
// Force repaint
this.adapter.computeScrollAreaClientRect();
requestAnimationFrame(function () {
_this.adapter.addClass(MDCTabScrollerFoundation.cssClasses.ANIMATING);
_this.adapter.setScrollContentStyleProperty('transform', 'none');
});
this.isAnimating = true;
};
/**
* Stops scroll animation
*/
MDCTabScrollerFoundation.prototype.stopScrollAnimation = function () {
this.isAnimating = false;
var currentScrollPosition = this.getAnimatingScrollPosition();
this.adapter.removeClass(MDCTabScrollerFoundation.cssClasses.ANIMATING);
this.adapter.setScrollContentStyleProperty('transform', 'translateX(0px)');
this.adapter.setScrollAreaScrollLeft(currentScrollPosition);
};
/**
* Gets the current scroll position during animation
*/
MDCTabScrollerFoundation.prototype.getAnimatingScrollPosition = function () {
var currentTranslateX = this.calculateCurrentTranslateX();
var scrollLeft = this.adapter.getScrollAreaScrollLeft();
if (this.isRTL()) {
return this.getRTLScroller().getAnimatingScrollPosition(scrollLeft, currentTranslateX);
}
return scrollLeft - currentTranslateX;
};
/**
* Determines the RTL Scroller to use
*/
MDCTabScrollerFoundation.prototype.rtlScrollerFactory = function () {
// Browsers have three different implementations of scrollLeft in RTL mode,
// dependent on the browser. The behavior is based off the max LTR
// scrollLeft value and 0.
//
// * Default scrolling in RTL *
// - Left-most value: 0
// - Right-most value: Max LTR scrollLeft value
//
// * Negative scrolling in RTL *
// - Left-most value: Negated max LTR scrollLeft value
// - Right-most value: 0
//
// * Reverse scrolling in RTL *
// - Left-most value: Max LTR scrollLeft value
// - Right-most value: 0
//
// We use those principles below to determine which RTL scrollLeft
// behavior is implemented in the current browser.
var initialScrollLeft = this.adapter.getScrollAreaScrollLeft();
this.adapter.setScrollAreaScrollLeft(initialScrollLeft - 1);
var newScrollLeft = this.adapter.getScrollAreaScrollLeft();
// If the newScrollLeft value is negative,then we know that the browser has
// implemented negative RTL scrolling, since all other implementations have
// only positive values.
if (newScrollLeft < 0) {
// Undo the scrollLeft test check
this.adapter.setScrollAreaScrollLeft(initialScrollLeft);
return new MDCTabScrollerRTLNegative(this.adapter);
}
var rootClientRect = this.adapter.computeScrollAreaClientRect();
var contentClientRect = this.adapter.computeScrollContentClientRect();
var rightEdgeDelta = Math.round(contentClientRect.right - rootClientRect.right);
// Undo the scrollLeft test check
this.adapter.setScrollAreaScrollLeft(initialScrollLeft);
// By calculating the clientRect of the root element and the clientRect of
// the content element, we can determine how much the scroll value changed
// when we performed the scrollLeft subtraction above.
if (rightEdgeDelta === newScrollLeft) {
return new MDCTabScrollerRTLReverse(this.adapter);
}
return new MDCTabScrollerRTLDefault(this.adapter);
};
MDCTabScrollerFoundation.prototype.isRTL = function () {
return this.adapter.getScrollContentStyleValue('direction') === 'rtl';
};
return MDCTabScrollerFoundation;
}(MDCFoundation));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
/**
* Stores result from computeHorizontalScrollbarHeight to avoid redundant processing.
*/
var horizontalScrollbarHeight_;
/**
* Computes the height of browser-rendered horizontal scrollbars using a self-created test element.
* May return 0 (e.g. on OS X browsers under default configuration).
*/
function computeHorizontalScrollbarHeight(documentObj, shouldCacheResult) {
if (shouldCacheResult === void 0) { shouldCacheResult = true; }
if (shouldCacheResult && typeof horizontalScrollbarHeight_ !== 'undefined') {
return horizontalScrollbarHeight_;
}
var el = documentObj.createElement('div');
el.classList.add(cssClasses$2.SCROLL_TEST);
documentObj.body.appendChild(el);
var horizontalScrollbarHeight = el.offsetHeight - el.clientHeight;
documentObj.body.removeChild(el);
if (shouldCacheResult) {
horizontalScrollbarHeight_ = horizontalScrollbarHeight;
}
return horizontalScrollbarHeight;
}
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabScroller = /** @class */ (function (_super) {
__extends(MDCTabScroller, _super);
function MDCTabScroller() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCTabScroller.attachTo = function (root) {
return new MDCTabScroller(root);
};
// initialSyncWithDOM()
MDCTabScroller.prototype.initialize = function () {
this.area = this.root.querySelector(MDCTabScrollerFoundation.strings.AREA_SELECTOR);
this.content = this.root.querySelector(MDCTabScrollerFoundation.strings.CONTENT_SELECTOR);
};
MDCTabScroller.prototype.initialSyncWithDOM = function () {
var _this = this;
this.handleInteraction = function () {
_this.foundation.handleInteraction();
};
this.handleTransitionEnd = function (evt) {
_this.foundation.handleTransitionEnd(evt);
};
this.area.addEventListener('wheel', this.handleInteraction, applyPassive());
this.area.addEventListener('touchstart', this.handleInteraction, applyPassive());
this.area.addEventListener('pointerdown', this.handleInteraction, applyPassive());
this.area.addEventListener('mousedown', this.handleInteraction, applyPassive());
this.area.addEventListener('keydown', this.handleInteraction, applyPassive());
this.content.addEventListener('transitionend', this.handleTransitionEnd);
};
MDCTabScroller.prototype.destroy = function () {
_super.prototype.destroy.call(this);
this.area.removeEventListener('wheel', this.handleInteraction, applyPassive());
this.area.removeEventListener('touchstart', this.handleInteraction, applyPassive());
this.area.removeEventListener('pointerdown', this.handleInteraction, applyPassive());
this.area.removeEventListener('mousedown', this.handleInteraction, applyPassive());
this.area.removeEventListener('keydown', this.handleInteraction, applyPassive());
this.content.removeEventListener('transitionend', this.handleTransitionEnd);
};
MDCTabScroller.prototype.getDefaultFoundation = function () {
var _this = this;
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
var adapter = {
eventTargetMatchesSelector: function (evtTarget, selector) {
return matches(evtTarget, selector);
},
addClass: function (className) {
_this.root.classList.add(className);
},
removeClass: function (className) {
_this.root.classList.remove(className);
},
addScrollAreaClass: function (className) {
_this.area.classList.add(className);
},
setScrollAreaStyleProperty: function (prop, value) {
_this.area.style.setProperty(prop, value);
},
setScrollContentStyleProperty: function (prop, value) {
_this.content.style.setProperty(prop, value);
},
getScrollContentStyleValue: function (propName) {
return window.getComputedStyle(_this.content).getPropertyValue(propName);
},
setScrollAreaScrollLeft: function (scrollX) { return _this.area.scrollLeft = scrollX; },
getScrollAreaScrollLeft: function () { return _this.area.scrollLeft; },
getScrollContentOffsetWidth: function () { return _this.content.offsetWidth; },
getScrollAreaOffsetWidth: function () { return _this.area.offsetWidth; },
computeScrollAreaClientRect: function () { return _this.area.getBoundingClientRect(); },
computeScrollContentClientRect: function () {
return _this.content.getBoundingClientRect();
},
computeHorizontalScrollbarHeight: function () {
return computeHorizontalScrollbarHeight(document);
},
};
// tslint:enable:object-literal-sort-keys
return new MDCTabScrollerFoundation(adapter);
};
/**
* Returns the current visual scroll position
*/
MDCTabScroller.prototype.getScrollPosition = function () {
return this.foundation.getScrollPosition();
};
/**
* Returns the width of the scroll content
*/
MDCTabScroller.prototype.getScrollContentWidth = function () {
return this.content.offsetWidth;
};
/**
* Increments the scroll value by the given amount
* @param scrollXIncrement The pixel value by which to increment the scroll value
*/
MDCTabScroller.prototype.incrementScroll = function (scrollXIncrement) {
this.foundation.incrementScroll(scrollXIncrement);
};
/**
* Scrolls to the given pixel position
* @param scrollX The pixel value to scroll to
*/
MDCTabScroller.prototype.scrollTo = function (scrollX) {
this.foundation.scrollTo(scrollX);
};
return MDCTabScroller;
}(MDCComponent));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var cssClasses$1 = {
ACTIVE: 'mdc-tab-indicator--active',
FADE: 'mdc-tab-indicator--fade',
NO_TRANSITION: 'mdc-tab-indicator--no-transition',
};
var strings$3 = {
CONTENT_SELECTOR: '.mdc-tab-indicator__content',
};
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabIndicatorFoundation = /** @class */ (function (_super) {
__extends(MDCTabIndicatorFoundation, _super);
function MDCTabIndicatorFoundation(adapter) {
return _super.call(this, __assign(__assign({}, MDCTabIndicatorFoundation.defaultAdapter), adapter)) || this;
}
Object.defineProperty(MDCTabIndicatorFoundation, "cssClasses", {
get: function () {
return cssClasses$1;
},
enumerable: false,
configurable: true
});
Object.defineProperty(MDCTabIndicatorFoundation, "strings", {
get: function () {
return strings$3;
},
enumerable: false,
configurable: true
});
Object.defineProperty(MDCTabIndicatorFoundation, "defaultAdapter", {
get: function () {
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
return {
addClass: function () { return undefined; },
removeClass: function () { return undefined; },
computeContentClientRect: function () {
return ({ top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 });
},
setContentStyleProperty: function () { return undefined; },
};
// tslint:enable:object-literal-sort-keys
},
enumerable: false,
configurable: true
});
MDCTabIndicatorFoundation.prototype.computeContentClientRect = function () {
return this.adapter.computeContentClientRect();
};
return MDCTabIndicatorFoundation;
}(MDCFoundation));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
/* istanbul ignore next: subclass is not a branch statement */
var MDCFadingTabIndicatorFoundation = /** @class */ (function (_super) {
__extends(MDCFadingTabIndicatorFoundation, _super);
function MDCFadingTabIndicatorFoundation() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCFadingTabIndicatorFoundation.prototype.activate = function () {
this.adapter.addClass(MDCTabIndicatorFoundation.cssClasses.ACTIVE);
};
MDCFadingTabIndicatorFoundation.prototype.deactivate = function () {
this.adapter.removeClass(MDCTabIndicatorFoundation.cssClasses.ACTIVE);
};
return MDCFadingTabIndicatorFoundation;
}(MDCTabIndicatorFoundation));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
/* istanbul ignore next: subclass is not a branch statement */
var MDCSlidingTabIndicatorFoundation = /** @class */ (function (_super) {
__extends(MDCSlidingTabIndicatorFoundation, _super);
function MDCSlidingTabIndicatorFoundation() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCSlidingTabIndicatorFoundation.prototype.activate = function (previousIndicatorClientRect) {
// Early exit if no indicator is present to handle cases where an indicator
// may be activated without a prior indicator state
if (!previousIndicatorClientRect) {
this.adapter.addClass(MDCTabIndicatorFoundation.cssClasses.ACTIVE);
return;
}
// This animation uses the FLIP approach. You can read more about it at the link below:
// https://aerotwist.com/blog/flip-your-animations/
// Calculate the dimensions based on the dimensions of the previous indicator
var currentClientRect = this.computeContentClientRect();
var widthDelta = previousIndicatorClientRect.width / currentClientRect.width;
var xPosition = previousIndicatorClientRect.left - currentClientRect.left;
this.adapter.addClass(MDCTabIndicatorFoundation.cssClasses.NO_TRANSITION);
this.adapter.setContentStyleProperty('transform', "translateX(" + xPosition + "px) scaleX(" + widthDelta + ")");
// Force repaint before updating classes and transform to ensure the transform properly takes effect
this.computeContentClientRect();
this.adapter.removeClass(MDCTabIndicatorFoundation.cssClasses.NO_TRANSITION);
this.adapter.addClass(MDCTabIndicatorFoundation.cssClasses.ACTIVE);
this.adapter.setContentStyleProperty('transform', '');
};
MDCSlidingTabIndicatorFoundation.prototype.deactivate = function () {
this.adapter.removeClass(MDCTabIndicatorFoundation.cssClasses.ACTIVE);
};
return MDCSlidingTabIndicatorFoundation;
}(MDCTabIndicatorFoundation));
/**
* @license
* Copyright 2018 Google Inc.
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
var MDCTabIndicator = /** @class */ (function (_super) {
__extends(MDCTabIndicator, _super);
function MDCTabIndicator() {
return _super !== null && _super.apply(this, arguments) || this;
}
MDCTabIndicator