@material/react-tab-indicator - npm Package Compare versions

Comparing version 0.7.1 to 0.8.0

dist/index.d.ts

+import * as React from 'react';
+// @ts-ignore
+import { MDCFadingTabIndicatorFoundation, MDCSlidingTabIndicatorFoundation } from '@material/tab-indicator/dist/mdc.tabIndicator';
+export interface TabIndicatorProps extends React.HTMLAttributes<HTMLSpanElement> {
+    active?: boolean;
+    className?: string;
+    fade?: boolean;
+    icon?: boolean;
+    previousIndicatorClientRect?: ClientRect;
+}
+export default class TabIndicator extends React.Component<TabIndicatorProps, {}> {
+    private tabIndicatorElement;
+    foundation?: MDCFadingTabIndicatorFoundation | MDCSlidingTabIndicatorFoundation;
+    static defaultProps: Partial<TabIndicatorProps>;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    componentDidUpdate(prevProps: TabIndicatorProps): void;
+    readonly classes: string;
+    readonly contentClasses: string;
+    readonly adapter: {
+        addClass: (className: string) => void;
+        removeClass: (className: string) => void;
+        computeContentClientRect: () => ClientRect | undefined;
+        setContentStyleProperty: (prop: number | "translate" | "color" | "grid" | "bottom" | "left" | "right" | "top" | "clip" | "content" | "flex" | "fill" | "stroke" | "zoom" | "clear" | "border" | "padding" | "alignContent" | "alignItems" | "alignSelf" | "animationDelay" | "animationDirection" | "animationDuration" | "animationFillMode" | "animationIterationCount" | "animationName" | "animationPlayState" | "animationTimingFunction" | "backfaceVisibility" | "backgroundAttachment" | "backgroundClip" | "backgroundColor" | "backgroundImage" | "backgroundOrigin" | "backgroundPosition" | "backgroundPositionX" | "backgroundPositionY" | "backgroundRepeat" | "backgroundSize" | "borderBottomColor" | "borderBottomLeftRadius" | "borderBottomRightRadius" | "borderBottomStyle" | "borderBottomWidth" | "borderCollapse" | "borderImageOutset" | "borderImageRepeat" | "borderImageSlice" | "borderImageSource" | "borderImageWidth" | "borderLeftColor" | "borderLeftStyle" | "borderLeftWidth" | "borderRightColor" | "borderRightStyle" | "borderRightWidth" | "borderSpacing" | "borderTopColor" | "borderTopLeftRadius" | "borderTopRightRadius" | "borderTopStyle" | "borderTopWidth" | "boxShadow" | "boxSizing" | "breakAfter" | "breakBefore" | "breakInside" | "captionSide" | "clipPath" | "columnCount" | "columnFill" | "columnGap" | "columnRuleColor" | "columnRuleStyle" | "columnRuleWidth" | "columnSpan" | "columnWidth" | "counterIncrement" | "counterReset" | "cursor" | "direction" | "display" | "emptyCells" | "filter" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontFeatureSettings" | "fontSize" | "fontSizeAdjust" | "fontStretch" | "fontStyle" | "fontVariant" | "fontWeight" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineBreak" | "lineHeight" | "listStyleImage" | "listStylePosition" | "listStyleType" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maskImage" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "objectFit" | "objectPosition" | "opacity" | "order" | "orphans" | "outlineColor" | "outlineOffset" | "outlineStyle" | "outlineWidth" | "overflow" | "overflowX" | "overflowY" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "pageBreakAfter" | "pageBreakBefore" | "pageBreakInside" | "perspective" | "perspectiveOrigin" | "pointerEvents" | "position" | "quotes" | "resize" | "rotate" | "rowGap" | "rubyAlign" | "rubyPosition" | "scale" | "scrollBehavior" | "tableLayout" | "textAlign" | "textAlignLast" | "textCombineUpright" | "textIndent" | "textJustify" | "textOverflow" | "textShadow" | "textTransform" | "textUnderlinePosition" | "touchAction" | "transform" | "transformOrigin" | "transformStyle" | "transitionDelay" | "transitionDuration" | "transitionProperty" | "transitionTimingFunction" | "unicodeBidi" | "userSelect" | "verticalAlign" | "visibility" | "whiteSpace" | "widows" | "width" | "wordBreak" | "wordSpacing" | "wordWrap" | "writingMode" | "zIndex" | "animation" | "background" | "borderBottom" | "borderColor" | "borderImage" | "borderLeft" | "borderRadius" | "borderRight" | "borderStyle" | "borderTop" | "borderWidth" | "columnRule" | "columns" | "flexFlow" | "font" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "gridTemplate" | "listStyle" | "margin" | "mask" | "outline" | "textDecoration" | "transition" | "msContentZoomChaining" | "msContentZoomLimitMax" | "msContentZoomLimitMin" | "msContentZoomSnapPoints" | "msContentZoomSnapType" | "msContentZooming" | "msFlowFrom" | "msFlowInto" | "msGridColumns" | "msGridRows" | "msHighContrastAdjust" | "msHyphenateLimitChars" | "msHyphenateLimitLines" | "msHyphenateLimitZone" | "msHyphens" | "msImeAlign" | "msOverflowStyle" | "msScrollChaining" | "msScrollLimitXMax" | "msScrollLimitXMin" | "msScrollLimitYMax" | "msScrollLimitYMin" | "msScrollRails" | "msScrollSnapPointsX" | "msScrollSnapPointsY" | "msScrollSnapType" | "msScrollTranslation" | "msTextCombineHorizontal" | "msTextSizeAdjust" | "msTouchAction" | "msTouchSelect" | "msUserSelect" | "msWrapFlow" | "msWrapMargin" | "msWrapThrough" | "msContentZoomLimit" | "msContentZoomSnap" | "msScrollLimit" | "msScrollSnapX" | "msScrollSnapY" | "gridColumnGap" | "gridGap" | "gridRowGap" | "imeMode" | "alignmentBaseline" | "baselineShift" | "clipRule" | "dominantBaseline" | "fillOpacity" | "fillRule" | "floodColor" | "floodOpacity" | "glyphOrientationVertical" | "lightingColor" | "marker" | "markerEnd" | "markerMid" | "markerStart" | "stopColor" | "stopOpacity" | "strokeDasharray" | "strokeDashoffset" | "strokeLinecap" | "strokeLinejoin" | "strokeMiterlimit" | "strokeOpacity" | "strokeWidth" | "textAnchor" | "colorInterpolationFilters" | "cssFloat" | "cssText" | "enableBackground" | "glyphOrientationHorizontal" | "kerning" | "layoutGrid" | "layoutGridChar" | "layoutGridLine" | "layoutGridMode" | "layoutGridType" | "length" | "msFontFeatureSettings" | "msGridColumn" | "msGridColumnAlign" | "msGridColumnSpan" | "msGridRow" | "msGridRowAlign" | "msGridRowSpan" | "parentRule" | "penAction" | "rubyOverhang" | "textKashida" | "textKashidaSpace" | "webkitAlignContent" | "webkitAlignItems" | "webkitAlignSelf" | "webkitAnimation" | "webkitAnimationDelay" | "webkitAnimationDirection" | "webkitAnimationDuration" | "webkitAnimationFillMode" | "webkitAnimationIterationCount" | "webkitAnimationName" | "webkitAnimationPlayState" | "webkitAnimationTimingFunction" | "webkitAppearance" | "webkitBackfaceVisibility" | "webkitBackgroundClip" | "webkitBackgroundOrigin" | "webkitBackgroundSize" | "webkitBorderBottomLeftRadius" | "webkitBorderBottomRightRadius" | "webkitBorderImage" | "webkitBorderRadius" | "webkitBorderTopLeftRadius" | "webkitBorderTopRightRadius" | "webkitBoxAlign" | "webkitBoxDirection" | "webkitBoxFlex" | "webkitBoxOrdinalGroup" | "webkitBoxOrient" | "webkitBoxPack" | "webkitBoxShadow" | "webkitBoxSizing" | "webkitColumnBreakAfter" | "webkitColumnBreakBefore" | "webkitColumnBreakInside" | "webkitColumnCount" | "webkitColumnGap" | "webkitColumnRule" | "webkitColumnRuleColor" | "webkitColumnRuleStyle" | "webkitColumnRuleWidth" | "webkitColumnSpan" | "webkitColumnWidth" | "webkitColumns" | "webkitFilter" | "webkitFlex" | "webkitFlexBasis" | "webkitFlexDirection" | "webkitFlexFlow" | "webkitFlexGrow" | "webkitFlexShrink" | "webkitFlexWrap" | "webkitJustifyContent" | "webkitMask" | "webkitMaskBoxImage" | "webkitMaskBoxImageOutset" | "webkitMaskBoxImageRepeat" | "webkitMaskBoxImageSlice" | "webkitMaskBoxImageSource" | "webkitMaskBoxImageWidth" | "webkitMaskClip" | "webkitMaskComposite" | "webkitMaskImage" | "webkitMaskOrigin" | "webkitMaskPosition" | "webkitMaskRepeat" | "webkitMaskSize" | "webkitOrder" | "webkitPerspective" | "webkitPerspectiveOrigin" | "webkitTapHighlightColor" | "webkitTextFillColor" | "webkitTextSizeAdjust" | "webkitTextStroke" | "webkitTextStrokeColor" | "webkitTextStrokeWidth" | "webkitTransform" | "webkitTransformOrigin" | "webkitTransformStyle" | "webkitTransition" | "webkitTransitionDelay" | "webkitTransitionDuration" | "webkitTransitionProperty" | "webkitTransitionTimingFunction" | "webkitUserModify" | "webkitUserSelect" | "webkitWritingMode" | "getPropertyPriority" | "getPropertyValue" | "item" | "removeProperty" | "setProperty", value: string) => void;
+    };
+    private getNativeContentElement;
+    computeContentClientRect: () => ClientRect | undefined;
+    render(): JSX.Element;
+    addContentClassesToChildren: () => React.ReactElement<any>;
+    renderContent(): React.ReactElement<any>;
+}

index.tsx

+// The MIT License
+//
+// Copyright (c) 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.
+
+import * as React from 'react';
+import classnames from 'classnames';
+import {
+  MDCFadingTabIndicatorFoundation,
+  MDCSlidingTabIndicatorFoundation,
+// @ts-ignore no .d.ts file
+} from '@material/tab-indicator/dist/mdc.tabIndicator';
+
+export interface TabIndicatorProps extends React.HTMLAttributes<HTMLSpanElement> {
+  active?: boolean;
+  className?: string;
+  fade?: boolean;
+  icon?: boolean;
+  previousIndicatorClientRect?: ClientRect;
+}
+
+export default class TabIndicator extends React.Component<TabIndicatorProps, {}> {
+  private tabIndicatorElement: React.RefObject<HTMLSpanElement> = React.createRef();
+  foundation?: MDCFadingTabIndicatorFoundation | MDCSlidingTabIndicatorFoundation;
+
+  static defaultProps: Partial<TabIndicatorProps> = {
+    active: false,
+    className: '',
+    fade: false,
+    icon: false,
+  };
+
+  componentDidMount() {
+    if (this.props.fade) {
+      this.foundation = new MDCFadingTabIndicatorFoundation(this.adapter);
+    } else {
+      this.foundation = new MDCSlidingTabIndicatorFoundation(this.adapter);
+    }
+    this.foundation.init();
+    if (this.props.active) {
+      this.foundation.activate();
+    }
+  }
+
+  componentWillUnmount() {
+    this.foundation.destroy();
+  }
+
+  componentDidUpdate(prevProps: TabIndicatorProps) {
+    if (this.props.active !== prevProps.active) {
+      if (this.props.active) {
+        this.foundation.activate(this.props.previousIndicatorClientRect);
+      } else {
+        this.foundation.deactivate();
+      }
+    }
+  }
+
+  get classes() {
+    const {className, fade} = this.props;
+    return classnames('mdc-tab-indicator', className, {
+      'mdc-tab-indicator--fade': fade,
+    });
+  }
+
+  get contentClasses() {
+    const {icon} = this.props;
+    return classnames('mdc-tab-indicator__content', {
+      'mdc-tab-indicator__content--icon': icon,
+      'mdc-tab-indicator__content--underline': !icon,
+    });
+  }
+
+  get adapter() {
+    return {
+      addClass: (className: string) => {
+        if (!this.tabIndicatorElement.current) return;
+        // since the sliding indicator depends on the FLIP method,
+        // our regular pattern of managing classes does not work here.
+        // setState is async, which does not work well with the FLIP method
+        // without a requestAnimationFrame, which was done in this PR:
+        // https://github.com/material-components
+        // /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62
+        this.tabIndicatorElement.current.classList.add(className);
+        this.forceUpdate();
+      },
+      removeClass: (className: string) => {
+        if (!this.tabIndicatorElement.current) return;
+        this.tabIndicatorElement.current.classList.remove(className);
+        this.forceUpdate();
+      },
+      computeContentClientRect: this.computeContentClientRect,
+      // setContentStyleProperty was using setState, but due to the method's
+      // async nature, its not condusive to the FLIP technique
+      setContentStyleProperty: (prop: keyof CSSStyleDeclaration, value: string) => {
+        const contentElement = this.getNativeContentElement() as HTMLElement;
+        // length and parentRule are readonly properties of CSSStyleDeclaration that
+        // cannot be set
+        if (!contentElement || prop === 'length' || prop === 'parentRule') {
+          return;
+        }
+        // https://github.com/Microsoft/TypeScript/issues/11914
+        contentElement.style[prop] = value;
+      },
+    };
+  }
+
+  private getNativeContentElement = () => {
+    if (!this.tabIndicatorElement.current) return;
+    // need to use getElementsByClassName since tabIndicator could be
+    // a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements
+    // return the instance of the component.
+    return this.tabIndicatorElement.current.getElementsByClassName('mdc-tab-indicator__content')[0];
+  };
+
+  computeContentClientRect = () => {
+    const contentElement = this.getNativeContentElement();
+    if (!(contentElement && contentElement.getBoundingClientRect)) return;
+    return contentElement.getBoundingClientRect();
+  };
+
+  render() {
+    const {
+      /* eslint-disable */
+      active,
+      children,
+      className,
+      fade,
+      icon,
+      previousIndicatorClientRect,
+      /* eslint-enable */
+      ...otherProps
+    } = this.props;
+    return (
+      <span
+        className={this.classes}
+        ref={this.tabIndicatorElement}
+        {...otherProps}
+      >
+        {this.renderContent()}
+      </span>
+    );
+  }
+
+  addContentClassesToChildren = () => {
+    const child = React.Children.only(this.props.children);
+    const className = classnames(child.props.className, this.contentClasses);
+    const props = Object.assign({}, child.props, {className});
+    return React.cloneElement(child, props);
+  };
+
+  renderContent() {
+    if (this.props.children) {
+      return this.addContentClassesToChildren();
+    }
+    return <span className={this.contentClasses} />;
+  }
+}
+

dist/index.js

 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("react"), require("prop-types"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator"));
+		module.exports = factory(require("react"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator.js"));
 	else if(typeof define === 'function' && define.amd)
-		define(["react", "prop-types", "classnames", "@material/tab-indicator/dist/mdc.tabIndicator"], factory);
+		define(["react", "classnames", "@material/tab-indicator/dist/mdc.tabIndicator.js"], factory);
 	else {
-		var a = typeof exports === 'object' ? factory(require("react"), require("prop-types"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator")) : factory(root["react"], root["prop-types"], root["classnames"], root["@material/tab-indicator/dist/mdc.tabIndicator"]);
+		var a = typeof exports === 'object' ? factory(require("react"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator.js")) : factory(root["react"], root["classnames"], root["@material/tab-indicator/dist/mdc.tabIndicator.js"]);
 		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
 	}
-})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__) {
+})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_79__) {
 return /******/ (function(modules) { // webpackBootstrap
@@ -73,11 +73,27 @@ /******/ 	// The module cache
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ 	return __webpack_require__(__webpack_require__.s = 78);
 /******/ })
 /************************************************************************/
-/******/ ([
-/* 0 */
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
+
+/***/ }),
+
+/***/ 78:
 /***/ (function(module, exports, __webpack_require__) {
 
 "use strict";
-Object.defineProperty(exports,"__esModule",{value:true});var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}return function(Constructor,protoProps,staticProps){if(protoProps)defineProperties(Constructor.prototype,protoProps);if(staticProps)defineProperties(Constructor,staticProps);return Constructor;};}();var _react=__webpack_require__(1);var _react2=_interopRequireDefault(_react);var _propTypes=__webpack_require__(2);var _propTypes2=_interopRequireDefault(_propTypes);var _classnames=__webpack_require__(3);var _classnames2=_interopRequireDefault(_classnames);var _mdc=__webpack_require__(4);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function _objectWithoutProperties(obj,keys){var target={};for(var i in obj){if(keys.indexOf(i)>=0)continue;if(!Object.prototype.hasOwnProperty.call(obj,i))continue;target[i]=obj[i];}return target;}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call&&(typeof call==="object"||typeof call==="function")?call:self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass;}// The MIT License
+
+// The MIT License
 //
@@ -103,42 +119,188 @@ // Copyright (c) 2018 Google, Inc.
 // THE SOFTWARE.
-var TabIndicator=function(_Component){_inherits(TabIndicator,_Component);function TabIndicator(){var _ref;var _temp,_this,_ret;_classCallCheck(this,TabIndicator);for(var _len=arguments.length,args=Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return _ret=(_temp=(_this=_possibleConstructorReturn(this,(_ref=TabIndicator.__proto__||Object.getPrototypeOf(TabIndicator)).call.apply(_ref,[this].concat(args))),_this),_this.tabIndicatorElement_=_react2.default.createRef(),_this.getNativeContentElement=function(){if(!_this.tabIndicatorElement_.current)return;// need to use getElementsByClassName since tabIndicator could be
-// a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements
-// return the instance of the component.
-return _this.tabIndicatorElement_.current.getElementsByClassName('mdc-tab-indicator__content')[0];},_this.computeContentClientRect=function(){var contentElement=_this.getNativeContentElement();if(!(contentElement&&contentElement.getBoundingClientRect))return;return contentElement.getBoundingClientRect();},_this.addContentClassesToChildren=function(){var child=_react2.default.Children.only(_this.props.children);var className=(0,_classnames2.default)(child.props.className,_this.contentClasses);var props=Object.assign({},child.props,{className:className});return _react2.default.cloneElement(child,props);},_temp),_possibleConstructorReturn(_this,_ret);}_createClass(TabIndicator,[{key:'componentDidMount',value:function componentDidMount(){if(this.props.fade){this.foundation_=new _mdc.MDCFadingTabIndicatorFoundation(this.adapter);}else{this.foundation_=new _mdc.MDCSlidingTabIndicatorFoundation(this.adapter);}this.foundation_.init();if(this.props.active){this.foundation_.activate();}}},{key:'componentWillUnmount',value:function componentWillUnmount(){this.foundation_.destroy();}},{key:'componentDidUpdate',value:function componentDidUpdate(prevProps){if(this.props.active!==prevProps.active){if(this.props.active){this.foundation_.activate(this.props.previousIndicatorClientRect);}else{this.foundation_.deactivate();}}}},{key:'render',value:function render(){var _props=this.props,active=_props.active,children=_props.children,className=_props.className,fade=_props.fade,icon=_props.icon,previousIndicatorClientRect=_props.previousIndicatorClientRect,otherProps=_objectWithoutProperties(_props,['active','children','className','fade','icon','previousIndicatorClientRect']);return _react2.default.createElement('span',_extends({className:this.classes,ref:this.tabIndicatorElement_},otherProps),this.renderContent());}},{key:'renderContent',value:function renderContent(){if(this.props.children){return this.addContentClassesToChildren();}return _react2.default.createElement('span',{className:this.contentClasses});}},{key:'classes',get:function get(){var _props2=this.props,className=_props2.className,fade=_props2.fade;return(0,_classnames2.default)('mdc-tab-indicator',className,{'mdc-tab-indicator--fade':fade});}},{key:'contentClasses',get:function get(){var icon=this.props.icon;return(0,_classnames2.default)('mdc-tab-indicator__content',{'mdc-tab-indicator__content--icon':icon,'mdc-tab-indicator__content--underline':!icon});}},{key:'adapter',get:function get(){var _this2=this;return{addClass:function addClass(className){if(!_this2.tabIndicatorElement_.current)return;// since the sliding indicator depends on the FLIP method,
-// our regular pattern of managing classes does not work here.
-// setState is async, which does not work well with the FLIP method
-// without a requestAnimationFrame, which was done in this PR:
-// https://github.com/material-components
-// /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62
-_this2.tabIndicatorElement_.current.classList.add(className);_this2.forceUpdate();},removeClass:function removeClass(className){if(!_this2.tabIndicatorElement_.current)return;_this2.tabIndicatorElement_.current.classList.remove(className);_this2.forceUpdate();},computeContentClientRect:this.computeContentClientRect,// setContentStyleProperty was using setState, but due to the method's
-// async nature, its not condusive to the FLIP technique
-setContentStyleProperty:function setContentStyleProperty(prop,value){var contentElement=_this2.getNativeContentElement();if(!contentElement)return;contentElement.style[prop]=value;}};}}]);return TabIndicator;}(_react.Component);exports.default=TabIndicator;TabIndicator.propTypes={active:_propTypes2.default.bool,className:_propTypes2.default.string,children:_propTypes2.default.element,fade:_propTypes2.default.bool,icon:_propTypes2.default.bool,previousIndicatorClientRect:_propTypes2.default.object};TabIndicator.defaultProps={active:false,className:'',children:null,fade:false,icon:false,previousIndicatorClientRect:{}};
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
+            t[p[i]] = s[p[i]];
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var React = __webpack_require__(0);
+var classnames_1 = __webpack_require__(1);
+var mdc_tabIndicator_1 = __webpack_require__(79);
+var TabIndicator = /** @class */ (function (_super) {
+    __extends(TabIndicator, _super);
+    function TabIndicator() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.tabIndicatorElement = React.createRef();
+        _this.getNativeContentElement = function () {
+            if (!_this.tabIndicatorElement.current)
+                return;
+            // need to use getElementsByClassName since tabIndicator could be
+            // a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements
+            // return the instance of the component.
+            return _this.tabIndicatorElement.current.getElementsByClassName('mdc-tab-indicator__content')[0];
+        };
+        _this.computeContentClientRect = function () {
+            var contentElement = _this.getNativeContentElement();
+            if (!(contentElement && contentElement.getBoundingClientRect))
+                return;
+            return contentElement.getBoundingClientRect();
+        };
+        _this.addContentClassesToChildren = function () {
+            var child = React.Children.only(_this.props.children);
+            var className = classnames_1.default(child.props.className, _this.contentClasses);
+            var props = Object.assign({}, child.props, { className: className });
+            return React.cloneElement(child, props);
+        };
+        return _this;
+    }
+    TabIndicator.prototype.componentDidMount = function () {
+        if (this.props.fade) {
+            this.foundation = new mdc_tabIndicator_1.MDCFadingTabIndicatorFoundation(this.adapter);
+        }
+        else {
+            this.foundation = new mdc_tabIndicator_1.MDCSlidingTabIndicatorFoundation(this.adapter);
+        }
+        this.foundation.init();
+        if (this.props.active) {
+            this.foundation.activate();
+        }
+    };
+    TabIndicator.prototype.componentWillUnmount = function () {
+        this.foundation.destroy();
+    };
+    TabIndicator.prototype.componentDidUpdate = function (prevProps) {
+        if (this.props.active !== prevProps.active) {
+            if (this.props.active) {
+                this.foundation.activate(this.props.previousIndicatorClientRect);
+            }
+            else {
+                this.foundation.deactivate();
+            }
+        }
+    };
+    Object.defineProperty(TabIndicator.prototype, "classes", {
+        get: function () {
+            var _a = this.props, className = _a.className, fade = _a.fade;
+            return classnames_1.default('mdc-tab-indicator', className, {
+                'mdc-tab-indicator--fade': fade,
+            });
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(TabIndicator.prototype, "contentClasses", {
+        get: function () {
+            var icon = this.props.icon;
+            return classnames_1.default('mdc-tab-indicator__content', {
+                'mdc-tab-indicator__content--icon': icon,
+                'mdc-tab-indicator__content--underline': !icon,
+            });
+        },
+        enumerable: true,
+        configurable: true
+    });
+    Object.defineProperty(TabIndicator.prototype, "adapter", {
+        get: function () {
+            var _this = this;
+            return {
+                addClass: function (className) {
+                    if (!_this.tabIndicatorElement.current)
+                        return;
+                    // since the sliding indicator depends on the FLIP method,
+                    // our regular pattern of managing classes does not work here.
+                    // setState is async, which does not work well with the FLIP method
+                    // without a requestAnimationFrame, which was done in this PR:
+                    // https://github.com/material-components
+                    // /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62
+                    _this.tabIndicatorElement.current.classList.add(className);
+                    _this.forceUpdate();
+                },
+                removeClass: function (className) {
+                    if (!_this.tabIndicatorElement.current)
+                        return;
+                    _this.tabIndicatorElement.current.classList.remove(className);
+                    _this.forceUpdate();
+                },
+                computeContentClientRect: this.computeContentClientRect,
+                // setContentStyleProperty was using setState, but due to the method's
+                // async nature, its not condusive to the FLIP technique
+                setContentStyleProperty: function (prop, value) {
+                    var contentElement = _this.getNativeContentElement();
+                    // length and parentRule are readonly properties of CSSStyleDeclaration that
+                    // cannot be set
+                    if (!contentElement || prop === 'length' || prop === 'parentRule') {
+                        return;
+                    }
+                    // https://github.com/Microsoft/TypeScript/issues/11914
+                    contentElement.style[prop] = value;
+                },
+            };
+        },
+        enumerable: true,
+        configurable: true
+    });
+    TabIndicator.prototype.render = function () {
+        var _a = this.props, 
+        /* eslint-disable */
+        active = _a.active, children = _a.children, className = _a.className, fade = _a.fade, icon = _a.icon, previousIndicatorClientRect = _a.previousIndicatorClientRect, 
+        /* eslint-enable */
+        otherProps = __rest(_a, ["active", "children", "className", "fade", "icon", "previousIndicatorClientRect"]);
+        return (React.createElement("span", __assign({ className: this.classes, ref: this.tabIndicatorElement }, otherProps), this.renderContent()));
+    };
+    TabIndicator.prototype.renderContent = function () {
+        if (this.props.children) {
+            return this.addContentClassesToChildren();
+        }
+        return React.createElement("span", { className: this.contentClasses });
+    };
+    TabIndicator.defaultProps = {
+        active: false,
+        className: '',
+        fade: false,
+        icon: false,
+    };
+    return TabIndicator;
+}(React.Component));
+exports.default = TabIndicator;
 
-/***/ }),
-/* 1 */
-/***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
-
 /***/ }),
-/* 2 */
-/***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_2__;
-
-/***/ }),
-/* 3 */
+/***/ 79:
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_79__;
 
