How to use the @material/dialog.MDCDialogFoundation function in @material/dialog

To help you get started, we’ve selected a few @material/dialog 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 jamesmfriedman / rmwc / src / dialog / dialog.tsx View on Github external
getDefaultFoundation() {
    return new MDCDialogFoundation({
      addClass: (className: string) => this.root.addClass(className),
      removeClass: (className: string) => this.root.removeClass(className),
      hasClass: (className: string) => this.root.hasClass(className),
      addBodyClass: (className: string) =>
        document.body && document.body.classList.add(className),
      removeBodyClass: (className: string) =>
        document.body && document.body.classList.remove(className),
      eventTargetMatches: (target: HTMLElement, selector: string) =>
        matches(target, selector),
      trapFocus: () => {
        try {
          // we dont always have an item to focus
          // so we try catch it
          this.focusTrap && this.focusTrap.activate();
        } catch (err) {}
      },
github jamesmfriedman / rmwc / src / dialog / index.tsx View on Github external
getDefaultFoundation() {
    return new MDCDialogFoundation({
      addClass: (className: string) => this.root.addClass(className),
      removeClass: (className: string) => this.root.removeClass(className),
      hasClass: (className: string) => this.root.hasClass(className),
      addBodyClass: (className: string) =>
        document.body && document.body.classList.add(className),
      removeBodyClass: (className: string) =>
        document.body && document.body.classList.remove(className),
      eventTargetMatches: (target: HTMLElement, selector: string) =>
        matches(target, selector),
      trapFocus: () => {
        try {
          // we dont always have an item to focus
          // so we try catch it
          this.focusTrap && this.focusTrap.activate();
        } catch (err) {}
      },
github src-zone / material / bundle / src / components / dialog / mdc.dialog.directive.ts View on Github external
deregisterTransitionEndHandler: (handler: EventListener) => this._registry.unlisten('transitionend', handler),
        notifyAccept: () => this.accept.emit(),
        notifyCancel: () => this.cancel.emit(),
        trapFocusOnSurface: () => this.trapFocus(),
        untrapFocusOnSurface: () => this.untrapFocus(),
        isDialog: (el: Element) => this._surface && el === this._surface._elm.nativeElement
    };
    private foundation: {
        init: Function,
        destroy: Function,
        open: Function,
        close: Function,
        isOpen: () => boolean,
        accept(shouldNotify: boolean),
        cancel(shouldNotify: boolean)
    } = new MDCDialogFoundation(this.mdcAdapter);

    constructor(private _elm: ElementRef, private _rndr: Renderer2, private _registry: MdcEventRegistry,
        @Optional() @Self() private _focusTrap: AbstractMdcFocusTrap) {
    }

    ngAfterContentInit() {
        this.foundation.init();
        this._initialized = true;        
    }

    ngOnDestroy() {
        this._initialized = false;
        this.foundation.destroy();
    }

    /**
github trimox / angular-mdc-web / packages / dialog / dialog.component.ts View on Github external
clickDefaultButton: () => {
        const defaultBtn = this._buttons.find(_ => _.default);
        if (defaultBtn) {
          defaultBtn.elementRef.nativeElement.click();
        }
      },
      reverseButtons: () => {
        this._buttons.toArray().reverse();
        this._buttons.forEach(button => button.getHostElement().parentElement!.appendChild(button.getHostElement()));
      },
      notifyOpened: () => this.dialogRef.opened(),
      notifyOpening: () => {},
      notifyClosed: (action: string) => this._closeDialogByRef(action),
      notifyClosing: () => {}
    };
    return new MDCDialogFoundation(adapter);
  }