swipe-angular-list.metadata.json

{"__symbolic":"module","version":4,"metadata":{"SwipeAngularListService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"ngInjectableDef":{}}},"SwipeAngularListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"sw-swipe-angular-list","template":"\n    <p>\n      swipe-angular-list works!\n    </p>\n  ","styles":[]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"HammerConfig":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@angular/platform-browser","name":"HammerGestureConfig","line":6,"character":34},"members":{}},"SwipeAngularListModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"SwipeAngularListComponent"},{"__symbolic":"reference","name":"ɵa"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":16,"character":4}],"providers":[{"provide":{"__symbolic":"reference","module":"@angular/platform-browser","name":"HAMMER_GESTURE_CONFIG","line":20,"character":15},"useClass":{"__symbolic":"reference","name":"HammerConfig"}}],"exports":[{"__symbolic":"reference","name":"SwipeAngularListComponent"},{"__symbolic":"reference","name":"ɵa"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"sw-item-list","template":"<div class=\"{{itemClass}}\" (swipeleft)=\"swipeleft($event)\" (swipe)=\"swipeleft($event)\" >\n  <ng-template #defaultEdit>\n    edit\n  </ng-template>\n  <ng-template #defaultTrash>\n    trash\n  </ng-template>\n  <ng-template #defaultMark>\n    <div class=\"yes-marker\"></div>\n  </ng-template>\n  <ng-template #defaultNotMark>\n    <div class=\"not-marker\"></div>\n  </ng-template>\n\n  <ng-template #defaultCustom>\n    <div data-id=\"{{idElement}}\" class=\"text truncate\">{{inside?.title}}</div>\n    <div data-id=\"{{idElement}}\" class=\"small truncate\">{{inside?.subTitle}}</div>\n  </ng-template>\n\n\n  <div [ngClass]=\"{'active':(result)}\" data-id=\"{{idElement}}\"\n       class=\" options-btn swipe-d-flex justify-content-between\">\n    <div (click)=\"action('edit')\" class=\"option-list\" *ngIf=\"editTemplate !== null\">\n      <ng-template let-show=\"show\" #viewContainerEdit></ng-template>\n    </div>\n    <div (click)=\"action('trash')\" class=\"option-list\" *ngIf=\"trashTemplate !== null\">\n      <ng-template let-show=\"show\" #viewContainerTrash></ng-template>\n    </div>\n  </div>\n  <div [ngClass]=\"{'left-swipe':(result)}\" data-id=\"{{idElement}}\" class=\"list-swipe swipe-d-flex\">\n\n    <div *ngIf=\"showMark\" class=\"swipe-w-10\">\n      <ng-container #viewContainerMark></ng-container>\n    </div>\n\n    <div (click)=\"clickItem($event)\" [ngClass]=\"{'swipe-w-90':showMark, 'swipe-w-100':!showMark}\">\n      <div *ngIf=\"customTemplate\" data-id=\"{{idElement}}\">\n        <ng-template #viewContainerCustom>\n        </ng-template>\n      </div>\n\n      <div *ngIf=\"!customTemplate\">\n        <ng-template #viewContainerCustom></ng-template>\n      </div>\n\n    </div>\n    <div class=\"mark\"></div>\n  </div>\n</div>\n","styles":[":host{display:block;font-family:Arial,serif}.not-marker{background:red;width:1rem;height:1rem;border-radius:3rem}.yes-marker{background:green;width:1rem;height:1rem;border-radius:3rem}.swipe-d-flex{display:flex}.swipe-w-10{width:10%}.swipe-w-100{width:100%}.swipe-w-90{width:90%}.options-btn.active{display:flex;transform:translate(66vw,0)}.list-swipe{box-shadow:0 5px 7px rgba(181,181,181,.18);border-radius:.25em;padding:.75em;font-weight:500;font-size:16px;line-height:19px;z-index:9;margin:.75rem 0;transition:50ms ease-out}.left-swipe{transform:translate(-29vw,0);transition:50ms ease-out;box-shadow:6px 0 7px rgba(181,181,181,.31)}.options-btn{position:absolute;display:none;transform:translate(100vw,0);padding:.5rem 0;width:28vw}.list-swipe .text{color:#313131}.list-swipe .small{font-weight:500;font-size:16px;line-height:19px;color:#9b9b9b;padding:1rem 0 0}.list-swipe .mark{background:#fff;height:2rem;margin-top:.75rem;margin-right:-.3rem;border-right:.175rem solid #f96060}.option-list{width:100%;min-height:3.75rem;line-height:3.75rem;border-right:1px solid rgba(0,0,0,.1);text-align:center}.option-list:last-child{border-right:0}.truncate{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}"]}]}],"members":{"inside":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"disabledMark":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3},"arguments":["disable-mark"]}]}],"showMark":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3},"arguments":["show-mark"]}]}],"itemClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3},"arguments":["item-class"]}]}],"defaultEdit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":37,"character":3},"arguments":["defaultEdit"]}]}],"defaultTrash":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":39,"character":3},"arguments":["defaultTrash"]}]}],"defaultMark":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":42,"character":3},"arguments":["defaultMark"]}]}],"defaultNotMark":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":44,"character":3},"arguments":["defaultNotMark"]}]}],"defaultCustom":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":46,"character":3},"arguments":["defaultCustom"]}]}],"customTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3},"arguments":["customTemplate"]}]}],"editTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3},"arguments":["editTemplate"]}]}],"trashTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3},"arguments":["trashTemplate"]}]}],"markTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3},"arguments":["markTemplate"]}]}],"notMarkTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3},"arguments":["notMarkTemplate"]}]}],"callback":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":59,"character":3}}]}],"swClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":62,"character":3}}]}],"viewContainerEdit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":65,"character":3},"arguments":["viewContainerEdit",{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":65,"character":56}}]}]}],"viewContainerTrash":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":68,"character":3},"arguments":["viewContainerTrash",{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":68,"character":57}}]}]}],"viewContainerMark":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":71,"character":3},"arguments":["viewContainerMark",{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":71,"character":56}}]}]}],"viewContainerCustom":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":74,"character":3},"arguments":["viewContainerCustom",{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":74,"character":58}}]}]}],"clickOut":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":77,"character":3},"arguments":["document:click",["$event"]]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":84,"character":21},{"__symbolic":"reference","name":"ɵb"}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"closeAll":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"SwipeAngularListService":"./lib/swipe-angular-list.service","SwipeAngularListComponent":"./lib/swipe-angular-list.component","HammerConfig":"./lib/swipe-angular-list.module","SwipeAngularListModule":"./lib/swipe-angular-list.module","ɵa":"./lib/item-list/item-list.component","ɵb":"./lib/swipe-service.service"},"importAs":"swipe-angular-list"}