Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 | 93x 93x 13x 13x 13x 13x 13x 13x 13x 13x 13x 13x 13x | import { Component } from '../zd-component/component';
import { ITab } from './interfaces';
/**
* Base class for Tab component.
*/
export class Tab extends Component implements ITab {
public disabled = false;
public tabTitle = '';
public lazyLoad = true;
// Zeedhi 3.0
/**
* Applies specified color to the control
*/
public color = 'primary';
/**
* Adjusts the vertical height used by the component.
*/
public dense = true;
/**
* Changes the direction of the tabs. Can be either horizontal or vertical.
*/
public direction: 'horizontal' | 'vertical' = 'horizontal';
/**
* Forces component to take up all available space up to
* their maximum width (300px), and centers it.
*/
public fixed = false;
/**
* Enable and show the icon with respective icon name.
*/
public iconName?: string;
/**
* Designates the border-radius applied to the component.
*/
public rounded: string | number | boolean = false;
/**
* Configure the active CSS class applied when an item is selected.
*/
public selectedClass = 'zd-tab--selected';
/**
* The value used when the component is selected in a group.
* If not provided, a unique ID will be used.
*/
public value: any = undefined;
/**
* Applies a distinct style to the component
*/
public variant: 'text' | 'flat' | 'elevated' | 'tonal' | 'outlined' | 'plain' = 'text';
/**
* Sets the width for the component.
*/
public width?: string | number;
/* istanbul ignore next */
/**
* Create a new Tab.
* @param props Tab properties
*/
constructor(props: ITab) {
super(props);
this.tabTitle = this.getInitValue('tabTitle', props.tabTitle, this.tabTitle);
this.disabled = this.getInitValue('disabled', props.disabled, this.disabled);
this.lazyLoad = this.getInitValue('lazyLoad', props.lazyLoad, this.lazyLoad);
// Zeedhi v3
this.color = this.getInitValue('color', props.color, this.color);
this.dense = this.getInitValue('dense', props.dense, this.dense);
this.direction = this.getInitValue('direction', props.direction, this.direction);
this.fixed = this.getInitValue('fixed', props.fixed, this.fixed);
this.iconName = this.getInitValue('iconName', props.iconName, this.iconName);
this.rounded = this.getInitValue('rounded', props.rounded, this.rounded);
this.selectedClass = this.getInitValue('selectedClass', props.selectedClass, this.selectedClass);
this.value = this.getInitValue('value', props.value, this.value);
this.variant = this.getInitValue('variant', props.variant, this.variant);
this.width = this.getInitValue('width', props.width, this.width);
// call createAccessors because this component's onCreated is not
// supposed to trigger
this.createAccessors();
}
}
|