How to use the @material/chips.MDCChipFoundation function in @material/chips

To help you get started, we’ve selected a few @material/chips 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 angular / components / src / material-experimental / mdc-chips / chip.ts View on Github external
constructor(
    public _changeDetectorRef: ChangeDetectorRef,
    readonly _elementRef: ElementRef,
    private _platform: Platform,
    protected _ngZone: NgZone,
    @Optional() @Inject(MAT_RIPPLE_GLOBAL_OPTIONS)
    private _globalRippleOptions: RippleGlobalOptions | null,
    @Optional() private _dir: Directionality,
    // @breaking-change 8.0.0 `animationMode` parameter to become required.
    @Optional() @Inject(ANIMATION_MODULE_TYPE) animationMode?: string) {
    super(_elementRef);
    this._chipFoundation = new MDCChipFoundation(this._chipAdapter);
    this._animationsDisabled = animationMode === 'NoopAnimations';
  }
github jamesmfriedman / rmwc / src / chip / index.tsx View on Github external
getDefaultFoundation() {
    return new MDCChipFoundation({
      addClass: className => {
        this.root.addClass(className);
      },
      removeClass: className => this.root.removeClass(className),
      hasClass: className => this.root.hasClass(className),
      addClassToLeadingIcon: className => {
        // handled by props
      },
      removeClassFromLeadingIcon: className => {
        // handled by props
      },
      eventTargetHasClass: (target: HTMLElement, className) => {
        return (
          this.root.hasClass(className) || target.classList.contains(className)
        );
      },
github trimox / angular-mdc-web / packages / chips / chip.ts View on Github external
notifyRemoval: () => this.removed.emit({detail: {chipId: this.id, root: this}}),
      getComputedStyleValue: (propertyName: string) => {
        if (!this._platform.isBrowser) {
          return '';
        }
        return window.getComputedStyle(this._getHostElement()).getPropertyValue(propertyName);
      },
      setStyleProperty: (propertyName: string, value: string) =>
        this._getHostElement().style.setProperty(propertyName, value),
      hasLeadingIcon: () => !!this.leadingIcon,
      setAttr: (name: string, value: string) => this._elementRef.nativeElement.setAttribute(name, value),
      getRootBoundingClientRect: () => this._getHostElement().getBoundingClientRect(),
      getCheckmarkBoundingClientRect: () => this._checkmark ?
        this._checkmark.elementRef.nativeElement.getBoundingClientRect() : null
    };
    return new MDCChipFoundation(adapter);
  }