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 127 128 129 130 131 132 133 134 135 136 137 138 139 140 | 93x 93x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x | import { ComponentRender } from '../zd-component/component-render';
import { IComponentRender } from '../zd-component/interfaces';
import { IFrameEvents } from '../zd-frame/interfaces';
import { IHeader } from './interfaces';
/**
* Base class for Header component.
*/
export class Header extends ComponentRender implements IHeader {
/**
* Applies position absolute to header.
*/
public absolute = false;
/**
* Designates the header as part of the application layout.
*/
public app = false;
/**
* Render components on the middle of header.
*/
public centerSlot: IComponentRender[] = [];
/**
* Applies specified color to the control. It can be the name of material or css color in hexa.
*/
public color = 'primary';
/**
* Reduces the height of the toolbar content to 48px.
*/
public dense = false;
/**
* Designates an elevation applied to the component between 0 and 24.
*/
public elevation: number | string = 2;
/**
* Events registered to the header.
*/
public declare events: IFrameEvents;
/**
* Applies position fixed to header.
*/
public fixed = false;
/**
* Sets the height for header.
*/
public height: number | string = '';
/**
* Render components on the left of header.
*/
public leftSlot: IComponentRender[] = [];
/**
* Sets the maximum height for the header.
*/
public maxHeight?: number | string;
/**
* Sets the maximum width for the header.
*/
public maxWidth?: number | string;
/**
* Sets the minimum height for the header.
*/
public minHeight?: number | string;
/**
* Sets the minimum width for the header.
*/
public minWidth?: number | string;
/**
* Removes internal padding from header.
*/
public padless?: boolean = false;
/**
* Render components on the right of header.
*/
public rightSlot: IComponentRender[] = [];
/**
* Sets the width for the component.
*/
public width?: number | string;
/**
* Specifies a v-img as the component’s background.
*/
public image?: string;
/**
* Adjust the order of the component in relation to its registration order.
*/
public order?: string | number = 0;
/* istanbul ignore next */
/**
* Creates a new header.
* @param props Header properties
*/
constructor(props: IHeader) {
super(props);
this.absolute = this.getInitValue('absolute', props.absolute, this.absolute);
this.app = this.getInitValue('app', props.app, this.app);
this.centerSlot = props.centerSlot || this.centerSlot;
this.color = this.getInitValue('color', props.color, this.color);
this.dense = this.getInitValue('dense', props.dense, this.dense);
this.elevation = this.getInitValue('elevation', props.elevation, this.elevation);
this.fixed = this.getInitValue('fixed', props.fixed, this.fixed);
this.height = this.getInitValue('height', props.height, this.height);
this.leftSlot = props.leftSlot || this.leftSlot;
this.maxHeight = this.getInitValue('maxHeight', props.maxHeight, this.maxHeight);
this.maxWidth = this.getInitValue('maxWidth', props.maxWidth, this.maxWidth);
this.minHeight = this.getInitValue('minHeight', props.minHeight, this.minHeight);
this.minWidth = this.getInitValue('minWidth', props.minWidth, this.minWidth);
this.padless = this.getInitValue('padless', props.padless, this.padless);
this.rightSlot = props.rightSlot || this.rightSlot;
this.width = this.getInitValue('width', props.width, this.width);
// Zeedhi 3
this.image = this.getInitValue('image', props.image, this.image);
this.order = this.getInitValue('order', props.order, this.order);
}
/**
* Retrieves named slots visibility
*/
get namedSlotsIsVisible() {
return this.leftSlot.length || this.centerSlot.length || this.rightSlot.length;
}
}
|