material_components_web-sass 0.3.0 → 0.4.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +9 -0
- data/README.md +2 -0
- data/lib/material_components_web/sass/version.rb +1 -1
- data/vendor/assets/javascripts/material-components-web.js +1226 -1159
- data/vendor/assets/stylesheets/@material/button/mdc-button.scss +1 -0
- data/vendor/assets/stylesheets/@material/card/mdc-card.scss +30 -29
- data/vendor/assets/stylesheets/@material/checkbox/_variables.scss +2 -0
- data/vendor/assets/stylesheets/@material/checkbox/mdc-checkbox.scss +40 -23
- data/vendor/assets/stylesheets/@material/drawer/temporary/mdc-temporary-drawer.scss +1 -0
- data/vendor/assets/stylesheets/@material/layout-grid/_mixins.scss +134 -0
- data/vendor/assets/stylesheets/@material/layout-grid/_variables.scss +29 -0
- data/vendor/assets/stylesheets/@material/layout-grid/mdc-layout-grid.scss +61 -0
- data/vendor/assets/stylesheets/@material/radio/mdc-radio.scss +17 -17
- data/vendor/assets/stylesheets/@material/ripple/_keyframes.scss +5 -5
- data/vendor/assets/stylesheets/@material/ripple/_mixins.scss +29 -30
- data/vendor/assets/stylesheets/@material/ripple/mdc-ripple.scss +17 -17
- data/vendor/assets/stylesheets/@material/switch/_mixins.scss +18 -0
- data/vendor/assets/stylesheets/@material/switch/_variables.scss +33 -0
- data/vendor/assets/stylesheets/@material/switch/mdc-switch.scss +194 -0
- data/vendor/assets/stylesheets/_material-components-web.scss +2 -0
- metadata +8 -3
- data/vendor/assets/stylesheets/@material/ripple/_variables.scss +0 -17
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: bf304e5a7f4fb9aa0e5ca3694feaffd6f15fe86a
|
4
|
+
data.tar.gz: 31b7b07dd10423a6a93a849edce4686bb262428b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 8cc879dc83a2e975c89d3d538e171f2cc9c09637626982b773a65c4223d2704b61b85475d47c7ef797755d4c4147d4dba269678b1fe161b72ab41d0ebd3f9061
|
7
|
+
data.tar.gz: 4fded022b8095bf9438b3e49ad4df55fa4e85ac97ccca778c9690a87dfd19765113116c1780236a331c059d24c74ddd2d74c514247c9c5874e1148b7d1f04504
|
data/CHANGELOG.md
CHANGED
data/README.md
CHANGED
@@ -51,12 +51,14 @@ Individual Sass components can be included like this:
|
|
51
51
|
@import "@material/fab/mdc-fab";
|
52
52
|
@import "@material/form-field/mdc-form-field";
|
53
53
|
@import "@material/icon-toggle/mdc-icon-toggle";
|
54
|
+
@import "@material/layout-grid/mdc-layout-grid";
|
54
55
|
@import "@material/list/mdc-list";
|
55
56
|
@import "@material/menu/mdc-menu";
|
56
57
|
@import "@material/radio/mdc-radio";
|
57
58
|
@import "@material/ripple/mdc-ripple";
|
58
59
|
@import "@material/select/mdc-select";
|
59
60
|
@import "@material/snackbar/mdc-snackbar";
|
61
|
+
@import "@material/switch/mdc-switch";
|
60
62
|
@import "@material/textfield/mdc-textfield";
|
61
63
|
@import "@material/theme/mdc-theme";
|
62
64
|
@import "@material/typography/mdc-typography";
|
@@ -74,7 +74,7 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
74
74
|
|
75
75
|
var checkbox = _interopRequireWildcard(_checkbox);
|
76
76
|
|
77
|
-
var _iconToggle = __webpack_require__(
|
77
|
+
var _iconToggle = __webpack_require__(12);
|
78
78
|
|
79
79
|
var iconToggle = _interopRequireWildcard(_iconToggle);
|
80
80
|
|
@@ -82,7 +82,7 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
82
82
|
|
83
83
|
var radio = _interopRequireWildcard(_radio);
|
84
84
|
|
85
|
-
var _ripple = __webpack_require__(
|
85
|
+
var _ripple = __webpack_require__(5);
|
86
86
|
|
87
87
|
var ripple = _interopRequireWildcard(_ripple);
|
88
88
|
|
@@ -415,13 +415,21 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
415
415
|
});
|
416
416
|
exports.MDCCheckbox = exports.MDCCheckboxFoundation = undefined;
|
417
417
|
|
418
|
+
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; };
|
419
|
+
|
420
|
+
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
|
421
|
+
|
418
422
|
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; }; }();
|
419
423
|
|
420
424
|
var _base = __webpack_require__(1);
|
421
425
|
|
422
|
-
var
|
426
|
+
var _ripple = __webpack_require__(5);
|
423
427
|
|
424
|
-
var
|
428
|
+
var _util = __webpack_require__(9);
|
429
|
+
|
430
|
+
var _animation = __webpack_require__(7);
|
431
|
+
|
432
|
+
var _foundation = __webpack_require__(10);
|
425
433
|
|
426
434
|
var _foundation2 = _interopRequireDefault(_foundation);
|
427
435
|
|
@@ -452,53 +460,113 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
452
460
|
var MDCCheckbox = exports.MDCCheckbox = function (_MDCComponent) {
|
453
461
|
_inherits(MDCCheckbox, _MDCComponent);
|
454
462
|
|
463
|
+
_createClass(MDCCheckbox, [{
|
464
|
+
key: 'nativeCb_',
|
465
|
+
get: function get() {
|
466
|
+
var NATIVE_CONTROL_SELECTOR = _foundation2.default.strings.NATIVE_CONTROL_SELECTOR;
|
467
|
+
|
468
|
+
return this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
|
469
|
+
}
|
470
|
+
}], [{
|
471
|
+
key: 'attachTo',
|
472
|
+
value: function attachTo(root) {
|
473
|
+
return new MDCCheckbox(root);
|
474
|
+
}
|
475
|
+
}]);
|
476
|
+
|
455
477
|
function MDCCheckbox() {
|
478
|
+
var _ref;
|
479
|
+
|
456
480
|
_classCallCheck(this, MDCCheckbox);
|
457
481
|
|
458
|
-
|
482
|
+
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
483
|
+
args[_key] = arguments[_key];
|
484
|
+
}
|
485
|
+
|
486
|
+
var _this = _possibleConstructorReturn(this, (_ref = MDCCheckbox.__proto__ || Object.getPrototypeOf(MDCCheckbox)).call.apply(_ref, [this].concat(args)));
|
487
|
+
|
488
|
+
_this.ripple_ = _this.initRipple_();
|
489
|
+
return _this;
|
459
490
|
}
|
460
491
|
|
461
492
|
_createClass(MDCCheckbox, [{
|
493
|
+
key: 'initRipple_',
|
494
|
+
value: function initRipple_() {
|
495
|
+
var _this2 = this;
|
496
|
+
|
497
|
+
var MATCHES = (0, _util.getMatchesProperty)(HTMLElement.prototype);
|
498
|
+
var adapter = _extends(_ripple.MDCRipple.createAdapter(this), {
|
499
|
+
isUnbounded: function isUnbounded() {
|
500
|
+
return true;
|
501
|
+
},
|
502
|
+
isSurfaceActive: function isSurfaceActive() {
|
503
|
+
return _this2.nativeCb_[MATCHES](':active');
|
504
|
+
},
|
505
|
+
registerInteractionHandler: function registerInteractionHandler(type, handler) {
|
506
|
+
return _this2.nativeCb_.addEventListener(type, handler);
|
507
|
+
},
|
508
|
+
deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
|
509
|
+
return _this2.nativeCb_.removeEventListener(type, handler);
|
510
|
+
},
|
511
|
+
computeBoundingRect: function computeBoundingRect() {
|
512
|
+
var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
|
513
|
+
left = _root_$getBoundingCli.left,
|
514
|
+
top = _root_$getBoundingCli.top;
|
515
|
+
|
516
|
+
var DIM = 40;
|
517
|
+
return {
|
518
|
+
top: top,
|
519
|
+
left: left,
|
520
|
+
right: left + DIM,
|
521
|
+
bottom: top + DIM,
|
522
|
+
width: DIM,
|
523
|
+
height: DIM
|
524
|
+
};
|
525
|
+
}
|
526
|
+
});
|
527
|
+
var foundation = new _ripple.MDCRippleFoundation(adapter);
|
528
|
+
return new _ripple.MDCRipple(this.root_, foundation);
|
529
|
+
}
|
530
|
+
}, {
|
462
531
|
key: 'getDefaultFoundation',
|
463
532
|
value: function getDefaultFoundation() {
|
464
|
-
var
|
533
|
+
var _this3 = this;
|
465
534
|
|
466
535
|
return new _foundation2.default({
|
467
536
|
addClass: function addClass(className) {
|
468
|
-
return
|
537
|
+
return _this3.root_.classList.add(className);
|
469
538
|
},
|
470
539
|
removeClass: function removeClass(className) {
|
471
|
-
return
|
540
|
+
return _this3.root_.classList.remove(className);
|
472
541
|
},
|
473
542
|
registerAnimationEndHandler: function registerAnimationEndHandler(handler) {
|
474
|
-
return
|
543
|
+
return _this3.root_.addEventListener((0, _animation.getCorrectEventName)(window, 'animationend'), handler);
|
475
544
|
},
|
476
545
|
deregisterAnimationEndHandler: function deregisterAnimationEndHandler(handler) {
|
477
|
-
return
|
546
|
+
return _this3.root_.removeEventListener((0, _animation.getCorrectEventName)(window, 'animationend'), handler);
|
478
547
|
},
|
479
548
|
registerChangeHandler: function registerChangeHandler(handler) {
|
480
|
-
return
|
549
|
+
return _this3.nativeCb_.addEventListener('change', handler);
|
481
550
|
},
|
482
551
|
deregisterChangeHandler: function deregisterChangeHandler(handler) {
|
483
|
-
return
|
552
|
+
return _this3.nativeCb_.removeEventListener('change', handler);
|
484
553
|
},
|
485
554
|
getNativeControl: function getNativeControl() {
|
486
|
-
return
|
555
|
+
return _this3.nativeCb_;
|
487
556
|
},
|
488
557
|
forceLayout: function forceLayout() {
|
489
|
-
return
|
558
|
+
return _this3.root_.offsetWidth;
|
490
559
|
},
|
491
560
|
isAttachedToDOM: function isAttachedToDOM() {
|
492
|
-
return Boolean(
|
561
|
+
return Boolean(_this3.root_.parentNode);
|
493
562
|
}
|
494
563
|
});
|
495
564
|
}
|
496
565
|
}, {
|
497
|
-
key: '
|
498
|
-
|
499
|
-
|
500
|
-
|
501
|
-
return this.root_.querySelector(NATIVE_CONTROL_SELECTOR);
|
566
|
+
key: 'destroy',
|
567
|
+
value: function destroy() {
|
568
|
+
this.ripple_.destroy();
|
569
|
+
_get(MDCCheckbox.prototype.__proto__ || Object.getPrototypeOf(MDCCheckbox.prototype), 'destroy', this).call(this);
|
502
570
|
}
|
503
571
|
}, {
|
504
572
|
key: 'checked',
|
@@ -524,11 +592,6 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
524
592
|
set: function set(disabled) {
|
525
593
|
this.foundation_.setDisabled(disabled);
|
526
594
|
}
|
527
|
-
}], [{
|
528
|
-
key: 'attachTo',
|
529
|
-
value: function attachTo(root) {
|
530
|
-
return new MDCCheckbox(root);
|
531
|
-
}
|
532
595
|
}]);
|
533
596
|
|
534
597
|
return MDCCheckbox;
|
@@ -536,138 +599,6 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
536
599
|
|
537
600
|
/***/ },
|
538
601
|
/* 5 */
|
539
|
-
/***/ function(module, exports) {
|
540
|
-
|
541
|
-
'use strict';
|
542
|
-
|
543
|
-
Object.defineProperty(exports, "__esModule", {
|
544
|
-
value: true
|
545
|
-
});
|
546
|
-
exports.getCorrectEventName = getCorrectEventName;
|
547
|
-
exports.getCorrectPropertyName = getCorrectPropertyName;
|
548
|
-
/**
|
549
|
-
* Copyright 2016 Google Inc. All Rights Reserved.
|
550
|
-
*
|
551
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
552
|
-
* you may not use this file except in compliance with the License.
|
553
|
-
* You may obtain a copy of the License at
|
554
|
-
*
|
555
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
556
|
-
*
|
557
|
-
* Unless required by applicable law or agreed to in writing, software
|
558
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
559
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
560
|
-
* See the License for the specific language governing permissions and
|
561
|
-
* limitations under the License.
|
562
|
-
*/
|
563
|
-
|
564
|
-
var eventTypeMap = {
|
565
|
-
animationstart: {
|
566
|
-
noPrefix: 'animationstart',
|
567
|
-
webkitPrefix: 'webkitAnimationStart'
|
568
|
-
},
|
569
|
-
animationend: {
|
570
|
-
noPrefix: 'animationend',
|
571
|
-
webkitPrefix: 'webkitAnimationEnd'
|
572
|
-
},
|
573
|
-
animationiteration: {
|
574
|
-
noPrefix: 'animationiteration',
|
575
|
-
webkitPrefix: 'webkitAnimationIteration'
|
576
|
-
},
|
577
|
-
transitionend: {
|
578
|
-
noPrefix: 'transitionend',
|
579
|
-
webkitPrefix: 'webkitTransitionEnd'
|
580
|
-
}
|
581
|
-
};
|
582
|
-
|
583
|
-
var cssPropertyMap = {
|
584
|
-
animation: {
|
585
|
-
noPrefix: 'animation',
|
586
|
-
webkitPrefix: '-webkit-animation'
|
587
|
-
},
|
588
|
-
transform: {
|
589
|
-
noPrefix: 'transform',
|
590
|
-
webkitPrefix: '-webkit-transform'
|
591
|
-
},
|
592
|
-
transition: {
|
593
|
-
noPrefix: 'transition',
|
594
|
-
webkitPrefix: '-webkit-transition'
|
595
|
-
}
|
596
|
-
};
|
597
|
-
|
598
|
-
function hasProperShape(windowObj) {
|
599
|
-
return windowObj.document !== undefined && typeof windowObj.document.createElement === 'function';
|
600
|
-
}
|
601
|
-
|
602
|
-
function eventFoundInMaps(eventType) {
|
603
|
-
return eventType in eventTypeMap || eventType in cssPropertyMap;
|
604
|
-
}
|
605
|
-
|
606
|
-
// If 'animation' or 'transition' exist as style property, webkit prefix isn't necessary. Since we are unable to
|
607
|
-
// see the event types on the element, we must rely on the corresponding style properties.
|
608
|
-
function getJavaScriptEventName(eventType, map, el) {
|
609
|
-
switch (eventType) {
|
610
|
-
case 'animationstart':
|
611
|
-
case 'animationend':
|
612
|
-
case 'animationiteration':
|
613
|
-
return 'animation' in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
614
|
-
case 'transitionend':
|
615
|
-
return 'transition' in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
616
|
-
default:
|
617
|
-
return map[eventType].noPrefix;
|
618
|
-
}
|
619
|
-
}
|
620
|
-
|
621
|
-
// Helper function to determine browser prefix for CSS3 animation events
|
622
|
-
// and property names
|
623
|
-
//
|
624
|
-
// Parameters:
|
625
|
-
// windowObject: Object -- Contains Document with a `createElement()` method
|
626
|
-
// eventType: string -- The type of animation
|
627
|
-
//
|
628
|
-
// returns the value of the event as a string, prefixed if necessary.
|
629
|
-
// If proper arguments are not supplied, this function will return
|
630
|
-
// the property or event type without webkit prefix.
|
631
|
-
//
|
632
|
-
function getAnimationName(windowObj, eventType) {
|
633
|
-
if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
|
634
|
-
return eventType;
|
635
|
-
}
|
636
|
-
|
637
|
-
var map = eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
|
638
|
-
var el = windowObj.document.createElement('div');
|
639
|
-
var eventName = '';
|
640
|
-
|
641
|
-
if (map === eventTypeMap) {
|
642
|
-
eventName = getJavaScriptEventName(eventType, map, el);
|
643
|
-
} else {
|
644
|
-
eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
645
|
-
}
|
646
|
-
|
647
|
-
return eventName;
|
648
|
-
}
|
649
|
-
|
650
|
-
// Public functions to access getAnimationName() for JavaScript events or CSS
|
651
|
-
// property names.
|
652
|
-
//
|
653
|
-
// Parameters:
|
654
|
-
// windowObject: Object -- Contains Document with a `createElement()` method
|
655
|
-
// eventType: string -- The type of animation
|
656
|
-
//
|
657
|
-
// returns the value of the event as a string, prefixed if necessary.
|
658
|
-
// If proper arguments are not supplied, this function will return
|
659
|
-
// the property or event type without webkit prefix.
|
660
|
-
//
|
661
|
-
function getCorrectEventName(windowObj, eventType) {
|
662
|
-
return getAnimationName(windowObj, eventType);
|
663
|
-
}
|
664
|
-
|
665
|
-
function getCorrectPropertyName(windowObj, eventType) {
|
666
|
-
return getAnimationName(windowObj, eventType);
|
667
|
-
}
|
668
|
-
|
669
|
-
/***/ },
|
670
|
-
/* 6 */
|
671
602
|
/***/ function(module, exports, __webpack_require__) {
|
672
603
|
|
673
604
|
'use strict';
|
@@ -675,14 +606,19 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
675
606
|
Object.defineProperty(exports, "__esModule", {
|
676
607
|
value: true
|
677
608
|
});
|
678
|
-
|
679
|
-
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; };
|
609
|
+
exports.MDCRipple = exports.MDCRippleFoundation = undefined;
|
680
610
|
|
681
611
|
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; }; }();
|
682
612
|
|
683
613
|
var _base = __webpack_require__(1);
|
684
614
|
|
685
|
-
var
|
615
|
+
var _foundation = __webpack_require__(6);
|
616
|
+
|
617
|
+
var _foundation2 = _interopRequireDefault(_foundation);
|
618
|
+
|
619
|
+
var _util = __webpack_require__(9);
|
620
|
+
|
621
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
686
622
|
|
687
623
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
688
624
|
|
@@ -704,238 +640,607 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
704
640
|
* limitations under the License.
|
705
641
|
*/
|
706
642
|
|
707
|
-
var
|
643
|
+
var MATCHES = (0, _util.getMatchesProperty)(HTMLElement.prototype);
|
708
644
|
|
709
|
-
|
710
|
-
_inherits(MDCCheckboxFoundation, _MDCFoundation);
|
645
|
+
exports.MDCRippleFoundation = _foundation2.default;
|
711
646
|
|
712
|
-
|
713
|
-
|
714
|
-
|
715
|
-
|
647
|
+
var MDCRipple = exports.MDCRipple = function (_MDCComponent) {
|
648
|
+
_inherits(MDCRipple, _MDCComponent);
|
649
|
+
|
650
|
+
function MDCRipple() {
|
651
|
+
_classCallCheck(this, MDCRipple);
|
652
|
+
|
653
|
+
return _possibleConstructorReturn(this, (MDCRipple.__proto__ || Object.getPrototypeOf(MDCRipple)).apply(this, arguments));
|
654
|
+
}
|
655
|
+
|
656
|
+
_createClass(MDCRipple, [{
|
657
|
+
key: 'getDefaultFoundation',
|
658
|
+
value: function getDefaultFoundation() {
|
659
|
+
return new _foundation2.default(MDCRipple.createAdapter(this));
|
716
660
|
}
|
717
661
|
}, {
|
718
|
-
key: '
|
719
|
-
|
720
|
-
|
662
|
+
key: 'initialSyncWithDOM',
|
663
|
+
value: function initialSyncWithDOM() {
|
664
|
+
this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
|
721
665
|
}
|
722
666
|
}, {
|
723
|
-
key: '
|
667
|
+
key: 'unbounded',
|
724
668
|
get: function get() {
|
725
|
-
return
|
669
|
+
return this.unbounded_;
|
670
|
+
},
|
671
|
+
set: function set(unbounded) {
|
672
|
+
var UNBOUNDED = _foundation2.default.cssClasses.UNBOUNDED;
|
673
|
+
|
674
|
+
this.unbounded_ = Boolean(unbounded);
|
675
|
+
if (this.unbounded_) {
|
676
|
+
this.root_.classList.add(UNBOUNDED);
|
677
|
+
} else {
|
678
|
+
this.root_.classList.remove(UNBOUNDED);
|
679
|
+
}
|
680
|
+
}
|
681
|
+
}], [{
|
682
|
+
key: 'attachTo',
|
683
|
+
value: function attachTo(root) {
|
684
|
+
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
685
|
+
_ref$isUnbounded = _ref.isUnbounded,
|
686
|
+
isUnbounded = _ref$isUnbounded === undefined ? undefined : _ref$isUnbounded;
|
687
|
+
|
688
|
+
var ripple = new MDCRipple(root);
|
689
|
+
// Only override unbounded behavior if option is explicitly specified
|
690
|
+
if (isUnbounded !== undefined) {
|
691
|
+
ripple.unbounded = isUnbounded;
|
692
|
+
}
|
693
|
+
return ripple;
|
694
|
+
}
|
695
|
+
}, {
|
696
|
+
key: 'createAdapter',
|
697
|
+
value: function createAdapter(instance) {
|
698
|
+
return {
|
699
|
+
browserSupportsCssVars: function browserSupportsCssVars() {
|
700
|
+
return (0, _util.supportsCssVariables)(window);
|
701
|
+
},
|
702
|
+
isUnbounded: function isUnbounded() {
|
703
|
+
return instance.unbounded;
|
704
|
+
},
|
705
|
+
isSurfaceActive: function isSurfaceActive() {
|
706
|
+
return instance.root_[MATCHES](':active');
|
707
|
+
},
|
708
|
+
addClass: function addClass(className) {
|
709
|
+
return instance.root_.classList.add(className);
|
710
|
+
},
|
711
|
+
removeClass: function removeClass(className) {
|
712
|
+
return instance.root_.classList.remove(className);
|
713
|
+
},
|
714
|
+
registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
|
715
|
+
return instance.root_.addEventListener(evtType, handler);
|
716
|
+
},
|
717
|
+
deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
|
718
|
+
return instance.root_.removeEventListener(evtType, handler);
|
719
|
+
},
|
720
|
+
registerResizeHandler: function registerResizeHandler(handler) {
|
721
|
+
return window.addEventListener('resize', handler);
|
722
|
+
},
|
723
|
+
deregisterResizeHandler: function deregisterResizeHandler(handler) {
|
724
|
+
return window.removeEventListener('resize', handler);
|
725
|
+
},
|
726
|
+
updateCssVariable: function updateCssVariable(varName, value) {
|
727
|
+
return instance.root_.style.setProperty(varName, value);
|
728
|
+
},
|
729
|
+
computeBoundingRect: function computeBoundingRect() {
|
730
|
+
return instance.root_.getBoundingClientRect();
|
731
|
+
},
|
732
|
+
getWindowPageOffset: function getWindowPageOffset() {
|
733
|
+
return { x: window.pageXOffset, y: window.pageYOffset };
|
734
|
+
}
|
735
|
+
};
|
736
|
+
}
|
737
|
+
}]);
|
738
|
+
|
739
|
+
return MDCRipple;
|
740
|
+
}(_base.MDCComponent);
|
741
|
+
|
742
|
+
/***/ },
|
743
|
+
/* 6 */
|
744
|
+
/***/ function(module, exports, __webpack_require__) {
|
745
|
+
|
746
|
+
'use strict';
|
747
|
+
|
748
|
+
Object.defineProperty(exports, "__esModule", {
|
749
|
+
value: true
|
750
|
+
});
|
751
|
+
|
752
|
+
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; };
|
753
|
+
|
754
|
+
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; }; }();
|
755
|
+
|
756
|
+
var _base = __webpack_require__(1);
|
757
|
+
|
758
|
+
var _animation = __webpack_require__(7);
|
759
|
+
|
760
|
+
var _constants = __webpack_require__(8);
|
761
|
+
|
762
|
+
var _util = __webpack_require__(9);
|
763
|
+
|
764
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
765
|
+
|
766
|
+
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; }
|
767
|
+
|
768
|
+
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; } /**
|
769
|
+
* Copyright 2016 Google Inc. All Rights Reserved.
|
770
|
+
*
|
771
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
772
|
+
* you may not use this file except in compliance with the License.
|
773
|
+
* You may obtain a copy of the License at
|
774
|
+
*
|
775
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
776
|
+
*
|
777
|
+
* Unless required by applicable law or agreed to in writing, software
|
778
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
779
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
780
|
+
* See the License for the specific language governing permissions and
|
781
|
+
* limitations under the License.
|
782
|
+
*/
|
783
|
+
|
784
|
+
var DEACTIVATION_ACTIVATION_PAIRS = {
|
785
|
+
mouseup: 'mousedown',
|
786
|
+
pointerup: 'pointerdown',
|
787
|
+
touchend: 'touchstart',
|
788
|
+
keyup: 'keydown',
|
789
|
+
blur: 'focus'
|
790
|
+
};
|
791
|
+
|
792
|
+
var MDCRippleFoundation = function (_MDCFoundation) {
|
793
|
+
_inherits(MDCRippleFoundation, _MDCFoundation);
|
794
|
+
|
795
|
+
_createClass(MDCRippleFoundation, [{
|
796
|
+
key: 'isSupported_',
|
797
|
+
|
798
|
+
|
799
|
+
// We compute this property so that we are not querying information about the client
|
800
|
+
// until the point in time where the foundation requests it. This prevents scenarios where
|
801
|
+
// client-side feature-detection may happen too early, such as when components are rendered on the server
|
802
|
+
// and then initialized at mount time on the client.
|
803
|
+
get: function get() {
|
804
|
+
return this.adapter_.browserSupportsCssVars();
|
805
|
+
}
|
806
|
+
}], [{
|
807
|
+
key: 'cssClasses',
|
808
|
+
get: function get() {
|
809
|
+
return _constants.cssClasses;
|
810
|
+
}
|
811
|
+
}, {
|
812
|
+
key: 'strings',
|
813
|
+
get: function get() {
|
814
|
+
return _constants.strings;
|
815
|
+
}
|
816
|
+
}, {
|
817
|
+
key: 'numbers',
|
818
|
+
get: function get() {
|
819
|
+
return _constants.numbers;
|
726
820
|
}
|
727
821
|
}, {
|
728
822
|
key: 'defaultAdapter',
|
729
823
|
get: function get() {
|
730
824
|
return {
|
825
|
+
browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
|
826
|
+
isUnbounded: function isUnbounded() /* boolean */{},
|
827
|
+
isSurfaceActive: function isSurfaceActive() /* boolean */{},
|
731
828
|
addClass: function addClass() /* className: string */{},
|
732
829
|
removeClass: function removeClass() /* className: string */{},
|
733
|
-
|
734
|
-
|
735
|
-
|
736
|
-
|
737
|
-
|
738
|
-
|
739
|
-
|
830
|
+
registerInteractionHandler: function registerInteractionHandler() /* evtType: string, handler: EventListener */{},
|
831
|
+
deregisterInteractionHandler: function deregisterInteractionHandler() /* evtType: string, handler: EventListener */{},
|
832
|
+
registerResizeHandler: function registerResizeHandler() /* handler: EventListener */{},
|
833
|
+
deregisterResizeHandler: function deregisterResizeHandler() /* handler: EventListener */{},
|
834
|
+
updateCssVariable: function updateCssVariable() /* varName: string, value: string */{},
|
835
|
+
computeBoundingRect: function computeBoundingRect() /* ClientRect */{},
|
836
|
+
getWindowPageOffset: function getWindowPageOffset() /* {x: number, y: number} */{}
|
740
837
|
};
|
741
838
|
}
|
742
839
|
}]);
|
743
840
|
|
744
|
-
function
|
745
|
-
_classCallCheck(this,
|
841
|
+
function MDCRippleFoundation(adapter) {
|
842
|
+
_classCallCheck(this, MDCRippleFoundation);
|
746
843
|
|
747
|
-
var _this = _possibleConstructorReturn(this, (
|
844
|
+
var _this = _possibleConstructorReturn(this, (MDCRippleFoundation.__proto__ || Object.getPrototypeOf(MDCRippleFoundation)).call(this, _extends(MDCRippleFoundation.defaultAdapter, adapter)));
|
748
845
|
|
749
|
-
_this.
|
750
|
-
_this.
|
751
|
-
_this.
|
752
|
-
_this.
|
753
|
-
|
754
|
-
|
755
|
-
|
756
|
-
|
757
|
-
|
846
|
+
_this.layoutFrame_ = 0;
|
847
|
+
_this.frame_ = { width: 0, height: 0 };
|
848
|
+
_this.activationState_ = _this.defaultActivationState_();
|
849
|
+
_this.xfDuration_ = 0;
|
850
|
+
_this.initialSize_ = 0;
|
851
|
+
_this.maxRadius_ = 0;
|
852
|
+
_this.listenerInfos_ = [{ activate: 'touchstart', deactivate: 'touchend' }, { activate: 'pointerdown', deactivate: 'pointerup' }, { activate: 'mousedown', deactivate: 'mouseup' }, { activate: 'keydown', deactivate: 'keyup' }, { focus: 'focus', blur: 'blur' }];
|
853
|
+
_this.listeners_ = {
|
854
|
+
activate: function activate(e) {
|
855
|
+
return _this.activate_(e);
|
856
|
+
},
|
857
|
+
deactivate: function deactivate(e) {
|
858
|
+
return _this.deactivate_(e);
|
859
|
+
},
|
860
|
+
focus: function focus() {
|
861
|
+
return requestAnimationFrame(function () {
|
862
|
+
return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_ACTIVE);
|
863
|
+
});
|
864
|
+
},
|
865
|
+
blur: function blur() {
|
866
|
+
return requestAnimationFrame(function () {
|
867
|
+
return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_ACTIVE);
|
868
|
+
});
|
869
|
+
}
|
758
870
|
};
|
759
|
-
_this.
|
760
|
-
|
871
|
+
_this.unboundedOpacityFadeTimer_ = 0;
|
872
|
+
_this.resizeHandler_ = function () {
|
873
|
+
return _this.layout();
|
874
|
+
};
|
875
|
+
_this.cancelBgBounded_ = function () {};
|
876
|
+
_this.cancelFgBounded_ = function () {};
|
877
|
+
_this.cancelFgUnbounded_ = function () {};
|
878
|
+
_this.unboundedCoords_ = {
|
879
|
+
left: 0,
|
880
|
+
top: 0
|
761
881
|
};
|
882
|
+
_this.fgScale_ = 0;
|
762
883
|
return _this;
|
763
884
|
}
|
764
885
|
|
765
|
-
_createClass(
|
766
|
-
key: '
|
767
|
-
value: function
|
768
|
-
|
769
|
-
|
886
|
+
_createClass(MDCRippleFoundation, [{
|
887
|
+
key: 'defaultActivationState_',
|
888
|
+
value: function defaultActivationState_() {
|
889
|
+
return {
|
890
|
+
isActivated: false,
|
891
|
+
wasActivatedByPointer: false,
|
892
|
+
wasElementMadeActive: false,
|
893
|
+
activationStartTime: 0,
|
894
|
+
activationEvent: null
|
895
|
+
};
|
770
896
|
}
|
771
897
|
}, {
|
772
|
-
key: '
|
773
|
-
value: function
|
774
|
-
this
|
775
|
-
|
898
|
+
key: 'init',
|
899
|
+
value: function init() {
|
900
|
+
var _this2 = this;
|
901
|
+
|
902
|
+
if (!this.isSupported_) {
|
903
|
+
return;
|
904
|
+
}
|
905
|
+
this.addEventListeners_();
|
906
|
+
|
907
|
+
var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
|
908
|
+
ROOT = _MDCRippleFoundation$.ROOT,
|
909
|
+
UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
|
910
|
+
|
911
|
+
requestAnimationFrame(function () {
|
912
|
+
_this2.adapter_.addClass(ROOT);
|
913
|
+
if (_this2.adapter_.isUnbounded()) {
|
914
|
+
_this2.adapter_.addClass(UNBOUNDED);
|
915
|
+
}
|
916
|
+
_this2.layoutInternal_();
|
917
|
+
});
|
776
918
|
}
|
777
919
|
}, {
|
778
|
-
key: '
|
779
|
-
value: function
|
780
|
-
|
781
|
-
|
782
|
-
|
783
|
-
|
784
|
-
|
785
|
-
|
786
|
-
|
787
|
-
|
788
|
-
key: 'isIndeterminate',
|
789
|
-
value: function isIndeterminate() {
|
790
|
-
return this.getNativeControl_().indeterminate;
|
791
|
-
}
|
792
|
-
}, {
|
793
|
-
key: 'setIndeterminate',
|
794
|
-
value: function setIndeterminate(indeterminate) {
|
795
|
-
this.getNativeControl_().indeterminate = indeterminate;
|
796
|
-
}
|
797
|
-
}, {
|
798
|
-
key: 'isDisabled',
|
799
|
-
value: function isDisabled() {
|
800
|
-
return this.getNativeControl_().disabled;
|
801
|
-
}
|
802
|
-
}, {
|
803
|
-
key: 'setDisabled',
|
804
|
-
value: function setDisabled(disabled) {
|
805
|
-
this.getNativeControl_().disabled = disabled;
|
920
|
+
key: 'addEventListeners_',
|
921
|
+
value: function addEventListeners_() {
|
922
|
+
var _this3 = this;
|
923
|
+
|
924
|
+
this.listenerInfos_.forEach(function (info) {
|
925
|
+
Object.keys(info).forEach(function (k) {
|
926
|
+
_this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
|
927
|
+
});
|
928
|
+
});
|
929
|
+
this.adapter_.registerResizeHandler(this.resizeHandler_);
|
806
930
|
}
|
807
931
|
}, {
|
808
|
-
key: '
|
809
|
-
value: function
|
810
|
-
var
|
932
|
+
key: 'activate_',
|
933
|
+
value: function activate_(e) {
|
934
|
+
var _this4 = this;
|
811
935
|
|
812
|
-
var
|
813
|
-
var cbProto = Object.getPrototypeOf(nativeCb);
|
936
|
+
var activationState = this.activationState_;
|
814
937
|
|
815
|
-
|
816
|
-
|
817
|
-
|
818
|
-
|
819
|
-
|
820
|
-
|
821
|
-
|
822
|
-
|
823
|
-
|
824
|
-
|
825
|
-
|
826
|
-
|
827
|
-
|
828
|
-
|
938
|
+
if (activationState.isActivated) {
|
939
|
+
return;
|
940
|
+
}
|
941
|
+
|
942
|
+
activationState.isActivated = true;
|
943
|
+
activationState.activationEvent = e;
|
944
|
+
activationState.wasActivatedByPointer = e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
|
945
|
+
|
946
|
+
activationState.activationStartTime = Date.now();
|
947
|
+
requestAnimationFrame(function () {
|
948
|
+
// This needs to be wrapped in an rAF call b/c web browsers
|
949
|
+
// report active states inconsistently when they're called within
|
950
|
+
// event handling code:
|
951
|
+
// - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
|
952
|
+
// - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
|
953
|
+
activationState.wasElementMadeActive = e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
|
954
|
+
if (activationState.wasElementMadeActive) {
|
955
|
+
_this4.animateActivation_();
|
956
|
+
} else {
|
957
|
+
// Reset activation state immediately if element was not made active.
|
958
|
+
_this4.activationState_ = _this4.defaultActivationState_();
|
829
959
|
}
|
830
960
|
});
|
831
961
|
}
|
832
962
|
}, {
|
833
|
-
key: '
|
834
|
-
value: function
|
835
|
-
var
|
836
|
-
var cbProto = Object.getPrototypeOf(nativeCb);
|
963
|
+
key: 'animateActivation_',
|
964
|
+
value: function animateActivation_() {
|
965
|
+
var _this5 = this;
|
837
966
|
|
838
|
-
|
839
|
-
|
840
|
-
|
841
|
-
|
842
|
-
|
967
|
+
var _MDCRippleFoundation$2 = MDCRippleFoundation.cssClasses,
|
968
|
+
BG_ACTIVE = _MDCRippleFoundation$2.BG_ACTIVE,
|
969
|
+
BG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$2.BG_BOUNDED_ACTIVE_FILL,
|
970
|
+
FG_UNBOUNDED_DEACTIVATION = _MDCRippleFoundation$2.FG_UNBOUNDED_DEACTIVATION,
|
971
|
+
FG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$2.FG_BOUNDED_ACTIVE_FILL;
|
972
|
+
|
973
|
+
// If ripple is currently deactivating, cancel those animations.
|
974
|
+
|
975
|
+
[BG_BOUNDED_ACTIVE_FILL, FG_UNBOUNDED_DEACTIVATION, FG_BOUNDED_ACTIVE_FILL].forEach(function (c) {
|
976
|
+
return _this5.adapter_.removeClass(c);
|
843
977
|
});
|
978
|
+
this.cancelBgBounded_();
|
979
|
+
this.cancelFgBounded_();
|
980
|
+
this.cancelFgUnbounded_();
|
981
|
+
if (this.unboundedOpacityFadeTimer_) {
|
982
|
+
clearTimeout(this.unboundedOpacityFadeTimer_);
|
983
|
+
this.unboundedOpacityFadeTimer_ = 0;
|
984
|
+
}
|
985
|
+
|
986
|
+
this.adapter_.addClass(BG_ACTIVE);
|
987
|
+
if (this.adapter_.isUnbounded()) {
|
988
|
+
this.animateUnboundedActivation_();
|
989
|
+
}
|
844
990
|
}
|
845
991
|
}, {
|
846
|
-
key: '
|
847
|
-
value: function
|
848
|
-
var
|
849
|
-
|
992
|
+
key: 'animateUnboundedActivation_',
|
993
|
+
value: function animateUnboundedActivation_() {
|
994
|
+
var FG_UNBOUNDED_ACTIVATION = MDCRippleFoundation.cssClasses.FG_UNBOUNDED_ACTIVATION;
|
995
|
+
|
996
|
+
this.adapter_.addClass(FG_UNBOUNDED_ACTIVATION);
|
997
|
+
}
|
998
|
+
}, {
|
999
|
+
key: 'deactivate_',
|
1000
|
+
value: function deactivate_(e) {
|
1001
|
+
var _this6 = this;
|
1002
|
+
|
1003
|
+
var activationState = this.activationState_;
|
1004
|
+
// This can happen in scenarios such as when you have a keyup event that blurs the element.
|
1005
|
+
|
1006
|
+
if (!activationState.isActivated) {
|
850
1007
|
return;
|
851
1008
|
}
|
852
|
-
var
|
853
|
-
var
|
854
|
-
|
855
|
-
|
1009
|
+
var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
|
1010
|
+
var expectedActivationType = activationState.activationEvent.type;
|
1011
|
+
// NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
|
1012
|
+
// Essentially, what we need to do here is decouple the deactivation UX from the actual
|
1013
|
+
// deactivation state itself. This way, touch/pointer events in sequence do not trample one
|
1014
|
+
// another.
|
1015
|
+
var needsDeactivationUX = actualActivationType === expectedActivationType;
|
1016
|
+
var needsActualDeactivation = needsDeactivationUX;
|
1017
|
+
if (activationState.wasActivatedByPointer) {
|
1018
|
+
needsActualDeactivation = e.type === 'mouseup';
|
856
1019
|
}
|
857
1020
|
|
858
|
-
|
859
|
-
|
860
|
-
|
861
|
-
|
862
|
-
|
863
|
-
this.adapter_.removeClass(this.currentAnimationClass_);
|
1021
|
+
var state = _extends({}, this.activationState_);
|
1022
|
+
if (needsDeactivationUX) {
|
1023
|
+
requestAnimationFrame(function () {
|
1024
|
+
return _this6.animateDeactivation_(e, state);
|
1025
|
+
});
|
864
1026
|
}
|
865
|
-
|
866
|
-
|
867
|
-
this.currentCheckState_ = newState;
|
868
|
-
|
869
|
-
// Check for parentNode so that animations are only run when the element is attached
|
870
|
-
// to the DOM.
|
871
|
-
if (this.adapter_.isAttachedToDOM() && this.currentAnimationClass_.length > 0) {
|
872
|
-
this.adapter_.addClass(this.currentAnimationClass_);
|
873
|
-
this.adapter_.registerAnimationEndHandler(this.animEndHandler_);
|
1027
|
+
if (needsActualDeactivation) {
|
1028
|
+
this.activationState_ = this.defaultActivationState_();
|
874
1029
|
}
|
875
1030
|
}
|
876
1031
|
}, {
|
877
|
-
key: '
|
878
|
-
value: function
|
879
|
-
var
|
880
|
-
|
881
|
-
|
882
|
-
|
1032
|
+
key: 'animateDeactivation_',
|
1033
|
+
value: function animateDeactivation_(e, _ref) {
|
1034
|
+
var wasActivatedByPointer = _ref.wasActivatedByPointer,
|
1035
|
+
wasElementMadeActive = _ref.wasElementMadeActive,
|
1036
|
+
activationStartTime = _ref.activationStartTime;
|
1037
|
+
var BG_ACTIVE = MDCRippleFoundation.cssClasses.BG_ACTIVE;
|
883
1038
|
|
884
|
-
if (
|
885
|
-
|
1039
|
+
if (wasActivatedByPointer || wasElementMadeActive) {
|
1040
|
+
this.adapter_.removeClass(BG_ACTIVE);
|
1041
|
+
var isPointerEvent = e.type === 'touchend' || e.type === 'pointerup' || e.type === 'mouseup';
|
1042
|
+
if (this.adapter_.isUnbounded()) {
|
1043
|
+
this.animateUnboundedDeactivation_(this.getUnboundedDeactivationInfo_(activationStartTime));
|
1044
|
+
} else {
|
1045
|
+
this.animateBoundedDeactivation_(e, isPointerEvent);
|
1046
|
+
}
|
886
1047
|
}
|
887
|
-
return nativeCb.checked ? TRANSITION_STATE_CHECKED : TRANSITION_STATE_UNCHECKED;
|
888
1048
|
}
|
889
1049
|
}, {
|
890
|
-
key: '
|
891
|
-
value: function
|
892
|
-
var
|
893
|
-
TRANSITION_STATE_CHECKED = _constants.strings.TRANSITION_STATE_CHECKED,
|
894
|
-
TRANSITION_STATE_UNCHECKED = _constants.strings.TRANSITION_STATE_UNCHECKED;
|
895
|
-
var _MDCCheckboxFoundatio = MDCCheckboxFoundation.cssClasses,
|
896
|
-
ANIM_UNCHECKED_CHECKED = _MDCCheckboxFoundatio.ANIM_UNCHECKED_CHECKED,
|
897
|
-
ANIM_UNCHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_UNCHECKED_INDETERMINATE,
|
898
|
-
ANIM_CHECKED_UNCHECKED = _MDCCheckboxFoundatio.ANIM_CHECKED_UNCHECKED,
|
899
|
-
ANIM_CHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_CHECKED_INDETERMINATE,
|
900
|
-
ANIM_INDETERMINATE_CHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_CHECKED,
|
901
|
-
ANIM_INDETERMINATE_UNCHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_UNCHECKED;
|
1050
|
+
key: 'animateUnboundedDeactivation_',
|
1051
|
+
value: function animateUnboundedDeactivation_(_ref2) {
|
1052
|
+
var _this7 = this;
|
902
1053
|
|
1054
|
+
var opacityDuration = _ref2.opacityDuration,
|
1055
|
+
transformDuration = _ref2.transformDuration,
|
1056
|
+
approxCurScale = _ref2.approxCurScale;
|
1057
|
+
var _MDCRippleFoundation$3 = MDCRippleFoundation.cssClasses,
|
1058
|
+
FG_UNBOUNDED_ACTIVATION = _MDCRippleFoundation$3.FG_UNBOUNDED_ACTIVATION,
|
1059
|
+
FG_UNBOUNDED_DEACTIVATION = _MDCRippleFoundation$3.FG_UNBOUNDED_DEACTIVATION;
|
1060
|
+
var _MDCRippleFoundation$4 = MDCRippleFoundation.strings,
|
1061
|
+
VAR_FG_UNBOUNDED_OPACITY_DURATION = _MDCRippleFoundation$4.VAR_FG_UNBOUNDED_OPACITY_DURATION,
|
1062
|
+
VAR_FG_UNBOUNDED_TRANSFORM_DURATION = _MDCRippleFoundation$4.VAR_FG_UNBOUNDED_TRANSFORM_DURATION,
|
1063
|
+
VAR_FG_APPROX_XF = _MDCRippleFoundation$4.VAR_FG_APPROX_XF;
|
903
1064
|
|
904
|
-
|
905
|
-
|
906
|
-
|
907
|
-
|
908
|
-
|
909
|
-
|
910
|
-
|
911
|
-
|
912
|
-
|
913
|
-
return newState === TRANSITION_STATE_UNCHECKED ? ANIM_CHECKED_UNCHECKED : ANIM_CHECKED_INDETERMINATE;
|
914
|
-
// TRANSITION_STATE_INDETERMINATE
|
915
|
-
default:
|
916
|
-
return newState === TRANSITION_STATE_CHECKED ? ANIM_INDETERMINATE_CHECKED : ANIM_INDETERMINATE_UNCHECKED;
|
917
|
-
}
|
1065
|
+
this.adapter_.updateCssVariable(VAR_FG_APPROX_XF, 'scale(' + approxCurScale + ')');
|
1066
|
+
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_OPACITY_DURATION, opacityDuration + 'ms');
|
1067
|
+
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_TRANSFORM_DURATION, transformDuration + 'ms');
|
1068
|
+
this.adapter_.addClass(FG_UNBOUNDED_DEACTIVATION);
|
1069
|
+
this.adapter_.removeClass(FG_UNBOUNDED_ACTIVATION);
|
1070
|
+
// We use setTimeout here since we know how long the fade will take.
|
1071
|
+
this.unboundedOpacityFadeTimer_ = setTimeout(function () {
|
1072
|
+
_this7.adapter_.removeClass(FG_UNBOUNDED_DEACTIVATION);
|
1073
|
+
}, opacityDuration);
|
918
1074
|
}
|
919
1075
|
}, {
|
920
|
-
key: '
|
921
|
-
value: function
|
922
|
-
|
923
|
-
|
924
|
-
|
925
|
-
|
926
|
-
|
927
|
-
|
928
|
-
|
1076
|
+
key: 'getUnboundedDeactivationInfo_',
|
1077
|
+
value: function getUnboundedDeactivationInfo_(activationStartTime) {
|
1078
|
+
var msElapsed = Date.now() - activationStartTime;
|
1079
|
+
var _MDCRippleFoundation$5 = MDCRippleFoundation.numbers,
|
1080
|
+
FG_TRANSFORM_DELAY_MS = _MDCRippleFoundation$5.FG_TRANSFORM_DELAY_MS,
|
1081
|
+
OPACITY_DURATION_DIVISOR = _MDCRippleFoundation$5.OPACITY_DURATION_DIVISOR,
|
1082
|
+
ACTIVE_OPACITY_DURATION_MS = _MDCRippleFoundation$5.ACTIVE_OPACITY_DURATION_MS,
|
1083
|
+
UNBOUNDED_TRANSFORM_DURATION_MS = _MDCRippleFoundation$5.UNBOUNDED_TRANSFORM_DURATION_MS,
|
1084
|
+
MIN_OPACITY_DURATION_MS = _MDCRippleFoundation$5.MIN_OPACITY_DURATION_MS;
|
929
1085
|
|
930
|
-
return MDCCheckboxFoundation;
|
931
|
-
}(_base.MDCFoundation);
|
932
1086
|
|
933
|
-
|
1087
|
+
var approxCurScale = 0;
|
1088
|
+
if (msElapsed > FG_TRANSFORM_DELAY_MS) {
|
1089
|
+
var percentComplete = Math.min((msElapsed - FG_TRANSFORM_DELAY_MS) / this.xfDuration_, 1);
|
1090
|
+
approxCurScale = percentComplete * this.fgScale_;
|
1091
|
+
}
|
934
1092
|
|
1093
|
+
var transformDuration = UNBOUNDED_TRANSFORM_DURATION_MS;
|
1094
|
+
var approxOpacity = Math.min(msElapsed / ACTIVE_OPACITY_DURATION_MS, 1);
|
1095
|
+
var opacityDuration = Math.max(MIN_OPACITY_DURATION_MS, 1000 * approxOpacity / OPACITY_DURATION_DIVISOR);
|
935
1096
|
|
936
|
-
|
937
|
-
|
938
|
-
|
1097
|
+
return { transformDuration: transformDuration, opacityDuration: opacityDuration, approxCurScale: approxCurScale };
|
1098
|
+
}
|
1099
|
+
}, {
|
1100
|
+
key: 'animateBoundedDeactivation_',
|
1101
|
+
value: function animateBoundedDeactivation_(e, isPointerEvent) {
|
1102
|
+
var startPoint = void 0;
|
1103
|
+
if (isPointerEvent) {
|
1104
|
+
startPoint = (0, _util.getNormalizedEventCoords)(e, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
|
1105
|
+
} else {
|
1106
|
+
startPoint = {
|
1107
|
+
x: this.frame_.width / 2,
|
1108
|
+
y: this.frame_.height / 2
|
1109
|
+
};
|
1110
|
+
}
|
1111
|
+
|
1112
|
+
startPoint = {
|
1113
|
+
x: startPoint.x - this.initialSize_ / 2,
|
1114
|
+
y: startPoint.y - this.initialSize_ / 2
|
1115
|
+
};
|
1116
|
+
|
1117
|
+
var endPoint = {
|
1118
|
+
x: this.frame_.width / 2 - this.initialSize_ / 2,
|
1119
|
+
y: this.frame_.height / 2 - this.initialSize_ / 2
|
1120
|
+
};
|
1121
|
+
|
1122
|
+
var _MDCRippleFoundation$6 = MDCRippleFoundation.strings,
|
1123
|
+
VAR_FG_TRANSLATE_START = _MDCRippleFoundation$6.VAR_FG_TRANSLATE_START,
|
1124
|
+
VAR_FG_TRANSLATE_END = _MDCRippleFoundation$6.VAR_FG_TRANSLATE_END;
|
1125
|
+
var _MDCRippleFoundation$7 = MDCRippleFoundation.cssClasses,
|
1126
|
+
BG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$7.BG_BOUNDED_ACTIVE_FILL,
|
1127
|
+
FG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$7.FG_BOUNDED_ACTIVE_FILL;
|
1128
|
+
|
1129
|
+
this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_START, startPoint.x + 'px, ' + startPoint.y + 'px');
|
1130
|
+
this.adapter_.updateCssVariable(VAR_FG_TRANSLATE_END, endPoint.x + 'px, ' + endPoint.y + 'px');
|
1131
|
+
this.cancelBgBounded_ = (0, _util.animateWithClass)(this.adapter_, BG_BOUNDED_ACTIVE_FILL, (0, _animation.getCorrectEventName)(window, 'transitionend'));
|
1132
|
+
this.cancelFgBounded_ = (0, _util.animateWithClass)(this.adapter_, FG_BOUNDED_ACTIVE_FILL, (0, _animation.getCorrectEventName)(window, 'animationend'));
|
1133
|
+
}
|
1134
|
+
}, {
|
1135
|
+
key: 'destroy',
|
1136
|
+
value: function destroy() {
|
1137
|
+
var _this8 = this;
|
1138
|
+
|
1139
|
+
if (!this.isSupported_) {
|
1140
|
+
return;
|
1141
|
+
}
|
1142
|
+
this.removeEventListeners_();
|
1143
|
+
|
1144
|
+
var _MDCRippleFoundation$8 = MDCRippleFoundation.cssClasses,
|
1145
|
+
ROOT = _MDCRippleFoundation$8.ROOT,
|
1146
|
+
UNBOUNDED = _MDCRippleFoundation$8.UNBOUNDED;
|
1147
|
+
|
1148
|
+
requestAnimationFrame(function () {
|
1149
|
+
_this8.adapter_.removeClass(ROOT);
|
1150
|
+
_this8.adapter_.removeClass(UNBOUNDED);
|
1151
|
+
_this8.removeCssVars_();
|
1152
|
+
});
|
1153
|
+
}
|
1154
|
+
}, {
|
1155
|
+
key: 'removeEventListeners_',
|
1156
|
+
value: function removeEventListeners_() {
|
1157
|
+
var _this9 = this;
|
1158
|
+
|
1159
|
+
this.listenerInfos_.forEach(function (info) {
|
1160
|
+
Object.keys(info).forEach(function (k) {
|
1161
|
+
_this9.adapter_.deregisterInteractionHandler(info[k], _this9.listeners_[k]);
|
1162
|
+
});
|
1163
|
+
});
|
1164
|
+
this.adapter_.deregisterResizeHandler(this.resizeHandler_);
|
1165
|
+
}
|
1166
|
+
}, {
|
1167
|
+
key: 'removeCssVars_',
|
1168
|
+
value: function removeCssVars_() {
|
1169
|
+
var _this10 = this;
|
1170
|
+
|
1171
|
+
var strings = MDCRippleFoundation.strings;
|
1172
|
+
|
1173
|
+
Object.keys(strings).forEach(function (k) {
|
1174
|
+
if (k.indexOf('VAR_') === 0) {
|
1175
|
+
_this10.adapter_.updateCssVariable(strings[k], null);
|
1176
|
+
}
|
1177
|
+
});
|
1178
|
+
}
|
1179
|
+
}, {
|
1180
|
+
key: 'layout',
|
1181
|
+
value: function layout() {
|
1182
|
+
var _this11 = this;
|
1183
|
+
|
1184
|
+
if (this.layoutFrame_) {
|
1185
|
+
cancelAnimationFrame(this.layoutFrame_);
|
1186
|
+
}
|
1187
|
+
this.layoutFrame_ = requestAnimationFrame(function () {
|
1188
|
+
_this11.layoutInternal_();
|
1189
|
+
_this11.layoutFrame_ = 0;
|
1190
|
+
});
|
1191
|
+
}
|
1192
|
+
}, {
|
1193
|
+
key: 'layoutInternal_',
|
1194
|
+
value: function layoutInternal_() {
|
1195
|
+
this.frame_ = this.adapter_.computeBoundingRect();
|
1196
|
+
|
1197
|
+
var maxDim = Math.max(this.frame_.height, this.frame_.width);
|
1198
|
+
var surfaceDiameter = Math.sqrt(Math.pow(this.frame_.width, 2) + Math.pow(this.frame_.height, 2));
|
1199
|
+
|
1200
|
+
// 60% of the largest dimension of the surface
|
1201
|
+
this.initialSize_ = maxDim * MDCRippleFoundation.numbers.INITIAL_ORIGIN_SCALE;
|
1202
|
+
|
1203
|
+
// Diameter of the surface + 10px
|
1204
|
+
this.maxRadius_ = surfaceDiameter + MDCRippleFoundation.numbers.PADDING;
|
1205
|
+
this.fgScale_ = this.maxRadius_ / this.initialSize_;
|
1206
|
+
this.xfDuration_ = 1000 * Math.sqrt(this.maxRadius_ / 1024);
|
1207
|
+
this.updateLayoutCssVars_();
|
1208
|
+
}
|
1209
|
+
}, {
|
1210
|
+
key: 'updateLayoutCssVars_',
|
1211
|
+
value: function updateLayoutCssVars_() {
|
1212
|
+
var _MDCRippleFoundation$9 = MDCRippleFoundation.strings,
|
1213
|
+
VAR_SURFACE_WIDTH = _MDCRippleFoundation$9.VAR_SURFACE_WIDTH,
|
1214
|
+
VAR_SURFACE_HEIGHT = _MDCRippleFoundation$9.VAR_SURFACE_HEIGHT,
|
1215
|
+
VAR_FG_SIZE = _MDCRippleFoundation$9.VAR_FG_SIZE,
|
1216
|
+
VAR_FG_UNBOUNDED_TRANSFORM_DURATION = _MDCRippleFoundation$9.VAR_FG_UNBOUNDED_TRANSFORM_DURATION,
|
1217
|
+
VAR_LEFT = _MDCRippleFoundation$9.VAR_LEFT,
|
1218
|
+
VAR_TOP = _MDCRippleFoundation$9.VAR_TOP,
|
1219
|
+
VAR_FG_SCALE = _MDCRippleFoundation$9.VAR_FG_SCALE;
|
1220
|
+
|
1221
|
+
|
1222
|
+
this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
|
1223
|
+
this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
|
1224
|
+
this.adapter_.updateCssVariable(VAR_FG_SIZE, this.initialSize_ + 'px');
|
1225
|
+
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_TRANSFORM_DURATION, this.xfDuration_ + 'ms');
|
1226
|
+
this.adapter_.updateCssVariable(VAR_FG_SCALE, this.fgScale_);
|
1227
|
+
|
1228
|
+
if (this.adapter_.isUnbounded()) {
|
1229
|
+
this.unboundedCoords_ = {
|
1230
|
+
left: Math.round(this.frame_.width / 2 - this.initialSize_ / 2),
|
1231
|
+
top: Math.round(this.frame_.height / 2 - this.initialSize_ / 2)
|
1232
|
+
};
|
1233
|
+
|
1234
|
+
this.adapter_.updateCssVariable(VAR_LEFT, this.unboundedCoords_.left + 'px');
|
1235
|
+
this.adapter_.updateCssVariable(VAR_TOP, this.unboundedCoords_.top + 'px');
|
1236
|
+
}
|
1237
|
+
}
|
1238
|
+
}]);
|
1239
|
+
|
1240
|
+
return MDCRippleFoundation;
|
1241
|
+
}(_base.MDCFoundation);
|
1242
|
+
|
1243
|
+
exports.default = MDCRippleFoundation;
|
939
1244
|
|
940
1245
|
/***/ },
|
941
1246
|
/* 7 */
|
@@ -946,6 +1251,8 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
946
1251
|
Object.defineProperty(exports, "__esModule", {
|
947
1252
|
value: true
|
948
1253
|
});
|
1254
|
+
exports.getCorrectEventName = getCorrectEventName;
|
1255
|
+
exports.getCorrectPropertyName = getCorrectPropertyName;
|
949
1256
|
/**
|
950
1257
|
* Copyright 2016 Google Inc. All Rights Reserved.
|
951
1258
|
*
|
@@ -962,367 +1269,260 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
962
1269
|
* limitations under the License.
|
963
1270
|
*/
|
964
1271
|
|
965
|
-
var
|
966
|
-
|
967
|
-
|
968
|
-
|
969
|
-
|
970
|
-
|
971
|
-
|
972
|
-
|
973
|
-
|
974
|
-
|
975
|
-
|
976
|
-
|
977
|
-
|
978
|
-
|
979
|
-
|
980
|
-
|
981
|
-
|
982
|
-
TRANSITION_STATE_INIT: 'init',
|
983
|
-
TRANSITION_STATE_CHECKED: 'checked',
|
984
|
-
TRANSITION_STATE_UNCHECKED: 'unchecked',
|
985
|
-
TRANSITION_STATE_INDETERMINATE: 'indeterminate'
|
1272
|
+
var eventTypeMap = {
|
1273
|
+
animationstart: {
|
1274
|
+
noPrefix: 'animationstart',
|
1275
|
+
webkitPrefix: 'webkitAnimationStart'
|
1276
|
+
},
|
1277
|
+
animationend: {
|
1278
|
+
noPrefix: 'animationend',
|
1279
|
+
webkitPrefix: 'webkitAnimationEnd'
|
1280
|
+
},
|
1281
|
+
animationiteration: {
|
1282
|
+
noPrefix: 'animationiteration',
|
1283
|
+
webkitPrefix: 'webkitAnimationIteration'
|
1284
|
+
},
|
1285
|
+
transitionend: {
|
1286
|
+
noPrefix: 'transitionend',
|
1287
|
+
webkitPrefix: 'webkitTransitionEnd'
|
1288
|
+
}
|
986
1289
|
};
|
987
1290
|
|
988
|
-
var
|
989
|
-
|
1291
|
+
var cssPropertyMap = {
|
1292
|
+
animation: {
|
1293
|
+
noPrefix: 'animation',
|
1294
|
+
webkitPrefix: '-webkit-animation'
|
1295
|
+
},
|
1296
|
+
transform: {
|
1297
|
+
noPrefix: 'transform',
|
1298
|
+
webkitPrefix: '-webkit-transform'
|
1299
|
+
},
|
1300
|
+
transition: {
|
1301
|
+
noPrefix: 'transition',
|
1302
|
+
webkitPrefix: '-webkit-transition'
|
1303
|
+
}
|
990
1304
|
};
|
991
1305
|
|
992
|
-
|
993
|
-
|
994
|
-
|
995
|
-
|
996
|
-
'use strict';
|
997
|
-
|
998
|
-
Object.defineProperty(exports, "__esModule", {
|
999
|
-
value: true
|
1000
|
-
});
|
1001
|
-
exports.MDCIconToggle = exports.MDCIconToggleFoundation = undefined;
|
1002
|
-
|
1003
|
-
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; };
|
1004
|
-
|
1005
|
-
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
|
1006
|
-
|
1007
|
-
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; }; }();
|
1008
|
-
|
1009
|
-
var _base = __webpack_require__(1);
|
1010
|
-
|
1011
|
-
var _ripple = __webpack_require__(9);
|
1012
|
-
|
1013
|
-
var _foundation = __webpack_require__(13);
|
1014
|
-
|
1015
|
-
var _foundation2 = _interopRequireDefault(_foundation);
|
1016
|
-
|
1017
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
1018
|
-
|
1019
|
-
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
1020
|
-
|
1021
|
-
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; }
|
1022
|
-
|
1023
|
-
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; } /**
|
1024
|
-
* Copyright 2016 Google Inc. All Rights Reserved.
|
1025
|
-
*
|
1026
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
1027
|
-
* you may not use this file except in compliance with the License.
|
1028
|
-
* You may obtain a copy of the License at
|
1029
|
-
*
|
1030
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
1031
|
-
*
|
1032
|
-
* Unless required by applicable law or agreed to in writing, software
|
1033
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
1034
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1035
|
-
* See the License for the specific language governing permissions and
|
1036
|
-
* limitations under the License.
|
1037
|
-
*/
|
1038
|
-
|
1039
|
-
exports.MDCIconToggleFoundation = _foundation2.default;
|
1040
|
-
|
1041
|
-
var MDCIconToggle = exports.MDCIconToggle = function (_MDCComponent) {
|
1042
|
-
_inherits(MDCIconToggle, _MDCComponent);
|
1043
|
-
|
1044
|
-
_createClass(MDCIconToggle, null, [{
|
1045
|
-
key: 'attachTo',
|
1046
|
-
value: function attachTo(root) {
|
1047
|
-
return new MDCIconToggle(root);
|
1048
|
-
}
|
1049
|
-
}]);
|
1050
|
-
|
1051
|
-
function MDCIconToggle() {
|
1052
|
-
var _ref;
|
1053
|
-
|
1054
|
-
_classCallCheck(this, MDCIconToggle);
|
1055
|
-
|
1056
|
-
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
1057
|
-
args[_key] = arguments[_key];
|
1058
|
-
}
|
1306
|
+
function hasProperShape(windowObj) {
|
1307
|
+
return windowObj.document !== undefined && typeof windowObj.document.createElement === 'function';
|
1308
|
+
}
|
1059
1309
|
|
1060
|
-
|
1310
|
+
function eventFoundInMaps(eventType) {
|
1311
|
+
return eventType in eventTypeMap || eventType in cssPropertyMap;
|
1312
|
+
}
|
1061
1313
|
|
1062
|
-
|
1063
|
-
|
1314
|
+
// If 'animation' or 'transition' exist as style property, webkit prefix isn't necessary. Since we are unable to
|
1315
|
+
// see the event types on the element, we must rely on the corresponding style properties.
|
1316
|
+
function getJavaScriptEventName(eventType, map, el) {
|
1317
|
+
switch (eventType) {
|
1318
|
+
case 'animationstart':
|
1319
|
+
case 'animationend':
|
1320
|
+
case 'animationiteration':
|
1321
|
+
return 'animation' in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
1322
|
+
case 'transitionend':
|
1323
|
+
return 'transition' in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
1324
|
+
default:
|
1325
|
+
return map[eventType].noPrefix;
|
1064
1326
|
}
|
1327
|
+
}
|
1065
1328
|
|
1066
|
-
|
1067
|
-
|
1068
|
-
|
1069
|
-
|
1070
|
-
|
1071
|
-
|
1072
|
-
|
1073
|
-
|
1074
|
-
|
1075
|
-
|
1076
|
-
|
1077
|
-
|
1078
|
-
|
1079
|
-
|
1329
|
+
// Helper function to determine browser prefix for CSS3 animation events
|
1330
|
+
// and property names
|
1331
|
+
//
|
1332
|
+
// Parameters:
|
1333
|
+
// windowObject: Object -- Contains Document with a `createElement()` method
|
1334
|
+
// eventType: string -- The type of animation
|
1335
|
+
//
|
1336
|
+
// returns the value of the event as a string, prefixed if necessary.
|
1337
|
+
// If proper arguments are not supplied, this function will return
|
1338
|
+
// the property or event type without webkit prefix.
|
1339
|
+
//
|
1340
|
+
function getAnimationName(windowObj, eventType) {
|
1341
|
+
if (!hasProperShape(windowObj) || !eventFoundInMaps(eventType)) {
|
1342
|
+
return eventType;
|
1343
|
+
}
|
1080
1344
|
|
1081
|
-
|
1082
|
-
|
1083
|
-
|
1345
|
+
var map = eventType in eventTypeMap ? eventTypeMap : cssPropertyMap;
|
1346
|
+
var el = windowObj.document.createElement('div');
|
1347
|
+
var eventName = '';
|
1084
1348
|
|
1085
|
-
|
1086
|
-
|
1087
|
-
|
1088
|
-
|
1089
|
-
|
1090
|
-
right: left + dim,
|
1091
|
-
bottom: left + dim
|
1092
|
-
};
|
1093
|
-
}
|
1094
|
-
});
|
1095
|
-
var foundation = new _ripple.MDCRippleFoundation(adapter);
|
1096
|
-
return new _ripple.MDCRipple(this.root_, foundation);
|
1097
|
-
}
|
1098
|
-
}, {
|
1099
|
-
key: 'destroy',
|
1100
|
-
value: function destroy() {
|
1101
|
-
this.ripple_.destroy();
|
1102
|
-
_get(MDCIconToggle.prototype.__proto__ || Object.getPrototypeOf(MDCIconToggle.prototype), 'destroy', this).call(this);
|
1103
|
-
}
|
1104
|
-
}, {
|
1105
|
-
key: 'getDefaultFoundation',
|
1106
|
-
value: function getDefaultFoundation() {
|
1107
|
-
var _this3 = this;
|
1349
|
+
if (map === eventTypeMap) {
|
1350
|
+
eventName = getJavaScriptEventName(eventType, map, el);
|
1351
|
+
} else {
|
1352
|
+
eventName = map[eventType].noPrefix in el.style ? map[eventType].noPrefix : map[eventType].webkitPrefix;
|
1353
|
+
}
|
1108
1354
|
|
1109
|
-
|
1110
|
-
|
1111
|
-
return _this3.iconEl_.classList.add(className);
|
1112
|
-
},
|
1113
|
-
removeClass: function removeClass(className) {
|
1114
|
-
return _this3.iconEl_.classList.remove(className);
|
1115
|
-
},
|
1116
|
-
registerInteractionHandler: function registerInteractionHandler(type, handler) {
|
1117
|
-
return _this3.root_.addEventListener(type, handler);
|
1118
|
-
},
|
1119
|
-
deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
|
1120
|
-
return _this3.root_.removeEventListener(type, handler);
|
1121
|
-
},
|
1122
|
-
setText: function setText(text) {
|
1123
|
-
_this3.iconEl_.textContent = text;
|
1124
|
-
},
|
1125
|
-
getTabIndex: function getTabIndex() {
|
1126
|
-
return (/* number */_this3.root_.tabIndex
|
1127
|
-
);
|
1128
|
-
},
|
1129
|
-
setTabIndex: function setTabIndex(tabIndex) {
|
1130
|
-
_this3.root_.tabIndex = tabIndex;
|
1131
|
-
},
|
1132
|
-
getAttr: function getAttr(name, value) {
|
1133
|
-
return _this3.root_.getAttribute(name, value);
|
1134
|
-
},
|
1135
|
-
setAttr: function setAttr(name, value) {
|
1136
|
-
return _this3.root_.setAttribute(name, value);
|
1137
|
-
},
|
1138
|
-
rmAttr: function rmAttr(name, value) {
|
1139
|
-
return _this3.root_.removeAttribute(name, value);
|
1140
|
-
},
|
1141
|
-
notifyChange: function notifyChange(evtData) {
|
1142
|
-
return _this3.emit('MDCIconToggle:change', evtData);
|
1143
|
-
}
|
1144
|
-
});
|
1145
|
-
}
|
1146
|
-
}, {
|
1147
|
-
key: 'initialSyncWithDOM',
|
1148
|
-
value: function initialSyncWithDOM() {
|
1149
|
-
this.on = this.root_.getAttribute(_foundation2.default.strings.ARIA_PRESSED) === 'true';
|
1150
|
-
this.disabled = this.root_.getAttribute(_foundation2.default.strings.ARIA_DISABLED) === 'true';
|
1151
|
-
}
|
1152
|
-
}, {
|
1153
|
-
key: 'refreshToggleData',
|
1154
|
-
value: function refreshToggleData() {
|
1155
|
-
this.foundation_.refreshToggleData();
|
1156
|
-
}
|
1157
|
-
}, {
|
1158
|
-
key: 'iconEl_',
|
1159
|
-
get: function get() {
|
1160
|
-
var sel = this.root_.dataset.iconInnerSelector;
|
1355
|
+
return eventName;
|
1356
|
+
}
|
1161
1357
|
|
1162
|
-
|
1163
|
-
|
1164
|
-
|
1165
|
-
|
1166
|
-
|
1167
|
-
|
1168
|
-
|
1169
|
-
|
1170
|
-
|
1171
|
-
|
1172
|
-
|
1173
|
-
|
1174
|
-
|
1175
|
-
|
1176
|
-
},
|
1177
|
-
set: function set(isDisabled) {
|
1178
|
-
this.foundation_.setDisabled(isDisabled);
|
1179
|
-
}
|
1180
|
-
}]);
|
1358
|
+
// Public functions to access getAnimationName() for JavaScript events or CSS
|
1359
|
+
// property names.
|
1360
|
+
//
|
1361
|
+
// Parameters:
|
1362
|
+
// windowObject: Object -- Contains Document with a `createElement()` method
|
1363
|
+
// eventType: string -- The type of animation
|
1364
|
+
//
|
1365
|
+
// returns the value of the event as a string, prefixed if necessary.
|
1366
|
+
// If proper arguments are not supplied, this function will return
|
1367
|
+
// the property or event type without webkit prefix.
|
1368
|
+
//
|
1369
|
+
function getCorrectEventName(windowObj, eventType) {
|
1370
|
+
return getAnimationName(windowObj, eventType);
|
1371
|
+
}
|
1181
1372
|
|
1182
|
-
|
1183
|
-
|
1373
|
+
function getCorrectPropertyName(windowObj, eventType) {
|
1374
|
+
return getAnimationName(windowObj, eventType);
|
1375
|
+
}
|
1184
1376
|
|
1185
1377
|
/***/ },
|
1186
|
-
/*
|
1187
|
-
/***/ function(module, exports
|
1378
|
+
/* 8 */
|
1379
|
+
/***/ function(module, exports) {
|
1188
1380
|
|
1189
1381
|
'use strict';
|
1190
1382
|
|
1191
1383
|
Object.defineProperty(exports, "__esModule", {
|
1192
1384
|
value: true
|
1193
1385
|
});
|
1194
|
-
|
1386
|
+
/**
|
1387
|
+
* Copyright 2016 Google Inc. All Rights Reserved.
|
1388
|
+
*
|
1389
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
1390
|
+
* you may not use this file except in compliance with the License.
|
1391
|
+
* You may obtain a copy of the License at
|
1392
|
+
*
|
1393
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
1394
|
+
*
|
1395
|
+
* Unless required by applicable law or agreed to in writing, software
|
1396
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
1397
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1398
|
+
* See the License for the specific language governing permissions and
|
1399
|
+
* limitations under the License.
|
1400
|
+
*/
|
1195
1401
|
|
1196
|
-
var
|
1402
|
+
var ROOT = exports.ROOT = 'mdc-ripple';
|
1403
|
+
var UPGRADED = exports.UPGRADED = ROOT + '-upgraded';
|
1197
1404
|
|
1198
|
-
var
|
1405
|
+
var cssClasses = exports.cssClasses = {
|
1406
|
+
// Ripple is a special case where the "root" component is really a "mixin" of sorts,
|
1407
|
+
// given that it's an 'upgrade' to an existing component. That being said it is the root
|
1408
|
+
// CSS class that all other CSS classes derive from.
|
1409
|
+
ROOT: UPGRADED,
|
1410
|
+
UNBOUNDED: UPGRADED + '--unbounded',
|
1411
|
+
BG_ACTIVE: UPGRADED + '--background-active',
|
1412
|
+
BG_BOUNDED_ACTIVE_FILL: UPGRADED + '--background-bounded-active-fill',
|
1413
|
+
FG_BOUNDED_ACTIVE_FILL: UPGRADED + '--foreground-bounded-active-fill',
|
1414
|
+
FG_UNBOUNDED_ACTIVATION: UPGRADED + '--foreground-unbounded-activation',
|
1415
|
+
FG_UNBOUNDED_DEACTIVATION: UPGRADED + '--foreground-unbounded-deactivation'
|
1416
|
+
};
|
1199
1417
|
|
1200
|
-
var
|
1418
|
+
var strings = exports.strings = {
|
1419
|
+
VAR_SURFACE_WIDTH: '--' + ROOT + '-surface-width',
|
1420
|
+
VAR_SURFACE_HEIGHT: '--' + ROOT + '-surface-height',
|
1421
|
+
VAR_FG_SIZE: '--' + ROOT + '-fg-size',
|
1422
|
+
VAR_FG_UNBOUNDED_OPACITY_DURATION: '--' + ROOT + '-fg-unbounded-opacity-duration',
|
1423
|
+
VAR_FG_UNBOUNDED_TRANSFORM_DURATION: '--' + ROOT + '-fg-unbounded-transform-duration',
|
1424
|
+
VAR_LEFT: '--' + ROOT + '-left',
|
1425
|
+
VAR_TOP: '--' + ROOT + '-top',
|
1426
|
+
VAR_TRANSLATE_END: '--' + ROOT + '-translate-end',
|
1427
|
+
VAR_FG_APPROX_XF: '--' + ROOT + '-fg-approx-xf',
|
1428
|
+
VAR_FG_SCALE: '--' + ROOT + '-fg-scale',
|
1429
|
+
VAR_FG_TRANSLATE_START: '--' + ROOT + '-fg-translate-start',
|
1430
|
+
VAR_FG_TRANSLATE_END: '--' + ROOT + '-fg-translate-end'
|
1431
|
+
};
|
1201
1432
|
|
1202
|
-
var
|
1433
|
+
var numbers = exports.numbers = {
|
1434
|
+
FG_TRANSFORM_DELAY_MS: 80,
|
1435
|
+
OPACITY_DURATION_DIVISOR: 3,
|
1436
|
+
ACTIVE_OPACITY_DURATION_MS: 110,
|
1437
|
+
MIN_OPACITY_DURATION_MS: 200,
|
1438
|
+
UNBOUNDED_TRANSFORM_DURATION_MS: 200,
|
1439
|
+
PADDING: 10,
|
1440
|
+
INITIAL_ORIGIN_SCALE: 0.6
|
1441
|
+
};
|
1203
1442
|
|
1204
|
-
|
1443
|
+
/***/ },
|
1444
|
+
/* 9 */
|
1445
|
+
/***/ function(module, exports) {
|
1205
1446
|
|
1206
|
-
|
1447
|
+
'use strict';
|
1207
1448
|
|
1208
|
-
|
1449
|
+
Object.defineProperty(exports, "__esModule", {
|
1450
|
+
value: true
|
1451
|
+
});
|
1452
|
+
exports.supportsCssVariables = supportsCssVariables;
|
1453
|
+
exports.getMatchesProperty = getMatchesProperty;
|
1454
|
+
exports.animateWithClass = animateWithClass;
|
1455
|
+
exports.getNormalizedEventCoords = getNormalizedEventCoords;
|
1456
|
+
/**
|
1457
|
+
* Copyright 2016 Google Inc. All Rights Reserved.
|
1458
|
+
*
|
1459
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
1460
|
+
* you may not use this file except in compliance with the License.
|
1461
|
+
* You may obtain a copy of the License at
|
1462
|
+
*
|
1463
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
1464
|
+
*
|
1465
|
+
* Unless required by applicable law or agreed to in writing, software
|
1466
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
1467
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1468
|
+
* See the License for the specific language governing permissions and
|
1469
|
+
* limitations under the License.
|
1470
|
+
*/
|
1209
1471
|
|
1210
|
-
function
|
1472
|
+
function supportsCssVariables(windowObj) {
|
1473
|
+
var supportsFunctionPresent = windowObj.CSS && typeof windowObj.CSS.supports === 'function';
|
1474
|
+
if (!supportsFunctionPresent) {
|
1475
|
+
return;
|
1476
|
+
}
|
1211
1477
|
|
1212
|
-
|
1213
|
-
|
1214
|
-
|
1215
|
-
|
1216
|
-
|
1217
|
-
|
1218
|
-
*
|
1219
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
1220
|
-
*
|
1221
|
-
* Unless required by applicable law or agreed to in writing, software
|
1222
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
1223
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1224
|
-
* See the License for the specific language governing permissions and
|
1225
|
-
* limitations under the License.
|
1226
|
-
*/
|
1478
|
+
var explicitlySupportsCssVars = windowObj.CSS.supports('--css-vars', 'yes');
|
1479
|
+
// See: https://bugs.webkit.org/show_bug.cgi?id=154669
|
1480
|
+
// See: README section on Safari
|
1481
|
+
var weAreFeatureDetectingSafari10plus = windowObj.CSS.supports('(--css-vars: yes)') && windowObj.CSS.supports('color', '#00000000');
|
1482
|
+
return explicitlySupportsCssVars || weAreFeatureDetectingSafari10plus;
|
1483
|
+
}
|
1227
1484
|
|
1228
|
-
|
1485
|
+
function getMatchesProperty(HTMLElementPrototype) {
|
1486
|
+
return ['webkitMatchesSelector', 'msMatchesSelector', 'matches'].filter(function (p) {
|
1487
|
+
return p in HTMLElementPrototype;
|
1488
|
+
}).pop();
|
1489
|
+
}
|
1229
1490
|
|
1230
|
-
|
1491
|
+
function animateWithClass(rippleAdapter, cls, endEvent) {
|
1492
|
+
var cancelled = false;
|
1493
|
+
var cancel = function cancel() {
|
1494
|
+
if (cancelled) {
|
1495
|
+
return;
|
1496
|
+
}
|
1497
|
+
cancelled = true;
|
1498
|
+
rippleAdapter.removeClass(cls);
|
1499
|
+
rippleAdapter.deregisterInteractionHandler(endEvent, cancel);
|
1500
|
+
};
|
1501
|
+
rippleAdapter.registerInteractionHandler(endEvent, cancel);
|
1502
|
+
rippleAdapter.addClass(cls);
|
1503
|
+
return cancel;
|
1504
|
+
}
|
1231
1505
|
|
1232
|
-
|
1233
|
-
|
1506
|
+
function getNormalizedEventCoords(ev, pageOffset, clientRect) {
|
1507
|
+
var x = pageOffset.x,
|
1508
|
+
y = pageOffset.y;
|
1234
1509
|
|
1235
|
-
|
1236
|
-
|
1510
|
+
var documentX = x + clientRect.left;
|
1511
|
+
var documentY = y + clientRect.top;
|
1237
1512
|
|
1238
|
-
|
1513
|
+
var normalizedX = void 0;
|
1514
|
+
var normalizedY = void 0;
|
1515
|
+
// Determine touch point relative to the ripple container.
|
1516
|
+
if (ev.type === 'touchend') {
|
1517
|
+
normalizedX = ev.changedTouches[0].pageX - documentX;
|
1518
|
+
normalizedY = ev.changedTouches[0].pageY - documentY;
|
1519
|
+
} else {
|
1520
|
+
normalizedX = ev.pageX - documentX;
|
1521
|
+
normalizedY = ev.pageY - documentY;
|
1239
1522
|
}
|
1240
1523
|
|
1241
|
-
|
1242
|
-
|
1243
|
-
value: function getDefaultFoundation() {
|
1244
|
-
return new _foundation2.default(MDCRipple.createAdapter(this));
|
1245
|
-
}
|
1246
|
-
}, {
|
1247
|
-
key: 'initialSyncWithDOM',
|
1248
|
-
value: function initialSyncWithDOM() {
|
1249
|
-
this.unbounded = 'mdcRippleIsUnbounded' in this.root_.dataset;
|
1250
|
-
}
|
1251
|
-
}, {
|
1252
|
-
key: 'unbounded',
|
1253
|
-
get: function get() {
|
1254
|
-
return this.unbounded_;
|
1255
|
-
},
|
1256
|
-
set: function set(unbounded) {
|
1257
|
-
var UNBOUNDED = _foundation2.default.cssClasses.UNBOUNDED;
|
1258
|
-
|
1259
|
-
this.unbounded_ = Boolean(unbounded);
|
1260
|
-
if (this.unbounded_) {
|
1261
|
-
this.root_.classList.add(UNBOUNDED);
|
1262
|
-
} else {
|
1263
|
-
this.root_.classList.remove(UNBOUNDED);
|
1264
|
-
}
|
1265
|
-
}
|
1266
|
-
}], [{
|
1267
|
-
key: 'attachTo',
|
1268
|
-
value: function attachTo(root) {
|
1269
|
-
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
|
1270
|
-
_ref$isUnbounded = _ref.isUnbounded,
|
1271
|
-
isUnbounded = _ref$isUnbounded === undefined ? undefined : _ref$isUnbounded;
|
1272
|
-
|
1273
|
-
var ripple = new MDCRipple(root);
|
1274
|
-
// Only override unbounded behavior if option is explicitly specified
|
1275
|
-
if (isUnbounded !== undefined) {
|
1276
|
-
ripple.unbounded = isUnbounded;
|
1277
|
-
}
|
1278
|
-
return ripple;
|
1279
|
-
}
|
1280
|
-
}, {
|
1281
|
-
key: 'createAdapter',
|
1282
|
-
value: function createAdapter(instance) {
|
1283
|
-
return {
|
1284
|
-
browserSupportsCssVars: function browserSupportsCssVars() {
|
1285
|
-
return (0, _util.supportsCssVariables)(window);
|
1286
|
-
},
|
1287
|
-
isUnbounded: function isUnbounded() {
|
1288
|
-
return instance.unbounded;
|
1289
|
-
},
|
1290
|
-
isSurfaceActive: function isSurfaceActive() {
|
1291
|
-
return instance.root_[MATCHES](':active');
|
1292
|
-
},
|
1293
|
-
addClass: function addClass(className) {
|
1294
|
-
return instance.root_.classList.add(className);
|
1295
|
-
},
|
1296
|
-
removeClass: function removeClass(className) {
|
1297
|
-
return instance.root_.classList.remove(className);
|
1298
|
-
},
|
1299
|
-
registerInteractionHandler: function registerInteractionHandler(evtType, handler) {
|
1300
|
-
return instance.root_.addEventListener(evtType, handler);
|
1301
|
-
},
|
1302
|
-
deregisterInteractionHandler: function deregisterInteractionHandler(evtType, handler) {
|
1303
|
-
return instance.root_.removeEventListener(evtType, handler);
|
1304
|
-
},
|
1305
|
-
registerResizeHandler: function registerResizeHandler(handler) {
|
1306
|
-
return window.addEventListener('resize', handler);
|
1307
|
-
},
|
1308
|
-
deregisterResizeHandler: function deregisterResizeHandler(handler) {
|
1309
|
-
return window.removeEventListener('resize', handler);
|
1310
|
-
},
|
1311
|
-
updateCssVariable: function updateCssVariable(varName, value) {
|
1312
|
-
return instance.root_.style.setProperty(varName, value);
|
1313
|
-
},
|
1314
|
-
computeBoundingRect: function computeBoundingRect() {
|
1315
|
-
return instance.root_.getBoundingClientRect();
|
1316
|
-
},
|
1317
|
-
getWindowPageOffset: function getWindowPageOffset() {
|
1318
|
-
return { x: window.pageXOffset, y: window.pageYOffset };
|
1319
|
-
}
|
1320
|
-
};
|
1321
|
-
}
|
1322
|
-
}]);
|
1323
|
-
|
1324
|
-
return MDCRipple;
|
1325
|
-
}(_base.MDCComponent);
|
1524
|
+
return { x: normalizedX, y: normalizedY };
|
1525
|
+
}
|
1326
1526
|
|
1327
1527
|
/***/ },
|
1328
1528
|
/* 10 */
|
@@ -1340,12 +1540,8 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
1340
1540
|
|
1341
1541
|
var _base = __webpack_require__(1);
|
1342
1542
|
|
1343
|
-
var _animation = __webpack_require__(5);
|
1344
|
-
|
1345
1543
|
var _constants = __webpack_require__(11);
|
1346
1544
|
|
1347
|
-
var _util = __webpack_require__(12);
|
1348
|
-
|
1349
1545
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
1350
1546
|
|
1351
1547
|
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; }
|
@@ -1366,29 +1562,12 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
1366
1562
|
* limitations under the License.
|
1367
1563
|
*/
|
1368
1564
|
|
1369
|
-
var
|
1370
|
-
mouseup: 'mousedown',
|
1371
|
-
pointerup: 'pointerdown',
|
1372
|
-
touchend: 'touchstart',
|
1373
|
-
keyup: 'keydown',
|
1374
|
-
blur: 'focus'
|
1375
|
-
};
|
1376
|
-
|
1377
|
-
var MDCRippleFoundation = function (_MDCFoundation) {
|
1378
|
-
_inherits(MDCRippleFoundation, _MDCFoundation);
|
1379
|
-
|
1380
|
-
_createClass(MDCRippleFoundation, [{
|
1381
|
-
key: 'isSupported_',
|
1565
|
+
var CB_PROTO_PROPS = ['checked', 'indeterminate'];
|
1382
1566
|
|
1567
|
+
var MDCCheckboxFoundation = function (_MDCFoundation) {
|
1568
|
+
_inherits(MDCCheckboxFoundation, _MDCFoundation);
|
1383
1569
|
|
1384
|
-
|
1385
|
-
// until the point in time where the foundation requests it. This prevents scenarios where
|
1386
|
-
// client-side feature-detection may happen too early, such as when components are rendered on the server
|
1387
|
-
// and then initialized at mount time on the client.
|
1388
|
-
get: function get() {
|
1389
|
-
return this.adapter_.browserSupportsCssVars();
|
1390
|
-
}
|
1391
|
-
}], [{
|
1570
|
+
_createClass(MDCCheckboxFoundation, null, [{
|
1392
1571
|
key: 'cssClasses',
|
1393
1572
|
get: function get() {
|
1394
1573
|
return _constants.cssClasses;
|
@@ -1407,490 +1586,217 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
1407
1586
|
key: 'defaultAdapter',
|
1408
1587
|
get: function get() {
|
1409
1588
|
return {
|
1410
|
-
browserSupportsCssVars: function browserSupportsCssVars() /* boolean - cached */{},
|
1411
|
-
isUnbounded: function isUnbounded() /* boolean */{},
|
1412
|
-
isSurfaceActive: function isSurfaceActive() /* boolean */{},
|
1413
1589
|
addClass: function addClass() /* className: string */{},
|
1414
1590
|
removeClass: function removeClass() /* className: string */{},
|
1415
|
-
|
1416
|
-
|
1417
|
-
|
1418
|
-
|
1419
|
-
|
1420
|
-
|
1421
|
-
|
1591
|
+
registerAnimationEndHandler: function registerAnimationEndHandler() /* handler: EventListener */{},
|
1592
|
+
deregisterAnimationEndHandler: function deregisterAnimationEndHandler() /* handler: EventListener */{},
|
1593
|
+
registerChangeHandler: function registerChangeHandler() /* handler: EventListener */{},
|
1594
|
+
deregisterChangeHandler: function deregisterChangeHandler() /* handler: EventListener */{},
|
1595
|
+
getNativeControl: function getNativeControl() /* HTMLInputElement */{},
|
1596
|
+
forceLayout: function forceLayout() {},
|
1597
|
+
isAttachedToDOM: function isAttachedToDOM() /* boolean */{}
|
1422
1598
|
};
|
1423
1599
|
}
|
1424
1600
|
}]);
|
1425
1601
|
|
1426
|
-
function
|
1427
|
-
_classCallCheck(this,
|
1602
|
+
function MDCCheckboxFoundation(adapter) {
|
1603
|
+
_classCallCheck(this, MDCCheckboxFoundation);
|
1428
1604
|
|
1429
|
-
var _this = _possibleConstructorReturn(this, (
|
1605
|
+
var _this = _possibleConstructorReturn(this, (MDCCheckboxFoundation.__proto__ || Object.getPrototypeOf(MDCCheckboxFoundation)).call(this, _extends(MDCCheckboxFoundation.defaultAdapter, adapter)));
|
1430
1606
|
|
1431
|
-
_this.
|
1432
|
-
_this.
|
1433
|
-
_this.
|
1434
|
-
_this.
|
1435
|
-
|
1436
|
-
|
1437
|
-
|
1438
|
-
|
1439
|
-
|
1440
|
-
},
|
1441
|
-
deactivate: function deactivate(e) {
|
1442
|
-
return _this.deactivate_(e);
|
1443
|
-
},
|
1444
|
-
focus: function focus() {
|
1445
|
-
return requestAnimationFrame(function () {
|
1446
|
-
return _this.adapter_.addClass(MDCRippleFoundation.cssClasses.BG_ACTIVE);
|
1447
|
-
});
|
1448
|
-
},
|
1449
|
-
blur: function blur() {
|
1450
|
-
return requestAnimationFrame(function () {
|
1451
|
-
return _this.adapter_.removeClass(MDCRippleFoundation.cssClasses.BG_ACTIVE);
|
1452
|
-
});
|
1453
|
-
}
|
1454
|
-
};
|
1455
|
-
_this.unboundedOpacityFadeTimer_ = 0;
|
1456
|
-
_this.resizeHandler_ = function () {
|
1457
|
-
return _this.layout();
|
1607
|
+
_this.currentCheckState_ = _constants.strings.TRANSITION_STATE_INIT;
|
1608
|
+
_this.currentAnimationClass_ = '';
|
1609
|
+
_this.animEndLatchTimer_ = 0;
|
1610
|
+
_this.animEndHandler_ = function () {
|
1611
|
+
clearTimeout(_this.animEndLatchTimer_);
|
1612
|
+
_this.animEndLatchTimer_ = setTimeout(function () {
|
1613
|
+
_this.adapter_.removeClass(_this.currentAnimationClass_);
|
1614
|
+
_this.adapter_.deregisterAnimationEndHandler(_this.animEndHandler_);
|
1615
|
+
}, _constants.numbers.ANIM_END_LATCH_MS);
|
1458
1616
|
};
|
1459
|
-
_this.
|
1460
|
-
|
1461
|
-
_this.cancelFgUnbounded_ = function () {};
|
1462
|
-
_this.unboundedCoords_ = {
|
1463
|
-
left: 0,
|
1464
|
-
top: 0
|
1617
|
+
_this.changeHandler_ = function () {
|
1618
|
+
return _this.transitionCheckState_();
|
1465
1619
|
};
|
1466
1620
|
return _this;
|
1467
1621
|
}
|
1468
1622
|
|
1469
|
-
_createClass(
|
1470
|
-
key: 'defaultActivationState_',
|
1471
|
-
value: function defaultActivationState_() {
|
1472
|
-
return {
|
1473
|
-
isActivated: false,
|
1474
|
-
wasActivatedByPointer: false,
|
1475
|
-
wasElementMadeActive: false,
|
1476
|
-
activationStartTime: 0,
|
1477
|
-
activationEvent: null
|
1478
|
-
};
|
1479
|
-
}
|
1480
|
-
}, {
|
1623
|
+
_createClass(MDCCheckboxFoundation, [{
|
1481
1624
|
key: 'init',
|
1482
1625
|
value: function init() {
|
1483
|
-
|
1484
|
-
|
1485
|
-
if (!this.isSupported_) {
|
1486
|
-
return;
|
1487
|
-
}
|
1488
|
-
this.addEventListeners_();
|
1489
|
-
|
1490
|
-
var _MDCRippleFoundation$ = MDCRippleFoundation.cssClasses,
|
1491
|
-
ROOT = _MDCRippleFoundation$.ROOT,
|
1492
|
-
UNBOUNDED = _MDCRippleFoundation$.UNBOUNDED;
|
1493
|
-
|
1494
|
-
requestAnimationFrame(function () {
|
1495
|
-
_this2.adapter_.addClass(ROOT);
|
1496
|
-
if (_this2.adapter_.isUnbounded()) {
|
1497
|
-
_this2.adapter_.addClass(UNBOUNDED);
|
1498
|
-
}
|
1499
|
-
_this2.layoutInternal_();
|
1500
|
-
});
|
1501
|
-
}
|
1502
|
-
}, {
|
1503
|
-
key: 'addEventListeners_',
|
1504
|
-
value: function addEventListeners_() {
|
1505
|
-
var _this3 = this;
|
1506
|
-
|
1507
|
-
this.listenerInfos_.forEach(function (info) {
|
1508
|
-
Object.keys(info).forEach(function (k) {
|
1509
|
-
_this3.adapter_.registerInteractionHandler(info[k], _this3.listeners_[k]);
|
1510
|
-
});
|
1511
|
-
});
|
1512
|
-
this.adapter_.registerResizeHandler(this.resizeHandler_);
|
1513
|
-
}
|
1514
|
-
}, {
|
1515
|
-
key: 'activate_',
|
1516
|
-
value: function activate_(e) {
|
1517
|
-
var _this4 = this;
|
1518
|
-
|
1519
|
-
var activationState = this.activationState_;
|
1520
|
-
|
1521
|
-
if (activationState.isActivated) {
|
1522
|
-
return;
|
1523
|
-
}
|
1524
|
-
|
1525
|
-
activationState.isActivated = true;
|
1526
|
-
activationState.activationEvent = e;
|
1527
|
-
activationState.wasActivatedByPointer = e.type === 'mousedown' || e.type === 'touchstart' || e.type === 'pointerdown';
|
1528
|
-
|
1529
|
-
activationState.activationStartTime = Date.now();
|
1530
|
-
requestAnimationFrame(function () {
|
1531
|
-
// This needs to be wrapped in an rAF call b/c web browsers
|
1532
|
-
// report active states inconsistently when they're called within
|
1533
|
-
// event handling code:
|
1534
|
-
// - https://bugs.chromium.org/p/chromium/issues/detail?id=635971
|
1535
|
-
// - https://bugzilla.mozilla.org/show_bug.cgi?id=1293741
|
1536
|
-
activationState.wasElementMadeActive = e.type === 'keydown' ? _this4.adapter_.isSurfaceActive() : true;
|
1537
|
-
if (activationState.wasElementMadeActive) {
|
1538
|
-
_this4.animateActivation_();
|
1539
|
-
} else {
|
1540
|
-
// Reset activation state immediately if element was not made active.
|
1541
|
-
_this4.activationState_ = _this4.defaultActivationState_();
|
1542
|
-
}
|
1543
|
-
});
|
1544
|
-
}
|
1545
|
-
}, {
|
1546
|
-
key: 'animateActivation_',
|
1547
|
-
value: function animateActivation_() {
|
1548
|
-
var _this5 = this;
|
1549
|
-
|
1550
|
-
var _MDCRippleFoundation$2 = MDCRippleFoundation.cssClasses,
|
1551
|
-
BG_ACTIVE = _MDCRippleFoundation$2.BG_ACTIVE,
|
1552
|
-
BG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$2.BG_BOUNDED_ACTIVE_FILL,
|
1553
|
-
FG_UNBOUNDED_DEACTIVATION = _MDCRippleFoundation$2.FG_UNBOUNDED_DEACTIVATION,
|
1554
|
-
FG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$2.FG_BOUNDED_ACTIVE_FILL;
|
1555
|
-
|
1556
|
-
// If ripple is currently deactivating, cancel those animations.
|
1557
|
-
|
1558
|
-
[BG_BOUNDED_ACTIVE_FILL, FG_UNBOUNDED_DEACTIVATION, FG_BOUNDED_ACTIVE_FILL].forEach(function (c) {
|
1559
|
-
return _this5.adapter_.removeClass(c);
|
1560
|
-
});
|
1561
|
-
this.cancelBgBounded_();
|
1562
|
-
this.cancelFgBounded_();
|
1563
|
-
this.cancelFgUnbounded_();
|
1564
|
-
if (this.unboundedOpacityFadeTimer_) {
|
1565
|
-
clearTimeout(this.unboundedOpacityFadeTimer_);
|
1566
|
-
this.unboundedOpacityFadeTimer_ = 0;
|
1567
|
-
}
|
1568
|
-
|
1569
|
-
this.adapter_.addClass(BG_ACTIVE);
|
1570
|
-
if (this.adapter_.isUnbounded()) {
|
1571
|
-
this.animateUnboundedActivation_();
|
1572
|
-
}
|
1626
|
+
this.adapter_.registerChangeHandler(this.changeHandler_);
|
1627
|
+
this.installPropertyChangeHooks_();
|
1573
1628
|
}
|
1574
1629
|
}, {
|
1575
|
-
key: '
|
1576
|
-
value: function
|
1577
|
-
|
1578
|
-
|
1579
|
-
var startPoint = void 0;
|
1580
|
-
if (this.activationState_.wasActivatedByPointer) {
|
1581
|
-
startPoint = (0, _util.getNormalizedEventCoords)(this.activationState_.activationEvent, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
|
1582
|
-
} else {
|
1583
|
-
startPoint = {
|
1584
|
-
left: this.frame_.width / 2,
|
1585
|
-
top: this.frame_.height / 2
|
1586
|
-
};
|
1587
|
-
}
|
1588
|
-
var _startPoint = startPoint,
|
1589
|
-
left = _startPoint.left,
|
1590
|
-
top = _startPoint.top;
|
1591
|
-
var _MDCRippleFoundation$3 = MDCRippleFoundation.strings,
|
1592
|
-
VAR_XF_ORIGIN_X = _MDCRippleFoundation$3.VAR_XF_ORIGIN_X,
|
1593
|
-
VAR_XF_ORIGIN_Y = _MDCRippleFoundation$3.VAR_XF_ORIGIN_Y;
|
1594
|
-
|
1595
|
-
this.adapter_.updateCssVariable(VAR_XF_ORIGIN_X, left - this.unboundedCoords_.left + 'px');
|
1596
|
-
this.adapter_.updateCssVariable(VAR_XF_ORIGIN_Y, top - this.unboundedCoords_.top + 'px');
|
1597
|
-
this.adapter_.addClass(FG_UNBOUNDED_ACTIVATION);
|
1630
|
+
key: 'destroy',
|
1631
|
+
value: function destroy() {
|
1632
|
+
this.adapter_.deregisterChangeHandler(this.changeHandler_);
|
1633
|
+
this.uninstallPropertyChangeHooks_();
|
1598
1634
|
}
|
1599
1635
|
}, {
|
1600
|
-
key: '
|
1601
|
-
value: function
|
1602
|
-
|
1603
|
-
|
1604
|
-
var activationState = this.activationState_;
|
1605
|
-
// This can happen in scenarios such as when you have a keyup event that blurs the element.
|
1606
|
-
|
1607
|
-
if (!activationState.isActivated) {
|
1608
|
-
return;
|
1609
|
-
}
|
1610
|
-
var actualActivationType = DEACTIVATION_ACTIVATION_PAIRS[e.type];
|
1611
|
-
var expectedActivationType = activationState.activationEvent.type;
|
1612
|
-
// NOTE: Pointer events are tricky - https://patrickhlauke.github.io/touch/tests/results/
|
1613
|
-
// Essentially, what we need to do here is decouple the deactivation UX from the actual
|
1614
|
-
// deactivation state itself. This way, touch/pointer events in sequence do not trample one
|
1615
|
-
// another.
|
1616
|
-
var needsDeactivationUX = actualActivationType === expectedActivationType;
|
1617
|
-
var needsActualDeactivation = needsDeactivationUX;
|
1618
|
-
if (activationState.wasActivatedByPointer) {
|
1619
|
-
needsActualDeactivation = e.type === 'mouseup';
|
1620
|
-
}
|
1621
|
-
|
1622
|
-
var state = _extends({}, this.activationState_);
|
1623
|
-
if (needsDeactivationUX) {
|
1624
|
-
requestAnimationFrame(function () {
|
1625
|
-
return _this6.animateDeactivation_(e, state);
|
1626
|
-
});
|
1627
|
-
}
|
1628
|
-
if (needsActualDeactivation) {
|
1629
|
-
this.activationState_ = this.defaultActivationState_();
|
1630
|
-
}
|
1636
|
+
key: 'isChecked',
|
1637
|
+
value: function isChecked() {
|
1638
|
+
return this.getNativeControl_().checked;
|
1631
1639
|
}
|
1632
1640
|
}, {
|
1633
|
-
key: '
|
1634
|
-
value: function
|
1635
|
-
|
1636
|
-
wasElementMadeActive = _ref.wasElementMadeActive,
|
1637
|
-
activationStartTime = _ref.activationStartTime;
|
1638
|
-
var BG_ACTIVE = MDCRippleFoundation.cssClasses.BG_ACTIVE;
|
1639
|
-
|
1640
|
-
if (wasActivatedByPointer || wasElementMadeActive) {
|
1641
|
-
this.adapter_.removeClass(BG_ACTIVE);
|
1642
|
-
var isPointerEvent = e.type === 'touchend' || e.type === 'pointerup' || e.type === 'mouseup';
|
1643
|
-
if (this.adapter_.isUnbounded()) {
|
1644
|
-
this.animateUnboundedDeactivation_(this.getUnboundedDeactivationInfo_(activationStartTime));
|
1645
|
-
} else {
|
1646
|
-
this.animateBoundedDeactivation_(e, isPointerEvent);
|
1647
|
-
}
|
1648
|
-
}
|
1641
|
+
key: 'setChecked',
|
1642
|
+
value: function setChecked(checked) {
|
1643
|
+
this.getNativeControl_().checked = checked;
|
1649
1644
|
}
|
1650
1645
|
}, {
|
1651
|
-
key: '
|
1652
|
-
value: function
|
1653
|
-
|
1654
|
-
|
1655
|
-
var opacityDuration = _ref2.opacityDuration,
|
1656
|
-
transformDuration = _ref2.transformDuration,
|
1657
|
-
approxCurScale = _ref2.approxCurScale;
|
1658
|
-
var _MDCRippleFoundation$4 = MDCRippleFoundation.cssClasses,
|
1659
|
-
FG_UNBOUNDED_ACTIVATION = _MDCRippleFoundation$4.FG_UNBOUNDED_ACTIVATION,
|
1660
|
-
FG_UNBOUNDED_DEACTIVATION = _MDCRippleFoundation$4.FG_UNBOUNDED_DEACTIVATION;
|
1661
|
-
var _MDCRippleFoundation$5 = MDCRippleFoundation.strings,
|
1662
|
-
VAR_FG_UNBOUNDED_OPACITY_DURATION = _MDCRippleFoundation$5.VAR_FG_UNBOUNDED_OPACITY_DURATION,
|
1663
|
-
VAR_FG_UNBOUNDED_TRANSFORM_DURATION = _MDCRippleFoundation$5.VAR_FG_UNBOUNDED_TRANSFORM_DURATION,
|
1664
|
-
VAR_FG_APPROX_XF = _MDCRippleFoundation$5.VAR_FG_APPROX_XF;
|
1665
|
-
|
1666
|
-
this.adapter_.updateCssVariable(VAR_FG_APPROX_XF, 'scale(' + approxCurScale + ')');
|
1667
|
-
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_OPACITY_DURATION, opacityDuration + 'ms');
|
1668
|
-
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_TRANSFORM_DURATION, transformDuration + 'ms');
|
1669
|
-
this.adapter_.addClass(FG_UNBOUNDED_DEACTIVATION);
|
1670
|
-
this.adapter_.removeClass(FG_UNBOUNDED_ACTIVATION);
|
1671
|
-
// We use setTimeout here since we know how long the fade will take.
|
1672
|
-
this.unboundedOpacityFadeTimer_ = setTimeout(function () {
|
1673
|
-
_this7.adapter_.removeClass(FG_UNBOUNDED_DEACTIVATION);
|
1674
|
-
}, opacityDuration);
|
1646
|
+
key: 'isIndeterminate',
|
1647
|
+
value: function isIndeterminate() {
|
1648
|
+
return this.getNativeControl_().indeterminate;
|
1675
1649
|
}
|
1676
1650
|
}, {
|
1677
|
-
key: '
|
1678
|
-
value: function
|
1679
|
-
|
1680
|
-
var _MDCRippleFoundation$6 = MDCRippleFoundation.numbers,
|
1681
|
-
FG_TRANSFORM_DELAY_MS = _MDCRippleFoundation$6.FG_TRANSFORM_DELAY_MS,
|
1682
|
-
OPACITY_DURATION_DIVISOR = _MDCRippleFoundation$6.OPACITY_DURATION_DIVISOR,
|
1683
|
-
ACTIVE_OPACITY_DURATION_MS = _MDCRippleFoundation$6.ACTIVE_OPACITY_DURATION_MS,
|
1684
|
-
UNBOUNDED_TRANSFORM_DURATION_MS = _MDCRippleFoundation$6.UNBOUNDED_TRANSFORM_DURATION_MS,
|
1685
|
-
MIN_OPACITY_DURATION_MS = _MDCRippleFoundation$6.MIN_OPACITY_DURATION_MS;
|
1686
|
-
|
1687
|
-
|
1688
|
-
var approxCurScale = 0;
|
1689
|
-
if (msElapsed > FG_TRANSFORM_DELAY_MS) {
|
1690
|
-
approxCurScale = Math.min((msElapsed - FG_TRANSFORM_DELAY_MS) / this.xfDuration_, 1);
|
1691
|
-
}
|
1692
|
-
|
1693
|
-
var transformDuration = UNBOUNDED_TRANSFORM_DURATION_MS;
|
1694
|
-
var approxOpacity = Math.min(msElapsed / ACTIVE_OPACITY_DURATION_MS, 1);
|
1695
|
-
var opacityDuration = Math.max(MIN_OPACITY_DURATION_MS, 1000 * approxOpacity / OPACITY_DURATION_DIVISOR);
|
1696
|
-
|
1697
|
-
return { transformDuration: transformDuration, opacityDuration: opacityDuration, approxCurScale: approxCurScale };
|
1651
|
+
key: 'setIndeterminate',
|
1652
|
+
value: function setIndeterminate(indeterminate) {
|
1653
|
+
this.getNativeControl_().indeterminate = indeterminate;
|
1698
1654
|
}
|
1699
1655
|
}, {
|
1700
|
-
key: '
|
1701
|
-
value: function
|
1702
|
-
|
1703
|
-
if (isPointerEvent) {
|
1704
|
-
startPoint = (0, _util.getNormalizedEventCoords)(e, this.adapter_.getWindowPageOffset(), this.adapter_.computeBoundingRect());
|
1705
|
-
} else {
|
1706
|
-
startPoint = {
|
1707
|
-
left: this.frame_.width / 2,
|
1708
|
-
top: this.frame_.height / 2
|
1709
|
-
};
|
1710
|
-
}
|
1711
|
-
var _startPoint2 = startPoint,
|
1712
|
-
left = _startPoint2.left,
|
1713
|
-
top = _startPoint2.top;
|
1714
|
-
var _MDCRippleFoundation$7 = MDCRippleFoundation.strings,
|
1715
|
-
VAR_LEFT = _MDCRippleFoundation$7.VAR_LEFT,
|
1716
|
-
VAR_TOP = _MDCRippleFoundation$7.VAR_TOP;
|
1717
|
-
var _MDCRippleFoundation$8 = MDCRippleFoundation.cssClasses,
|
1718
|
-
BG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$8.BG_BOUNDED_ACTIVE_FILL,
|
1719
|
-
FG_BOUNDED_ACTIVE_FILL = _MDCRippleFoundation$8.FG_BOUNDED_ACTIVE_FILL;
|
1720
|
-
|
1721
|
-
this.adapter_.updateCssVariable(VAR_LEFT, left + 'px');
|
1722
|
-
this.adapter_.updateCssVariable(VAR_TOP, top + 'px');
|
1723
|
-
this.cancelBgBounded_ = (0, _util.animateWithClass)(this.adapter_, BG_BOUNDED_ACTIVE_FILL, (0, _animation.getCorrectEventName)(window, 'transitionend'));
|
1724
|
-
this.cancelFgBounded_ = (0, _util.animateWithClass)(this.adapter_, FG_BOUNDED_ACTIVE_FILL, (0, _animation.getCorrectEventName)(window, 'animationend'));
|
1656
|
+
key: 'isDisabled',
|
1657
|
+
value: function isDisabled() {
|
1658
|
+
return this.getNativeControl_().disabled;
|
1725
1659
|
}
|
1726
1660
|
}, {
|
1727
|
-
key: '
|
1728
|
-
value: function
|
1729
|
-
|
1730
|
-
|
1731
|
-
if (!this.isSupported_) {
|
1732
|
-
return;
|
1733
|
-
}
|
1734
|
-
this.removeEventListeners_();
|
1735
|
-
|
1736
|
-
var _MDCRippleFoundation$9 = MDCRippleFoundation.cssClasses,
|
1737
|
-
ROOT = _MDCRippleFoundation$9.ROOT,
|
1738
|
-
UNBOUNDED = _MDCRippleFoundation$9.UNBOUNDED;
|
1739
|
-
|
1740
|
-
requestAnimationFrame(function () {
|
1741
|
-
_this8.adapter_.removeClass(ROOT);
|
1742
|
-
_this8.adapter_.removeClass(UNBOUNDED);
|
1743
|
-
_this8.removeCssVars_();
|
1744
|
-
});
|
1661
|
+
key: 'setDisabled',
|
1662
|
+
value: function setDisabled(disabled) {
|
1663
|
+
this.getNativeControl_().disabled = disabled;
|
1745
1664
|
}
|
1746
1665
|
}, {
|
1747
|
-
key: '
|
1748
|
-
value: function
|
1749
|
-
var
|
1666
|
+
key: 'installPropertyChangeHooks_',
|
1667
|
+
value: function installPropertyChangeHooks_() {
|
1668
|
+
var _this2 = this;
|
1750
1669
|
|
1751
|
-
this.
|
1752
|
-
|
1753
|
-
|
1754
|
-
|
1670
|
+
var nativeCb = this.getNativeControl_();
|
1671
|
+
var cbProto = Object.getPrototypeOf(nativeCb);
|
1672
|
+
|
1673
|
+
CB_PROTO_PROPS.forEach(function (controlState) {
|
1674
|
+
var desc = Object.getOwnPropertyDescriptor(cbProto, controlState);
|
1675
|
+
// We have to check for this descriptor, since some browsers (Safari) don't support its return.
|
1676
|
+
// See: https://bugs.webkit.org/show_bug.cgi?id=49739
|
1677
|
+
if (validDescriptor(desc)) {
|
1678
|
+
Object.defineProperty(nativeCb, controlState, {
|
1679
|
+
get: desc.get,
|
1680
|
+
set: function set(state) {
|
1681
|
+
desc.set.call(nativeCb, state);
|
1682
|
+
_this2.transitionCheckState_();
|
1683
|
+
},
|
1684
|
+
configurable: desc.configurable,
|
1685
|
+
enumerable: desc.enumerable
|
1686
|
+
});
|
1687
|
+
}
|
1755
1688
|
});
|
1756
|
-
this.adapter_.deregisterResizeHandler(this.resizeHandler_);
|
1757
1689
|
}
|
1758
1690
|
}, {
|
1759
|
-
key: '
|
1760
|
-
value: function
|
1761
|
-
var
|
1762
|
-
|
1763
|
-
var strings = MDCRippleFoundation.strings;
|
1691
|
+
key: 'uninstallPropertyChangeHooks_',
|
1692
|
+
value: function uninstallPropertyChangeHooks_() {
|
1693
|
+
var nativeCb = this.getNativeControl_();
|
1694
|
+
var cbProto = Object.getPrototypeOf(nativeCb);
|
1764
1695
|
|
1765
|
-
|
1766
|
-
|
1767
|
-
|
1696
|
+
CB_PROTO_PROPS.forEach(function (controlState) {
|
1697
|
+
var desc = Object.getOwnPropertyDescriptor(cbProto, controlState);
|
1698
|
+
if (validDescriptor(desc)) {
|
1699
|
+
Object.defineProperty(nativeCb, controlState, desc);
|
1768
1700
|
}
|
1769
1701
|
});
|
1770
1702
|
}
|
1771
1703
|
}, {
|
1772
|
-
key: '
|
1773
|
-
value: function
|
1774
|
-
var
|
1704
|
+
key: 'transitionCheckState_',
|
1705
|
+
value: function transitionCheckState_() {
|
1706
|
+
var nativeCb = this.adapter_.getNativeControl();
|
1707
|
+
if (!nativeCb) {
|
1708
|
+
return;
|
1709
|
+
}
|
1710
|
+
var oldState = this.currentCheckState_;
|
1711
|
+
var newState = this.determineCheckState_(nativeCb);
|
1712
|
+
if (oldState === newState) {
|
1713
|
+
return;
|
1714
|
+
}
|
1775
1715
|
|
1776
|
-
|
1777
|
-
|
1716
|
+
// Check to ensure that there isn't a previously existing animation class, in case for example
|
1717
|
+
// the user interacted with the checkbox before the animation was finished.
|
1718
|
+
if (this.currentAnimationClass_.length > 0) {
|
1719
|
+
clearTimeout(this.animEndLatchTimer_);
|
1720
|
+
this.adapter_.forceLayout();
|
1721
|
+
this.adapter_.removeClass(this.currentAnimationClass_);
|
1722
|
+
}
|
1723
|
+
|
1724
|
+
this.currentAnimationClass_ = this.getTransitionAnimationClass_(oldState, newState);
|
1725
|
+
this.currentCheckState_ = newState;
|
1726
|
+
|
1727
|
+
// Check for parentNode so that animations are only run when the element is attached
|
1728
|
+
// to the DOM.
|
1729
|
+
if (this.adapter_.isAttachedToDOM() && this.currentAnimationClass_.length > 0) {
|
1730
|
+
this.adapter_.addClass(this.currentAnimationClass_);
|
1731
|
+
this.adapter_.registerAnimationEndHandler(this.animEndHandler_);
|
1778
1732
|
}
|
1779
|
-
this.layoutFrame_ = requestAnimationFrame(function () {
|
1780
|
-
_this11.layoutInternal_();
|
1781
|
-
_this11.layoutFrame_ = 0;
|
1782
|
-
});
|
1783
1733
|
}
|
1784
1734
|
}, {
|
1785
|
-
key: '
|
1786
|
-
value: function
|
1787
|
-
|
1735
|
+
key: 'determineCheckState_',
|
1736
|
+
value: function determineCheckState_(nativeCb) {
|
1737
|
+
var TRANSITION_STATE_INDETERMINATE = _constants.strings.TRANSITION_STATE_INDETERMINATE,
|
1738
|
+
TRANSITION_STATE_CHECKED = _constants.strings.TRANSITION_STATE_CHECKED,
|
1739
|
+
TRANSITION_STATE_UNCHECKED = _constants.strings.TRANSITION_STATE_UNCHECKED;
|
1788
1740
|
|
1789
|
-
var maxDim = Math.max(this.frame_.height, this.frame_.width);
|
1790
1741
|
|
1791
|
-
|
1792
|
-
|
1793
|
-
|
1794
|
-
|
1742
|
+
if (nativeCb.indeterminate) {
|
1743
|
+
return TRANSITION_STATE_INDETERMINATE;
|
1744
|
+
}
|
1745
|
+
return nativeCb.checked ? TRANSITION_STATE_CHECKED : TRANSITION_STATE_UNCHECKED;
|
1795
1746
|
}
|
1796
1747
|
}, {
|
1797
|
-
key: '
|
1798
|
-
value: function
|
1799
|
-
var
|
1800
|
-
|
1801
|
-
|
1802
|
-
|
1803
|
-
|
1804
|
-
|
1805
|
-
|
1806
|
-
|
1807
|
-
|
1748
|
+
key: 'getTransitionAnimationClass_',
|
1749
|
+
value: function getTransitionAnimationClass_(oldState, newState) {
|
1750
|
+
var TRANSITION_STATE_INIT = _constants.strings.TRANSITION_STATE_INIT,
|
1751
|
+
TRANSITION_STATE_CHECKED = _constants.strings.TRANSITION_STATE_CHECKED,
|
1752
|
+
TRANSITION_STATE_UNCHECKED = _constants.strings.TRANSITION_STATE_UNCHECKED;
|
1753
|
+
var _MDCCheckboxFoundatio = MDCCheckboxFoundation.cssClasses,
|
1754
|
+
ANIM_UNCHECKED_CHECKED = _MDCCheckboxFoundatio.ANIM_UNCHECKED_CHECKED,
|
1755
|
+
ANIM_UNCHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_UNCHECKED_INDETERMINATE,
|
1756
|
+
ANIM_CHECKED_UNCHECKED = _MDCCheckboxFoundatio.ANIM_CHECKED_UNCHECKED,
|
1757
|
+
ANIM_CHECKED_INDETERMINATE = _MDCCheckboxFoundatio.ANIM_CHECKED_INDETERMINATE,
|
1758
|
+
ANIM_INDETERMINATE_CHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_CHECKED,
|
1759
|
+
ANIM_INDETERMINATE_UNCHECKED = _MDCCheckboxFoundatio.ANIM_INDETERMINATE_UNCHECKED;
|
1808
1760
|
|
1809
|
-
this.adapter_.updateCssVariable(VAR_SURFACE_WIDTH, this.frame_.width + 'px');
|
1810
|
-
this.adapter_.updateCssVariable(VAR_SURFACE_HEIGHT, this.frame_.height + 'px');
|
1811
|
-
this.adapter_.updateCssVariable(VAR_FG_SIZE, fgSize + 'px');
|
1812
|
-
this.adapter_.updateCssVariable(VAR_FG_UNBOUNDED_TRANSFORM_DURATION, this.xfDuration_ + 'ms');
|
1813
1761
|
|
1814
|
-
|
1815
|
-
|
1816
|
-
|
1817
|
-
|
1818
|
-
|
1819
|
-
|
1820
|
-
|
1762
|
+
switch (oldState) {
|
1763
|
+
case TRANSITION_STATE_INIT:
|
1764
|
+
if (newState === TRANSITION_STATE_UNCHECKED) {
|
1765
|
+
return '';
|
1766
|
+
}
|
1767
|
+
// fallthrough
|
1768
|
+
case TRANSITION_STATE_UNCHECKED:
|
1769
|
+
return newState === TRANSITION_STATE_CHECKED ? ANIM_UNCHECKED_CHECKED : ANIM_UNCHECKED_INDETERMINATE;
|
1770
|
+
case TRANSITION_STATE_CHECKED:
|
1771
|
+
return newState === TRANSITION_STATE_UNCHECKED ? ANIM_CHECKED_UNCHECKED : ANIM_CHECKED_INDETERMINATE;
|
1772
|
+
// TRANSITION_STATE_INDETERMINATE
|
1773
|
+
default:
|
1774
|
+
return newState === TRANSITION_STATE_CHECKED ? ANIM_INDETERMINATE_CHECKED : ANIM_INDETERMINATE_UNCHECKED;
|
1821
1775
|
}
|
1822
1776
|
}
|
1777
|
+
}, {
|
1778
|
+
key: 'getNativeControl_',
|
1779
|
+
value: function getNativeControl_() {
|
1780
|
+
return this.adapter_.getNativeControl() || {
|
1781
|
+
checked: false,
|
1782
|
+
indeterminate: false,
|
1783
|
+
disabled: false
|
1784
|
+
};
|
1785
|
+
}
|
1823
1786
|
}]);
|
1824
1787
|
|
1825
|
-
return
|
1788
|
+
return MDCCheckboxFoundation;
|
1826
1789
|
}(_base.MDCFoundation);
|
1827
1790
|
|
1828
|
-
exports.default =
|
1829
|
-
|
1830
|
-
|
1831
|
-
|
1832
|
-
|
1833
|
-
|
1834
|
-
|
1835
|
-
|
1836
|
-
Object.defineProperty(exports, "__esModule", {
|
1837
|
-
value: true
|
1838
|
-
});
|
1839
|
-
/**
|
1840
|
-
* Copyright 2016 Google Inc. All Rights Reserved.
|
1841
|
-
*
|
1842
|
-
* Licensed under the Apache License, Version 2.0 (the "License");
|
1843
|
-
* you may not use this file except in compliance with the License.
|
1844
|
-
* You may obtain a copy of the License at
|
1845
|
-
*
|
1846
|
-
* http://www.apache.org/licenses/LICENSE-2.0
|
1847
|
-
*
|
1848
|
-
* Unless required by applicable law or agreed to in writing, software
|
1849
|
-
* distributed under the License is distributed on an "AS IS" BASIS,
|
1850
|
-
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1851
|
-
* See the License for the specific language governing permissions and
|
1852
|
-
* limitations under the License.
|
1853
|
-
*/
|
1854
|
-
|
1855
|
-
var ROOT = exports.ROOT = 'mdc-ripple';
|
1856
|
-
var UPGRADED = exports.UPGRADED = ROOT + '-upgraded';
|
1857
|
-
|
1858
|
-
var cssClasses = exports.cssClasses = {
|
1859
|
-
// Ripple is a special case where the "root" component is really a "mixin" of sorts,
|
1860
|
-
// given that it's an 'upgrade' to an existing component. That being said it is the root
|
1861
|
-
// CSS class that all other CSS classes derive from.
|
1862
|
-
ROOT: UPGRADED,
|
1863
|
-
UNBOUNDED: UPGRADED + '--unbounded',
|
1864
|
-
BG_ACTIVE: UPGRADED + '--background-active',
|
1865
|
-
BG_BOUNDED_ACTIVE_FILL: UPGRADED + '--background-bounded-active-fill',
|
1866
|
-
FG_BOUNDED_ACTIVE_FILL: UPGRADED + '--foreground-bounded-active-fill',
|
1867
|
-
FG_UNBOUNDED_ACTIVATION: UPGRADED + '--foreground-unbounded-activation',
|
1868
|
-
FG_UNBOUNDED_DEACTIVATION: UPGRADED + '--foreground-unbounded-deactivation'
|
1869
|
-
};
|
1870
|
-
|
1871
|
-
var strings = exports.strings = {
|
1872
|
-
VAR_SURFACE_WIDTH: '--' + ROOT + '-surface-width',
|
1873
|
-
VAR_SURFACE_HEIGHT: '--' + ROOT + '-surface-height',
|
1874
|
-
VAR_FG_SIZE: '--' + ROOT + '-fg-size',
|
1875
|
-
VAR_FG_UNBOUNDED_OPACITY_DURATION: '--' + ROOT + '-fg-unbounded-opacity-duration',
|
1876
|
-
VAR_FG_UNBOUNDED_TRANSFORM_DURATION: '--' + ROOT + '-fg-unbounded-transform-duration',
|
1877
|
-
VAR_LEFT: '--' + ROOT + '-left',
|
1878
|
-
VAR_TOP: '--' + ROOT + '-top',
|
1879
|
-
VAR_XF_ORIGIN_X: '--' + ROOT + '-xfo-x',
|
1880
|
-
VAR_XF_ORIGIN_Y: '--' + ROOT + '-xfo-y',
|
1881
|
-
VAR_FG_APPROX_XF: '--' + ROOT + '-fg-approx-xf'
|
1882
|
-
};
|
1883
|
-
|
1884
|
-
var numbers = exports.numbers = {
|
1885
|
-
FG_TRANSFORM_DELAY_MS: 80,
|
1886
|
-
OPACITY_DURATION_DIVISOR: 3,
|
1887
|
-
ACTIVE_OPACITY_DURATION_MS: 110,
|
1888
|
-
MIN_OPACITY_DURATION_MS: 200,
|
1889
|
-
UNBOUNDED_TRANSFORM_DURATION_MS: 200
|
1890
|
-
};
|
1891
|
-
|
1791
|
+
exports.default = MDCCheckboxFoundation;
|
1792
|
+
|
1793
|
+
|
1794
|
+
function validDescriptor(inputPropDesc) {
|
1795
|
+
return inputPropDesc && typeof inputPropDesc.set === 'function';
|
1796
|
+
}
|
1797
|
+
|
1892
1798
|
/***/ },
|
1893
|
-
/*
|
1799
|
+
/* 11 */
|
1894
1800
|
/***/ function(module, exports) {
|
1895
1801
|
|
1896
1802
|
'use strict';
|
@@ -1898,10 +1804,6 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
1898
1804
|
Object.defineProperty(exports, "__esModule", {
|
1899
1805
|
value: true
|
1900
1806
|
});
|
1901
|
-
exports.supportsCssVariables = supportsCssVariables;
|
1902
|
-
exports.getMatchesProperty = getMatchesProperty;
|
1903
|
-
exports.animateWithClass = animateWithClass;
|
1904
|
-
exports.getNormalizedEventCoords = getNormalizedEventCoords;
|
1905
1807
|
/**
|
1906
1808
|
* Copyright 2016 Google Inc. All Rights Reserved.
|
1907
1809
|
*
|
@@ -1918,60 +1820,225 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
1918
1820
|
* limitations under the License.
|
1919
1821
|
*/
|
1920
1822
|
|
1921
|
-
|
1922
|
-
|
1923
|
-
if (!supportsFunctionPresent) {
|
1924
|
-
return;
|
1925
|
-
}
|
1823
|
+
var ROOT = 'mdc-checkbox';
|
1824
|
+
var ANIM = ROOT + '--anim';
|
1926
1825
|
|
1927
|
-
|
1928
|
-
|
1929
|
-
|
1930
|
-
|
1931
|
-
|
1932
|
-
|
1826
|
+
var cssClasses = exports.cssClasses = {
|
1827
|
+
ROOT: ROOT,
|
1828
|
+
CHECKED: ROOT + '--checked',
|
1829
|
+
INDETERMINATE: ROOT + '--indeterminate',
|
1830
|
+
ANIM_UNCHECKED_CHECKED: ANIM + '-unchecked-checked',
|
1831
|
+
ANIM_UNCHECKED_INDETERMINATE: ANIM + '-unchecked-indeterminate',
|
1832
|
+
ANIM_CHECKED_UNCHECKED: ANIM + '-checked-unchecked',
|
1833
|
+
ANIM_CHECKED_INDETERMINATE: ANIM + '-checked-indeterminate',
|
1834
|
+
ANIM_INDETERMINATE_CHECKED: ANIM + '-indeterminate-checked',
|
1835
|
+
ANIM_INDETERMINATE_UNCHECKED: ANIM + '-indeterminate-unchecked'
|
1836
|
+
};
|
1933
1837
|
|
1934
|
-
|
1935
|
-
|
1936
|
-
|
1937
|
-
|
1938
|
-
|
1838
|
+
var strings = exports.strings = {
|
1839
|
+
NATIVE_CONTROL_SELECTOR: '.' + ROOT + '__native-control',
|
1840
|
+
TRANSITION_STATE_INIT: 'init',
|
1841
|
+
TRANSITION_STATE_CHECKED: 'checked',
|
1842
|
+
TRANSITION_STATE_UNCHECKED: 'unchecked',
|
1843
|
+
TRANSITION_STATE_INDETERMINATE: 'indeterminate'
|
1844
|
+
};
|
1939
1845
|
|
1940
|
-
|
1941
|
-
|
1942
|
-
|
1943
|
-
|
1944
|
-
|
1846
|
+
var numbers = exports.numbers = {
|
1847
|
+
ANIM_END_LATCH_MS: 100
|
1848
|
+
};
|
1849
|
+
|
1850
|
+
/***/ },
|
1851
|
+
/* 12 */
|
1852
|
+
/***/ function(module, exports, __webpack_require__) {
|
1853
|
+
|
1854
|
+
'use strict';
|
1855
|
+
|
1856
|
+
Object.defineProperty(exports, "__esModule", {
|
1857
|
+
value: true
|
1858
|
+
});
|
1859
|
+
exports.MDCIconToggle = exports.MDCIconToggleFoundation = undefined;
|
1860
|
+
|
1861
|
+
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; };
|
1862
|
+
|
1863
|
+
var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
|
1864
|
+
|
1865
|
+
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; }; }();
|
1866
|
+
|
1867
|
+
var _base = __webpack_require__(1);
|
1868
|
+
|
1869
|
+
var _ripple = __webpack_require__(5);
|
1870
|
+
|
1871
|
+
var _foundation = __webpack_require__(13);
|
1872
|
+
|
1873
|
+
var _foundation2 = _interopRequireDefault(_foundation);
|
1874
|
+
|
1875
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
1876
|
+
|
1877
|
+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
1878
|
+
|
1879
|
+
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; }
|
1880
|
+
|
1881
|
+
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; } /**
|
1882
|
+
* Copyright 2016 Google Inc. All Rights Reserved.
|
1883
|
+
*
|
1884
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
1885
|
+
* you may not use this file except in compliance with the License.
|
1886
|
+
* You may obtain a copy of the License at
|
1887
|
+
*
|
1888
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
1889
|
+
*
|
1890
|
+
* Unless required by applicable law or agreed to in writing, software
|
1891
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
1892
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
1893
|
+
* See the License for the specific language governing permissions and
|
1894
|
+
* limitations under the License.
|
1895
|
+
*/
|
1896
|
+
|
1897
|
+
exports.MDCIconToggleFoundation = _foundation2.default;
|
1898
|
+
|
1899
|
+
var MDCIconToggle = exports.MDCIconToggle = function (_MDCComponent) {
|
1900
|
+
_inherits(MDCIconToggle, _MDCComponent);
|
1901
|
+
|
1902
|
+
_createClass(MDCIconToggle, null, [{
|
1903
|
+
key: 'attachTo',
|
1904
|
+
value: function attachTo(root) {
|
1905
|
+
return new MDCIconToggle(root);
|
1945
1906
|
}
|
1946
|
-
|
1947
|
-
rippleAdapter.removeClass(cls);
|
1948
|
-
rippleAdapter.deregisterInteractionHandler(endEvent, cancel);
|
1949
|
-
};
|
1950
|
-
rippleAdapter.registerInteractionHandler(endEvent, cancel);
|
1951
|
-
rippleAdapter.addClass(cls);
|
1952
|
-
return cancel;
|
1953
|
-
}
|
1907
|
+
}]);
|
1954
1908
|
|
1955
|
-
|
1956
|
-
|
1957
|
-
|
1909
|
+
function MDCIconToggle() {
|
1910
|
+
var _ref;
|
1911
|
+
|
1912
|
+
_classCallCheck(this, MDCIconToggle);
|
1958
1913
|
|
1959
|
-
|
1960
|
-
|
1914
|
+
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
|
1915
|
+
args[_key] = arguments[_key];
|
1916
|
+
}
|
1961
1917
|
|
1962
|
-
|
1963
|
-
|
1964
|
-
|
1965
|
-
|
1966
|
-
normalizedLeft = ev.changedTouches[0].pageX - documentLeft;
|
1967
|
-
normalizedTop = ev.changedTouches[0].pageY - documentTop;
|
1968
|
-
} else {
|
1969
|
-
normalizedLeft = ev.pageX - documentLeft;
|
1970
|
-
normalizedTop = ev.pageY - documentTop;
|
1918
|
+
var _this = _possibleConstructorReturn(this, (_ref = MDCIconToggle.__proto__ || Object.getPrototypeOf(MDCIconToggle)).call.apply(_ref, [this].concat(args)));
|
1919
|
+
|
1920
|
+
_this.ripple_ = _this.initRipple_();
|
1921
|
+
return _this;
|
1971
1922
|
}
|
1972
1923
|
|
1973
|
-
|
1974
|
-
|
1924
|
+
_createClass(MDCIconToggle, [{
|
1925
|
+
key: 'initRipple_',
|
1926
|
+
value: function initRipple_() {
|
1927
|
+
var _this2 = this;
|
1928
|
+
|
1929
|
+
var adapter = _extends(_ripple.MDCRipple.createAdapter(this), {
|
1930
|
+
isUnbounded: function isUnbounded() {
|
1931
|
+
return true;
|
1932
|
+
},
|
1933
|
+
isSurfaceActive: function isSurfaceActive() {
|
1934
|
+
return _this2.foundation_.isKeyboardActivated();
|
1935
|
+
},
|
1936
|
+
computeBoundingRect: function computeBoundingRect() {
|
1937
|
+
var dim = 48;
|
1938
|
+
|
1939
|
+
var _root_$getBoundingCli = _this2.root_.getBoundingClientRect(),
|
1940
|
+
left = _root_$getBoundingCli.left,
|
1941
|
+
top = _root_$getBoundingCli.top;
|
1942
|
+
|
1943
|
+
return {
|
1944
|
+
left: left,
|
1945
|
+
top: top,
|
1946
|
+
width: dim,
|
1947
|
+
height: dim,
|
1948
|
+
right: left + dim,
|
1949
|
+
bottom: left + dim
|
1950
|
+
};
|
1951
|
+
}
|
1952
|
+
});
|
1953
|
+
var foundation = new _ripple.MDCRippleFoundation(adapter);
|
1954
|
+
return new _ripple.MDCRipple(this.root_, foundation);
|
1955
|
+
}
|
1956
|
+
}, {
|
1957
|
+
key: 'destroy',
|
1958
|
+
value: function destroy() {
|
1959
|
+
this.ripple_.destroy();
|
1960
|
+
_get(MDCIconToggle.prototype.__proto__ || Object.getPrototypeOf(MDCIconToggle.prototype), 'destroy', this).call(this);
|
1961
|
+
}
|
1962
|
+
}, {
|
1963
|
+
key: 'getDefaultFoundation',
|
1964
|
+
value: function getDefaultFoundation() {
|
1965
|
+
var _this3 = this;
|
1966
|
+
|
1967
|
+
return new _foundation2.default({
|
1968
|
+
addClass: function addClass(className) {
|
1969
|
+
return _this3.iconEl_.classList.add(className);
|
1970
|
+
},
|
1971
|
+
removeClass: function removeClass(className) {
|
1972
|
+
return _this3.iconEl_.classList.remove(className);
|
1973
|
+
},
|
1974
|
+
registerInteractionHandler: function registerInteractionHandler(type, handler) {
|
1975
|
+
return _this3.root_.addEventListener(type, handler);
|
1976
|
+
},
|
1977
|
+
deregisterInteractionHandler: function deregisterInteractionHandler(type, handler) {
|
1978
|
+
return _this3.root_.removeEventListener(type, handler);
|
1979
|
+
},
|
1980
|
+
setText: function setText(text) {
|
1981
|
+
_this3.iconEl_.textContent = text;
|
1982
|
+
},
|
1983
|
+
getTabIndex: function getTabIndex() {
|
1984
|
+
return (/* number */_this3.root_.tabIndex
|
1985
|
+
);
|
1986
|
+
},
|
1987
|
+
setTabIndex: function setTabIndex(tabIndex) {
|
1988
|
+
_this3.root_.tabIndex = tabIndex;
|
1989
|
+
},
|
1990
|
+
getAttr: function getAttr(name, value) {
|
1991
|
+
return _this3.root_.getAttribute(name, value);
|
1992
|
+
},
|
1993
|
+
setAttr: function setAttr(name, value) {
|
1994
|
+
return _this3.root_.setAttribute(name, value);
|
1995
|
+
},
|
1996
|
+
rmAttr: function rmAttr(name) {
|
1997
|
+
return _this3.root_.removeAttribute(name);
|
1998
|
+
},
|
1999
|
+
notifyChange: function notifyChange(evtData) {
|
2000
|
+
return _this3.emit('MDCIconToggle:change', evtData);
|
2001
|
+
}
|
2002
|
+
});
|
2003
|
+
}
|
2004
|
+
}, {
|
2005
|
+
key: 'initialSyncWithDOM',
|
2006
|
+
value: function initialSyncWithDOM() {
|
2007
|
+
this.on = this.root_.getAttribute(_foundation2.default.strings.ARIA_PRESSED) === 'true';
|
2008
|
+
this.disabled = this.root_.getAttribute(_foundation2.default.strings.ARIA_DISABLED) === 'true';
|
2009
|
+
}
|
2010
|
+
}, {
|
2011
|
+
key: 'refreshToggleData',
|
2012
|
+
value: function refreshToggleData() {
|
2013
|
+
this.foundation_.refreshToggleData();
|
2014
|
+
}
|
2015
|
+
}, {
|
2016
|
+
key: 'iconEl_',
|
2017
|
+
get: function get() {
|
2018
|
+
var sel = this.root_.dataset.iconInnerSelector;
|
2019
|
+
|
2020
|
+
return sel ? this.root_.querySelector(sel) : this.root_;
|
2021
|
+
}
|
2022
|
+
}, {
|
2023
|
+
key: 'on',
|
2024
|
+
get: function get() {
|
2025
|
+
return this.foundation_.isOn();
|
2026
|
+
},
|
2027
|
+
set: function set(isOn) {
|
2028
|
+
this.foundation_.toggle(isOn);
|
2029
|
+
}
|
2030
|
+
}, {
|
2031
|
+
key: 'disabled',
|
2032
|
+
get: function get() {
|
2033
|
+
return this.foundation_.isDisabled();
|
2034
|
+
},
|
2035
|
+
set: function set(isDisabled) {
|
2036
|
+
this.foundation_.setDisabled(isDisabled);
|
2037
|
+
}
|
2038
|
+
}]);
|
2039
|
+
|
2040
|
+
return MDCIconToggle;
|
2041
|
+
}(_base.MDCComponent);
|
1975
2042
|
|
1976
2043
|
/***/ },
|
1977
2044
|
/* 13 */
|
@@ -2236,7 +2303,7 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
2236
2303
|
|
2237
2304
|
var _base = __webpack_require__(1);
|
2238
2305
|
|
2239
|
-
var _ripple = __webpack_require__(
|
2306
|
+
var _ripple = __webpack_require__(5);
|
2240
2307
|
|
2241
2308
|
var _foundation = __webpack_require__(15);
|
2242
2309
|
|
@@ -3454,7 +3521,7 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
3454
3521
|
registerInputKeydownHandler: function registerInputKeydownHandler() /* handler: EventListener */{},
|
3455
3522
|
deregisterInputKeydownHandler: function deregisterInputKeydownHandler() /* handler: EventListener */{},
|
3456
3523
|
setHelptextAttr: function setHelptextAttr() /* name: string, value: string */{},
|
3457
|
-
removeHelptextAttr: function removeHelptextAttr() /* name: string
|
3524
|
+
removeHelptextAttr: function removeHelptextAttr() /* name: string */{},
|
3458
3525
|
getNativeInput: function getNativeInput() {
|
3459
3526
|
return (/* HTMLInputElement */{}
|
3460
3527
|
);
|
@@ -3636,7 +3703,7 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
3636
3703
|
|
3637
3704
|
var _foundation2 = _interopRequireDefault(_foundation);
|
3638
3705
|
|
3639
|
-
var _animation = __webpack_require__(
|
3706
|
+
var _animation = __webpack_require__(7);
|
3640
3707
|
|
3641
3708
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
3642
3709
|
|