How to use the @material/ripple.MDCRippleFoundation function in @material/ripple

To help you get started, we’ve selected a few @material/ripple examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github trimox / angular-mdc-web / packages / radio / radio.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      isSurfaceActive: () => false,
      isUnbounded: () => true
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
github trimox / angular-mdc-web / packages / icon-button / icon-button.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      isUnbounded: () => true
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
github trimox / angular-mdc-web / packages / top-app-bar / top-app-bar.directives.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      isUnbounded: () => true
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
}
github trimox / angular-mdc-web / packages / chips / chip.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      computeBoundingRect: () => this._foundation.getDimensions(),
      isSurfaceDisabled: () => this._disableRipple
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
github trimox / angular-mdc-web / packages / top-app-bar / top-app-bar.directives.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      isUnbounded: () => true
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
}
github trimox / angular-mdc-web / packages / switch / switch.ts View on Github external
addClass: (className: string) => rippleSurface.classList.add(className),
      computeBoundingRect: () => rippleSurface.getBoundingClientRect(),
      deregisterInteractionHandler: (evtType: any, handler: any) => {
        this._inputElement.nativeElement.removeEventListener(evtType, handler, supportsPassiveEventListeners());
      },
      isSurfaceActive: () => matches(this._inputElement.nativeElement, ':active'),
      isUnbounded: () => true,
      registerInteractionHandler: (evtType: any, handler: any) => {
        this._inputElement.nativeElement.addEventListener(evtType, handler, supportsPassiveEventListeners());
      },
      removeClass: (className: string) => rippleSurface.classList.remove(className),
      updateCssVariable: (varName: string, value: string) => {
        rippleSurface.style.setProperty(varName, value);
      },
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }
github fintechstudios / angularjs-mdc / src / mdc-icon-toggle / mdc-icon-toggle.js View on Github external
initRipple_() {
    this.root_ = this.$element[0];
    const adapter = Object.assign(MDCRipple.createAdapter(this), {
      isUnbounded: () => true,
      isSurfaceActive: () => this.foundation_.isKeyboardActivated(),
    });
    const foundation = new MDCRippleFoundation(adapter);
    return new MDCRipple(this.$element[0], foundation);
  }
github trimox / angular-mdc-web / packages / list / list-item.ts View on Github external
private _createRipple(): MdcRipple {
    const adapter: MDCRippleAdapter = {
      ...MdcRipple.createAdapter(this),
      isSurfaceDisabled: () => this._disabled || this._parent.disableRipple
    };
    return new MdcRipple(this.elementRef, new MDCRippleFoundation(adapter));
  }