ng-devui
Version:
DevUI components based on Angular
193 lines (188 loc) • 18.2 kB
JavaScript
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { Directive, HostBinding, Input, Component, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
class CardContentDirective {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardContentDirective, selector: "d-card-content, [dCardContent]", host: { properties: { "class.devui-card-content": "this.default" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardContentDirective, decorators: [{
type: Directive,
args: [{
selector: 'd-card-content, [dCardContent]',
}]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-content']
}] } });
class CardTitleDirective {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardTitleDirective, selector: "d-card-title, [dCardTitle]", host: { properties: { "class.devui-card-title": "this.default" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardTitleDirective, decorators: [{
type: Directive,
args: [{
selector: `d-card-title, [dCardTitle]`,
}]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-title']
}] } });
class CardSubtitleDirective {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardSubtitleDirective, selector: "d-card-subtitle, [dCardSubtitle]", host: { properties: { "class.devui-card-subtitle": "this.default" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardSubtitleDirective, decorators: [{
type: Directive,
args: [{
selector: `d-card-subtitle, [dCardSubtitle]`,
}]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-subtitle']
}] } });
class CardActionsDirective {
constructor() {
this.align = 'start';
this.default = true;
}
get alignEnd() {
return this.align === 'end';
}
get alignSpaceBetween() {
return this.align === 'spaceBetween';
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardActionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardActionsDirective, selector: "d-card-actions,[dCardActions]", inputs: { align: "align" }, host: { properties: { "class.devui-card-actions": "this.default", "class.devui-card-actions-align-end": "this.alignEnd", "class.devui-card-actions-align-space-between": "this.alignSpaceBetween" } }, exportAs: ["dCardActions"], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardActionsDirective, decorators: [{
type: Directive,
args: [{
selector: 'd-card-actions,[dCardActions]',
exportAs: 'dCardActions',
}]
}], propDecorators: { align: [{
type: Input
}], default: [{
type: HostBinding,
args: ['class.devui-card-actions']
}], alignEnd: [{
type: HostBinding,
args: ['class.devui-card-actions-align-end']
}], alignSpaceBetween: [{
type: HostBinding,
args: ['class.devui-card-actions-align-space-between']
}] } });
class CardMetaDirective {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardMetaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardMetaDirective, selector: "[dCardMeta]", host: { properties: { "class.devui-card-meta": "this.default" } }, exportAs: ["dCardMeta"], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardMetaDirective, decorators: [{
type: Directive,
args: [{
selector: '[dCardMeta]',
exportAs: 'dCardMeta',
}]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-meta']
}] } });
class CardAvatarDirective {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardAvatarDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: CardAvatarDirective, selector: "[dCardAvatar]", host: { properties: { "class.devui-card-avatar": "this.default" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardAvatarDirective, decorators: [{
type: Directive,
args: [{
selector: '[dCardAvatar]',
}]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-avatar']
}] } });
class CardComponent {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CardComponent, selector: "d-card", inputs: { interactive: "interactive" }, host: { properties: { "class.devui-card": "this.default", "class.devui-card-interactive": "this.interactive" } }, exportAs: ["dCard"], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-card{position:relative;display:block;padding:16px 20px;border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-base, 0 1px 6px 0) var(--devui-light-shadow, rgba(0, 0, 0, .08))}.devui-card.devui-card-interactive{cursor:pointer;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-card.devui-card-interactive:hover{box-shadow:var(--devui-shadow-length-hover, 0 8px 24px 0) var(--devui-hover-shadow, rgba(0, 0, 0, .16));transform:translateY(-5px)}.devui-card-title{display:block;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;color:var(--devui-text, #191919)}.devui-card-subtitle{display:block;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text-stress, #333333)}.devui-card-header{display:flex;flex-direction:row;align-items:center;margin-bottom:var(--card-block-space, 16px)}.devui-card-avatar{margin-right:var(--card-block-space, 16px)}.devui-card-content{font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #595959)}.devui-card-actions{margin-top:var(--card-block-space, 16px);display:flex;justify-content:flex-start;align-items:center}.devui-card-title+.devui-card-subtitle{margin-top:var(--card-ele-space, 8px)}.devui-card-actions-align-end{justify-content:flex-end}.devui-card-actions-align-space-between{justify-content:space-between}.devui-card-meta{width:calc(100% + 40px);margin:0 -20px var(--card-block-space, 16px) -20px;height:auto}.devui-card-meta:first-child{margin-top:-var(--card-block-space,16px)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, decorators: [{
type: Component,
args: [{ selector: 'd-card', exportAs: 'dCard', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-card{position:relative;display:block;padding:16px 20px;border-radius:var(--devui-border-radius-card, 6px);box-shadow:var(--devui-shadow-length-base, 0 1px 6px 0) var(--devui-light-shadow, rgba(0, 0, 0, .08))}.devui-card.devui-card-interactive{cursor:pointer;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-card.devui-card-interactive:hover{box-shadow:var(--devui-shadow-length-hover, 0 8px 24px 0) var(--devui-hover-shadow, rgba(0, 0, 0, .16));transform:translateY(-5px)}.devui-card-title{display:block;font-size:var(--devui-font-size-card-title, 14px);font-weight:700;color:var(--devui-text, #191919)}.devui-card-subtitle{display:block;font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text-stress, #333333)}.devui-card-header{display:flex;flex-direction:row;align-items:center;margin-bottom:var(--card-block-space, 16px)}.devui-card-avatar{margin-right:var(--card-block-space, 16px)}.devui-card-content{font-size:var(--devui-font-size, 12px);color:var(--devui-aide-text, #595959)}.devui-card-actions{margin-top:var(--card-block-space, 16px);display:flex;justify-content:flex-start;align-items:center}.devui-card-title+.devui-card-subtitle{margin-top:var(--card-ele-space, 8px)}.devui-card-actions-align-end{justify-content:flex-end}.devui-card-actions-align-space-between{justify-content:space-between}.devui-card-meta{width:calc(100% + 40px);margin:0 -20px var(--card-block-space, 16px) -20px;height:auto}.devui-card-meta:first-child{margin-top:-var(--card-block-space,16px)}\n"] }]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card']
}], interactive: [{
type: Input
}, {
type: HostBinding,
args: ['class.devui-card-interactive']
}] } });
class CardHeaderComponent {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CardHeaderComponent, selector: "d-card-header", host: { properties: { "class.devui-card-header": "this.default" } }, ngImport: i0, template: "<ng-content select=\"[d-card-avatar], [dCardAvatar]\"></ng-content>\n<div class=\"devui-card-header-title-area\">\n <ng-content\n select=\"d-card-title, d-card-subtitle,\n [d-card-title], [d-card-subtitle],\n [dCardTitle], [dCardSubtitle]\"\n ></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardHeaderComponent, decorators: [{
type: Component,
args: [{ selector: 'd-card-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content select=\"[d-card-avatar], [dCardAvatar]\"></ng-content>\n<div class=\"devui-card-header-title-area\">\n <ng-content\n select=\"d-card-title, d-card-subtitle,\n [d-card-title], [d-card-subtitle],\n [dCardTitle], [dCardSubtitle]\"\n ></ng-content>\n</div>\n" }]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-header']
}] } });
// waiting for design
class CardExtendComponent {
constructor() {
this.default = true;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardExtendComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CardExtendComponent, selector: "d-card-extend", host: { properties: { "class.devui-card-extend": "this.default" } }, ngImport: i0, template: "<!-- waiting for design -->\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardExtendComponent, decorators: [{
type: Component,
args: [{ selector: 'd-card-extend', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- waiting for design -->\n" }]
}], propDecorators: { default: [{
type: HostBinding,
args: ['class.devui-card-extend']
}] } });
class CardModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: CardModule, declarations: [CardComponent, CardHeaderComponent, CardAvatarDirective, CardMetaDirective,
CardActionsDirective, CardSubtitleDirective, CardTitleDirective, CardContentDirective, CardExtendComponent], imports: [CommonModule], exports: [CardComponent, CardHeaderComponent, CardAvatarDirective, CardMetaDirective,
CardActionsDirective, CardSubtitleDirective, CardTitleDirective, CardContentDirective, CardExtendComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardModule, imports: [CommonModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardModule, decorators: [{
type: NgModule,
args: [{
declarations: [CardComponent, CardHeaderComponent, CardAvatarDirective, CardMetaDirective,
CardActionsDirective, CardSubtitleDirective, CardTitleDirective, CardContentDirective, CardExtendComponent],
imports: [
CommonModule
],
exports: [CardComponent, CardHeaderComponent, CardAvatarDirective, CardMetaDirective,
CardActionsDirective, CardSubtitleDirective, CardTitleDirective, CardContentDirective, CardExtendComponent]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { CardActionsDirective, CardAvatarDirective, CardComponent, CardContentDirective, CardExtendComponent, CardHeaderComponent, CardMetaDirective, CardModule, CardSubtitleDirective, CardTitleDirective };
//# sourceMappingURL=ng-devui-card.mjs.map