@covalent/components 4.16.0-beta.1 → 6.0.2

package/ripple-handlers.mjs

@@ -0,0 +1,761 @@
+import { o as H, y as D, i as k, e as z } from "./query-assigned-elements.mjs";
+import { _ as x, a as y, c as v, b as p } from "./tslib.es6.mjs";
+import { B } from "./base-element.mjs";
+import { e as u } from "./property.mjs";
+import { t as l } from "./state.mjs";
+import { i as M } from "./query.mjs";
+import { o as U } from "./class-map.mjs";
+import { i as G } from "./style-map.mjs";
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+function Y(o) {
+  return H({ descriptor: (t) => ({ async get() {
+    var e;
+    return await this.updateComplete, (e = this.renderRoot) === null || e === void 0 ? void 0 : e.querySelector(o);
+  }, enumerable: !0, configurable: !0 }) });
+}
+/**
+ * @license
+ * Copyright 2018 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+function L(o, t) {
+  var e = o.matches || o.webkitMatchesSelector || o.msMatchesSelector;
+  return e.call(o, t);
+}
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+var I = (
+  /** @class */
+  function() {
+    function o(t) {
+      t === void 0 && (t = {}), this.adapter = t;
+    }
+    return Object.defineProperty(o, "cssClasses", {
+      get: function() {
+        return {};
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(o, "strings", {
+      get: function() {
+        return {};
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(o, "numbers", {
+      get: function() {
+        return {};
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(o, "defaultAdapter", {
+      get: function() {
+        return {};
+      },
+      enumerable: !1,
+      configurable: !0
+    }), o.prototype.init = function() {
+    }, o.prototype.destroy = function() {
+    }, o;
+  }()
+);
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+var P = {
+  // Ripple is a special case where the "root" component is really a "mixin" of sorts,
+  // given that it's an 'upgrade' to an existing component. That being said it is the root
+  // CSS class that all other CSS classes derive from.
+  BG_FOCUSED: "mdc-ripple-upgraded--background-focused",
+  FG_ACTIVATION: "mdc-ripple-upgraded--foreground-activation",
+  FG_DEACTIVATION: "mdc-ripple-upgraded--foreground-deactivation",
+  ROOT: "mdc-ripple-upgraded",
+  UNBOUNDED: "mdc-ripple-upgraded--unbounded"
+}, O = {
+  VAR_FG_SCALE: "--mdc-ripple-fg-scale",
+  VAR_FG_SIZE: "--mdc-ripple-fg-size",
+  VAR_FG_TRANSLATE_END: "--mdc-ripple-fg-translate-end",
+  VAR_FG_TRANSLATE_START: "--mdc-ripple-fg-translate-start",
+  VAR_LEFT: "--mdc-ripple-left",
+  VAR_TOP: "--mdc-ripple-top"
+}, w = {
+  DEACTIVATION_TIMEOUT_MS: 225,
+  FG_DEACTIVATION_MS: 150,
+  INITIAL_ORIGIN_SCALE: 0.6,
+  PADDING: 10,
+  TAP_DELAY_MS: 300
+  // Delay between touch and simulated mouse events on touch devices
+};
+function X(o, t, e) {
+  if (!o)
+    return { x: 0, y: 0 };
+  var r = t.x, a = t.y, i = r + e.left, c = a + e.top, n, d;
+  if (o.type === "touchstart") {
+    var m = o;
+    n = m.changedTouches[0].pageX - i, d = m.changedTouches[0].pageY - c;
+  } else {
+    var f = o;
+    n = f.pageX - i, d = f.pageY - c;
+  }
+  return { x: n, y: d };
+}
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+var R = [
+  "touchstart",
+  "pointerdown",
+  "mousedown",
+  "keydown"
+], S = [
+  "touchend",
+  "pointerup",
+  "mouseup",
+  "contextmenu"
+], h = [], q = (
+  /** @class */
+  function(o) {
+    x(t, o);
+    function t(e) {
+      var r = o.call(this, y(y({}, t.defaultAdapter), e)) || this;
+      return r.activationAnimationHasEnded = !1, r.activationTimer = 0, r.fgDeactivationRemovalTimer = 0, r.fgScale = "0", r.frame = { width: 0, height: 0 }, r.initialSize = 0, r.layoutFrame = 0, r.maxRadius = 0, r.unboundedCoords = { left: 0, top: 0 }, r.activationState = r.defaultActivationState(), r.activationTimerCallback = function() {
+        r.activationAnimationHasEnded = !0, r.runDeactivationUXLogicIfReady();
+      }, r.activateHandler = function(a) {
+        r.activateImpl(a);
+      }, r.deactivateHandler = function() {
+        r.deactivateImpl();
+      }, r.focusHandler = function() {
+        r.handleFocus();
+      }, r.blurHandler = function() {
+        r.handleBlur();
+      }, r.resizeHandler = function() {
+        r.layout();
+      }, r;
+    }
+    return Object.defineProperty(t, "cssClasses", {
+      get: function() {
+        return P;
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(t, "strings", {
+      get: function() {
+        return O;
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(t, "numbers", {
+      get: function() {
+        return w;
+      },
+      enumerable: !1,
+      configurable: !0
+    }), Object.defineProperty(t, "defaultAdapter", {
+      get: function() {
+        return {
+          addClass: function() {
+          },
+          browserSupportsCssVars: function() {
+            return !0;
+          },
+          computeBoundingRect: function() {
+            return { top: 0, right: 0, bottom: 0, left: 0, width: 0, height: 0 };
+          },
+          containsEventTarget: function() {
+            return !0;
+          },
+          deregisterDocumentInteractionHandler: function() {
+          },
+          deregisterInteractionHandler: function() {
+          },
+          deregisterResizeHandler: function() {
+          },
+          getWindowPageOffset: function() {
+            return { x: 0, y: 0 };
+          },
+          isSurfaceActive: function() {
+            return !0;
+          },
+          isSurfaceDisabled: function() {
+            return !0;
+          },
+          isUnbounded: function() {
+            return !0;
+          },
+          registerDocumentInteractionHandler: function() {
+          },
+          registerInteractionHandler: function() {
+          },
+          registerResizeHandler: function() {
+          },
+          removeClass: function() {
+          },
+          updateCssVariable: function() {
+          }
+        };
+      },
+      enumerable: !1,
+      configurable: !0
+    }), t.prototype.init = function() {
+      var e = this, r = this.supportsPressRipple();
+      if (this.registerRootHandlers(r), r) {
+        var a = t.cssClasses, i = a.ROOT, c = a.UNBOUNDED;
+        requestAnimationFrame(function() {
+          e.adapter.addClass(i), e.adapter.isUnbounded() && (e.adapter.addClass(c), e.layoutInternal());
+        });
+      }
+    }, t.prototype.destroy = function() {
+      var e = this;
+      if (this.supportsPressRipple()) {
+        this.activationTimer && (clearTimeout(this.activationTimer), this.activationTimer = 0, this.adapter.removeClass(t.cssClasses.FG_ACTIVATION)), this.fgDeactivationRemovalTimer && (clearTimeout(this.fgDeactivationRemovalTimer), this.fgDeactivationRemovalTimer = 0, this.adapter.removeClass(t.cssClasses.FG_DEACTIVATION));
+        var r = t.cssClasses, a = r.ROOT, i = r.UNBOUNDED;
+        requestAnimationFrame(function() {
+          e.adapter.removeClass(a), e.adapter.removeClass(i), e.removeCssVars();
+        });
+      }
+      this.deregisterRootHandlers(), this.deregisterDeactivationHandlers();
+    }, t.prototype.activate = function(e) {
+      this.activateImpl(e);
+    }, t.prototype.deactivate = function() {
+      this.deactivateImpl();
+    }, t.prototype.layout = function() {
+      var e = this;
+      this.layoutFrame && cancelAnimationFrame(this.layoutFrame), this.layoutFrame = requestAnimationFrame(function() {
+        e.layoutInternal(), e.layoutFrame = 0;
+      });
+    }, t.prototype.setUnbounded = function(e) {
+      var r = t.cssClasses.UNBOUNDED;
+      e ? this.adapter.addClass(r) : this.adapter.removeClass(r);
+    }, t.prototype.handleFocus = function() {
+      var e = this;
+      requestAnimationFrame(function() {
+        return e.adapter.addClass(t.cssClasses.BG_FOCUSED);
+      });
+    }, t.prototype.handleBlur = function() {
+      var e = this;
+      requestAnimationFrame(function() {
+        return e.adapter.removeClass(t.cssClasses.BG_FOCUSED);
+      });
+    }, t.prototype.supportsPressRipple = function() {
+      return this.adapter.browserSupportsCssVars();
+    }, t.prototype.defaultActivationState = function() {
+      return {
+        activationEvent: void 0,
+        hasDeactivationUXRun: !1,
+        isActivated: !1,
+        isProgrammatic: !1,
+        wasActivatedByPointer: !1,
+        wasElementMadeActive: !1
+      };
+    }, t.prototype.registerRootHandlers = function(e) {
+      var r, a;
+      if (e) {
+        try {
+          for (var i = v(R), c = i.next(); !c.done; c = i.next()) {
+            var n = c.value;
+            this.adapter.registerInteractionHandler(n, this.activateHandler);
+          }
+        } catch (d) {
+          r = { error: d };
+        } finally {
+          try {
+            c && !c.done && (a = i.return) && a.call(i);
+          } finally {
+            if (r)
+              throw r.error;
+          }
+        }
+        this.adapter.isUnbounded() && this.adapter.registerResizeHandler(this.resizeHandler);
+      }
+      this.adapter.registerInteractionHandler("focus", this.focusHandler), this.adapter.registerInteractionHandler("blur", this.blurHandler);
+    }, t.prototype.registerDeactivationHandlers = function(e) {
+      var r, a;
+      if (e.type === "keydown")
+        this.adapter.registerInteractionHandler("keyup", this.deactivateHandler);
+      else
+        try {
+          for (var i = v(S), c = i.next(); !c.done; c = i.next()) {
+            var n = c.value;
+            this.adapter.registerDocumentInteractionHandler(n, this.deactivateHandler);
+          }
+        } catch (d) {
+          r = { error: d };
+        } finally {
+          try {
+            c && !c.done && (a = i.return) && a.call(i);
+          } finally {
+            if (r)
+              throw r.error;
+          }
+        }
+    }, t.prototype.deregisterRootHandlers = function() {
+      var e, r;
+      try {
+        for (var a = v(R), i = a.next(); !i.done; i = a.next()) {
+          var c = i.value;
+          this.adapter.deregisterInteractionHandler(c, this.activateHandler);
+        }
+      } catch (n) {
+        e = { error: n };
+      } finally {
+        try {
+          i && !i.done && (r = a.return) && r.call(a);
+        } finally {
+          if (e)
+            throw e.error;
+        }
+      }
+      this.adapter.deregisterInteractionHandler("focus", this.focusHandler), this.adapter.deregisterInteractionHandler("blur", this.blurHandler), this.adapter.isUnbounded() && this.adapter.deregisterResizeHandler(this.resizeHandler);
+    }, t.prototype.deregisterDeactivationHandlers = function() {
+      var e, r;
+      this.adapter.deregisterInteractionHandler("keyup", this.deactivateHandler);
+      try {
+        for (var a = v(S), i = a.next(); !i.done; i = a.next()) {
+          var c = i.value;
+          this.adapter.deregisterDocumentInteractionHandler(c, this.deactivateHandler);
+        }
+      } catch (n) {
+        e = { error: n };
+      } finally {
+        try {
+          i && !i.done && (r = a.return) && r.call(a);
+        } finally {
+          if (e)
+            throw e.error;
+        }
+      }
+    }, t.prototype.removeCssVars = function() {
+      var e = this, r = t.strings, a = Object.keys(r);
+      a.forEach(function(i) {
+        i.indexOf("VAR_") === 0 && e.adapter.updateCssVariable(r[i], null);
+      });
+    }, t.prototype.activateImpl = function(e) {
+      var r = this;
+      if (!this.adapter.isSurfaceDisabled()) {
+        var a = this.activationState;
+        if (!a.isActivated) {
+          var i = this.previousActivationEvent, c = i && e !== void 0 && i.type !== e.type;
+          if (!c) {
+            a.isActivated = !0, a.isProgrammatic = e === void 0, a.activationEvent = e, a.wasActivatedByPointer = a.isProgrammatic ? !1 : e !== void 0 && (e.type === "mousedown" || e.type === "touchstart" || e.type === "pointerdown");
+            var n = e !== void 0 && h.length > 0 && h.some(function(d) {
+              return r.adapter.containsEventTarget(d);
+            });
+            if (n) {
+              this.resetActivationState();
+              return;
+            }
+            e !== void 0 && (h.push(e.target), this.registerDeactivationHandlers(e)), a.wasElementMadeActive = this.checkElementMadeActive(e), a.wasElementMadeActive && this.animateActivation(), requestAnimationFrame(function() {
+              h = [], !a.wasElementMadeActive && e !== void 0 && (e.key === " " || e.keyCode === 32) && (a.wasElementMadeActive = r.checkElementMadeActive(e), a.wasElementMadeActive && r.animateActivation()), a.wasElementMadeActive || (r.activationState = r.defaultActivationState());
+            });
+          }
+        }
+      }
+    }, t.prototype.checkElementMadeActive = function(e) {
+      return e !== void 0 && e.type === "keydown" ? this.adapter.isSurfaceActive() : !0;
+    }, t.prototype.animateActivation = function() {
+      var e = this, r = t.strings, a = r.VAR_FG_TRANSLATE_START, i = r.VAR_FG_TRANSLATE_END, c = t.cssClasses, n = c.FG_DEACTIVATION, d = c.FG_ACTIVATION, m = t.numbers.DEACTIVATION_TIMEOUT_MS;
+      this.layoutInternal();
+      var f = "", b = "";
+      if (!this.adapter.isUnbounded()) {
+        var A = this.getFgTranslationCoordinates(), F = A.startPoint, C = A.endPoint;
+        f = F.x + "px, " + F.y + "px", b = C.x + "px, " + C.y + "px";
+      }
+      this.adapter.updateCssVariable(a, f), this.adapter.updateCssVariable(i, b), clearTimeout(this.activationTimer), clearTimeout(this.fgDeactivationRemovalTimer), this.rmBoundedActivationClasses(), this.adapter.removeClass(n), this.adapter.computeBoundingRect(), this.adapter.addClass(d), this.activationTimer = setTimeout(function() {
+        e.activationTimerCallback();
+      }, m);
+    }, t.prototype.getFgTranslationCoordinates = function() {
+      var e = this.activationState, r = e.activationEvent, a = e.wasActivatedByPointer, i;
+      a ? i = X(r, this.adapter.getWindowPageOffset(), this.adapter.computeBoundingRect()) : i = {
+        x: this.frame.width / 2,
+        y: this.frame.height / 2
+      }, i = {
+        x: i.x - this.initialSize / 2,
+        y: i.y - this.initialSize / 2
+      };
+      var c = {
+        x: this.frame.width / 2 - this.initialSize / 2,
+        y: this.frame.height / 2 - this.initialSize / 2
+      };
+      return { startPoint: i, endPoint: c };
+    }, t.prototype.runDeactivationUXLogicIfReady = function() {
+      var e = this, r = t.cssClasses.FG_DEACTIVATION, a = this.activationState, i = a.hasDeactivationUXRun, c = a.isActivated, n = i || !c;
+      n && this.activationAnimationHasEnded && (this.rmBoundedActivationClasses(), this.adapter.addClass(r), this.fgDeactivationRemovalTimer = setTimeout(function() {
+        e.adapter.removeClass(r);
+      }, w.FG_DEACTIVATION_MS));
+    }, t.prototype.rmBoundedActivationClasses = function() {
+      var e = t.cssClasses.FG_ACTIVATION;
+      this.adapter.removeClass(e), this.activationAnimationHasEnded = !1, this.adapter.computeBoundingRect();
+    }, t.prototype.resetActivationState = function() {
+      var e = this;
+      this.previousActivationEvent = this.activationState.activationEvent, this.activationState = this.defaultActivationState(), setTimeout(function() {
+        return e.previousActivationEvent = void 0;
+      }, t.numbers.TAP_DELAY_MS);
+    }, t.prototype.deactivateImpl = function() {
+      var e = this, r = this.activationState;
+      if (r.isActivated) {
+        var a = y({}, r);
+        r.isProgrammatic ? (requestAnimationFrame(function() {
+          e.animateDeactivation(a);
+        }), this.resetActivationState()) : (this.deregisterDeactivationHandlers(), requestAnimationFrame(function() {
+          e.activationState.hasDeactivationUXRun = !0, e.animateDeactivation(a), e.resetActivationState();
+        }));
+      }
+    }, t.prototype.animateDeactivation = function(e) {
+      var r = e.wasActivatedByPointer, a = e.wasElementMadeActive;
+      (r || a) && this.runDeactivationUXLogicIfReady();
+    }, t.prototype.layoutInternal = function() {
+      var e = this;
+      this.frame = this.adapter.computeBoundingRect();
+      var r = Math.max(this.frame.height, this.frame.width), a = function() {
+        var c = Math.sqrt(Math.pow(e.frame.width, 2) + Math.pow(e.frame.height, 2));
+        return c + t.numbers.PADDING;
+      };
+      this.maxRadius = this.adapter.isUnbounded() ? r : a();
+      var i = Math.floor(r * t.numbers.INITIAL_ORIGIN_SCALE);
+      this.adapter.isUnbounded() && i % 2 !== 0 ? this.initialSize = i - 1 : this.initialSize = i, this.fgScale = "" + this.maxRadius / this.initialSize, this.updateLayoutCssVars();
+    }, t.prototype.updateLayoutCssVars = function() {
+      var e = t.strings, r = e.VAR_FG_SIZE, a = e.VAR_LEFT, i = e.VAR_TOP, c = e.VAR_FG_SCALE;
+      this.adapter.updateCssVariable(r, this.initialSize + "px"), this.adapter.updateCssVariable(c, this.fgScale), this.adapter.isUnbounded() && (this.unboundedCoords = {
+        left: Math.round(this.frame.width / 2 - this.initialSize / 2),
+        top: Math.round(this.frame.height / 2 - this.initialSize / 2)
+      }, this.adapter.updateCssVariable(a, this.unboundedCoords.left + "px"), this.adapter.updateCssVariable(i, this.unboundedCoords.top + "px"));
+    }, t;
+  }(I)
+);
+const j = q;
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+class s extends B {
+  constructor() {
+    super(...arguments), this.primary = !1, this.accent = !1, this.unbounded = !1, this.disabled = !1, this.activated = !1, this.selected = !1, this.internalUseStateLayerCustomProperties = !1, this.hovering = !1, this.bgFocused = !1, this.fgActivation = !1, this.fgDeactivation = !1, this.fgScale = "", this.fgSize = "", this.translateStart = "", this.translateEnd = "", this.leftPos = "", this.topPos = "", this.mdcFoundationClass = j;
+  }
+  get isActive() {
+    return L(this.parentElement || this, ":active");
+  }
+  createAdapter() {
+    return {
+      browserSupportsCssVars: () => !0,
+      isUnbounded: () => this.unbounded,
+      isSurfaceActive: () => this.isActive,
+      isSurfaceDisabled: () => this.disabled,
+      addClass: (t) => {
+        switch (t) {
+          case "mdc-ripple-upgraded--background-focused":
+            this.bgFocused = !0;
+            break;
+          case "mdc-ripple-upgraded--foreground-activation":
+            this.fgActivation = !0;
+            break;
+          case "mdc-ripple-upgraded--foreground-deactivation":
+            this.fgDeactivation = !0;
+            break;
+        }
+      },
+      removeClass: (t) => {
+        switch (t) {
+          case "mdc-ripple-upgraded--background-focused":
+            this.bgFocused = !1;
+            break;
+          case "mdc-ripple-upgraded--foreground-activation":
+            this.fgActivation = !1;
+            break;
+          case "mdc-ripple-upgraded--foreground-deactivation":
+            this.fgDeactivation = !1;
+            break;
+        }
+      },
+      containsEventTarget: () => !0,
+      registerInteractionHandler: () => {
+      },
+      deregisterInteractionHandler: () => {
+      },
+      registerDocumentInteractionHandler: () => {
+      },
+      deregisterDocumentInteractionHandler: () => {
+      },
+      registerResizeHandler: () => {
+      },
+      deregisterResizeHandler: () => {
+      },
+      updateCssVariable: (t, e) => {
+        switch (t) {
+          case "--mdc-ripple-fg-scale":
+            this.fgScale = e;
+            break;
+          case "--mdc-ripple-fg-size":
+            this.fgSize = e;
+            break;
+          case "--mdc-ripple-fg-translate-end":
+            this.translateEnd = e;
+            break;
+          case "--mdc-ripple-fg-translate-start":
+            this.translateStart = e;
+            break;
+          case "--mdc-ripple-left":
+            this.leftPos = e;
+            break;
+          case "--mdc-ripple-top":
+            this.topPos = e;
+            break;
+        }
+      },
+      computeBoundingRect: () => (this.parentElement || this).getBoundingClientRect(),
+      getWindowPageOffset: () => ({ x: window.pageXOffset, y: window.pageYOffset })
+    };
+  }
+  startPress(t) {
+    this.waitForFoundation(() => {
+      this.mdcFoundation.activate(t);
+    });
+  }
+  endPress() {
+    this.waitForFoundation(() => {
+      this.mdcFoundation.deactivate();
+    });
+  }
+  startFocus() {
+    this.waitForFoundation(() => {
+      this.mdcFoundation.handleFocus();
+    });
+  }
+  endFocus() {
+    this.waitForFoundation(() => {
+      this.mdcFoundation.handleBlur();
+    });
+  }
+  startHover() {
+    this.hovering = !0;
+  }
+  endHover() {
+    this.hovering = !1;
+  }
+  /**
+   * Wait for the MDCFoundation to be created by `firstUpdated`
+   */
+  waitForFoundation(t) {
+    this.mdcFoundation ? t() : this.updateComplete.then(t);
+  }
+  update(t) {
+    t.has("disabled") && this.disabled && this.endHover(), super.update(t);
+  }
+  /** @soyTemplate */
+  render() {
+    const t = this.activated && (this.primary || !this.accent), e = this.selected && (this.primary || !this.accent), r = {
+      "mdc-ripple-surface--accent": this.accent,
+      "mdc-ripple-surface--primary--activated": t,
+      "mdc-ripple-surface--accent--activated": this.accent && this.activated,
+      "mdc-ripple-surface--primary--selected": e,
+      "mdc-ripple-surface--accent--selected": this.accent && this.selected,
+      "mdc-ripple-surface--disabled": this.disabled,
+      "mdc-ripple-surface--hover": this.hovering,
+      "mdc-ripple-surface--primary": this.primary,
+      "mdc-ripple-surface--selected": this.selected,
+      "mdc-ripple-upgraded--background-focused": this.bgFocused,
+      "mdc-ripple-upgraded--foreground-activation": this.fgActivation,
+      "mdc-ripple-upgraded--foreground-deactivation": this.fgDeactivation,
+      "mdc-ripple-upgraded--unbounded": this.unbounded,
+      "mdc-ripple-surface--internal-use-state-layer-custom-properties": this.internalUseStateLayerCustomProperties
+    };
+    return D`
+        <div class="mdc-ripple-surface mdc-ripple-upgraded ${U(r)}"
+          style="${G({
+      "--mdc-ripple-fg-scale": this.fgScale,
+      "--mdc-ripple-fg-size": this.fgSize,
+      "--mdc-ripple-fg-translate-end": this.translateEnd,
+      "--mdc-ripple-fg-translate-start": this.translateStart,
+      "--mdc-ripple-left": this.leftPos,
+      "--mdc-ripple-top": this.topPos
+    })}"></div>`;
+  }
+}
+p([
+  M(".mdc-ripple-surface")
+], s.prototype, "mdcRoot", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "primary", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "accent", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "unbounded", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "disabled", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "activated", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "selected", void 0);
+p([
+  u({ type: Boolean })
+], s.prototype, "internalUseStateLayerCustomProperties", void 0);
+p([
+  l()
+], s.prototype, "hovering", void 0);
+p([
+  l()
+], s.prototype, "bgFocused", void 0);
+p([
+  l()
+], s.prototype, "fgActivation", void 0);
+p([
+  l()
+], s.prototype, "fgDeactivation", void 0);
+p([
+  l()
+], s.prototype, "fgScale", void 0);
+p([
+  l()
+], s.prototype, "fgSize", void 0);
+p([
+  l()
+], s.prototype, "translateStart", void 0);
+p([
+  l()
+], s.prototype, "translateEnd", void 0);
+p([
+  l()
+], s.prototype, "leftPos", void 0);
+p([
+  l()
+], s.prototype, "topPos", void 0);
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-LIcense-Identifier: Apache-2.0
+ */
+const $ = k`.mdc-ripple-surface{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity;position:relative;outline:none;overflow:hidden}.mdc-ripple-surface::before,.mdc-ripple-surface::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}.mdc-ripple-surface::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-ripple-surface::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-ripple-surface.mdc-ripple-upgraded::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface.mdc-ripple-upgraded::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-ripple-surface.mdc-ripple-upgraded--unbounded::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-activation::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}.mdc-ripple-surface.mdc-ripple-upgraded--foreground-deactivation::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-ripple-surface::before,.mdc-ripple-surface::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-ripple-surface.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded],.mdc-ripple-upgraded--unbounded{overflow:visible}.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded]::after,.mdc-ripple-upgraded--unbounded::before,.mdc-ripple-upgraded--unbounded::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::before,.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::before,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface[data-mdc-ripple-is-unbounded].mdc-ripple-upgraded::after,.mdc-ripple-upgraded--unbounded.mdc-ripple-upgraded::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-ripple-surface::before,.mdc-ripple-surface::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-ripple-surface:hover::before,.mdc-ripple-surface.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:block}:host .mdc-ripple-surface{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;will-change:unset}.mdc-ripple-surface--primary::before,.mdc-ripple-surface--primary::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary:hover::before,.mdc-ripple-surface--primary.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface--primary.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--primary.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--primary--activated::before{opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12)}.mdc-ripple-surface--primary--activated::before,.mdc-ripple-surface--primary--activated::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary--activated:hover::before,.mdc-ripple-surface--primary--activated.mdc-ripple-surface--hover::before{opacity:0.16;opacity:var(--mdc-ripple-hover-opacity, 0.16)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--primary--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--primary--selected::before{opacity:0.08;opacity:var(--mdc-ripple-selected-opacity, 0.08)}.mdc-ripple-surface--primary--selected::before,.mdc-ripple-surface--primary--selected::after{background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-ripple-surface--primary--selected:hover::before,.mdc-ripple-surface--primary--selected.mdc-ripple-surface--hover::before{opacity:0.12;opacity:var(--mdc-ripple-hover-opacity, 0.12)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-focus-opacity, 0.2)}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--primary--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--primary--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--accent::before,.mdc-ripple-surface--accent::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent:hover::before,.mdc-ripple-surface--accent.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-ripple-surface--accent.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--accent.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-ripple-surface--accent--activated::before{opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12)}.mdc-ripple-surface--accent--activated::before,.mdc-ripple-surface--accent--activated::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent--activated:hover::before,.mdc-ripple-surface--accent--activated.mdc-ripple-surface--hover::before{opacity:0.16;opacity:var(--mdc-ripple-hover-opacity, 0.16)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--activated:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--accent--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.24)}.mdc-ripple-surface--accent--selected::before{opacity:0.08;opacity:var(--mdc-ripple-selected-opacity, 0.08)}.mdc-ripple-surface--accent--selected::before,.mdc-ripple-surface--accent--selected::after{background-color:#018786;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #018786))}.mdc-ripple-surface--accent--selected:hover::before,.mdc-ripple-surface--accent--selected.mdc-ripple-surface--hover::before{opacity:0.12;opacity:var(--mdc-ripple-hover-opacity, 0.12)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-focus-opacity, 0.2)}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--accent--selected:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.2;opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--accent--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.2)}.mdc-ripple-surface--disabled{opacity:0}.mdc-ripple-surface--internal-use-state-layer-custom-properties::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties::after{background-color:#000;background-color:var(--mdc-ripple-hover-state-layer-color, #000)}.mdc-ripple-surface--internal-use-state-layer-custom-properties:hover::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-surface--hover::before{opacity:0.04;opacity:var(--mdc-ripple-hover-state-layer-opacity, 0.04)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded--background-focused::before,.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):focus::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-state-layer-opacity, 0.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded)::after{transition:opacity 150ms linear}.mdc-ripple-surface--internal-use-state-layer-custom-properties:not(.mdc-ripple-upgraded):active::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-pressed-state-layer-opacity, 0.12)}.mdc-ripple-surface--internal-use-state-layer-custom-properties.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-pressed-state-layer-opacity, 0.12)}`;
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+let g = class extends s {
+};
+g.styles = [$];
+g = p([
+  z("mwc-ripple")
+], g);
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+class E {
+  constructor(t) {
+    this.startPress = (e) => {
+      t().then((r) => {
+        r && r.startPress(e);
+      });
+    }, this.endPress = () => {
+      t().then((e) => {
+        e && e.endPress();
+      });
+    }, this.startFocus = () => {
+      t().then((e) => {
+        e && e.startFocus();
+      });
+    }, this.endFocus = () => {
+      t().then((e) => {
+        e && e.endFocus();
+      });
+    }, this.startHover = () => {
+      t().then((e) => {
+        e && e.startHover();
+      });
+    }, this.endHover = () => {
+      t().then((e) => {
+        e && e.endHover();
+      });
+    };
+  }
+}
+export {
+  E as R,
+  Y as e
+};