UNPKG

13.1 kBJavaScriptView Raw
1(function (global, factory) {
2 typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular2-material/core')) :
3 typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular2-material/core'], factory) :
4 (factory((global.md = global.md || {}, global.md.list = global.md.list || {}),global.ng.core,global.md.core));
5}(this, (function (exports,_angular_core,_angular2Material_core) { 'use strict';
6
7var __decorate = (window && window.__decorate) || function (decorators, target, key, desc) {
8 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
9 if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
10 else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
11 return c > 3 && r && Object.defineProperty(target, key, r), r;
12};
13var __metadata = (window && window.__metadata) || function (k, v) {
14 if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
15};
16var MdListDivider = (function () {
17 function MdListDivider() {
18 }
19 MdListDivider = __decorate([
20 _angular_core.Directive({
21 selector: 'md-divider'
22 }),
23 __metadata('design:paramtypes', [])
24 ], MdListDivider);
25 return MdListDivider;
26}());
27var MdList = (function () {
28 function MdList() {
29 }
30 MdList = __decorate([
31 _angular_core.Component({selector: 'md-list, md-nav-list',
32 host: { 'role': 'list' },
33 template: '<ng-content></ng-content>',
34 styles: ["/** * This mixin will ensure that lines that overflow the container will * hide the overflow and truncate neatly with an ellipsis. */ /** * This mixin provides all md-line styles, changing secondary font size * based on whether the list is in dense mode. */ /** * This mixin provides base styles for the wrapper around md-line * elements in a list. */ /** * This mixin normalizes default element styles, e.g. font weight for heading text. */ /* Normal list variables */ /* Dense list variables */ /* This mixin provides all list-item styles, changing font size and height based on whether the list is in dense mode. */ /* This mixin provides all subheader styles, adjusting heights and padding based on whether the list is in dense mode. */ md-list, md-nav-list { padding-top: 8px; display: block; } md-list [md-subheader], md-nav-list [md-subheader] { display: block; box-sizing: border-box; height: 48px; padding: 16px; margin: 0; font-size: 14px; font-weight: 500; color: rgba(0, 0, 0, 0.54); } md-list [md-subheader]:first-child, md-nav-list [md-subheader]:first-child { margin-top: -8px; } md-list md-list-item .md-list-item, md-list a[md-list-item] .md-list-item, md-nav-list md-list-item .md-list-item, md-nav-list a[md-list-item] .md-list-item { display: flex; flex-direction: row; align-items: center; font-family: Roboto, \"Helvetica Neue\", sans-serif; box-sizing: border-box; font-size: 16px; height: 48px; padding: 0 16px; color: black; } md-list md-list-item.md-list-avatar .md-list-item, md-list a[md-list-item].md-list-avatar .md-list-item, md-nav-list md-list-item.md-list-avatar .md-list-item, md-nav-list a[md-list-item].md-list-avatar .md-list-item { height: 56px; } md-list md-list-item.md-2-line .md-list-item, md-list a[md-list-item].md-2-line .md-list-item, md-nav-list md-list-item.md-2-line .md-list-item, md-nav-list a[md-list-item].md-2-line .md-list-item { height: 72px; } md-list md-list-item.md-3-line .md-list-item, md-list a[md-list-item].md-3-line .md-list-item, md-nav-list md-list-item.md-3-line .md-list-item, md-nav-list a[md-list-item].md-3-line .md-list-item { height: 88px; } md-list md-list-item .md-list-text, md-list a[md-list-item] .md-list-text, md-nav-list md-list-item .md-list-text, md-nav-list a[md-list-item] .md-list-text { display: flex; flex-direction: column; width: 100%; box-sizing: border-box; overflow: hidden; padding: 0 16px; } md-list md-list-item .md-list-text > *, md-list a[md-list-item] .md-list-text > *, md-nav-list md-list-item .md-list-text > *, md-nav-list a[md-list-item] .md-list-text > * { margin: 0; padding: 0; font-weight: normal; font-size: inherit; } md-list md-list-item .md-list-text:empty, md-list a[md-list-item] .md-list-text:empty, md-nav-list md-list-item .md-list-text:empty, md-nav-list a[md-list-item] .md-list-text:empty { display: none; } md-list md-list-item .md-list-text:first-child, md-list a[md-list-item] .md-list-text:first-child, md-nav-list md-list-item .md-list-text:first-child, md-nav-list a[md-list-item] .md-list-text:first-child { padding: 0; } md-list md-list-item [md-list-avatar], md-list a[md-list-item] [md-list-avatar], md-nav-list md-list-item [md-list-avatar], md-nav-list a[md-list-item] [md-list-avatar] { width: 40px; height: 40px; border-radius: 50%; } md-list md-list-item [md-list-icon], md-list a[md-list-item] [md-list-icon], md-nav-list md-list-item [md-list-icon], md-nav-list a[md-list-item] [md-list-icon] { width: 24px; height: 24px; border-radius: 50%; padding: 4px; } md-list md-list-item [md-line], md-list a[md-list-item] [md-line], md-nav-list md-list-item [md-line], md-nav-list a[md-list-item] [md-line] { white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } md-list md-list-item [md-line]:nth-child(n+2), md-list a[md-list-item] [md-line]:nth-child(n+2), md-nav-list md-list-item [md-line]:nth-child(n+2), md-nav-list a[md-list-item] [md-line]:nth-child(n+2) { font-size: 14px; } md-list[dense], md-nav-list[dense] { padding-top: 4px; display: block; } md-list[dense] [md-subheader], md-nav-list[dense] [md-subheader] { display: block; box-sizing: border-box; height: 40px; padding: 16px; margin: 0; font-size: 13px; font-weight: 500; color: rgba(0, 0, 0, 0.54); } md-list[dense] [md-subheader]:first-child, md-nav-list[dense] [md-subheader]:first-child { margin-top: -4px; } md-list[dense] md-list-item .md-list-item, md-list[dense] a[md-list-item] .md-list-item, md-nav-list[dense] md-list-item .md-list-item, md-nav-list[dense] a[md-list-item] .md-list-item { display: flex; flex-direction: row; align-items: center; font-family: Roboto, \"Helvetica Neue\", sans-serif; box-sizing: border-box; font-size: 13px; height: 40px; padding: 0 16px; color: black; } md-list[dense] md-list-item.md-list-avatar .md-list-item, md-list[dense] a[md-list-item].md-list-avatar .md-list-item, md-nav-list[dense] md-list-item.md-list-avatar .md-list-item, md-nav-list[dense] a[md-list-item].md-list-avatar .md-list-item { height: 48px; } md-list[dense] md-list-item.md-2-line .md-list-item, md-list[dense] a[md-list-item].md-2-line .md-list-item, md-nav-list[dense] md-list-item.md-2-line .md-list-item, md-nav-list[dense] a[md-list-item].md-2-line .md-list-item { height: 60px; } md-list[dense] md-list-item.md-3-line .md-list-item, md-list[dense] a[md-list-item].md-3-line .md-list-item, md-nav-list[dense] md-list-item.md-3-line .md-list-item, md-nav-list[dense] a[md-list-item].md-3-line .md-list-item { height: 76px; } md-list[dense] md-list-item .md-list-text, md-list[dense] a[md-list-item] .md-list-text, md-nav-list[dense] md-list-item .md-list-text, md-nav-list[dense] a[md-list-item] .md-list-text { display: flex; flex-direction: column; width: 100%; box-sizing: border-box; overflow: hidden; padding: 0 16px; } md-list[dense] md-list-item .md-list-text > *, md-list[dense] a[md-list-item] .md-list-text > *, md-nav-list[dense] md-list-item .md-list-text > *, md-nav-list[dense] a[md-list-item] .md-list-text > * { margin: 0; padding: 0; font-weight: normal; font-size: inherit; } md-list[dense] md-list-item .md-list-text:empty, md-list[dense] a[md-list-item] .md-list-text:empty, md-nav-list[dense] md-list-item .md-list-text:empty, md-nav-list[dense] a[md-list-item] .md-list-text:empty { display: none; } md-list[dense] md-list-item .md-list-text:first-child, md-list[dense] a[md-list-item] .md-list-text:first-child, md-nav-list[dense] md-list-item .md-list-text:first-child, md-nav-list[dense] a[md-list-item] .md-list-text:first-child { padding: 0; } md-list[dense] md-list-item [md-list-avatar], md-list[dense] a[md-list-item] [md-list-avatar], md-nav-list[dense] md-list-item [md-list-avatar], md-nav-list[dense] a[md-list-item] [md-list-avatar] { width: 40px; height: 40px; border-radius: 50%; } md-list[dense] md-list-item [md-list-icon], md-list[dense] a[md-list-item] [md-list-icon], md-nav-list[dense] md-list-item [md-list-icon], md-nav-list[dense] a[md-list-item] [md-list-icon] { width: 24px; height: 24px; border-radius: 50%; padding: 4px; } md-list[dense] md-list-item [md-line], md-list[dense] a[md-list-item] [md-line], md-nav-list[dense] md-list-item [md-line], md-nav-list[dense] a[md-list-item] [md-line] { white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } md-list[dense] md-list-item [md-line]:nth-child(n+2), md-list[dense] a[md-list-item] [md-line]:nth-child(n+2), md-nav-list[dense] md-list-item [md-line]:nth-child(n+2), md-nav-list[dense] a[md-list-item] [md-line]:nth-child(n+2) { font-size: 13px; } md-divider { display: block; border-top: 1px solid rgba(0, 0, 0, 0.12); margin: 0; } md-nav-list a { text-decoration: none; color: inherit; } md-nav-list .md-list-item { cursor: pointer; } md-nav-list .md-list-item:hover, md-nav-list .md-list-item.md-list-item-focus { outline: none; background: rgba(0, 0, 0, 0.04); } /*# sourceMappingURL=list.css.map */ "],
35 encapsulation: _angular_core.ViewEncapsulation.None
36 }),
37 __metadata('design:paramtypes', [])
38 ], MdList);
39 return MdList;
40}());
41/* Need directive for a ContentChild query in list-item */
42var MdListAvatar = (function () {
43 function MdListAvatar() {
44 }
45 MdListAvatar = __decorate([
46 _angular_core.Directive({ selector: '[md-list-avatar]' }),
47 __metadata('design:paramtypes', [])
48 ], MdListAvatar);
49 return MdListAvatar;
50}());
51var MdListItem = (function () {
52 function MdListItem(_renderer, _element) {
53 this._renderer = _renderer;
54 this._element = _element;
55 this._hasFocus = false;
56 }
57 Object.defineProperty(MdListItem.prototype, "_hasAvatar", {
58 set: function (avatar) {
59 this._renderer.setElementClass(this._element.nativeElement, 'md-list-avatar', avatar != null);
60 },
61 enumerable: true,
62 configurable: true
63 });
64 /** TODO: internal */
65 MdListItem.prototype.ngAfterContentInit = function () {
66 this._lineSetter = new _angular2Material_core.MdLineSetter(this._lines, this._renderer, this._element);
67 };
68 MdListItem.prototype._handleFocus = function () {
69 this._hasFocus = true;
70 };
71 MdListItem.prototype._handleBlur = function () {
72 this._hasFocus = false;
73 };
74 __decorate([
75 _angular_core.ContentChildren(_angular2Material_core.MdLine),
76 __metadata('design:type', _angular_core.QueryList)
77 ], MdListItem.prototype, "_lines", void 0);
78 __decorate([
79 _angular_core.ContentChild(MdListAvatar),
80 __metadata('design:type', MdListAvatar),
81 __metadata('design:paramtypes', [MdListAvatar])
82 ], MdListItem.prototype, "_hasAvatar", null);
83 MdListItem = __decorate([
84 _angular_core.Component({selector: 'md-list-item, a[md-list-item]',
85 host: {
86 'role': 'listitem',
87 '(focus)': '_handleFocus()',
88 '(blur)': '_handleBlur()',
89 },
90 template: "<div class=\"md-list-item\" [class.md-list-item-focus]=\"_hasFocus\"> <ng-content select=\"[md-list-avatar],[md-list-icon]\"></ng-content> <div class=\"md-list-text\"><ng-content select=\"[md-line]\"></ng-content></div> <ng-content></ng-content> </div> ",
91 encapsulation: _angular_core.ViewEncapsulation.None
92 }),
93 __metadata('design:paramtypes', [_angular_core.Renderer, _angular_core.ElementRef])
94 ], MdListItem);
95 return MdListItem;
96}());
97var MdListModule = (function () {
98 function MdListModule() {
99 }
100 MdListModule.forRoot = function () {
101 return {
102 ngModule: MdListModule,
103 providers: []
104 };
105 };
106 MdListModule = __decorate([
107 _angular_core.NgModule({
108 imports: [_angular2Material_core.MdLineModule],
109 exports: [MdList, MdListItem, MdListDivider, MdListAvatar, _angular2Material_core.MdLineModule],
110 declarations: [MdList, MdListItem, MdListDivider, MdListAvatar],
111 }),
112 __metadata('design:paramtypes', [])
113 ], MdListModule);
114 return MdListModule;
115}());
116
117exports.MdListDivider = MdListDivider;
118exports.MdList = MdList;
119exports.MdListAvatar = MdListAvatar;
120exports.MdListItem = MdListItem;
121exports.MdListModule = MdListModule;
122
123Object.defineProperty(exports, '__esModule', { value: true });
124
125})));
\No newline at end of file