-/***/ }),
-/* 4 */
-/***/ (function(module, exports) {
+/***/ })
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_4__;
-
-/***/ })
-/******/ ]);
+/******/ });
 });
 //# sourceMappingURL=tab-indicator.js.map

dist/index.js.map

@@ -1,1 +0,1 @@
-{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap 3a7b787e2bcef67be6d0","webpack:///./packages/tab-indicator/index.js","webpack:///external \"react\"","webpack:///external \"prop-types\"","webpack:///external \"classnames\"","webpack:///external \"@material/tab-indicator/dist/mdc.tabIndicator\""],"names":["TabIndicator","tabIndicatorElement_","createRef","getNativeContentElement","current","getElementsByClassName","computeContentClientRect","contentElement","getBoundingClientRect","addContentClassesToChildren","child","Children","only","props","children","className","contentClasses","Object","assign","cloneElement","fade","foundation_","adapter","init","active","activate","destroy","prevProps","previousIndicatorClientRect","deactivate","icon","otherProps","classes","renderContent","addClass","classList","add","forceUpdate","removeClass","remove","setContentStyleProperty","prop","value","style","propTypes","bool","string","element","object","defaultProps"],"mappings":"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","file":"tab-indicator.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"), require(\"prop-types\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\", \"prop-types\", \"classnames\", \"@material/tab-indicator/dist/mdc.tabIndicator\"], factory);\n\telse {\n\t\tvar a = typeof exports === 'object' ? factory(require(\"react\"), require(\"prop-types\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator\")) : factory(root[\"react\"], root[\"prop-types\"], root[\"classnames\"], root[\"@material/tab-indicator/dist/mdc.tabIndicator\"]);\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__) {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 3a7b787e2bcef67be6d0","// The MIT License\n//\n// Copyright (c) 2018 Google, Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\nimport React, {Component} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\n\nimport {\n  MDCFadingTabIndicatorFoundation,\n  MDCSlidingTabIndicatorFoundation,\n} from '@material/tab-indicator/dist/mdc.tabIndicator';\n\nexport default class TabIndicator extends Component {\n  tabIndicatorElement_ = React.createRef();\n\n  componentDidMount() {\n    if (this.props.fade) {\n      this.foundation_ = new MDCFadingTabIndicatorFoundation(this.adapter);\n    } else {\n      this.foundation_ = new MDCSlidingTabIndicatorFoundation(this.adapter);\n    }\n    this.foundation_.init();\n\n    if (this.props.active) {\n      this.foundation_.activate();\n    }\n  }\n\n  componentWillUnmount() {\n    this.foundation_.destroy();\n  }\n\n  componentDidUpdate(prevProps) {\n    if (this.props.active !== prevProps.active) {\n      if (this.props.active) {\n        this.foundation_.activate(this.props.previousIndicatorClientRect);\n      } else {\n        this.foundation_.deactivate();\n      }\n    }\n  }\n\n  get classes() {\n    const {className, fade} = this.props;\n    return classnames('mdc-tab-indicator', className, {\n      'mdc-tab-indicator--fade': fade,\n    });\n  }\n\n  get contentClasses() {\n    const {icon} = this.props;\n    return classnames('mdc-tab-indicator__content', {\n      'mdc-tab-indicator__content--icon': icon,\n      'mdc-tab-indicator__content--underline': !icon,\n    });\n  }\n\n  get adapter() {\n    return {\n      addClass: (className) => {\n        if (!this.tabIndicatorElement_.current) return;\n        // since the sliding indicator depends on the FLIP method,\n        // our regular pattern of managing classes does not work here.\n        // setState is async, which does not work well with the FLIP method\n        // without a requestAnimationFrame, which was done in this PR:\n        // https://github.com/material-components\n        // /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62\n        this.tabIndicatorElement_.current.classList.add(className);\n        this.forceUpdate();\n      },\n      removeClass: (className) => {\n        if (!this.tabIndicatorElement_.current) return;\n        this.tabIndicatorElement_.current.classList.remove(className);\n        this.forceUpdate();\n      },\n      computeContentClientRect: this.computeContentClientRect,\n      // setContentStyleProperty was using setState, but due to the method's\n      // async nature, its not condusive to the FLIP technique\n      setContentStyleProperty: (prop, value) => {\n        const contentElement = this.getNativeContentElement();\n        if (!contentElement) return;\n        contentElement.style[prop] = value;\n      },\n    };\n  }\n\n  getNativeContentElement = () => {\n    if (!this.tabIndicatorElement_.current) return;\n    // need to use getElementsByClassName since tabIndicator could be\n    // a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements\n    // return the instance of the component.\n    return this.tabIndicatorElement_.current.getElementsByClassName('mdc-tab-indicator__content')[0];\n  }\n\n  computeContentClientRect = () => {\n    const contentElement = this.getNativeContentElement();\n    if (!(contentElement && contentElement.getBoundingClientRect)) return;\n    return contentElement.getBoundingClientRect();\n  }\n\n  render() {\n    const {\n      /* eslint-disable */\n      active,\n      children,\n      className,\n      fade,\n      icon,\n      previousIndicatorClientRect,\n      /* eslint-enable */\n      ...otherProps\n    } = this.props;\n\n    return (\n      <span\n        className={this.classes}\n        ref={this.tabIndicatorElement_}\n        {...otherProps}\n      >\n        {this.renderContent()}\n      </span>\n    );\n  }\n\n  addContentClassesToChildren = () => {\n    const child = React.Children.only(this.props.children);\n    const className = classnames(child.props.className, this.contentClasses);\n    const props = Object.assign({}, child.props, {className});\n    return React.cloneElement(child, props);\n  };\n\n  renderContent() {\n    if (this.props.children) {\n      return this.addContentClassesToChildren();\n    }\n    return (\n      <span className={this.contentClasses} />\n    );\n  }\n}\n\nTabIndicator.propTypes = {\n  active: PropTypes.bool,\n  className: PropTypes.string,\n  children: PropTypes.element,\n  fade: PropTypes.bool,\n  icon: PropTypes.bool,\n  previousIndicatorClientRect: PropTypes.object,\n};\n\nTabIndicator.defaultProps = {\n  active: false,\n  className: '',\n  children: null,\n  fade: false,\n  icon: false,\n  previousIndicatorClientRect: {},\n};\n\n\n\n// WEBPACK FOOTER //\n// ./packages/tab-indicator/index.js","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"react\"\n// module id = 1\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_2__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"prop-types\"\n// module id = 2\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_3__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"classnames\"\n// module id = 3\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_4__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"@material/tab-indicator/dist/mdc.tabIndicator\"\n// module id = 4\n// module chunks = 0"],"sourceRoot":""}
+{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap c6469eb6ef29265ede51","webpack:///external \"react\"","webpack:///external \"classnames\"","webpack:///./packages/tab-indicator/index.tsx","webpack:///external \"@material/tab-indicator/dist/mdc.tabIndicator.js\""],"names":[],"mappings":"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","file":"tab-indicator.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator.js\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\", \"classnames\", \"@material/tab-indicator/dist/mdc.tabIndicator.js\"], factory);\n\telse {\n\t\tvar a = typeof exports === 'object' ? factory(require(\"react\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator.js\")) : factory(root[\"react\"], root[\"classnames\"], root[\"@material/tab-indicator/dist/mdc.tabIndicator.js\"]);\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_79__) {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 78);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap c6469eb6ef29265ede51","module.exports = __WEBPACK_EXTERNAL_MODULE_0__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"react\"\n// module id = 0\n// module chunks = 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"classnames\"\n// module id = 1\n// module chunks = 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51","// The MIT License\n//\n// Copyright (c) 2018 Google, Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\nimport * as React from 'react';\nimport classnames from 'classnames';\nimport {\n  MDCFadingTabIndicatorFoundation,\n  MDCSlidingTabIndicatorFoundation,\n// @ts-ignore no .d.ts file\n} from '@material/tab-indicator/dist/mdc.tabIndicator';\n\nexport interface TabIndicatorProps extends React.HTMLAttributes<HTMLSpanElement> {\n  active?: boolean;\n  className?: string;\n  fade?: boolean;\n  icon?: boolean;\n  previousIndicatorClientRect?: ClientRect;\n}\n\nexport default class TabIndicator extends React.Component<TabIndicatorProps, {}> {\n  private tabIndicatorElement: React.RefObject<HTMLSpanElement> = React.createRef();\n  foundation?: MDCFadingTabIndicatorFoundation | MDCSlidingTabIndicatorFoundation;\n\n  static defaultProps: Partial<TabIndicatorProps> = {\n    active: false,\n    className: '',\n    fade: false,\n    icon: false,\n  };\n\n  componentDidMount() {\n    if (this.props.fade) {\n      this.foundation = new MDCFadingTabIndicatorFoundation(this.adapter);\n    } else {\n      this.foundation = new MDCSlidingTabIndicatorFoundation(this.adapter);\n    }\n    this.foundation.init();\n    if (this.props.active) {\n      this.foundation.activate();\n    }\n  }\n\n  componentWillUnmount() {\n    this.foundation.destroy();\n  }\n\n  componentDidUpdate(prevProps: TabIndicatorProps) {\n    if (this.props.active !== prevProps.active) {\n      if (this.props.active) {\n        this.foundation.activate(this.props.previousIndicatorClientRect);\n      } else {\n        this.foundation.deactivate();\n      }\n    }\n  }\n\n  get classes() {\n    const {className, fade} = this.props;\n    return classnames('mdc-tab-indicator', className, {\n      'mdc-tab-indicator--fade': fade,\n    });\n  }\n\n  get contentClasses() {\n    const {icon} = this.props;\n    return classnames('mdc-tab-indicator__content', {\n      'mdc-tab-indicator__content--icon': icon,\n      'mdc-tab-indicator__content--underline': !icon,\n    });\n  }\n\n  get adapter() {\n    return {\n      addClass: (className: string) => {\n        if (!this.tabIndicatorElement.current) return;\n        // since the sliding indicator depends on the FLIP method,\n        // our regular pattern of managing classes does not work here.\n        // setState is async, which does not work well with the FLIP method\n        // without a requestAnimationFrame, which was done in this PR:\n        // https://github.com/material-components\n        // /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62\n        this.tabIndicatorElement.current.classList.add(className);\n        this.forceUpdate();\n      },\n      removeClass: (className: string) => {\n        if (!this.tabIndicatorElement.current) return;\n        this.tabIndicatorElement.current.classList.remove(className);\n        this.forceUpdate();\n      },\n      computeContentClientRect: this.computeContentClientRect,\n      // setContentStyleProperty was using setState, but due to the method's\n      // async nature, its not condusive to the FLIP technique\n      setContentStyleProperty: (prop: keyof CSSStyleDeclaration, value: string) => {\n        const contentElement = this.getNativeContentElement() as HTMLElement;\n        // length and parentRule are readonly properties of CSSStyleDeclaration that\n        // cannot be set\n        if (!contentElement || prop === 'length' || prop === 'parentRule') {\n          return;\n        }\n        // https://github.com/Microsoft/TypeScript/issues/11914\n        contentElement.style[prop] = value;\n      },\n    };\n  }\n\n  private getNativeContentElement = () => {\n    if (!this.tabIndicatorElement.current) return;\n    // need to use getElementsByClassName since tabIndicator could be\n    // a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements\n    // return the instance of the component.\n    return this.tabIndicatorElement.current.getElementsByClassName('mdc-tab-indicator__content')[0];\n  };\n\n  computeContentClientRect = () => {\n    const contentElement = this.getNativeContentElement();\n    if (!(contentElement && contentElement.getBoundingClientRect)) return;\n    return contentElement.getBoundingClientRect();\n  };\n\n  render() {\n    const {\n      /* eslint-disable */\n      active,\n      children,\n      className,\n      fade,\n      icon,\n      previousIndicatorClientRect,\n      /* eslint-enable */\n      ...otherProps\n    } = this.props;\n    return (\n      <span\n        className={this.classes}\n        ref={this.tabIndicatorElement}\n        {...otherProps}\n      >\n        {this.renderContent()}\n      </span>\n    );\n  }\n\n  addContentClassesToChildren = () => {\n    const child = React.Children.only(this.props.children);\n    const className = classnames(child.props.className, this.contentClasses);\n    const props = Object.assign({}, child.props, {className});\n    return React.cloneElement(child, props);\n  };\n\n  renderContent() {\n    if (this.props.children) {\n      return this.addContentClassesToChildren();\n    }\n    return <span className={this.contentClasses} />;\n  }\n}\n\n\n\n\n// WEBPACK FOOTER //\n// ./packages/tab-indicator/index.tsx","module.exports = __WEBPACK_EXTERNAL_MODULE_79__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"@material/tab-indicator/dist/mdc.tabIndicator.js\"\n// module id = 79\n// module chunks = 32 33"],"sourceRoot":""}

dist/index.min.js

@@ -1,1 +0,1 @@
-!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("react"),require("prop-types"),require("classnames"),require("@material/tab-indicator/dist/mdc.tabIndicator"));else if("function"==typeof define&&define.amd)define(["react","prop-types","classnames","@material/tab-indicator/dist/mdc.tabIndicator"],e);else{var n="object"==typeof exports?e(require("react"),require("prop-types"),require("classnames"),require("@material/tab-indicator/dist/mdc.tabIndicator")):e(t.react,t["prop-types"],t.classnames,t["@material/tab-indicator/dist/mdc.tabIndicator"]);for(var r in n)("object"==typeof exports?exports:t)[r]=n[r]}}("undefined"!=typeof self?self:this,function(t,e,n,r){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=0)}([function(t,e,n){"use strict";function r(t){return t&&t.__esModule?t:{default:t}}function o(t,e){var n={};for(var r in t)e.indexOf(r)>=0||Object.prototype.hasOwnProperty.call(t,r)&&(n[r]=t[r]);return n}function a(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function i(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function c(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}Object.defineProperty(e,"__esModule",{value:!0});var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},u=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),l=n(1),d=r(l),f=n(2),p=r(f),m=n(3),b=r(m),h=n(4),v=function(t){function e(){var t,n,r,o;a(this,e);for(var c=arguments.length,s=Array(c),u=0;u<c;u++)s[u]=arguments[u];return n=r=i(this,(t=e.__proto__||Object.getPrototypeOf(e)).call.apply(t,[this].concat(s))),r.tabIndicatorElement_=d.default.createRef(),r.getNativeContentElement=function(){if(r.tabIndicatorElement_.current)return r.tabIndicatorElement_.current.getElementsByClassName("mdc-tab-indicator__content")[0]},r.computeContentClientRect=function(){var t=r.getNativeContentElement();if(t&&t.getBoundingClientRect)return t.getBoundingClientRect()},r.addContentClassesToChildren=function(){var t=d.default.Children.only(r.props.children),e=(0,b.default)(t.props.className,r.contentClasses),n=Object.assign({},t.props,{className:e});return d.default.cloneElement(t,n)},o=n,i(r,o)}return c(e,t),u(e,[{key:"componentDidMount",value:function(){this.props.fade?this.foundation_=new h.MDCFadingTabIndicatorFoundation(this.adapter):this.foundation_=new h.MDCSlidingTabIndicatorFoundation(this.adapter),this.foundation_.init(),this.props.active&&this.foundation_.activate()}},{key:"componentWillUnmount",value:function(){this.foundation_.destroy()}},{key:"componentDidUpdate",value:function(t){this.props.active!==t.active&&(this.props.active?this.foundation_.activate(this.props.previousIndicatorClientRect):this.foundation_.deactivate())}},{key:"render",value:function(){var t=this.props,e=(t.active,t.children,t.className,t.fade,t.icon,t.previousIndicatorClientRect,o(t,["active","children","className","fade","icon","previousIndicatorClientRect"]));return d.default.createElement("span",s({className:this.classes,ref:this.tabIndicatorElement_},e),this.renderContent())}},{key:"renderContent",value:function(){return this.props.children?this.addContentClassesToChildren():d.default.createElement("span",{className:this.contentClasses})}},{key:"classes",get:function(){var t=this.props,e=t.className,n=t.fade;return(0,b.default)("mdc-tab-indicator",e,{"mdc-tab-indicator--fade":n})}},{key:"contentClasses",get:function(){var t=this.props.icon;return(0,b.default)("mdc-tab-indicator__content",{"mdc-tab-indicator__content--icon":t,"mdc-tab-indicator__content--underline":!t})}},{key:"adapter",get:function(){var t=this;return{addClass:function(e){t.tabIndicatorElement_.current&&(t.tabIndicatorElement_.current.classList.add(e),t.forceUpdate())},removeClass:function(e){t.tabIndicatorElement_.current&&(t.tabIndicatorElement_.current.classList.remove(e),t.forceUpdate())},computeContentClientRect:this.computeContentClientRect,setContentStyleProperty:function(e,n){var r=t.getNativeContentElement();r&&(r.style[e]=n)}}}}]),e}(l.Component);e.default=v,v.propTypes={active:p.default.bool,className:p.default.string,children:p.default.element,fade:p.default.bool,icon:p.default.bool,previousIndicatorClientRect:p.default.object},v.defaultProps={active:!1,className:"",children:null,fade:!1,icon:!1,previousIndicatorClientRect:{}}},function(e,n){e.exports=t},function(t,n){t.exports=e},function(t,e){t.exports=n},function(t,e){t.exports=r}])});
+!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e(require("react"),require("classnames"),require("@material/tab-indicator/dist/mdc.tabIndicator.js"));else if("function"==typeof define&&define.amd)define(["react","classnames","@material/tab-indicator/dist/mdc.tabIndicator.js"],e);else{var n="object"==typeof exports?e(require("react"),require("classnames"),require("@material/tab-indicator/dist/mdc.tabIndicator.js")):e(t.react,t.classnames,t["@material/tab-indicator/dist/mdc.tabIndicator.js"]);for(var r in n)("object"==typeof exports?exports:t)[r]=n[r]}}("undefined"!=typeof self?self:this,function(t,e,n){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=78)}({0:function(e,n){e.exports=t},1:function(t,n){t.exports=e},78:function(t,e,n){"use strict";var r=this&&this.__extends||function(){var t=function(e,n){return(t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(e,n)};return function(e,n){function r(){this.constructor=e}t(e,n),e.prototype=null===n?Object.create(n):(r.prototype=n.prototype,new r)}}(),o=this&&this.__assign||function(){return o=Object.assign||function(t){for(var e,n=1,r=arguments.length;n<r;n++){e=arguments[n];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},o.apply(this,arguments)},i=this&&this.__rest||function(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(n[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols)for(var o=0,r=Object.getOwnPropertySymbols(t);o<r.length;o++)e.indexOf(r[o])<0&&(n[r[o]]=t[r[o]]);return n};Object.defineProperty(e,"__esModule",{value:!0});var a=n(0),c=n(1),s=n(79),u=function(t){function e(){var e=null!==t&&t.apply(this,arguments)||this;return e.tabIndicatorElement=a.createRef(),e.getNativeContentElement=function(){if(e.tabIndicatorElement.current)return e.tabIndicatorElement.current.getElementsByClassName("mdc-tab-indicator__content")[0]},e.computeContentClientRect=function(){var t=e.getNativeContentElement();if(t&&t.getBoundingClientRect)return t.getBoundingClientRect()},e.addContentClassesToChildren=function(){var t=a.Children.only(e.props.children),n=c.default(t.props.className,e.contentClasses),r=Object.assign({},t.props,{className:n});return a.cloneElement(t,r)},e}return r(e,t),e.prototype.componentDidMount=function(){this.props.fade?this.foundation=new s.MDCFadingTabIndicatorFoundation(this.adapter):this.foundation=new s.MDCSlidingTabIndicatorFoundation(this.adapter),this.foundation.init(),this.props.active&&this.foundation.activate()},e.prototype.componentWillUnmount=function(){this.foundation.destroy()},e.prototype.componentDidUpdate=function(t){this.props.active!==t.active&&(this.props.active?this.foundation.activate(this.props.previousIndicatorClientRect):this.foundation.deactivate())},Object.defineProperty(e.prototype,"classes",{get:function(){var t=this.props,e=t.className,n=t.fade;return c.default("mdc-tab-indicator",e,{"mdc-tab-indicator--fade":n})},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"contentClasses",{get:function(){var t=this.props.icon;return c.default("mdc-tab-indicator__content",{"mdc-tab-indicator__content--icon":t,"mdc-tab-indicator__content--underline":!t})},enumerable:!0,configurable:!0}),Object.defineProperty(e.prototype,"adapter",{get:function(){var t=this;return{addClass:function(e){t.tabIndicatorElement.current&&(t.tabIndicatorElement.current.classList.add(e),t.forceUpdate())},removeClass:function(e){t.tabIndicatorElement.current&&(t.tabIndicatorElement.current.classList.remove(e),t.forceUpdate())},computeContentClientRect:this.computeContentClientRect,setContentStyleProperty:function(e,n){var r=t.getNativeContentElement();r&&"length"!==e&&"parentRule"!==e&&(r.style[e]=n)}}},enumerable:!0,configurable:!0}),e.prototype.render=function(){var t=this.props,e=(t.active,t.children,t.className,t.fade,t.icon,t.previousIndicatorClientRect,i(t,["active","children","className","fade","icon","previousIndicatorClientRect"]));return a.createElement("span",o({className:this.classes,ref:this.tabIndicatorElement},e),this.renderContent())},e.prototype.renderContent=function(){return this.props.children?this.addContentClassesToChildren():a.createElement("span",{className:this.contentClasses})},e.defaultProps={active:!1,className:"",fade:!1,icon:!1},e}(a.Component);e.default=u},79:function(t,e){t.exports=n}})});

dist/tab-indicator.css.js

@@ -73,7 +73,8 @@ (function webpackUniversalModuleDefinition(root, factory) {
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ 	return __webpack_require__(__webpack_require__.s = 21);
 /******/ })
 /************************************************************************/
-/******/ ([
-/* 0 */
+/******/ ({
+
+/***/ 21:
 /***/ (function(module, exports) {
@@ -84,4 +85,5 @@
 /***/ })
-/******/ ]);
+
+/******/ });
 });
 //# sourceMappingURL=tab-indicator.css.js.map

