Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@material/drawer

Package Overview
Dependencies
Maintainers
8
Versions
1688
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@material/drawer - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

persistent/constants.js
persistent/foundation.js
persistent/index.js
persistent/mdc-persistent-drawer.scss
slidable/_mixins.css
slidable/_variables.css
slidable/constants.js
slidable/foundation.js
slidable/index.js
slidable/README.md

590

dist/mdc.drawer.js

@@ -81,3 +81,3 @@ /*!

/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 48);
/******/ return __webpack_require__(__webpack_require__.s = 60);
/******/ })

@@ -200,3 +200,3 @@ /************************************************************************/

/***/ 13:
/***/ 11:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

@@ -321,3 +321,3 @@

/***/ 17:
/***/ 18:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

@@ -327,6 +327,9 @@

Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(13);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__temporary__ = __webpack_require__(32);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__util__ = __webpack_require__(11);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__temporary__ = __webpack_require__(38);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawer", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["a"]; });
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCTemporaryDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_1__temporary__["b"]; });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__persistent__ = __webpack_require__(33);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawer", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["a"]; });
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "MDCPersistentDrawerFoundation", function() { return __WEBPACK_IMPORTED_MODULE_2__persistent__["b"]; });
/* harmony reexport (module object) */ __webpack_require__.d(__webpack_exports__, "util", function() { return __WEBPACK_IMPORTED_MODULE_0__util__; });

@@ -353,2 +356,3 @@ /**

/***/ }),

@@ -487,6 +491,7 @@

/***/ 30:
/***/ 31:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(9);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });

@@ -510,15 +515,13 @@ /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });

var ROOT = 'mdc-temporary-drawer';
var cssClasses = {
ROOT: ROOT,
OPEN: ROOT + '--open',
ANIMATING: ROOT + '--animating',
RIGHT: ROOT + '--right'
ROOT: 'mdc-persistent-drawer',
OPEN: 'mdc-persistent-drawer--open',
ANIMATING: 'mdc-persistent-drawer--animating'
};
var strings = {
DRAWER_SELECTOR: '.' + ROOT + '__drawer',
OPACITY_VAR_NAME: '--' + ROOT + '-opacity',
FOCUSABLE_ELEMENTS: 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), ' + 'button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]'
DRAWER_SELECTOR: '.mdc-persistent-drawer__drawer',
FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */]
};

@@ -528,8 +531,8 @@

/***/ 31:
/***/ 32:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(30);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(9);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(31);
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; };

@@ -564,6 +567,6 @@

