rb-fab-speed-dial
Version:
Fab speed dial for angular and material2.
1 lines • 24.1 kB
JSON
{"__symbolic":"module","version":4,"metadata":{"RbFabSpeedDialModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule","line":8,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatButtonModule","line":9,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵb"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"rb-fab-speed-dial","template":"<div [ngClass]=\"{'main': direction == 'right', 'main-down': direction == 'down', 'main-left': direction == 'left','main-up': direction == 'up'}\">\n <button class=\"trigger\" [color]=\"color\" (click)=\"toggle()\" mat-fab>\n <mat-icon *ngIf=\"!actions\">{{openIcon}}</mat-icon>\n <mat-icon *ngIf=\"actions\">{{closeIcon}}</mat-icon>\n </button>\n <div class=\"actions\" [@listAnimation]=\"state\" (@listAnimation.done)=\"done()\">\n <ng-content *ngIf=\"actions\"></ng-content>\n </div>\n</div>","styles":[".main{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;z-index:102}.main .trigger{z-index:101;margin:6px}.main .actions{z-index:100;position:absolute;height:68px;left:68px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.main .actions>button{margin:6px}.main-down{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.main-down .trigger{z-index:101;margin:6px}.main-down .actions{z-index:100;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;width:68px;top:68px;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.main-down .actions>button{margin:6px}.main-left{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.main-left .trigger{z-index:101;margin:6px}.main-left .actions{z-index:100;position:absolute;right:68px;height:68px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.main-left .actions>button{margin:6px}.main-up{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;position:relative;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse}.main-up .trigger{z-index:101;margin:6px}.main-up .actions{z-index:100;position:absolute;width:68px;bottom:68px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:reverse;-ms-flex-direction:column-reverse;flex-direction:column-reverse;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.main-up .actions>button{margin:6px}"],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":16,"character":4},"arguments":["listAnimation",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":17,"character":6},"arguments":["* => right",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":18,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":18,"character":24},"arguments":[{"opacity":0}]},{"optional":true}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":19,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":19,"character":24},"arguments":["50ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":19,"character":40},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":19,"character":57},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":20,"character":12},"arguments":[{"opacity":0,"transform":"translateX(-100%)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":21,"character":12},"arguments":[{"opacity":1,"transform":"translateX(15px)","offset":0.3}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":22,"character":12},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":1}]}]]}]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":26,"character":6},"arguments":["right => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":27,"character":8},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"group","line":27,"character":23},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":27,"character":31},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":27,"character":51},"arguments":["50ms reverse",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":27,"character":74},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":27,"character":90},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":28,"character":14},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":29,"character":14},"arguments":[{"opacity":1,"transform":"translateX(15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":30,"character":14},"arguments":[{"opacity":0,"transform":"translateX(-100%)","offset":1}]}]]}]}]}]]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":35,"character":6},"arguments":["* => down",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":36,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":36,"character":24},"arguments":[{"opacity":0}]},{"optional":true}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":37,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":37,"character":24},"arguments":["50ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":37,"character":40},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":37,"character":57},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":38,"character":12},"arguments":[{"opacity":0,"transform":"translateY(-100%)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":39,"character":12},"arguments":[{"opacity":1,"transform":"translateY(15px)","offset":0.3}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":40,"character":12},"arguments":[{"opacity":1,"transform":"translateY(0)","offset":1}]}]]}]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":44,"character":6},"arguments":["down => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":45,"character":8},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"group","line":45,"character":23},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":45,"character":31},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":45,"character":51},"arguments":["50ms reverse",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":45,"character":74},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":45,"character":90},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":46,"character":14},"arguments":[{"opacity":1,"transform":"translateY(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":47,"character":14},"arguments":[{"opacity":1,"transform":"translateY(15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":48,"character":14},"arguments":[{"opacity":0,"transform":"translateY(-100%)","offset":1}]}]]}]}]}]]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":53,"character":6},"arguments":["* => left",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":54,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":54,"character":24},"arguments":[{"opacity":0}]},{"optional":true}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":55,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":55,"character":24},"arguments":["50ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":55,"character":40},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":55,"character":57},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":56,"character":12},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":57,"character":12},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.3}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":58,"character":12},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":1}]}]]}]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":62,"character":6},"arguments":["left => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":63,"character":8},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"group","line":63,"character":23},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":63,"character":31},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":63,"character":51},"arguments":["50ms reverse",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":63,"character":74},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":63,"character":90},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":64,"character":14},"arguments":[{"opacity":1,"transform":"translateX(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":65,"character":14},"arguments":[{"opacity":1,"transform":"translateX(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":66,"character":14},"arguments":[{"opacity":0,"transform":"translateX(100%)","offset":1}]}]]}]}]}]]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":71,"character":6},"arguments":["* => up",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":72,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":72,"character":24},"arguments":[{"opacity":0}]},{"optional":true}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":73,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":73,"character":24},"arguments":["50ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":73,"character":40},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":73,"character":57},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":74,"character":12},"arguments":[{"opacity":0,"transform":"translateY(100%)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":75,"character":12},"arguments":[{"opacity":1,"transform":"translateY(-15px)","offset":0.3}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":76,"character":12},"arguments":[{"opacity":1,"transform":"translateY(0)","offset":1}]}]]}]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":80,"character":6},"arguments":["up => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":81,"character":8},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"group","line":81,"character":23},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":81,"character":31},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":81,"character":51},"arguments":["50ms reverse",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":81,"character":74},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":81,"character":90},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":82,"character":14},"arguments":[{"opacity":1,"transform":"translateY(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":83,"character":14},"arguments":[{"opacity":1,"transform":"translateY(-15px)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":84,"character":14},"arguments":[{"opacity":0,"transform":"translateY(100%)","offset":1}]}]]}]}]}]]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":89,"character":6},"arguments":["* => scale",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":90,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":90,"character":24},"arguments":[{"opacity":0}]},{"optional":true}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":91,"character":8},"arguments":[":enter",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":91,"character":24},"arguments":["50ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":91,"character":40},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":91,"character":57},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":92,"character":12},"arguments":[{"opacity":0,"transform":"scale(0)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":93,"character":12},"arguments":[{"opacity":1,"transform":"scale(0.3)","offset":0.3}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":94,"character":12},"arguments":[{"opacity":1,"transform":"scale(1)","offset":1}]}]]}]}]},{"optional":true}]}]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":98,"character":6},"arguments":["scale => *",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"query","line":99,"character":8},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"group","line":99,"character":23},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":99,"character":31},"arguments":[{"opacity":1}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"stagger","line":99,"character":51},"arguments":["50ms reverse",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":99,"character":74},"arguments":["200ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"keyframes","line":99,"character":90},"arguments":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":100,"character":14},"arguments":[{"opacity":1,"transform":"scale(1)","offset":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":101,"character":14},"arguments":[{"opacity":1,"transform":"scale(0.7)","offset":0.7}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":102,"character":14},"arguments":[{"opacity":0,"transform":"scale(0)","offset":1}]}]]}]}]}]]},{"optional":true}]}]]}]]}]}]}],"members":{"state":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":112,"character":3}}]}],"direction":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":115,"character":3}}]}],"mode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":116,"character":3}}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":117,"character":3}}]}],"openIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":118,"character":3}}]}],"closeIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":119,"character":3}}]}],"open":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":121,"character":3}}]}],"clickon":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":123,"character":3},"arguments":["click",["$event"]]}]}],"clickout":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":127,"character":3},"arguments":["document:click"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}],"done":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[rbFabItem]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":7,"character":25}]}]}}},"origins":{"RbFabSpeedDialModule":"./src/app/modules/rb-fab-speed-dial/rb-fab-speed-dial.module","ɵa":"./src/app/modules/rb-fab-speed-dial/rb-fab-speed-dial.component","ɵb":"./src/app/modules/rb-fab-speed-dial/rb-fab-item.directive"},"importAs":"rb-fab-speed-dial"}