How to use the @angular/material/core.mixinDisabled function in @angular/material

To help you get started, we’ve selected a few @angular/material 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 / lib / tree / node.ts View on Github external
Attribute,
  ContentChildren,
  Directive,
  ElementRef,
  Input,
  IterableDiffers,
  OnDestroy,
  QueryList,
} from '@angular/core';
import {CanDisable, HasTabIndex, mixinDisabled, mixinTabIndex} from '@angular/material/core';
import {MatTreeNodeOutlet} from './outlet';

// TODO(devversion): workaround for https://github.com/angular/material2/issues/12760
export const _CdkTreeNodeDef = CdkTreeNodeDef;

export const _MatTreeNodeMixinBase = mixinTabIndex(mixinDisabled(CdkTreeNode));
export const _MatNestedTreeNodeMixinBase = mixinTabIndex(mixinDisabled(CdkNestedTreeNode));

/**
 * Wrapper for the CdkTree node with Material design styles.
 */
@Directive({
  selector: 'mat-tree-node',
  exportAs: 'matTreeNode',
  inputs: ['disabled', 'tabIndex'],
  host: {
    '[attr.aria-expanded]': 'isExpanded',
    '[attr.aria-level]': 'role === "treeitem" ? level : null',
    '[attr.role]': 'role',
    'class': 'mat-tree-node'
  },
  providers: [{provide: CdkTreeNode, useExisting: MatTreeNode}]
github GetTerminus / terminus-ui / src / lib / src / sort / sort.directive.ts View on Github external
import { TsSortDirection } from './../utilities/types/sort.types';
import {
  TsSortableItem,
  TsSortState,
} from './../utilities/interfaces/sort.interface';
import {
  getSortInvalidDirectionError,
  getSortDuplicateSortableIdError,
  getSortHeaderMissingIdError,
} from './sort-errors';


// Boilerplate for applying mixins to TsSort.
export class TsSortBase {}
export const _TsSortMixinBase = mixinDisabled(TsSortBase);


/**
 * Container for TsSortables to manage the sort state and provide default sort parameters
 */
@Directive({
  selector: '[tsSort]',
  exportAs: 'tsSort',
  inputs: ['disabled: tsSortDisabled'],
})
export class TsSortDirective extends _TsSortMixinBase implements CanDisable, OnChanges, OnDestroy {
  /**
   * Collection of all registered sortables that this directive manages
   */
  private sortables = new Map();
github angular / components / src / lib / tabs / tab-label-wrapper.ts View on Github external
* @license
 * Copyright Google LLC All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */

import {Directive, ElementRef} from '@angular/core';
import {CanDisable, CanDisableCtor, mixinDisabled} from '@angular/material/core';


// Boilerplate for applying mixins to MatTabLabelWrapper.
/** @docs-private */
export class MatTabLabelWrapperBase {}
export const _MatTabLabelWrapperMixinBase: CanDisableCtor & typeof MatTabLabelWrapperBase =
    mixinDisabled(MatTabLabelWrapperBase);

/**
 * Used in the `mat-tab-group` view to display tab labels.
 * @docs-private
 */
@Directive({
  selector: '[matTabLabelWrapper]',
  inputs: ['disabled'],
  host: {
    '[class.mat-tab-disabled]': 'disabled',
    '[attr.aria-disabled]': '!!disabled',
  }
})
export class MatTabLabelWrapper extends _MatTabLabelWrapperMixinBase implements CanDisable {
  constructor(public elementRef: ElementRef) {
    super();
github albertnadal / ng2-daterange-picker / node_modules / @angular / material / esm5 / slider.es5.js View on Github external
var MatSliderChange = (function () {
    function MatSliderChange() {
    }
    return MatSliderChange;
}());
/**
 * \@docs-private
 */
var MatSliderBase = (function () {
    function MatSliderBase(_renderer, _elementRef) {
        this._renderer = _renderer;
        this._elementRef = _elementRef;
    }
    return MatSliderBase;
}());
var _MatSliderMixinBase = mixinColor(mixinDisabled(MatSliderBase), 'accent');
/**
 * Allows users to select from a range of values by moving the slider thumb. It is similar in
 * behavior to the native `<input type="range">` element.
 */
var MatSlider = (function (_super) {
    __extends(MatSlider, _super);
    function MatSlider(renderer, elementRef, _focusMonitor, _changeDetectorRef, _dir) {
        var _this = _super.call(this, renderer, elementRef) || this;
        _this._focusMonitor = _focusMonitor;
        _this._changeDetectorRef = _changeDetectorRef;
        _this._dir = _dir;
        _this._invert = false;
        _this._max = 100;
        _this._min = 0;
        _this._step = 1;
        _this._thumbLabel = false;
github albertnadal / ng2-daterange-picker / node_modules / @angular / material / esm5 / select.es5.js View on Github external
this.source = source;
        this.value = value;
    }
    return MatSelectChange;
}());
/**
 * \@docs-private
 */
var MatSelectBase = (function () {
    function MatSelectBase(_renderer, _elementRef) {
        this._renderer = _renderer;
        this._elementRef = _elementRef;
    }
    return MatSelectBase;
}());
var _MatSelectMixinBase = mixinTabIndex(mixinDisabled(MatSelectBase));
/**
 * Allows the user to customize the trigger that is displayed when the select has a value.
 */
var MatSelectTrigger = (function () {
    function MatSelectTrigger() {
    }
    MatSelectTrigger.decorators = [
        { type: Directive, args: [{
                    selector: 'mat-select-trigger'
                },] },
    ];
    /** @nocollapse */
    MatSelectTrigger.ctorParameters = function () { return []; };
    return MatSelectTrigger;
}());
var MatSelect = (function (_super) {
github albertnadal / ng2-daterange-picker / node_modules / @angular / material / esm2015 / slider.js View on Github external
class MatSliderChange {
}
/**
 * \@docs-private
 */
class MatSliderBase {
    /**
     * @param {?} _renderer
     * @param {?} _elementRef
     */
    constructor(_renderer, _elementRef) {
        this._renderer = _renderer;
        this._elementRef = _elementRef;
    }
}
const _MatSliderMixinBase = mixinColor(mixinDisabled(MatSliderBase), 'accent');
/**
 * Allows users to select from a range of values by moving the slider thumb. It is similar in
 * behavior to the native `<input type="range">` element.
 */
class MatSlider extends _MatSliderMixinBase {
    /**
     * @param {?} renderer
     * @param {?} elementRef
     * @param {?} _focusMonitor
     * @param {?} _changeDetectorRef
     * @param {?} _dir
     */
    constructor(renderer, elementRef, _focusMonitor, _changeDetectorRef, _dir) {
        super(renderer, elementRef);
        this._focusMonitor = _focusMonitor;
        this._changeDetectorRef = _changeDetectorRef;
github albertnadal / ng2-daterange-picker / node_modules / @angular / material / esm5 / tabs.es5.js View on Github external
return MatTabLabel;
}(_MatTabLabelBaseClass));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes} checked by tsc
 */
/**
 * \@docs-private
 */
var MatTabBase = (function () {
    function MatTabBase() {
    }
    return MatTabBase;
}());
var _MatTabMixinBase = mixinDisabled(MatTabBase);
var MatTab = (function (_super) {
    __extends(MatTab, _super);
    function MatTab(_viewContainerRef) {
        var _this = _super.call(this) || this;
        _this._viewContainerRef = _viewContainerRef;
        /**
         * The plain text label for the tab, used when there is no template label.
         */
        _this.textLabel = '';
        /**
         * The portal that will be the hosted content of the tab
         */
        _this._contentPortal = null;
        /**
         * Emits whenever the label changes.
         */