dist/tab-indicator.css.js.map

@@ -1,1 +0,1 @@
-{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap cfca4bad4210457bf8cd","webpack:///./packages/tab-indicator/index.scss"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,O;ACVA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;AC7DA,yC","file":"tab-indicator.css.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse {\n\t\tvar a = factory();\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function() {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap cfca4bad4210457bf8cd","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./packages/tab-indicator/index.scss\n// module id = 0\n// module chunks = 0"],"sourceRoot":""}
+{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap cca8de0efbedd11a8870","webpack:///./packages/tab-indicator/index.scss"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,O;ACVA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;;AC7DA,yC","file":"tab-indicator.css.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse {\n\t\tvar a = factory();\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function() {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 21);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap cca8de0efbedd11a8870","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./packages/tab-indicator/index.scss\n// module id = 21\n// module chunks = 5"],"sourceRoot":""}

dist/tab-indicator.min.css.js

@@ -73,7 +73,8 @@ (function webpackUniversalModuleDefinition(root, factory) {
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 0);
+/******/ 	return __webpack_require__(__webpack_require__.s = 21);
 /******/ })
 /************************************************************************/
-/******/ ([
-/* 0 */
+/******/ ({
+
+/***/ 21:
 /***/ (function(module, exports) {
@@ -84,4 +85,5 @@
 /***/ })
-/******/ ]);
+
+/******/ });
 });
 //# sourceMappingURL=tab-indicator.min.css.js.map