var MDCTemporaryDrawerFoundation = function (_MDCFoundation) {
_inherits(MDCTemporaryDrawerFoundation, _MDCFoundation);
var MDCPersistentDrawerFoundation = function (_MDCSlidableDrawerFou) {
_inherits(MDCPersistentDrawerFoundation, _MDCSlidableDrawerFou);
_createClass(MDCTemporaryDrawerFoundation, null, [{
_createClass(MDCPersistentDrawerFoundation, null, [{
key: 'cssClasses',

@@ -581,2 +584,248 @@ get: function get() {

get: function get() {
return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
isDrawer: function isDrawer() {
return false;
}
});
}
}]);
function MDCPersistentDrawerFoundation(adapter) {
_classCallCheck(this, MDCPersistentDrawerFoundation);
return _possibleConstructorReturn(this, (MDCPersistentDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCPersistentDrawerFoundation)).call(this, _extends(MDCPersistentDrawerFoundation.defaultAdapter, adapter), MDCPersistentDrawerFoundation.cssClasses.ROOT, MDCPersistentDrawerFoundation.cssClasses.ANIMATING, MDCPersistentDrawerFoundation.cssClasses.OPEN));
}
_createClass(MDCPersistentDrawerFoundation, [{
key: 'isRootTransitioningEventTarget_',
value: function isRootTransitioningEventTarget_(el) {
return this.adapter_.isDrawer(el);
}
}]);
return MDCPersistentDrawerFoundation;
}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);
/* harmony default export */ __webpack_exports__["a"] = MDCPersistentDrawerFoundation;
/***/ }),
/***/ 33:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(32);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(11);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
/* unused harmony reexport util */
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCPersistentDrawer; });
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
var MDCPersistentDrawer = function (_MDCComponent) {
_inherits(MDCPersistentDrawer, _MDCComponent);
function MDCPersistentDrawer() {
_classCallCheck(this, MDCPersistentDrawer);
return _possibleConstructorReturn(this, (MDCPersistentDrawer.__proto__ || Object.getPrototypeOf(MDCPersistentDrawer)).apply(this, arguments));
}
_createClass(MDCPersistentDrawer, [{
key: 'getDefaultFoundation',
value: function getDefaultFoundation() {
var _this2 = this;
var FOCUSABLE_ELEMENTS = __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.FOCUSABLE_ELEMENTS;
return new __WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */]({
addClass: function addClass(className) {
return _this2.root_.classList.add(className);
},
removeClass: function removeClass(className) {
return _this2.root_.classList.remove(className);
},
hasClass: function hasClass(className) {
return _this2.root_.classList.contains(className);
},
hasNecessaryDom: function hasNecessaryDom() {
return Boolean(_this2.drawer);
},
registerInteractionHandler: function registerInteractionHandler(evt, handler) {
return _this2.root_.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
},
deregisterInteractionHandler: function deregisterInteractionHandler(evt, handler) {
return _this2.root_.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler, __WEBPACK_IMPORTED_MODULE_2__util__["applyPassive"]());
},
registerDrawerInteractionHandler: function registerDrawerInteractionHandler(evt, handler) {
return _this2.drawer.addEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
},
deregisterDrawerInteractionHandler: function deregisterDrawerInteractionHandler(evt, handler) {
return _this2.drawer.removeEventListener(__WEBPACK_IMPORTED_MODULE_2__util__["remapEvent"](evt), handler);
},
registerTransitionEndHandler: function registerTransitionEndHandler(handler) {
return _this2.root_.addEventListener('transitionend', handler);
},
deregisterTransitionEndHandler: function deregisterTransitionEndHandler(handler) {
return _this2.root_.removeEventListener('transitionend', handler);
},
registerDocumentKeydownHandler: function registerDocumentKeydownHandler(handler) {
return document.addEventListener('keydown', handler);
},
deregisterDocumentKeydownHandler: function deregisterDocumentKeydownHandler(handler) {
return document.removeEventListener('keydown', handler);
},
getDrawerWidth: function getDrawerWidth() {
return _this2.drawer.offsetWidth;
},
setTranslateX: function setTranslateX(value) {
return _this2.drawer.style.setProperty(__WEBPACK_IMPORTED_MODULE_2__util__["getTransformPropertyName"](), value === null ? null : 'translateX(' + value + 'px)');
},
getFocusableElements: function getFocusableElements() {
return _this2.drawer.querySelectorAll(FOCUSABLE_ELEMENTS);
},
saveElementTabState: function saveElementTabState(el) {
return __WEBPACK_IMPORTED_MODULE_2__util__["saveElementTabState"](el);
},
restoreElementTabState: function restoreElementTabState(el) {
return __WEBPACK_IMPORTED_MODULE_2__util__["restoreElementTabState"](el);
},
makeElementUntabbable: function makeElementUntabbable(el) {
return el.setAttribute('tabindex', -1);
},
isRtl: function isRtl() {
return getComputedStyle(_this2.root_).getPropertyValue('direction') === 'rtl';
},
isDrawer: function isDrawer(el) {
return el === _this2.drawer;
}
});
}
}, {
key: 'open',
get: function get() {
return this.foundation_.isOpen();
},
set: function set(value) {
if (value) {
this.foundation_.open();
} else {
this.foundation_.close();
}
}
/* Return the drawer element inside the component. */
}, {
key: 'drawer',
get: function get() {
return this.root_.querySelector(__WEBPACK_IMPORTED_MODULE_1__foundation__["a" /* default */].strings.DRAWER_SELECTOR);
}
}], [{
key: 'attachTo',
value: function attachTo(root) {
return new MDCPersistentDrawer(root);
}
}]);
return MDCPersistentDrawer;
}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCComponent"]);
/***/ }),
/***/ 34:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return FOCUSABLE_ELEMENTS; });
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
var FOCUSABLE_ELEMENTS = 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), ' + 'button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]';
/***/ }),
/***/ 35:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCSlidableDrawerFoundation; });
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
var MDCSlidableDrawerFoundation = function (_MDCFoundation) {
_inherits(MDCSlidableDrawerFoundation, _MDCFoundation);
_createClass(MDCSlidableDrawerFoundation, null, [{
key: 'defaultAdapter',
get: function get() {
return {

@@ -599,3 +848,2 @@ addClass: function addClass() /* className: string */{},

setTranslateX: function setTranslateX() /* value: number | null */{},
updateCssVariable: function updateCssVariable() /* value: string */{},
getFocusableElements: function getFocusableElements() /* NodeList */{},

@@ -612,6 +860,2 @@ saveElementTabState: function saveElementTabState() /* el: Element */{},

);
},
isDrawer: function isDrawer() {
return (/* el: Element */ /* boolean */false
);
}

@@ -622,10 +866,14 @@ };

function MDCTemporaryDrawerFoundation(adapter) {
_classCallCheck(this, MDCTemporaryDrawerFoundation);
function MDCSlidableDrawerFoundation(adapter, rootCssClass, animatingCssClass, openCssClass) {
_classCallCheck(this, MDCSlidableDrawerFoundation);
var _this = _possibleConstructorReturn(this, (MDCTemporaryDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation)).call(this, _extends(MDCTemporaryDrawerFoundation.defaultAdapter, adapter)));
var _this = _possibleConstructorReturn(this, (MDCSlidableDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCSlidableDrawerFoundation)).call(this, _extends(MDCSlidableDrawerFoundation.defaultAdapter, adapter)));
_this.rootCssClass_ = rootCssClass;
_this.animatingCssClass_ = animatingCssClass;
_this.openCssClass_ = openCssClass;
_this.transitionEndHandler_ = function (ev) {
if (_this.adapter_.isDrawer(ev.target)) {
_this.adapter_.removeClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
if (_this.isRootTransitioningEventTarget_(ev.target)) {
_this.adapter_.removeClass(_this.animatingCssClass_);
_this.adapter_.deregisterTransitionEndHandler(_this.transitionEndHandler_);

@@ -637,5 +885,2 @@ }

_this.componentClickHandler_ = function () {
return _this.close();
};
_this.drawerClickHandler_ = function (evt) {

@@ -661,10 +906,8 @@ return evt.stopPropagation();

_createClass(MDCTemporaryDrawerFoundation, [{
_createClass(MDCSlidableDrawerFoundation, [{
key: 'init',
value: function init() {
var _MDCTemporaryDrawerFo = MDCTemporaryDrawerFoundation.cssClasses,
ROOT = _MDCTemporaryDrawerFo.ROOT,
OPEN = _MDCTemporaryDrawerFo.OPEN;
var ROOT = this.rootCssClass_;
var OPEN = this.openCssClass_;
if (!this.adapter_.hasClass(ROOT)) {

@@ -685,7 +928,2 @@ throw new Error(ROOT + ' class required in root element.');

// Make browser aware of custom property being used in this element.
// Workaround for certain types of hard-to-reproduce heisenbugs.
this.adapter_.updateCssVariable(0);
this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
this.adapter_.registerDrawerInteractionHandler('click', this.drawerClickHandler_);

@@ -699,3 +937,2 @@ this.adapter_.registerDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);

value: function destroy() {
this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
this.adapter_.deregisterDrawerInteractionHandler('click', this.drawerClickHandler_);

@@ -711,9 +948,6 @@ this.adapter_.deregisterDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);

value: function open() {
// Make sure custom property values are cleared before starting.
this.adapter_.updateCssVariable('');
this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN);
this.adapter_.addClass(this.animatingCssClass_);
this.adapter_.addClass(this.openCssClass_);
this.retabinate_();

@@ -725,9 +959,6 @@ this.isOpen_ = true;

value: function close() {
// Make sure custom property values are cleared before making any changes.
this.adapter_.updateCssVariable('');
this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
this.adapter_.removeClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN);
this.adapter_.addClass(this.animatingCssClass_);
this.adapter_.removeClass(this.openCssClass_);
this.detabinate_();

@@ -787,3 +1018,3 @@ this.isOpen_ = false;

value: function handleTouchStart_(evt) {
if (!this.adapter_.hasClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN)) {
if (!this.adapter_.hasClass(this.openCssClass_)) {
return;

@@ -819,15 +1050,6 @@ }

this.touchingSideNav_ = false;
this.adapter_.setTranslateX(null);
this.adapter_.updateCssVariable('');
this.prepareForTouchEnd_();
var newPos = null;
if (this.direction_ === 1) {
newPos = Math.min(0, this.currentX_ - this.startX_);
} else {
newPos = Math.max(0, this.currentX_ - this.startX_);
}
// Did the user close the drawer by more than 50%?
if (Math.abs(newPos / this.drawerWidth_) >= 0.5) {
if (Math.abs(this.newPosition_ / this.drawerWidth_) >= 0.5) {
this.close();

@@ -840,2 +1062,8 @@ } else {

}, {
key: 'prepareForTouchEnd_',
value: function prepareForTouchEnd_() {
this.touchingSideNav_ = false;
this.adapter_.setTranslateX(null);
}
}, {
key: 'updateDrawer_',

@@ -848,5 +1076,15 @@ value: function updateDrawer_() {

requestAnimationFrame(this.updateDrawer_.bind(this));
this.adapter_.setTranslateX(this.newPosition_);
}
}, {
key: 'isRootTransitioningEventTarget_',
value: function isRootTransitioningEventTarget_(el) {
// Classes extending MDCSlidableDrawerFoundation should implement this method to return true or false
// if the event target is the root event target currently transitioning.
return false;
}
}, {
key: 'newPosition_',
get: function get() {
var newPos = null;
var newOpacity = null;

@@ -859,11 +1097,180 @@ if (this.direction_ === 1) {

newOpacity = Math.max(0, 1 + this.direction_ * (newPos / this.drawerWidth_));
return newPos;
}
}]);
this.adapter_.setTranslateX(newPos);
return MDCSlidableDrawerFoundation;
}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
/***/ }),
/***/ 36:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(9);
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return cssClasses; });
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return strings; });
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
var cssClasses = {
ROOT: 'mdc-temporary-drawer',
OPEN: 'mdc-temporary-drawer--open',
ANIMATING: 'mdc-temporary-drawer--animating'
};
var strings = {
DRAWER_SELECTOR: '.mdc-temporary-drawer__drawer',
OPACITY_VAR_NAME: '--mdc-temporary-drawer-opacity',
FOCUSABLE_ELEMENTS: __WEBPACK_IMPORTED_MODULE_0__slidable__["b" /* FOCUSABLE_ELEMENTS */]
};
/***/ }),
/***/ 37:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__slidable__ = __webpack_require__(9);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__constants__ = __webpack_require__(36);
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _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); } };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
var MDCTemporaryDrawerFoundation = function (_MDCSlidableDrawerFou) {
_inherits(MDCTemporaryDrawerFoundation, _MDCSlidableDrawerFou);
_createClass(MDCTemporaryDrawerFoundation, null, [{
key: 'cssClasses',
get: function get() {
return __WEBPACK_IMPORTED_MODULE_1__constants__["a" /* cssClasses */];
}
}, {
key: 'strings',
get: function get() {
return __WEBPACK_IMPORTED_MODULE_1__constants__["b" /* strings */];
}
}, {
key: 'defaultAdapter',
get: function get() {
return _extends(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */].defaultAdapter, {
isDrawer: function isDrawer() {
return false;
},
updateCssVariable: function updateCssVariable() /* value: string */{}
});
}
}]);
function MDCTemporaryDrawerFoundation(adapter) {
_classCallCheck(this, MDCTemporaryDrawerFoundation);
var _this = _possibleConstructorReturn(this, (MDCTemporaryDrawerFoundation.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation)).call(this, _extends(MDCTemporaryDrawerFoundation.defaultAdapter, adapter), MDCTemporaryDrawerFoundation.cssClasses.ROOT, MDCTemporaryDrawerFoundation.cssClasses.ANIMATING, MDCTemporaryDrawerFoundation.cssClasses.OPEN));
_this.componentClickHandler_ = function () {
return _this.close();
};
return _this;
}
_createClass(MDCTemporaryDrawerFoundation, [{
key: 'init',
value: function init() {
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'init', this).call(this);
// Make browser aware of custom property being used in this element.
// Workaround for certain types of hard-to-reproduce heisenbugs.
this.adapter_.updateCssVariable(0);
this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
}
}, {
key: 'destroy',
value: function destroy() {
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'destroy', this).call(this);
this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
}
}, {
key: 'open',
value: function open() {
// Make sure custom property values are cleared before starting.
this.adapter_.updateCssVariable('');
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'open', this).call(this);
}
}, {
key: 'close',
value: function close() {
// Make sure custom property values are cleared before making any changes.
this.adapter_.updateCssVariable('');
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'close', this).call(this);
}
}, {
key: 'prepareForTouchEnd_',
value: function prepareForTouchEnd_() {
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'prepareForTouchEnd_', this).call(this);
this.adapter_.updateCssVariable('');
}
}, {
key: 'updateDrawer_',
value: function updateDrawer_() {
_get(MDCTemporaryDrawerFoundation.prototype.__proto__ || Object.getPrototypeOf(MDCTemporaryDrawerFoundation.prototype), 'updateDrawer_', this).call(this);
var newOpacity = Math.max(0, 1 + this.direction_ * (this.newPosition_ / this.drawerWidth_));
this.adapter_.updateCssVariable(newOpacity);
}
}, {
key: 'isRootTransitioningEventTarget_',
value: function isRootTransitioningEventTarget_(el) {
return this.adapter_.isDrawer(el);
}
}]);
return MDCTemporaryDrawerFoundation;
}(__WEBPACK_IMPORTED_MODULE_0__material_base__["MDCFoundation"]);
}(__WEBPACK_IMPORTED_MODULE_0__slidable__["a" /* MDCSlidableDrawerFoundation */]);

