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 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 | 93x 93x 93x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 4x 3x 2x 1x 1x | import { ComponentRender } from '../zd-component/component-render';
import { IList, IListItem } from './interfaces';
import { ItemNotFoundError } from './item-not-found';
/**
* Base class for List component.
*/
export class List extends ComponentRender implements IList {
/**
* Applies specified color to the entire list.
* It can be the name of material or css color in hexa or rgba.
*/
public color?: string;
/**
* Create the list with smaller items.
*/
public dense = false;
/**
* Removes the ability to click or target the list.
*/
public disabled = false;
/**
* Render list with dividers between the items.
*/
public divided = false;
/**
* List items structure.
*/
public items!: IListItem[];
/**
* Increases the height of all the list items to better support more lines of text.
*/
public lines: false | 'one' | 'two' | 'three' = 'one';
/**
* Designates an elevation applied to the list between 0 and 24.
*/
public elevation: number | string = 0;
/**
* Will only collapse when explicitly closed.
*/
public openStrategy: 'single' | 'multiple' | 'list' = 'single';
/**
* Defines the component height. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public height: string | number = 'auto';
/**
* Defines the component min height. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public minHeight: string | number = 'auto';
/**
* Defines the component max height. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public maxHeight: string | number = 'none';
/**
* Set component height to fill all space available
*/
public fillHeight = false;
/**
* Defines the component width. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public width: string | number = '100%';
/**
* Defines the component min width. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public minWidth: string | number = 'auto';
/**
* Defines the component max height. Possible values for this property can be
* <samp>'auto', '100%', '400px' or 400</samp>
*/
public maxWidth: string | number = 'none';
constructor(props: IList) {
super(props);
this.theme = this.getInitValue('theme', props.theme, this.theme);
this.dense = this.getInitValue('dense', props.dense, this.dense);
this.disabled = this.getInitValue('disabled', props.disabled, this.disabled);
this.divided = this.getInitValue('divided', props.divided, this.divided);
this.items = this.getInitValue('items', props.items, this.items);
this.lines = this.getInitValue('lines', props.lines, this.lines);
this.color = this.getInitValue('color', props.color, this.color);
this.elevation = this.getInitValue('elevation', props.elevation, this.elevation);
this.openStrategy = this.getInitValue('openStrategy', props.openStrategy, this.openStrategy);
this.height = this.getInitValue('height', props.height, this.height);
this.minHeight = this.getInitValue('minHeight', props.minHeight, this.minHeight);
this.maxHeight = this.getInitValue('maxHeight', props.maxHeight, this.maxHeight);
this.fillHeight = this.getInitValue('fillHeight', props.fillHeight, this.fillHeight);
this.width = this.getInitValue('width', props.width, this.width);
this.minWidth = this.getInitValue('minWidth', props.minWidth, this.minWidth);
this.maxWidth = this.getInitValue('maxWidth', props.maxWidth, this.maxWidth);
this.createAccessors();
}
/**
* Get item by name
* @param name name property of the item
* @throws ItemNotFoundError
*/
public getItem(name: string) {
const item = this.items.find((listItem: IListItem) => listItem.name === name);
if (item) {
return item;
}
throw new ItemNotFoundError(name, this.name);
}
}
|