dist/tab-indicator.min.css.js.map

@@ -1,1 +0,1 @@
-{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap 9a6f30fe58b96e47dac2","webpack:///./packages/tab-indicator/index.scss"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,O;ACVA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;AC7DA,yC","file":"tab-indicator.min.css.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse {\n\t\tvar a = factory();\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function() {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 9a6f30fe58b96e47dac2","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./packages/tab-indicator/index.scss\n// module id = 0\n// module chunks = 0"],"sourceRoot":""}
+{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap 0a9b7fac14f446630116","webpack:///./packages/tab-indicator/index.scss"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AACD,O;ACVA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;;;AAGA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAK;AACL;AACA;;AAEA;AACA;AACA;AACA,mCAA2B,0BAA0B,EAAE;AACvD,yCAAiC,eAAe;AAChD;AACA;AACA;;AAEA;AACA,8DAAsD,+DAA+D;;AAErH;AACA;;AAEA;AACA;;;;;;;;AC7DA,yC","file":"tab-indicator.min.css.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory();\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([], factory);\n\telse {\n\t\tvar a = factory();\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function() {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 21);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 0a9b7fac14f446630116","// removed by extract-text-webpack-plugin\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./packages/tab-indicator/index.scss\n// module id = 21\n// module chunks = 5"],"sourceRoot":""}

package.json

 {
   "name": "@material/react-tab-indicator",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "Material Components React Tab Indicator",
   "license": "MIT",
   "main": "dist/index.js",
+  "types": "dist/index.d.ts",
   "keywords": [
@@ -22,3 +23,2 @@ "mdc web react",
     "classnames": "^2.2.5",
-    "prop-types": "^15.6.1",
     "react": "^16.4.2"
@@ -25,0 +25,0 @@ },

dist/tab-indicator.es.js

-(function webpackUniversalModuleDefinition(root, factory) {
-	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("react"), require("prop-types"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator"));
-	else if(typeof define === 'function' && define.amd)
-		define(["react", "prop-types", "classnames", "@material/tab-indicator/dist/mdc.tabIndicator"], factory);
-	else {
-		var a = typeof exports === 'object' ? factory(require("react"), require("prop-types"), require("classnames"), require("@material/tab-indicator/dist/mdc.tabIndicator")) : factory(root["react"], root["prop-types"], root["classnames"], root["@material/tab-indicator/dist/mdc.tabIndicator"]);
-		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
-	}
-})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__) {
-return /******/ (function(modules) { // webpackBootstrap
-/******/ 	// The module cache
-/******/ 	var installedModules = {};
-/******/
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/
-/******/ 		// Check if module is in cache
-/******/ 		if(installedModules[moduleId]) {
-/******/ 			return installedModules[moduleId].exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = installedModules[moduleId] = {
-/******/ 			i: moduleId,
-/******/ 			l: false,
-/******/ 			exports: {}
-/******/ 		};
-/******/
-/******/ 		// Execute the module function
-/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
-/******/
-/******/ 		// Flag the module as loaded
-/******/ 		module.l = true;
-/******/
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/
-/******/
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = modules;
-/******/
-/******/ 	// expose the module cache
-/******/ 	__webpack_require__.c = installedModules;
-/******/
-/******/ 	// define getter function for harmony exports
-/******/ 	__webpack_require__.d = function(exports, name, getter) {
-/******/ 		if(!__webpack_require__.o(exports, name)) {
-/******/ 			Object.defineProperty(exports, name, {
-/******/ 				configurable: false,
-/******/ 				enumerable: true,
-/******/ 				get: getter
-/******/ 			});
-/******/ 		}
-/******/ 	};
-/******/
-/******/ 	// getDefaultExport function for compatibility with non-harmony modules
-/******/ 	__webpack_require__.n = function(module) {
-/******/ 		var getter = module && module.__esModule ?
-/******/ 			function getDefault() { return module['default']; } :
-/******/ 			function getModuleExports() { return module; };
-/******/ 		__webpack_require__.d(getter, 'a', getter);
-/******/ 		return getter;
-/******/ 	};
-/******/
-/******/ 	// Object.prototype.hasOwnProperty.call
-/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
-/******/
-/******/ 	// __webpack_public_path__
-/******/ 	__webpack_require__.p = "";
-/******/
-/******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 0);
-/******/ })
-/************************************************************************/
-/******/ ([
-/* 0 */
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react__ = __webpack_require__(1);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0_react___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_0_react__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types__ = __webpack_require__(2);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_prop_types___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_1_prop_types__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_classnames__ = __webpack_require__(3);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_classnames___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_2_classnames__);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_tab_indicator_dist_mdc_tabIndicator__ = __webpack_require__(4);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__material_tab_indicator_dist_mdc_tabIndicator___default = __webpack_require__.n(__WEBPACK_IMPORTED_MODULE_3__material_tab_indicator_dist_mdc_tabIndicator__);
-var _extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}return function(Constructor,protoProps,staticProps){if(protoProps)defineProperties(Constructor.prototype,protoProps);if(staticProps)defineProperties(Constructor,staticProps);return Constructor;};}();function _objectWithoutProperties(obj,keys){var target={};for(var i in obj){if(keys.indexOf(i)>=0)continue;if(!Object.prototype.hasOwnProperty.call(obj,i))continue;target[i]=obj[i];}return target;}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call&&(typeof call==="object"||typeof call==="function")?call:self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass;}// The MIT License
-//
-// Copyright (c) 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 TabIndicator=function(_Component){_inherits(TabIndicator,_Component);function TabIndicator(){var _ref;var _temp,_this,_ret;_classCallCheck(this,TabIndicator);for(var _len=arguments.length,args=Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return _ret=(_temp=(_this=_possibleConstructorReturn(this,(_ref=TabIndicator.__proto__||Object.getPrototypeOf(TabIndicator)).call.apply(_ref,[this].concat(args))),_this),_this.tabIndicatorElement_=__WEBPACK_IMPORTED_MODULE_0_react___default.a.createRef(),_this.getNativeContentElement=function(){if(!_this.tabIndicatorElement_.current)return;// need to use getElementsByClassName since tabIndicator could be
-// a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements
-// return the instance of the component.
-return _this.tabIndicatorElement_.current.getElementsByClassName('mdc-tab-indicator__content')[0];},_this.computeContentClientRect=function(){var contentElement=_this.getNativeContentElement();if(!(contentElement&&contentElement.getBoundingClientRect))return;return contentElement.getBoundingClientRect();},_this.addContentClassesToChildren=function(){var child=__WEBPACK_IMPORTED_MODULE_0_react___default.a.Children.only(_this.props.children);var className=__WEBPACK_IMPORTED_MODULE_2_classnames___default()(child.props.className,_this.contentClasses);var props=Object.assign({},child.props,{className:className});return __WEBPACK_IMPORTED_MODULE_0_react___default.a.cloneElement(child,props);},_temp),_possibleConstructorReturn(_this,_ret);}_createClass(TabIndicator,[{key:'componentDidMount',value:function componentDidMount(){if(this.props.fade){this.foundation_=new __WEBPACK_IMPORTED_MODULE_3__material_tab_indicator_dist_mdc_tabIndicator__["MDCFadingTabIndicatorFoundation"](this.adapter);}else{this.foundation_=new __WEBPACK_IMPORTED_MODULE_3__material_tab_indicator_dist_mdc_tabIndicator__["MDCSlidingTabIndicatorFoundation"](this.adapter);}this.foundation_.init();if(this.props.active){this.foundation_.activate();}}},{key:'componentWillUnmount',value:function componentWillUnmount(){this.foundation_.destroy();}},{key:'componentDidUpdate',value:function componentDidUpdate(prevProps){if(this.props.active!==prevProps.active){if(this.props.active){this.foundation_.activate(this.props.previousIndicatorClientRect);}else{this.foundation_.deactivate();}}}},{key:'render',value:function render(){var _props=this.props,active=_props.active,children=_props.children,className=_props.className,fade=_props.fade,icon=_props.icon,previousIndicatorClientRect=_props.previousIndicatorClientRect,otherProps=_objectWithoutProperties(_props,['active','children','className','fade','icon','previousIndicatorClientRect']);return __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement('span',_extends({className:this.classes,ref:this.tabIndicatorElement_},otherProps),this.renderContent());}},{key:'renderContent',value:function renderContent(){if(this.props.children){return this.addContentClassesToChildren();}return __WEBPACK_IMPORTED_MODULE_0_react___default.a.createElement('span',{className:this.contentClasses});}},{key:'classes',get:function get(){var _props2=this.props,className=_props2.className,fade=_props2.fade;return __WEBPACK_IMPORTED_MODULE_2_classnames___default()('mdc-tab-indicator',className,{'mdc-tab-indicator--fade':fade});}},{key:'contentClasses',get:function get(){var icon=this.props.icon;return __WEBPACK_IMPORTED_MODULE_2_classnames___default()('mdc-tab-indicator__content',{'mdc-tab-indicator__content--icon':icon,'mdc-tab-indicator__content--underline':!icon});}},{key:'adapter',get:function get(){var _this2=this;return{addClass:function addClass(className){if(!_this2.tabIndicatorElement_.current)return;// since the sliding indicator depends on the FLIP method,
-// our regular pattern of managing classes does not work here.
-// setState is async, which does not work well with the FLIP method
-// without a requestAnimationFrame, which was done in this PR:
-// https://github.com/material-components
-// /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62
-_this2.tabIndicatorElement_.current.classList.add(className);_this2.forceUpdate();},removeClass:function removeClass(className){if(!_this2.tabIndicatorElement_.current)return;_this2.tabIndicatorElement_.current.classList.remove(className);_this2.forceUpdate();},computeContentClientRect:this.computeContentClientRect,// setContentStyleProperty was using setState, but due to the method's
-// async nature, its not condusive to the FLIP technique
-setContentStyleProperty:function setContentStyleProperty(prop,value){var contentElement=_this2.getNativeContentElement();if(!contentElement)return;contentElement.style[prop]=value;}};}}]);return TabIndicator;}(__WEBPACK_IMPORTED_MODULE_0_react__["Component"]);/* harmony default export */ __webpack_exports__["default"] = (TabIndicator);TabIndicator.propTypes={active:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.bool,className:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.string,children:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.element,fade:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.bool,icon:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.bool,previousIndicatorClientRect:__WEBPACK_IMPORTED_MODULE_1_prop_types___default.a.object};TabIndicator.defaultProps={active:false,className:'',children:null,fade:false,icon:false,previousIndicatorClientRect:{}};
-
-/***/ }),
-/* 1 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
-
-/***/ }),
-/* 2 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_2__;
-
-/***/ }),
-/* 3 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
-
-/***/ }),
-/* 4 */
-/***/ (function(module, exports) {
-
-module.exports = __WEBPACK_EXTERNAL_MODULE_4__;
-
-/***/ })
-/******/ ]);
-});
-//# sourceMappingURL=tab-indicator.es.js.map