@@ -874,3 +1281,3 @@ /* harmony default export */ __webpack_exports__["a"] = MDCTemporaryDrawerFoundation;

/***/ 32:
/***/ 38:
/***/ (function(module, __webpack_exports__, __webpack_require__) {

@@ -880,5 +1287,6 @@

/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__material_base__ = __webpack_require__(0);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(31);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(13);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(37);
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__util__ = __webpack_require__(11);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
/* unused harmony reexport util */
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return MDCTemporaryDrawer; });

@@ -915,2 +1323,3 @@ var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var MDCTemporaryDrawer = function (_MDCComponent) {

@@ -1035,8 +1444,37 @@ _inherits(MDCTemporaryDrawer, _MDCComponent);

/***/ 48:
/***/ 60:
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(17);
module.exports = __webpack_require__(18);
/***/ }),
/***/ 9:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__constants__ = __webpack_require__(34);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "b", function() { return __WEBPACK_IMPORTED_MODULE_0__constants__["a"]; });
/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__foundation__ = __webpack_require__(35);
/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return __WEBPACK_IMPORTED_MODULE_1__foundation__["a"]; });
/**
* Copyright 2016 Google Inc. All Rights Reserved.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/***/ })

@@ -1043,0 +1481,0 @@

2

dist/mdc.drawer.min.js

