Project import generated by Copybara.
GitOrigin-RevId: 63746295f1a5ab5a619056791995793d65529e62
diff --git a/node_modules/mdl-ext/src/demo/etc/mdl-basic-component.js b/node_modules/mdl-ext/src/demo/etc/mdl-basic-component.js
new file mode 100644
index 0000000..05db9c1
--- /dev/null
+++ b/node_modules/mdl-ext/src/demo/etc/mdl-basic-component.js
@@ -0,0 +1,79 @@
+(function() {
+ 'use strict';
+
+ /**
+ * https://github.com/google/material-design-lite/issues/4205
+ * @constructor
+ * @param {Element} element The element that will be upgraded.
+ */
+ const MaterialBasic = function MaterialBasic(element) {
+ // Stores the element.
+ this.element_ = element;
+
+ console.log('***** ctor', this.element_.classList, 'data-upgraded', this.element_.getAttribute('data-upgraded'));
+
+ // Initialize instance.
+ this.init();
+ };
+ window['MaterialBasic'] = MaterialBasic;
+
+ /**
+ * Store constants in one place so they can be updated easily.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialBasic.prototype.Constant_ = {
+ RIPPLE_COMPONENT: 'MaterialRipple'
+ };
+
+ /**
+ * Store strings for class names defined by this component that are used in
+ * JavaScript. This allows us to simply change it in one place should we
+ * decide to modify at a later date.
+ *
+ * @enum {string}
+ * @private
+ */
+ MaterialBasic.prototype.CssClasses_ = {
+ IS_UPGRADED: 'is-upgraded',
+ JS_RIPPLE_EFFECT: 'mdl-js-ripple-effect',
+ JS_RIPPLE_EFFECT_IGNORE_EVENTS: 'mdl-js-ripple-effect--ignore-events'
+ };
+
+ /**
+ * Initialize component
+ */
+ MaterialBasic.prototype.init = function() {
+ console.log('***** init', this.element_.classList, 'data-upgraded', this.element_.getAttribute('data-upgraded'));
+
+ if (this.element_) {
+ if (this.element_.classList.contains(this.CssClasses_.JS_RIPPLE_EFFECT)) {
+ this.element_.classList.add(this.CssClasses_.JS_RIPPLE_EFFECT_IGNORE_EVENTS);
+ }
+
+ // Do the init required for this component to work
+
+ // Set upgraded flag
+ this.element_.classList.add(this.CssClasses_.IS_UPGRADED);
+ }
+ };
+
+ /**
+ * Downgrade component
+ * E.g remove listeners and clean up resources
+ */
+ MaterialBasic.prototype.mdlDowngrade_ = function() {
+ 'use strict';
+ };
+
+ // The component registers itself. It can assume componentHandler is available
+ // in the global scope.
+ /* eslint no-undef: 0 */
+ /* jshint undef:false */
+ componentHandler.register({
+ constructor: MaterialBasic,
+ classAsString: 'MaterialBasic',
+ cssClass: 'mdl-js-basic'
+ });
+})();