dist/tab-indicator.es.js.map

-{"version":3,"sources":["webpack:///webpack/universalModuleDefinition","webpack:///webpack/bootstrap 3347d29b79d1bc33489e","webpack:///./packages/tab-indicator/index.js","webpack:///external \"react\"","webpack:///external \"prop-types\"","webpack:///external \"classnames\"","webpack:///external \"@material/tab-indicator/dist/mdc.tabIndicator\""],"names":["TabIndicator","tabIndicatorElement_","React","createRef","getNativeContentElement","current","getElementsByClassName","computeContentClientRect","contentElement","getBoundingClientRect","addContentClassesToChildren","child","Children","only","props","children","className","classnames","contentClasses","Object","assign","cloneElement","fade","foundation_","MDCFadingTabIndicatorFoundation","adapter","MDCSlidingTabIndicatorFoundation","init","active","activate","destroy","prevProps","previousIndicatorClientRect","deactivate","icon","otherProps","classes","renderContent","addClass","classList","add","forceUpdate","removeClass","remove","setContentStyleProperty","prop","value","style","propTypes","PropTypes","bool","string","element","object","defaultProps"],"mappings":"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","file":"tab-indicator.es.js","sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"), require(\"prop-types\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\", \"prop-types\", \"classnames\", \"@material/tab-indicator/dist/mdc.tabIndicator\"], factory);\n\telse {\n\t\tvar a = typeof exports === 'object' ? factory(require(\"react\"), require(\"prop-types\"), require(\"classnames\"), require(\"@material/tab-indicator/dist/mdc.tabIndicator\")) : factory(root[\"react\"], root[\"prop-types\"], root[\"classnames\"], root[\"@material/tab-indicator/dist/mdc.tabIndicator\"]);\n\t\tfor(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];\n\t}\n})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__) {\nreturn \n\n\n// WEBPACK FOOTER //\n// webpack/universalModuleDefinition"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 3347d29b79d1bc33489e","// The MIT License\n//\n// Copyright (c) 2018 Google, Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\nimport React, {Component} from 'react';\nimport PropTypes from 'prop-types';\nimport classnames from 'classnames';\n\nimport {\n  MDCFadingTabIndicatorFoundation,\n  MDCSlidingTabIndicatorFoundation,\n} from '@material/tab-indicator/dist/mdc.tabIndicator';\n\nexport default class TabIndicator extends Component {\n  tabIndicatorElement_ = React.createRef();\n\n  componentDidMount() {\n    if (this.props.fade) {\n      this.foundation_ = new MDCFadingTabIndicatorFoundation(this.adapter);\n    } else {\n      this.foundation_ = new MDCSlidingTabIndicatorFoundation(this.adapter);\n    }\n    this.foundation_.init();\n\n    if (this.props.active) {\n      this.foundation_.activate();\n    }\n  }\n\n  componentWillUnmount() {\n    this.foundation_.destroy();\n  }\n\n  componentDidUpdate(prevProps) {\n    if (this.props.active !== prevProps.active) {\n      if (this.props.active) {\n        this.foundation_.activate(this.props.previousIndicatorClientRect);\n      } else {\n        this.foundation_.deactivate();\n      }\n    }\n  }\n\n  get classes() {\n    const {className, fade} = this.props;\n    return classnames('mdc-tab-indicator', className, {\n      'mdc-tab-indicator--fade': fade,\n    });\n  }\n\n  get contentClasses() {\n    const {icon} = this.props;\n    return classnames('mdc-tab-indicator__content', {\n      'mdc-tab-indicator__content--icon': icon,\n      'mdc-tab-indicator__content--underline': !icon,\n    });\n  }\n\n  get adapter() {\n    return {\n      addClass: (className) => {\n        if (!this.tabIndicatorElement_.current) return;\n        // since the sliding indicator depends on the FLIP method,\n        // our regular pattern of managing classes does not work here.\n        // setState is async, which does not work well with the FLIP method\n        // without a requestAnimationFrame, which was done in this PR:\n        // https://github.com/material-components\n        // /material-components-web/pull/3337/files#diff-683d792d28dad99754294121e1afbfb5L62\n        this.tabIndicatorElement_.current.classList.add(className);\n        this.forceUpdate();\n      },\n      removeClass: (className) => {\n        if (!this.tabIndicatorElement_.current) return;\n        this.tabIndicatorElement_.current.classList.remove(className);\n        this.forceUpdate();\n      },\n      computeContentClientRect: this.computeContentClientRect,\n      // setContentStyleProperty was using setState, but due to the method's\n      // async nature, its not condusive to the FLIP technique\n      setContentStyleProperty: (prop, value) => {\n        const contentElement = this.getNativeContentElement();\n        if (!contentElement) return;\n        contentElement.style[prop] = value;\n      },\n    };\n  }\n\n  getNativeContentElement = () => {\n    if (!this.tabIndicatorElement_.current) return;\n    // need to use getElementsByClassName since tabIndicator could be\n    // a non-semantic element (span, i, etc.). This is a problem since refs to a non semantic elements\n    // return the instance of the component.\n    return this.tabIndicatorElement_.current.getElementsByClassName('mdc-tab-indicator__content')[0];\n  }\n\n  computeContentClientRect = () => {\n    const contentElement = this.getNativeContentElement();\n    if (!(contentElement && contentElement.getBoundingClientRect)) return;\n    return contentElement.getBoundingClientRect();\n  }\n\n  render() {\n    const {\n      /* eslint-disable */\n      active,\n      children,\n      className,\n      fade,\n      icon,\n      previousIndicatorClientRect,\n      /* eslint-enable */\n      ...otherProps\n    } = this.props;\n\n    return (\n      <span\n        className={this.classes}\n        ref={this.tabIndicatorElement_}\n        {...otherProps}\n      >\n        {this.renderContent()}\n      </span>\n    );\n  }\n\n  addContentClassesToChildren = () => {\n    const child = React.Children.only(this.props.children);\n    const className = classnames(child.props.className, this.contentClasses);\n    const props = Object.assign({}, child.props, {className});\n    return React.cloneElement(child, props);\n  };\n\n  renderContent() {\n    if (this.props.children) {\n      return this.addContentClassesToChildren();\n    }\n    return (\n      <span className={this.contentClasses} />\n    );\n  }\n}\n\nTabIndicator.propTypes = {\n  active: PropTypes.bool,\n  className: PropTypes.string,\n  children: PropTypes.element,\n  fade: PropTypes.bool,\n  icon: PropTypes.bool,\n  previousIndicatorClientRect: PropTypes.object,\n};\n\nTabIndicator.defaultProps = {\n  active: false,\n  className: '',\n  children: null,\n  fade: false,\n  icon: false,\n  previousIndicatorClientRect: {},\n};\n\n\n\n// WEBPACK FOOTER //\n// ./packages/tab-indicator/index.js","module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"react\"\n// module id = 1\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_2__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"prop-types\"\n// module id = 2\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_3__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"classnames\"\n// module id = 3\n// module chunks = 0","module.exports = __WEBPACK_EXTERNAL_MODULE_4__;\n\n\n//////////////////\n// WEBPACK FOOTER\n// external \"@material/tab-indicator/dist/mdc.tabIndicator\"\n// module id = 4\n// module chunks = 0"],"sourceRoot":""}

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

URL strings

Supply chain risk

Package contains fragments of external URLs or IP addresses, which the package may be accessing at runtime.

Found 1 instance in 1 package

Improved metrics

Dependency count

3

-25%

Lines of code

762

32.29%

Worsened metrics

Total package byte prevSize

69314

-15.24%

Number of low supply chain risk alerts

2

Infinity%

Number of medium supply chain risk alerts

1

Infinity%

Dependency changes

• - Removed

  prop-types@^15.6.1