UNPKG

@piumaz/pull-to-refresh

Version:

It provides an Angular component and a service, for the Pull-To-Refresh feature.

1 lines 6.8 kB
{"__symbolic":"module","version":4,"metadata":{"PullToRefreshService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"refresh$":[{"__symbolic":"method"}],"pull":[{"__symbolic":"method"}],"reset$":[{"__symbolic":"method"}],"dismiss":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"PullToRefreshComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"selector":"pull-to-refresh","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":18,"character":19},"member":"OnPush"},"template":"\r\n<div class=\"pull\" [ngStyle]=\"{'transform': 'translateY(' + pull + 'px)'}\" [hidden]=\"disabled || pullFirst\">\r\n\r\n <span class=\"rotate\" [ngStyle]=\"{'transform': 'rotate(' + rotation + 'deg)'}\">\r\n\r\n <span class=\"spinner\" [class.spin-animation]=\"spin\" [ngStyle]=\"{'opacity': (rotation/360) - 0.1}\">\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"xMidYMid\">\r\n <g>\r\n <path d=\"M50 15A35 35 0 1 0 74.74873734152916 25.251262658470843\" fill=\"none\" [attr.stroke]=\"color\" stroke-width=\"10\" ></path>\r\n <path d=\"M49 3L49 27L61 15L49 3\" [attr.fill]=\"color\" [attr.stroke]=\"color\" stroke-width=\"4\"></path>\r\n </g>\r\n </svg>\r\n\r\n </span>\r\n\r\n </span>\r\n\r\n</div>\r\n\r\n<div class=\"pull first\"\r\n [ngStyle]=\"{'transform': 'translateY(' + pullFirst + 'px)', 'border-bottom-right-radius': radiusRight + '%', 'border-bottom-left-radius': radiusLeft + '%'}\"\r\n [hidden]=\"disabled || pull\"></div>\r\n","styles":["::ng-deep body,::ng-deep html{overscroll-behavior-y:none}.pull{display:flex;justify-content:space-around;align-items:center;position:absolute;z-index:1060;width:100%;padding:0;left:0;right:0;text-align:center;overflow:hidden;transform:translateY(-60px);transition:transform .2s;will-change:transform,opacity}.pull,.pull.first{height:60px;top:-60px}.pull.first{transition:transform .3s;background-color:rgba(53,53,53,.3);opacity:.5;border-radius:0/0 0 0 0}.pull .rotate{transition:transform .3s;will-change:transform,opacity;background-color:#fff;border:1px solid rgba(53,53,53,.3);box-shadow:0 0 4px 0 rgba(0,0,0,.2);border-radius:100px;padding:6px;box-sizing:content-box}.pull .rotate,.pull .spinner{height:25px;width:25px;display:inline-block}.pull .spinner svg{height:100%;width:100%}.pull .spinner.spin-animation{-webkit-animation-name:spin;animation-name:spin;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-timing-function:linear;animation-timing-function:linear}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}"]}]}],"members":{"pullToRefresh":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3},"arguments":["sensitivity"]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"target":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"autoDismiss":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"refresh":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":32,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":101,"character":7},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":101,"character":14}]}]],"parameters":[{"__symbolic":"reference","name":"PullToRefreshService"},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":100,"character":33},null]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"getScrollTop":[{"__symbolic":"method"}],"onTouchStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":132,"character":3},"arguments":["window:touchstart",["$event"]]}]}],"onToucMove":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":146,"character":3},"arguments":["window:touchmove",["$event"]]}]}],"onTouchEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":210,"character":3},"arguments":["window:touchend",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":211,"character":3},"arguments":["window:touchcancel",["$event"]]}]}],"dismiss":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"PullToRefreshModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"PullToRefreshComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":8}],"exports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":8},{"__symbolic":"reference","name":"PullToRefreshComponent"}]}]}],"members":{}}},"origins":{"PullToRefreshService":"./lib/pull-to-refresh.service","PullToRefreshComponent":"./lib/pull-to-refresh.component","PullToRefreshModule":"./lib/pull-to-refresh.module"},"importAs":"@piumaz/pull-to-refresh"}