license import { MDCComponent } from '@material/base/component' ; import { applyPassive } from '@material/dom/events' ; import { matches } from '@material/dom/ponyfill' ; import { MDCRippleAdapter } from './adapter' ; import { MDCRippleFoundation } from './foundation' ; import { MDCRippleAttachOpts , MDCRippleCapableSurface } from './types' ; import * as util from './util' ; export type MDCRippleFactory = ( el : Element , foundation ? : MDCRippleFoundation ) => MDCRipple ; export class MDCRipple extends MDCComponent < MDCRippleFoundation > implements MDCRippleCapableSurface { static override attachTo ( root , opts = { isUnbounded : undefined } ) { const ripple = new MDCRipple ( root ) ; if ( opts . isUnbounded !== undefined ) { ripple . unbounded = opts . isUnbounded ; } return ripple ; } static createAdapter ( instance ) { return { addClass : ( className ) => instance . root . classList . add ( className ) , browserSupportsCssVars : ( ) => util . supportsCssVariables ( window ) , computeBoundingRect : ( ) => instance . root . getBoundingClientRect ( ) , containsEventTarget : ( target ) => instance . root . contains ( target as Node ) , deregisterDocumentInteractionHandler : ( evtType , handler ) => document . documentElement . removeEventListener ( evtType , handler , applyPassive ( ) ) , deregisterInteractionHandler : ( evtType , handler ) => ( instance . root as HTMLElement ) . removeEventListener ( evtType , handler , applyPassive ( ) ) , deregisterResizeHandler : ( handler ) => window . removeEventListener ( 'resize' , handler ) , getWindowPageOffset : ( ) => ( { x : window . pageXOffset , y : window . pageYOffset } ) , isSurfaceActive : ( ) => matches ( instance . root , ':active' ) , isSurfaceDisabled : ( ) => Boolean ( instance . disabled ) , isUnbounded : ( ) => Boolean ( instance . unbounded ) , registerDocumentInteractionHandler : ( evtType , handler ) => document . documentElement . addEventListener ( evtType , handler , applyPassive ( ) ) , registerInteractionHandler : ( evtType , handler ) => ( instance . root as HTMLElement ) . addEventListener ( evtType , handler , applyPassive ( ) ) , registerResizeHandler : ( handler ) => window . addEventListener ( 'resize' , handler ) , removeClass : ( className ) => instance . root . classList . remove ( className ) , updateCssVariable : ( varName , value ) => ( instance . root as HTMLElement ) . style . setProperty ( varName , value ) , } ; } disabled = false ; private isUnbounded ? : boolean ; get unbounded ( ) : boolean { return Boolean ( this . isUnbounded ) ; } set unbounded ( unbounded ) { this . isUnbounded = Boolean ( unbounded ) ; this . setUnbounded ( ) ; } activate ( ) { this . foundation . activate ( ) ; } deactivate ( ) { this . foundation . deactivate ( ) ; } layout ( ) { this . foundation . layout ( ) ; } override getDefaultFoundation ( ) { return new MDCRippleFoundation ( MDCRipple . createAdapter ( this ) ) ; } override initialSyncWithDOM ( ) { const root = this . root as HTMLElement ; this . isUnbounded = 'mdcRippleIsUnbounded' in root . dataset ; } /**
     * Closure Compiler throws an access control error when directly accessing a
     * protected or private property inside a getter/setter, like unbounded above.
     * By accessing the protected property inside a method, we solve that problem.
     * That's why this function exists.
     */ private setUnbounded ( ) { this . foundation . setUnbounded ( Boolean ( this . isUnbounded ) ) ; } }