@@ -6,2 +6,2 @@ /*!

*/
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.drawer=t():(e.mdc=e.mdc||{},e.mdc.drawer=t())}(this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/assets/",t(t.s=48)}({0:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(1);n.d(t,"MDCFoundation",function(){return r.a});var a=n(2);n.d(t,"MDCComponent",function(){return a.a})},1:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var a=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),i=function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,e),this.adapter_=t}return a(e,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),a(e,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),e}();t.a=i},13:function(e,t,n){"use strict";function r(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:window;if(!("ontouchstart"in t.document))switch(e){case"touchstart":return"pointerdown";case"touchmove":return"pointermove";case"touchend":return"pointerup";default:return e}return e}function a(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===l||t){var n=e.document.createElement("div"),r="transform"in n.style?"transform":"-webkit-transform";l=r}return l}function i(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window;return"CSS"in e&&e.CSS.supports("(--color: red)")}function o(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===f||t){var n=!1;try{e.document.addEventListener("test",null,{get passive(){n=!0}})}catch(e){}f=n}return!!f&&{passive:!0}}function s(e){e.hasAttribute("tabindex")&&e.setAttribute(c,e.getAttribute("tabindex")),e.setAttribute(d,!0)}function u(e){e.hasAttribute(d)&&(e.hasAttribute(c)?(e.setAttribute("tabindex",e.getAttribute(c)),e.removeAttribute(c)):e.removeAttribute("tabindex"),e.removeAttribute(d))}Object.defineProperty(t,"__esModule",{value:!0}),t.remapEvent=r,t.getTransformPropertyName=a,t.supportsCssCustomProperties=i,t.applyPassive=o,t.saveElementTabState=s,t.restoreElementTabState=u;var c="data-mdc-tabindex",d="data-mdc-tabindex-handled",l=void 0,f=void 0},17:function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(13),a=n(32);n.d(t,"MDCTemporaryDrawer",function(){return a.a}),n.d(t,"MDCTemporaryDrawerFoundation",function(){return a.b}),n.d(t,"util",function(){return r})},2:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}var a=n(1),i=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),o=function(){function e(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;r(this,e),this.root_=t;for(var a=arguments.length,i=Array(a>2?a-2:0),o=2;o<a;o++)i[o-2]=arguments[o];this.initialize.apply(this,i),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return i(e,null,[{key:"attachTo",value:function(t){return new e(t,new a.a)}}]),i(e,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(e,t){this.root_.addEventListener(e,t)}},{key:"unlisten",value:function(e,t){this.root_.removeEventListener(e,t)}},{key:"emit",value:function(e,t){var n=void 0;"function"==typeof CustomEvent?n=new CustomEvent(e,{detail:t}):(n=document.createEvent("CustomEvent"),n.initCustomEvent(e,!1,!1,t)),this.root_.dispatchEvent(n)}}]),e}();t.a=o},30:function(e,t,n){"use strict";n.d(t,"a",function(){return a}),n.d(t,"b",function(){return i});var r="mdc-temporary-drawer",a={ROOT:r,OPEN:r+"--open",ANIMATING:r+"--animating",RIGHT:r+"--right"},i={DRAWER_SELECTOR:"."+r+"__drawer",OPACITY_VAR_NAME:"--"+r+"-opacity",FOCUSABLE_ELEMENTS:"a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]"}},31:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var o=n(0),s=n(30),u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},c=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),d=function(e){function t(e){r(this,t);var n=a(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,u(t.defaultAdapter,e)));return n.transitionEndHandler_=function(e){n.adapter_.isDrawer(e.target)&&(n.adapter_.removeClass(t.cssClasses.ANIMATING),n.adapter_.deregisterTransitionEndHandler(n.transitionEndHandler_))},n.inert_=!1,n.componentClickHandler_=function(){return n.close()},n.drawerClickHandler_=function(e){return e.stopPropagation()},n.componentTouchStartHandler_=function(e){return n.handleTouchStart_(e)},n.componentTouchMoveHandler_=function(e){return n.handleTouchMove_(e)},n.componentTouchEndHandler_=function(e){return n.handleTouchEnd_(e)},n.documentKeydownHandler_=function(e){(e.key&&"Escape"===e.key||27===e.keyCode)&&n.close()},n}return i(t,e),c(t,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},hasNecessaryDom:function(){return!1},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerDrawerInteractionHandler:function(){},deregisterDrawerInteractionHandler:function(){},registerTransitionEndHandler:function(){},deregisterTransitionEndHandler:function(){},registerDocumentKeydownHandler:function(){},deregisterDocumentKeydownHandler:function(){},setTranslateX:function(){},updateCssVariable:function(){},getFocusableElements:function(){},saveElementTabState:function(){},restoreElementTabState:function(){},makeElementUntabbable:function(){},isRtl:function(){return!1},getDrawerWidth:function(){return 0},isDrawer:function(){return!1}}}}]),c(t,[{key:"init",value:function(){var e=t.cssClasses,n=e.ROOT,r=e.OPEN;if(!this.adapter_.hasClass(n))throw new Error(n+" class required in root element.");if(!this.adapter_.hasNecessaryDom())throw new Error("Required DOM nodes missing in "+n+" component.");this.adapter_.hasClass(r)?this.isOpen_=!0:(this.detabinate_(),this.isOpen_=!1),this.adapter_.updateCssVariable(0),this.adapter_.registerInteractionHandler("click",this.componentClickHandler_),this.adapter_.registerDrawerInteractionHandler("click",this.drawerClickHandler_),this.adapter_.registerDrawerInteractionHandler("touchstart",this.componentTouchStartHandler_),this.adapter_.registerInteractionHandler("touchmove",this.componentTouchMoveHandler_),this.adapter_.registerInteractionHandler("touchend",this.componentTouchEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterInteractionHandler("click",this.componentClickHandler_),this.adapter_.deregisterDrawerInteractionHandler("click",this.drawerClickHandler_),this.adapter_.deregisterDrawerInteractionHandler("touchstart",this.componentTouchStartHandler_),this.adapter_.deregisterInteractionHandler("touchmove",this.componentTouchMoveHandler_),this.adapter_.deregisterInteractionHandler("touchend",this.componentTouchEndHandler_),this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_)}},{key:"open",value:function(){this.adapter_.updateCssVariable(""),this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_),this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_),this.adapter_.addClass(t.cssClasses.ANIMATING),this.adapter_.addClass(t.cssClasses.OPEN),this.retabinate_(),this.isOpen_=!0}},{key:"close",value:function(){this.adapter_.updateCssVariable(""),this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_),this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_),this.adapter_.addClass(t.cssClasses.ANIMATING),this.adapter_.removeClass(t.cssClasses.OPEN),this.detabinate_(),this.isOpen_=!1}},{key:"isOpen",value:function(){return this.isOpen_}},{key:"detabinate_",value:function(){if(!this.inert_){var e=this.adapter_.getFocusableElements();if(e)for(var t=0;t<e.length;t++)this.adapter_.saveElementTabState(e[t]),this.adapter_.makeElementUntabbable(e[t]);this.inert_=!0}}},{key:"retabinate_",value:function(){if(this.inert_){var e=this.adapter_.getFocusableElements();if(e)for(var t=0;t<e.length;t++)this.adapter_.restoreElementTabState(e[t]);this.inert_=!1}}},{key:"handleTouchStart_",value:function(e){this.adapter_.hasClass(t.cssClasses.OPEN)&&(e.pointerType&&"touch"!==e.pointerType||(this.direction_=this.adapter_.isRtl()?-1:1,this.drawerWidth_=this.adapter_.getDrawerWidth(),this.startX_=e.touches?e.touches[0].pageX:e.pageX,this.currentX_=this.startX_,this.touchingSideNav_=!0,requestAnimationFrame(this.updateDrawer_.bind(this))))}},{key:"handleTouchMove_",value:function(e){e.pointerType&&"touch"!==e.pointerType||(this.currentX_=e.touches?e.touches[0].pageX:e.pageX)}},{key:"handleTouchEnd_",value:function(e){if(!e.pointerType||"touch"===e.pointerType){this.touchingSideNav_=!1,this.adapter_.setTranslateX(null),this.adapter_.updateCssVariable("");var t=null;t=1===this.direction_?Math.min(0,this.currentX_-this.startX_):Math.max(0,this.currentX_-this.startX_),Math.abs(t/this.drawerWidth_)>=.5?this.close():this.open()}}},{key:"updateDrawer_",value:function(){if(this.touchingSideNav_){requestAnimationFrame(this.updateDrawer_.bind(this));var e=null,t=null;e=1===this.direction_?Math.min(0,this.currentX_-this.startX_):Math.max(0,this.currentX_-this.startX_),t=Math.max(0,1+this.direction_*(e/this.drawerWidth_)),this.adapter_.setTranslateX(e),this.adapter_.updateCssVariable(t)}}}]),t}(o.MDCFoundation);t.a=d},32:function(e,t,n){"use strict";function r(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function a(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}function i(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}var o=n(0),s=n(31),u=n(13);n.d(t,"b",function(){return s.a}),n.d(t,"a",function(){return d});var c=function(){function e(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}return function(t,n,r){return n&&e(t.prototype,n),r&&e(t,r),t}}(),d=function(e){function t(){return r(this,t),a(this,(t.__proto__||Object.getPrototypeOf(t)).apply(this,arguments))}return i(t,e),c(t,[{key:"getDefaultFoundation",value:function(){var e=this,t=s.a.strings,n=t.FOCUSABLE_ELEMENTS,r=t.OPACITY_VAR_NAME;return new s.a({addClass:function(t){return e.root_.classList.add(t)},removeClass:function(t){return e.root_.classList.remove(t)},hasClass:function(t){return e.root_.classList.contains(t)},hasNecessaryDom:function(){return Boolean(e.drawer)},registerInteractionHandler:function(t,n){return e.root_.addEventListener(u.remapEvent(t),n,u.applyPassive())},deregisterInteractionHandler:function(t,n){return e.root_.removeEventListener(u.remapEvent(t),n,u.applyPassive())},registerDrawerInteractionHandler:function(t,n){return e.drawer.addEventListener(u.remapEvent(t),n)},deregisterDrawerInteractionHandler:function(t,n){return e.drawer.removeEventListener(u.remapEvent(t),n)},registerTransitionEndHandler:function(t){return e.drawer.addEventListener("transitionend",t)},deregisterTransitionEndHandler:function(t){return e.drawer.removeEventListener("transitionend",t)},registerDocumentKeydownHandler:function(e){return document.addEventListener("keydown",e)},deregisterDocumentKeydownHandler:function(e){return document.removeEventListener("keydown",e)},getDrawerWidth:function(){return e.drawer.offsetWidth},setTranslateX:function(t){return e.drawer.style.setProperty(u.getTransformPropertyName(),null===t?null:"translateX("+t+"px)")},updateCssVariable:function(t){u.supportsCssCustomProperties()&&e.root_.style.setProperty(r,t)},getFocusableElements:function(){return e.drawer.querySelectorAll(n)},saveElementTabState:function(e){return u.saveElementTabState(e)},restoreElementTabState:function(e){return u.restoreElementTabState(e)},makeElementUntabbable:function(e){return e.setAttribute("tabindex",-1)},isRtl:function(){return"rtl"===getComputedStyle(e.root_).getPropertyValue("direction")},isDrawer:function(t){return t===e.drawer}})}},{key:"open",get:function(){return this.foundation_.isOpen()},set:function(e){e?this.foundation_.open():this.foundation_.close()}},{key:"drawer",get:function(){return this.root_.querySelector(s.a.strings.DRAWER_SELECTOR)}}],[{key:"attachTo",value:function(e){return new t(e)}}]),t}(o.MDCComponent)},48:function(e,t,n){e.exports=n(17)}})});
!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.drawer=e():(t.mdc=t.mdc||{},t.mdc.drawer=e())}(this,function(){return function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.i=function(t){return t},e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="/assets/",e(e.s=60)}({0:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=n(1);n.d(e,"MDCFoundation",function(){return r.a});var o=n(2);n.d(e,"MDCComponent",function(){return o.a})},1:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var o=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),a=function(){function t(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};r(this,t),this.adapter_=e}return o(t,null,[{key:"cssClasses",get:function(){return{}}},{key:"strings",get:function(){return{}}},{key:"numbers",get:function(){return{}}},{key:"defaultAdapter",get:function(){return{}}}]),o(t,[{key:"init",value:function(){}},{key:"destroy",value:function(){}}]),t}();e.a=a},11:function(t,e,n){"use strict";function r(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:window;if(!("ontouchstart"in e.document))switch(t){case"touchstart":return"pointerdown";case"touchmove":return"pointermove";case"touchend":return"pointerup";default:return t}return t}function o(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===d||e){var n=t.document.createElement("div"),r="transform"in n.style?"transform":"-webkit-transform";d=r}return d}function a(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window;return"CSS"in t&&t.CSS.supports("(--color: red)")}function i(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:window,e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(void 0===f||e){var n=!1;try{t.document.addEventListener("test",null,{get passive(){n=!0}})}catch(t){}f=n}return!!f&&{passive:!0}}function s(t){t.hasAttribute("tabindex")&&t.setAttribute(c,t.getAttribute("tabindex")),t.setAttribute(l,!0)}function u(t){t.hasAttribute(l)&&(t.hasAttribute(c)?(t.setAttribute("tabindex",t.getAttribute(c)),t.removeAttribute(c)):t.removeAttribute("tabindex"),t.removeAttribute(l))}Object.defineProperty(e,"__esModule",{value:!0}),e.remapEvent=r,e.getTransformPropertyName=o,e.supportsCssCustomProperties=a,e.applyPassive=i,e.saveElementTabState=s,e.restoreElementTabState=u;var c="data-mdc-tabindex",l="data-mdc-tabindex-handled",d=void 0,f=void 0},18:function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var r=n(11),o=n(38);n.d(e,"MDCTemporaryDrawer",function(){return o.a}),n.d(e,"MDCTemporaryDrawerFoundation",function(){return o.b});var a=n(33);n.d(e,"MDCPersistentDrawer",function(){return a.a}),n.d(e,"MDCPersistentDrawerFoundation",function(){return a.b}),n.d(e,"util",function(){return r})},2:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}var o=n(1),a=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),i=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:void 0;r(this,t),this.root_=e;for(var o=arguments.length,a=Array(o>2?o-2:0),i=2;i<o;i++)a[i-2]=arguments[i];this.initialize.apply(this,a),this.foundation_=void 0===n?this.getDefaultFoundation():n,this.foundation_.init(),this.initialSyncWithDOM()}return a(t,null,[{key:"attachTo",value:function(e){return new t(e,new o.a)}}]),a(t,[{key:"initialize",value:function(){}},{key:"getDefaultFoundation",value:function(){throw new Error("Subclasses must override getDefaultFoundation to return a properly configured foundation class")}},{key:"initialSyncWithDOM",value:function(){}},{key:"destroy",value:function(){this.foundation_.destroy()}},{key:"listen",value:function(t,e){this.root_.addEventListener(t,e)}},{key:"unlisten",value:function(t,e){this.root_.removeEventListener(t,e)}},{key:"emit",value:function(t,e){var n=void 0;"function"==typeof CustomEvent?n=new CustomEvent(t,{detail:e}):(n=document.createEvent("CustomEvent"),n.initCustomEvent(t,!1,!1,e)),this.root_.dispatchEvent(n)}}]),t}();e.a=i},31:function(t,e,n){"use strict";var r=n(9);n.d(e,"a",function(){return o}),n.d(e,"b",function(){return a});var o={ROOT:"mdc-persistent-drawer",OPEN:"mdc-persistent-drawer--open",ANIMATING:"mdc-persistent-drawer--animating"},a={DRAWER_SELECTOR:".mdc-persistent-drawer__drawer",FOCUSABLE_ELEMENTS:r.b}},32:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var i=n(9),s=n(31),u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},c=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),l=function(t){function e(t){return r(this,e),o(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,u(e.defaultAdapter,t),e.cssClasses.ROOT,e.cssClasses.ANIMATING,e.cssClasses.OPEN))}return a(e,t),c(e,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return u(i.a.defaultAdapter,{isDrawer:function(){return!1}})}}]),c(e,[{key:"isRootTransitioningEventTarget_",value:function(t){return this.adapter_.isDrawer(t)}}]),e}(i.a);e.a=l},33:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var i=n(0),s=n(32),u=n(11);n.d(e,"b",function(){return s.a}),n.d(e,"a",function(){return l});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),l=function(t){function e(){return r(this,e),o(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"getDefaultFoundation",value:function(){var t=this,e=s.a.strings.FOCUSABLE_ELEMENTS;return new s.a({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},hasClass:function(e){return t.root_.classList.contains(e)},hasNecessaryDom:function(){return Boolean(t.drawer)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(u.remapEvent(e),n,u.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(u.remapEvent(e),n,u.applyPassive())},registerDrawerInteractionHandler:function(e,n){return t.drawer.addEventListener(u.remapEvent(e),n)},deregisterDrawerInteractionHandler:function(e,n){return t.drawer.removeEventListener(u.remapEvent(e),n)},registerTransitionEndHandler:function(e){return t.root_.addEventListener("transitionend",e)},deregisterTransitionEndHandler:function(e){return t.root_.removeEventListener("transitionend",e)},registerDocumentKeydownHandler:function(t){return document.addEventListener("keydown",t)},deregisterDocumentKeydownHandler:function(t){return document.removeEventListener("keydown",t)},getDrawerWidth:function(){return t.drawer.offsetWidth},setTranslateX:function(e){return t.drawer.style.setProperty(u.getTransformPropertyName(),null===e?null:"translateX("+e+"px)")},getFocusableElements:function(){return t.drawer.querySelectorAll(e)},saveElementTabState:function(t){return u.saveElementTabState(t)},restoreElementTabState:function(t){return u.restoreElementTabState(t)},makeElementUntabbable:function(t){return t.setAttribute("tabindex",-1)},isRtl:function(){return"rtl"===getComputedStyle(t.root_).getPropertyValue("direction")},isDrawer:function(e){return e===t.drawer}})}},{key:"open",get:function(){return this.foundation_.isOpen()},set:function(t){t?this.foundation_.open():this.foundation_.close()}},{key:"drawer",get:function(){return this.root_.querySelector(s.a.strings.DRAWER_SELECTOR)}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(i.MDCComponent)},34:function(t,e,n){"use strict";n.d(e,"a",function(){return r});var r="a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]"},35:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var i=n(0);n.d(e,"a",function(){return c});var s=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},u=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),c=function(t){function e(t,n,a,i){r(this,e);var u=o(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,s(e.defaultAdapter,t)));return u.rootCssClass_=n,u.animatingCssClass_=a,u.openCssClass_=i,u.transitionEndHandler_=function(t){u.isRootTransitioningEventTarget_(t.target)&&(u.adapter_.removeClass(u.animatingCssClass_),u.adapter_.deregisterTransitionEndHandler(u.transitionEndHandler_))},u.inert_=!1,u.drawerClickHandler_=function(t){return t.stopPropagation()},u.componentTouchStartHandler_=function(t){return u.handleTouchStart_(t)},u.componentTouchMoveHandler_=function(t){return u.handleTouchMove_(t)},u.componentTouchEndHandler_=function(t){return u.handleTouchEnd_(t)},u.documentKeydownHandler_=function(t){(t.key&&"Escape"===t.key||27===t.keyCode)&&u.close()},u}return a(e,t),u(e,null,[{key:"defaultAdapter",get:function(){return{addClass:function(){},removeClass:function(){},hasClass:function(){},hasNecessaryDom:function(){return!1},registerInteractionHandler:function(){},deregisterInteractionHandler:function(){},registerDrawerInteractionHandler:function(){},deregisterDrawerInteractionHandler:function(){},registerTransitionEndHandler:function(){},deregisterTransitionEndHandler:function(){},registerDocumentKeydownHandler:function(){},deregisterDocumentKeydownHandler:function(){},setTranslateX:function(){},getFocusableElements:function(){},saveElementTabState:function(){},restoreElementTabState:function(){},makeElementUntabbable:function(){},isRtl:function(){return!1},getDrawerWidth:function(){return 0}}}}]),u(e,[{key:"init",value:function(){var t=this.rootCssClass_,e=this.openCssClass_;if(!this.adapter_.hasClass(t))throw new Error(t+" class required in root element.");if(!this.adapter_.hasNecessaryDom())throw new Error("Required DOM nodes missing in "+t+" component.");this.adapter_.hasClass(e)?this.isOpen_=!0:(this.detabinate_(),this.isOpen_=!1),this.adapter_.registerDrawerInteractionHandler("click",this.drawerClickHandler_),this.adapter_.registerDrawerInteractionHandler("touchstart",this.componentTouchStartHandler_),this.adapter_.registerInteractionHandler("touchmove",this.componentTouchMoveHandler_),this.adapter_.registerInteractionHandler("touchend",this.componentTouchEndHandler_)}},{key:"destroy",value:function(){this.adapter_.deregisterDrawerInteractionHandler("click",this.drawerClickHandler_),this.adapter_.deregisterDrawerInteractionHandler("touchstart",this.componentTouchStartHandler_),this.adapter_.deregisterInteractionHandler("touchmove",this.componentTouchMoveHandler_),this.adapter_.deregisterInteractionHandler("touchend",this.componentTouchEndHandler_),this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_)}},{key:"open",value:function(){this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_),this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_),this.adapter_.addClass(this.animatingCssClass_),this.adapter_.addClass(this.openCssClass_),this.retabinate_(),this.isOpen_=!0}},{key:"close",value:function(){this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_),this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_),this.adapter_.addClass(this.animatingCssClass_),this.adapter_.removeClass(this.openCssClass_),this.detabinate_(),this.isOpen_=!1}},{key:"isOpen",value:function(){return this.isOpen_}},{key:"detabinate_",value:function(){if(!this.inert_){var t=this.adapter_.getFocusableElements();if(t)for(var e=0;e<t.length;e++)this.adapter_.saveElementTabState(t[e]),this.adapter_.makeElementUntabbable(t[e]);this.inert_=!0}}},{key:"retabinate_",value:function(){if(this.inert_){var t=this.adapter_.getFocusableElements();if(t)for(var e=0;e<t.length;e++)this.adapter_.restoreElementTabState(t[e]);this.inert_=!1}}},{key:"handleTouchStart_",value:function(t){this.adapter_.hasClass(this.openCssClass_)&&(t.pointerType&&"touch"!==t.pointerType||(this.direction_=this.adapter_.isRtl()?-1:1,this.drawerWidth_=this.adapter_.getDrawerWidth(),this.startX_=t.touches?t.touches[0].pageX:t.pageX,this.currentX_=this.startX_,this.touchingSideNav_=!0,requestAnimationFrame(this.updateDrawer_.bind(this))))}},{key:"handleTouchMove_",value:function(t){t.pointerType&&"touch"!==t.pointerType||(this.currentX_=t.touches?t.touches[0].pageX:t.pageX)}},{key:"handleTouchEnd_",value:function(t){t.pointerType&&"touch"!==t.pointerType||(this.prepareForTouchEnd_(),Math.abs(this.newPosition_/this.drawerWidth_)>=.5?this.close():this.open())}},{key:"prepareForTouchEnd_",value:function(){this.touchingSideNav_=!1,this.adapter_.setTranslateX(null)}},{key:"updateDrawer_",value:function(){this.touchingSideNav_&&(requestAnimationFrame(this.updateDrawer_.bind(this)),this.adapter_.setTranslateX(this.newPosition_))}},{key:"isRootTransitioningEventTarget_",value:function(t){return!1}},{key:"newPosition_",get:function(){var t=null;return t=1===this.direction_?Math.min(0,this.currentX_-this.startX_):Math.max(0,this.currentX_-this.startX_)}}]),e}(i.MDCFoundation)},36:function(t,e,n){"use strict";var r=n(9);n.d(e,"a",function(){return o}),n.d(e,"b",function(){return a});var o={ROOT:"mdc-temporary-drawer",OPEN:"mdc-temporary-drawer--open",ANIMATING:"mdc-temporary-drawer--animating"},a={DRAWER_SELECTOR:".mdc-temporary-drawer__drawer",OPACITY_VAR_NAME:"--mdc-temporary-drawer-opacity",FOCUSABLE_ELEMENTS:r.b}},37:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var i=n(9),s=n(36),u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t},c=function t(e,n,r){null===e&&(e=Function.prototype);var o=Object.getOwnPropertyDescriptor(e,n);if(void 0===o){var a=Object.getPrototypeOf(e);return null===a?void 0:t(a,n,r)}if("value"in o)return o.value;var i=o.get;if(void 0!==i)return i.call(r)},l=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),d=function(t){function e(t){r(this,e);var n=o(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,u(e.defaultAdapter,t),e.cssClasses.ROOT,e.cssClasses.ANIMATING,e.cssClasses.OPEN));return n.componentClickHandler_=function(){return n.close()},n}return a(e,t),l(e,null,[{key:"cssClasses",get:function(){return s.a}},{key:"strings",get:function(){return s.b}},{key:"defaultAdapter",get:function(){return u(i.a.defaultAdapter,{isDrawer:function(){return!1},updateCssVariable:function(){}})}}]),l(e,[{key:"init",value:function(){c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"init",this).call(this),this.adapter_.updateCssVariable(0),this.adapter_.registerInteractionHandler("click",this.componentClickHandler_)}},{key:"destroy",value:function(){c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"destroy",this).call(this),this.adapter_.deregisterInteractionHandler("click",this.componentClickHandler_)}},{key:"open",value:function(){this.adapter_.updateCssVariable(""),c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"open",this).call(this)}},{key:"close",value:function(){this.adapter_.updateCssVariable(""),c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"close",this).call(this)}},{key:"prepareForTouchEnd_",value:function(){c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"prepareForTouchEnd_",this).call(this),this.adapter_.updateCssVariable("")}},{key:"updateDrawer_",value:function(){c(e.prototype.__proto__||Object.getPrototypeOf(e.prototype),"updateDrawer_",this).call(this);var t=Math.max(0,1+this.direction_*(this.newPosition_/this.drawerWidth_));this.adapter_.updateCssVariable(t)}},{key:"isRootTransitioningEventTarget_",value:function(t){return this.adapter_.isDrawer(t)}}]),e}(i.a);e.a=d},38:function(t,e,n){"use strict";function r(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function o(t,e){if(!t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?t:e}function a(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(t,e):t.__proto__=e)}var i=n(0),s=n(37),u=n(11);n.d(e,"b",function(){return s.a}),n.d(e,"a",function(){return l});var c=function(){function t(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}return function(e,n,r){return n&&t(e.prototype,n),r&&t(e,r),e}}(),l=function(t){function e(){return r(this,e),o(this,(e.__proto__||Object.getPrototypeOf(e)).apply(this,arguments))}return a(e,t),c(e,[{key:"getDefaultFoundation",value:function(){var t=this,e=s.a.strings,n=e.FOCUSABLE_ELEMENTS,r=e.OPACITY_VAR_NAME;return new s.a({addClass:function(e){return t.root_.classList.add(e)},removeClass:function(e){return t.root_.classList.remove(e)},hasClass:function(e){return t.root_.classList.contains(e)},hasNecessaryDom:function(){return Boolean(t.drawer)},registerInteractionHandler:function(e,n){return t.root_.addEventListener(u.remapEvent(e),n,u.applyPassive())},deregisterInteractionHandler:function(e,n){return t.root_.removeEventListener(u.remapEvent(e),n,u.applyPassive())},registerDrawerInteractionHandler:function(e,n){return t.drawer.addEventListener(u.remapEvent(e),n)},deregisterDrawerInteractionHandler:function(e,n){return t.drawer.removeEventListener(u.remapEvent(e),n)},registerTransitionEndHandler:function(e){return t.drawer.addEventListener("transitionend",e)},deregisterTransitionEndHandler:function(e){return t.drawer.removeEventListener("transitionend",e)},registerDocumentKeydownHandler:function(t){return document.addEventListener("keydown",t)},deregisterDocumentKeydownHandler:function(t){return document.removeEventListener("keydown",t)},getDrawerWidth:function(){return t.drawer.offsetWidth},setTranslateX:function(e){return t.drawer.style.setProperty(u.getTransformPropertyName(),null===e?null:"translateX("+e+"px)")},updateCssVariable:function(e){u.supportsCssCustomProperties()&&t.root_.style.setProperty(r,e)},getFocusableElements:function(){return t.drawer.querySelectorAll(n)},saveElementTabState:function(t){return u.saveElementTabState(t)},restoreElementTabState:function(t){return u.restoreElementTabState(t)},makeElementUntabbable:function(t){return t.setAttribute("tabindex",-1)},isRtl:function(){return"rtl"===getComputedStyle(t.root_).getPropertyValue("direction")},isDrawer:function(e){return e===t.drawer}})}},{key:"open",get:function(){return this.foundation_.isOpen()},set:function(t){t?this.foundation_.open():this.foundation_.close()}},{key:"drawer",get:function(){return this.root_.querySelector(s.a.strings.DRAWER_SELECTOR)}}],[{key:"attachTo",value:function(t){return new e(t)}}]),e}(i.MDCComponent)},60:function(t,e,n){t.exports=n(18)},9:function(t,e,n){"use strict";var r=n(34);n.d(e,"b",function(){return r.a});var o=n(35);n.d(e,"a",function(){return o.a})}})});

