How to use the @material/ripple/index.MDCRipple 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 material-components / material-components-web-catalog / src / ComponentSidebar.js View on Github external
  initRipple = ele => ele && this.ripples.push(new MDCRipple(ele));
  handleDrawerOpen_ = () => this.handleDrawerOpen();
github material-components / material-components-web-catalog / src / RippleCatalog.js View on Github external
  initRipple = buttonEl => buttonEl && this.ripples.push(new MDCRipple(buttonEl));
github material-components / material-components-web-catalog / src / CardCatalog.js View on Github external
        ref={(surfaceEl) => this.ripple = surfaceEl && new MDCRipple(surfaceEl)}>{this.props.icon}
    );
github material-components / material-components-web-catalog / src / MenuCatalog.js View on Github external
  initRipple = (rippleEl) => this.ripple = rippleEl && new MDCRipple(rippleEl);
github material-components / material-components-web / packages / mdc-dialog / component.ts View on Github external
focusTrapFactory?: FocusTrapFactory,
      initialFocusEl?: Element | null) {
    const container = this.root_.querySelector(strings.CONTAINER_SELECTOR);
    if (!container) {
      throw new Error(`Dialog component requires a ${strings.CONTAINER_SELECTOR} container element`);
    }
    this.container_ = container;
    this.content_ = this.root_.querySelector(strings.CONTENT_SELECTOR);
    this.buttons_ = [].slice.call(this.root_.querySelectorAll(strings.BUTTON_SELECTOR));
    this.defaultButton_ = this.root_.querySelector(strings.DEFAULT_BUTTON_SELECTOR);
    this.focusTrapFactory_ = focusTrapFactory;
    this.initialFocusEl_ = initialFocusEl as HTMLElement;
    this.buttonRipples_ = [];

    for (const buttonEl of this.buttons_) {
      this.buttonRipples_.push(new MDCRipple(buttonEl));
    }
  }
github material-components / material-components-web / packages / mdc-textfield / index.js View on Github external
    rippleFactory = (el, foundation) => new MDCRipple(el, foundation),
    lineRippleFactory = (el) => new MDCLineRipple(el),
github material-components / material-components-web-catalog / src / TopAppBarCatalog.js View on Github external
initRipple = icon => {
    if (!icon) return;
    const current = new MDCRipple(icon);
    current.unbounded = true;
    this.ripples.push(current);
  }
github material-components / material-components-web / packages / mdc-select / index.js View on Github external
initRipple_() {
    const element = this.nativeControl_ ? this.nativeControl_ : this.selectedText_;
    const adapter = Object.assign(MDCRipple.createAdapter(this), {
      registerInteractionHandler: (type, handler) => element.addEventListener(type, handler),
      deregisterInteractionHandler: (type, handler) => element.removeEventListener(type, handler),
    });
    const foundation = new MDCRippleFoundation(adapter);
    return new MDCRipple(this.root_, foundation);
  }