1

index.js

@@ -19,2 +19,3 @@ /**

export {MDCTemporaryDrawer, MDCTemporaryDrawerFoundation} from './temporary';
export {MDCPersistentDrawer, MDCPersistentDrawerFoundation} from './persistent';
export {util};

2

package.json
{
"name": "@material/drawer",
"version": "0.2.0",
"version": "0.3.0",
"description": "The Material Components Web drawer component",

@@ -5,0 +5,0 @@ "license": "Apache-2.0",

129

README.md

@@ -5,4 +5,4 @@ # MDC Drawer

[Material Design navigation drawer pattern](https://material.google.com/patterns/navigation-drawer.html).
It implements permanent and temporary drawers. Permanent drawers are CSS-only and require no JavaScript, whereas
temporary drawers require JavaScript to function, in order to respond to user interaction.
It implements permanent, persistent, and temporary drawers. Permanent drawers are CSS-only and require no JavaScript, whereas persistent and temporary drawers require JavaScript to function, in order to respond to
user interaction.

@@ -74,3 +74,128 @@ ## Installation

## Persistent drawer usage
Persistent drawers can be toggled open or closed. The drawer sits on the same surface elevation as the content. It is closed by default. When the drawer is outside of the page grid and opens, the drawer forces other content to change size and adapt to the smaller viewport. Persistent drawers stay open until closed by the user.
Persistent drawers are acceptable for all sizes larger than mobile.
```html
<aside class="mdc-persistent-drawer mdc-typography">
<nav class="mdc-persistent-drawer__drawer">
<header class="mdc-persistent-drawer__header">
<div class="mdc-persistent-drawer__header-content">
Header here
</div>
</header>
<nav id="icon-with-text-demo" class="mdc-persistent-drawer__content mdc-list">
<a class="mdc-list-item mdc-persistent-drawer--selected" href="#">
<i class="material-icons mdc-list-item__start-detail" aria-hidden="true">inbox</i>Inbox
</a>
<a class="mdc-list-item" href="#">
<i class="material-icons mdc-list-item__start-detail" aria-hidden="true">star</i>Star
</a>
</nav>
</nav>
</aside>
```
```js
let drawer = new mdc.drawer.MDCPersistentDrawer(document.querySelector('.mdc-persistent-drawer'));
document.querySelector('.menu').addEventListener('click', () => drawer.open = true);
```
CSS classes:
| Class | Description |
| -------------------------------------- | -------------------------------------------------------------------------- |
| `mdc-persistent-drawer` | Mandatory. Needs to be set on the root element of the component. |
| `mdc-persistent-drawer__drawer` | Mandatory. Needs to be set on the container node for the drawer content. |
### Using the JS Component
MDC Persistent Drawer ships with a Component / Foundation combo which allows for frameworks to richly integrate the
correct drawer behaviors into idiomatic components.
#### Including in code
##### ES2015
```javascript
import {MDCPersistentDrawer, MDCPersistentDrawerFoundation, util} from 'mdc-drawer';
```
##### CommonJS
```javascript
const mdcDrawer = require('mdc-drawer');
const MDCPersistentDrawer = mdcDrawer.MDCPersistentDrawer;
const MDCPersistentDrawerFoundation = mdcDrawer.MDCPersistentDrawerFoundation;
const util = mdcDrawer.util;
```
##### AMD
```javascript
require(['path/to/mdc-drawer'], mdcDrawer => {
const MDCPersistentDrawer = mdcDrawer.MDCPersistentDrawer;
const MDCPersistentDrawerFoundation = mdcDrawer.MDCPersistentDrawerFoundation;
const util = mdcDrawer.util;
});
```
##### Global
```javascript
const MDCPersistentDrawer = mdc.drawer.MDCPersistentDrawer;
const MDCPersistentDrawerFoundation = mdc.drawer.MDCPersistentDrawerFoundation;
const util = mdc.drawer.util;
```
#### Automatic Instantiation
If you do not care about retaining the component instance for the persistent drawer, simply call `attachTo()`
and pass it a DOM element.
```javascript
mdc.drawer.MDCPersistentDrawer.attachTo(document.querySelector('.mdc-persistent-drawer'));
```
#### Manual Instantiation
Persistent drawers can easily be initialized using their default constructors as well, similar to `attachTo`.
```javascript
import {MDCPersistentDrawer} from 'mdc-drawer';
const drawer = new MDCPersistentDrawer(document.querySelector('.mdc-persistent-drawer'));
```
### Using the Foundation Class
MDC Persistent Drawer ships with an `MDCPersistentDrawerFoundation` class that external frameworks and libraries can
use to integrate the component. As with all foundation classes, an adapter object must be provided.
The adapter for persistent drawers must provide the following functions, with correct signatures:
| Method Signature | Description |
| --- | --- |
| `addClass(className: string) => void` | Adds a class to the root element. |
| `removeClass(className: string) => void` | Removes a class from the root element. |
| `hasClass(className: string) => boolean` | Returns boolean indicating whether element has a given class. |
| `hasNecessaryDom() => boolean` | Returns boolean indicating whether the necessary DOM is present (namely, the `mdc-persistent-drawer__drawer` drawer container). |
| `registerInteractionHandler(evt: string, handler: EventListener) => void` | Adds an event listener to the root element, for the specified event name. |
| `deregisterInteractionHandler(evt: string, handler: EventListener) => void` | Removes an event listener from the root element, for the specified event name. |
| `registerDrawerInteractionHandler(evt: string, handler: EventListener) => void` | Adds an event listener to the drawer container sub-element, for the specified event name. |
| `deregisterDrawerInteractionHandler(evt: string, handler: EventListener) => void` | Removes an event listener from drawer container sub-element, for the specified event name. |
| `registerTransitionEndHandler(handler: EventListener) => void` | Registers an event handler to be called when a `transitionend` event is triggered on the drawer container sub-element element. |
| `deregisterTransitionEndHandler(handler: EventListener) => void` | Deregisters an event handler from a `transitionend` event listener. This will only be called with handlers that have previously been passed to `registerTransitionEndHandler` calls. |
| `registerDocumentKeydownHandler(handler: EventListener) => void` | Registers an event handler on the `document` object for a `keydown` event. |
| `deregisterDocumentKeydownHandler(handler: EventListener) => void` | Deregisters an event handler on the `document` object for a `keydown` event. |
| `getDrawerWidth() => number` | Returns the current drawer width, in pixels. |
| `setTranslateX(value: number) => void` | Sets the current position for the drawer, in pixels from the border. |
| `getFocusableElements() => NodeList` | Returns the node list of focusable elements inside the drawer. |
| `saveElementTabState(el: Element) => void` | Saves the current tab index for the element in a data property. |
| `restoreElementTabState(el: Element) => void` | Restores the saved tab index (if any) for an element. |
| `makeElementUntabbable(el: Element) => void` | Makes an element untabbable. |
| `isRtl() => boolean` | Returns boolean indicating whether the current environment is RTL. |
| `isDrawer(el: Element) => boolean` | Returns boolean indicating whether the provided element is the drawer container sub-element. |
## Temporary drawer usage

@@ -77,0 +202,0 @@

16

temporary/constants.js

@@ -17,16 +17,14 @@ /**

const ROOT = 'mdc-temporary-drawer';
import {FOCUSABLE_ELEMENTS} from '../slidable';
export const cssClasses = {
ROOT,
OPEN: `${ROOT}--open`,
ANIMATING: `${ROOT}--animating`,
RIGHT: `${ROOT}--right`,
ROOT: 'mdc-temporary-drawer',
OPEN: 'mdc-temporary-drawer--open',
ANIMATING: 'mdc-temporary-drawer--animating',
};
export const strings = {
DRAWER_SELECTOR: `.${ROOT}__drawer`,
OPACITY_VAR_NAME: `--${ROOT}-opacity`,
FOCUSABLE_ELEMENTS: 'a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), ' +
'button:not([disabled]), iframe, object, embed, [tabindex], [contenteditable]',
DRAWER_SELECTOR: '.mdc-temporary-drawer__drawer',
OPACITY_VAR_NAME: '--mdc-temporary-drawer-opacity',
FOCUSABLE_ELEMENTS,
};

209

temporary/foundation.js

@@ -17,6 +17,6 @@ /**

import {MDCFoundation} from '@material/base';
import {MDCSlidableDrawerFoundation} from '../slidable';
import {cssClasses, strings} from './constants';
export default class MDCTemporaryDrawerFoundation extends MDCFoundation {
export default class MDCTemporaryDrawerFoundation extends MDCSlidableDrawerFoundation {
static get cssClasses() {

@@ -31,88 +31,31 @@ return cssClasses;

static get defaultAdapter() {
return {
addClass: (/* className: string */) => {},
removeClass: (/* className: string */) => {},
hasClass: (/* className: string */) => {},
hasNecessaryDom: () => /* boolean */ false,
registerInteractionHandler: (/* evt: string, handler: EventListener */) => {},
deregisterInteractionHandler: (/* evt: string, handler: EventListener */) => {},
registerDrawerInteractionHandler: (/* evt: string, handler: EventListener */) => {},
deregisterDrawerInteractionHandler: (/* evt: string, handler: EventListener */) => {},
registerTransitionEndHandler: (/* handler: EventListener */) => {},
deregisterTransitionEndHandler: (/* handler: EventListener */) => {},
registerDocumentKeydownHandler: (/* handler: EventListener */) => {},
deregisterDocumentKeydownHandler: (/* handler: EventListener */) => {},
setTranslateX: (/* value: number | null */) => {},
return Object.assign(MDCSlidableDrawerFoundation.defaultAdapter, {
isDrawer: () => false,
updateCssVariable: (/* value: string */) => {},
getFocusableElements: () => /* NodeList */ {},
saveElementTabState: (/* el: Element */) => {},
restoreElementTabState: (/* el: Element */) => {},
makeElementUntabbable: (/* el: Element */) => {},
isRtl: () => /* boolean */ false,
getDrawerWidth: () => /* number */ 0,
isDrawer: (/* el: Element */) => /* boolean */ false,
};
});
}
constructor(adapter) {
super(Object.assign(MDCTemporaryDrawerFoundation.defaultAdapter, adapter));
super(
Object.assign(MDCTemporaryDrawerFoundation.defaultAdapter, adapter),
MDCTemporaryDrawerFoundation.cssClasses.ROOT,
MDCTemporaryDrawerFoundation.cssClasses.ANIMATING,
MDCTemporaryDrawerFoundation.cssClasses.OPEN);
this.transitionEndHandler_ = (ev) => {
if (this.adapter_.isDrawer(ev.target)) {
this.adapter_.removeClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
this.adapter_.deregisterTransitionEndHandler(this.transitionEndHandler_);
}
};
this.inert_ = false;
this.componentClickHandler_ = () => this.close();
this.drawerClickHandler_ = (evt) => evt.stopPropagation();
this.componentTouchStartHandler_ = (evt) => this.handleTouchStart_(evt);
this.componentTouchMoveHandler_ = (evt) => this.handleTouchMove_(evt);
this.componentTouchEndHandler_ = (evt) => this.handleTouchEnd_(evt);
this.documentKeydownHandler_ = (evt) => {
if (evt.key && evt.key === 'Escape' || evt.keyCode === 27) {
this.close();
}
};
}
init() {
const {ROOT, OPEN} = MDCTemporaryDrawerFoundation.cssClasses;
super.init();
if (!this.adapter_.hasClass(ROOT)) {
throw new Error(`${ROOT} class required in root element.`);
}
if (!this.adapter_.hasNecessaryDom()) {
throw new Error(`Required DOM nodes missing in ${ROOT} component.`);
}
if (this.adapter_.hasClass(OPEN)) {
this.isOpen_ = true;
} else {
this.detabinate_();
this.isOpen_ = false;
}
// Make browser aware of custom property being used in this element.
// Workaround for certain types of hard-to-reproduce heisenbugs.
this.adapter_.updateCssVariable(0);
this.adapter_.registerInteractionHandler('click', this.componentClickHandler_);
this.adapter_.registerDrawerInteractionHandler('click', this.drawerClickHandler_);
this.adapter_.registerDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
this.adapter_.registerInteractionHandler('touchmove', this.componentTouchMoveHandler_);
this.adapter_.registerInteractionHandler('touchend', this.componentTouchEndHandler_);
}
destroy() {
super.destroy();
this.adapter_.deregisterInteractionHandler('click', this.componentClickHandler_);
this.adapter_.deregisterDrawerInteractionHandler('click', this.drawerClickHandler_);
this.adapter_.deregisterDrawerInteractionHandler('touchstart', this.componentTouchStartHandler_);
this.adapter_.deregisterInteractionHandler('touchmove', this.componentTouchMoveHandler_);
this.adapter_.deregisterInteractionHandler('touchend', this.componentTouchEndHandler_);
// Deregister the document keydown handler just in case the component is destroyed while the menu is open.
this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
}

@@ -124,8 +67,3 @@

this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
this.adapter_.registerDocumentKeydownHandler(this.documentKeydownHandler_);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN);
this.retabinate_();
this.isOpen_ = true;
super.open();
}

@@ -137,122 +75,21 @@

this.adapter_.deregisterDocumentKeydownHandler(this.documentKeydownHandler_);
this.adapter_.registerTransitionEndHandler(this.transitionEndHandler_);
this.adapter_.addClass(MDCTemporaryDrawerFoundation.cssClasses.ANIMATING);
this.adapter_.removeClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN);
this.detabinate_();
this.isOpen_ = false;
super.close();
}
isOpen() {
return this.isOpen_;
}
prepareForTouchEnd_() {
super.prepareForTouchEnd_();
/**
* Render all children of the drawer inert when it's closed.
*/
detabinate_() {
if (this.inert_) {
return;
}
const elements = this.adapter_.getFocusableElements();
if (elements) {
for (let i = 0; i < elements.length; i++) {
this.adapter_.saveElementTabState(elements[i]);
this.adapter_.makeElementUntabbable(elements[i]);
}
}
this.inert_ = true;
}
/**
* Make all children of the drawer tabbable again when it's open.
*/
retabinate_() {
if (!this.inert_) {
return;
}
const elements = this.adapter_.getFocusableElements();
if (elements) {
for (let i = 0; i < elements.length; i++) {
this.adapter_.restoreElementTabState(elements[i]);
}
}
this.inert_ = false;
}
handleTouchStart_(evt) {
if (!this.adapter_.hasClass(MDCTemporaryDrawerFoundation.cssClasses.OPEN)) {
return;
}
if (evt.pointerType && evt.pointerType !== 'touch') {
return;
}
this.direction_ = this.adapter_.isRtl() ? -1 : 1;
this.drawerWidth_ = this.adapter_.getDrawerWidth();
this.startX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
this.currentX_ = this.startX_;
this.touchingSideNav_ = true;
requestAnimationFrame(this.updateDrawer_.bind(this));
}
handleTouchMove_(evt) {
if (evt.pointerType && evt.pointerType !== 'touch') {
return;
}
this.currentX_ = evt.touches ? evt.touches[0].pageX : evt.pageX;
}
handleTouchEnd_(evt) {
if (evt.pointerType && evt.pointerType !== 'touch') {
return;
}
this.touchingSideNav_ = false;
this.adapter_.setTranslateX(null);
this.adapter_.updateCssVariable('');
let newPos = null;
if (this.direction_ === 1) {
newPos = Math.min(0, this.currentX_ - this.startX_);
} else {
newPos = Math.max(0, this.currentX_ - this.startX_);
}
// Did the user close the drawer by more than 50%?
if (Math.abs(newPos / this.drawerWidth_) >= 0.5) {
this.close();
} else {
// Triggering an open here means we'll get a nice animation back to the fully open state.
this.open();
}
}
updateDrawer_() {
if (!this.touchingSideNav_) {
return;
}
super.updateDrawer_();
requestAnimationFrame(this.updateDrawer_.bind(this));
let newPos = null;
let newOpacity = null;
if (this.direction_ === 1) {
newPos = Math.min(0, this.currentX_ - this.startX_);
} else {
newPos = Math.max(0, this.currentX_ - this.startX_);
}
newOpacity = Math.max(0, 1 + this.direction_ * (newPos / this.drawerWidth_));
this.adapter_.setTranslateX(newPos);
const newOpacity = Math.max(0, 1 + this.direction_ * (this.newPosition_ / this.drawerWidth_));
this.adapter_.updateCssVariable(newOpacity);
}
isRootTransitioningEventTarget_(el) {
return this.adapter_.isDrawer(el);
}
}

1

temporary/index.js

@@ -22,2 +22,3 @@ /**

export {MDCTemporaryDrawerFoundation};
export {util};

@@ -24,0 +25,0 @@ export class MDCTemporaryDrawer extends MDCComponent {

dist/mdc.drawer.css

Sorry, the diff of this file is not supported yet

dist/mdc.drawer.min.css

Sorry, the diff of this file is not supported yet

mdc-drawer.scss

Sorry, the diff of this file is not supported yet

permanent/mdc-permanent-drawer.scss

Sorry, the diff of this file is not supported yet

temporary/mdc-temporary-drawer.scss

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc