{"_id":"@anderstornkvist/angular-mgl-timeline","_rev":"2-d0384d10868c51295537e65e813b4ab4","name":"@anderstornkvist/angular-mgl-timeline","dist-tags":{"latest":"0.3.1","alpha":"0.3.2"},"versions":{"0.3.1":{"name":"@anderstornkvist/angular-mgl-timeline","author":{"name":"Markus Glutting"},"version":"0.3.1","license":"MIT","repository":{"type":"git","url":"git+https://github.com/glutengo/angular-mgl-timeline.git"},"private":false,"peerDependencies":{"@angular/animations":"^7.2.0","@angular/common":"^7.2.0","@angular/compiler":"^7.2.0","@angular/core":"^7.2.0","@angular/platform-browser":"^7.2.0","@angular/platform-browser-dynamic":"^7.2.0","core-js":"^2.6.2","rxjs":"^6.3.3","zone.js":"^0.8.27"},"devDependencies":{"@angular-devkit/build-angular":"~0.12.0","@angular/animations":"^7.2.0","@angular/cdk":"^7.2.1","@angular/cli":"^7.2.1","@angular/common":"^7.2.0","@angular/compiler":"^7.2.0","@angular/compiler-cli":"^7.2.0","@angular/core":"^7.2.0","@angular/language-service":"^7.2.0","@angular/material":"^7.2.1","@angular/platform-browser":"^7.2.0","@angular/platform-browser-dynamic":"^7.2.0","@types/jasmine":"~3.3.5","@types/jasminewd2":"~2.0.6","@types/node":"~10.12.18","codelyzer":"^4.5.0","core-js":"^2.6.2","jasmine-core":"~3.3.0","jasmine-spec-reporter":"~4.2.1","karma":"^3.1.4","karma-chrome-launcher":"~2.2.0","karma-cli":"~2.0.0","karma-coverage-istanbul-reporter":"^2.0.4","karma-jasmine":"~2.0.1","karma-jasmine-html-reporter":"^1.4.0","ng-packagr":"^4.4.5","protractor":"^5.4.2","rxjs":"^6.3.3","rxjs-compat":"^6.3.3","smoothscroll-polyfill":"^0.4.3","ts-node":"~7.0.1","tsickle":"^0.34.0","tslint":"~5.12.1","typescript":"~3.2.2","web-animations-js":"^2.3.1","zone.js":"^0.8.27"},"dependencies":{"tslib":"^1.9.0"},"main":"bundles/anderstornkvist-angular-mgl-timeline.umd.js","module":"fesm5/anderstornkvist-angular-mgl-timeline.js","es2015":"fesm2015/anderstornkvist-angular-mgl-timeline.js","esm5":"esm5/anderstornkvist-angular-mgl-timeline.js","esm2015":"esm2015/anderstornkvist-angular-mgl-timeline.js","fesm5":"fesm5/anderstornkvist-angular-mgl-timeline.js","fesm2015":"fesm2015/anderstornkvist-angular-mgl-timeline.js","typings":"anderstornkvist-angular-mgl-timeline.d.ts","metadata":"anderstornkvist-angular-mgl-timeline.metadata.json","sideEffects":false,"description":"[](https://badge.fury.io/js/angular-mgl-timeline)","bugs":{"url":"https://github.com/glutengo/angular-mgl-timeline/issues"},"homepage":"https://github.com/glutengo/angular-mgl-timeline#readme","_id":"@anderstornkvist/angular-mgl-timeline@0.3.1","_nodeVersion":"8.11.2","_npmVersion":"6.7.0","dist":{"integrity":"sha512-TXtOqgN5ycygJsRSUz3J/jPfms7+Abyd382ZlA6FMGOOGaLp+dDlk/rc1Rg1Aumlv1iyw1HN/P6MOBAeG6sKxQ==","shasum":"c19b3faafdb3c71af8d3df0c691efed5ba979d9c","tarball":"https://registry.npmjs.org/@anderstornkvist/angular-mgl-timeline/-/angular-mgl-timeline-0.3.1.tgz","fileCount":41,"unpackedSize":406812,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcZqBECRA9TVsSAnZWagAAH1UP/3lh2Xkl+WIvtH5pj+XS\nCVxdZQ7wWbcZXs/nY3L5OYglzMVxHVm1N0b5Gf5t5mXUZBA747lHQoE2+04R\nWyWgnuRVvWh4PKtqWRK1KD3pzDPKSMFYTQCj/jZdlSXVjUA9MrdzhHS7q4FY\nwY7zVUyEq11spAMv4BQNNjmFxZgN48UPpzWsIJQwoKAmHkR/CVQs6j5tpX8i\nzp+v6xUvIE75iFeOu/TfCat6VOr0jRD8pwBInR3YoQy0JYE4X67MMQrxVT3G\n9WnRjaOz3lfQXZhcg13iVH3nr19HQBXAXg57QeJIWzg3k4Bgftx1L+I0xlXB\nZbjdP239oUB2h2ojRHfv75ma6qgBbOvpKHBb/toPkWoq53u65Y4OxAXeiIqL\nsNrMHJgDR8mFl9eIzC+eZ8DmP6P70srHANLARZ8Wguvljag/LRKqiWV+fpyX\ndWZNJ72T2e8YXmJSa+f7V3JnvxthChi9eosYFEKwbt0kTqyVhgPIl1KmHW/n\ntIzaoXWvydN+yz7FyQQgg0w+6uBK1TS12GRi6PIJ7e9u9sIDlUZA1ovCjkSR\n4Mi4k5NkCxJtJTFZFQRQGcQ3o46MX+LpPh8dDTjuuB82icLvAlRjcxGZ2QYy\njOrqzczJ+ihKK/xd0uXjuNdwVEUGsZVmRt+w8ilBXRWHk0PADhnr5fJfBgFd\ngx7H\r\n=aJF+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBkCuPpHfur8u8dOkCmsndUOmJCBOVWXUftRMws0bAxZAiEA40TZSC73izl4cXMgByDusCw64zFHkoG0/L++QnEbVo4="}]},"maintainers":[{"name":"anderstornkvist","email":"dev.npm@anderstornkvist.se"}],"_npmUser":{"name":"anderstornkvist","email":"dev.npm@anderstornkvist.se"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/angular-mgl-timeline_0.3.1_1550229571768_0.2507574109206372"},"_hasShrinkwrap":false},"0.3.2":{"name":"@anderstornkvist/angular-mgl-timeline","author":{"name":"Markus Glutting"},"version":"0.3.2","license":"MIT","peerDependencies":{"@angular/common":"^8.2.14","@angular/core":"^8.2.14","@angular/material":"^8.2.3"},"repository":{"type":"git","url":"git+https://github.com/AndersTornkvist/angular-mgl-timeline.git"},"main":"bundles/angular-mgl-timeline.umd.js","module":"fesm5/angular-mgl-timeline.js","es2015":"fesm2015/angular-mgl-timeline.js","esm5":"esm5/angular-mgl-timeline.js","esm2015":"esm2015/angular-mgl-timeline.js","fesm5":"fesm5/angular-mgl-timeline.js","fesm2015":"fesm2015/angular-mgl-timeline.js","typings":"angular-mgl-timeline.d.ts","metadata":"angular-mgl-timeline.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.9.0"},"description":"[](https://badge.fury.io/js/angular-mgl-timeline)","directories":{"lib":"lib"},"scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"readme":"# angular-mgl-timeline\n\n[](https://badge.fury.io/js/angular-mgl-timeline)\n\nThis is a animated vertical timeline component for Angular 2+. Angular Material is supported but not mandatory.\n\n## Online Demo\n\nAn Online Demo with live editing is available on [stackblitz](https://stackblitz.com/edit/angular-mgl-timeline).\n\n## Getting started\n\n1) run `npm install --save angular-mgl-timeline` \n2) in your app module: \n```typescript\n...\nimport { BrowserAnimationsModule } from '@angular/platform-browser/animations';\nimport { MglTimelineModule } from 'angular-mgl-timeline';\n\n@NgModule({\n ...\n imports: [\n ...\n BrowserAnimationsModule,\n MglTimelineModule\n ]\n})\nexport class AppModule { }\n```\n## Usage\n\n### Minimal Setup\n```xml\n\n \n Header\n Content\n \n\n```\n\n### Include a dot\n```xml\n\n \n Header\n Content\n \n \n\n```\n\n### Include side data\n```xml\n\n \n Header\n Content\n 2018\n \n\n```\n\n## Angular Material\n\nThe package includes a theme for angular material. In your own angular material theme:\n\n```scss\n@import '~@angular/material/theming';\n@import 'projects/angular-mgl-timeline/theme';\n...\n\n@include angular-material-theme($your-theme);\n@include mgl-timeline-theme($your-theme);\n```\nIf the theme is included, the components will be styled according to `$your-theme` including support for primary and accent colors for the dot.\n\n## Components\n\n### MglTimeline\n\n#### Content\n| tag | number |\n| ---------------------- | ------ |\n| `` | n |\n\n#### Inputs\n\n| property | type | default | impact |\n| -------------------- | ------- | -------- | ----------------------------------------------------------------------------------------------- |\n| toggle | boolean | true | If set to true, expanding one entry will collapse all other entries and vice versa |\n| alternate | boolean | true | If set to true, entries will be displayed alternately (left / right). No effect in mobile mode |\n| focusOnOpen | boolean | false | If set to true, expanding an entry will scroll it into view |\n| side | string | 'left' | Changes side (`'left'` | `'right'`) the entries are shown on. No effect if alternate is `true` |\n| mobileWidthThreshold | number | 640 | Decides when the mobile layout is used |\n\n### MglTimelineEntry\nThe `expanded` class will be added to the timeline-entry compnent when the entry is expanded. \n\n#### Content\n| tag | number |\n| ------------------------------ | ------ |\n| `` | 1 |\n| `` | 1 |\n| `` | 0...1 |\n| `` | 0...1 |\n\n#### Outputs\n\n| event | type | description\n| --------------- | ------- | --------------------------------------------\n| expand | boolean | fired when an entry is expanded / collapsed. Value is true for expanded and false for collapsed\n\n### MglTimelineEntryHeader\n\n### MglTimelineEntryContent\n\n### MglTimelineEntryDot\n\n#### Inputs\n| property | type | default | impact |\n| -------- | ------ | ------- | ------------------------------------------------------------------------------------------------------------------ |\n| size | number | 45 | Size of the dot [px] |\n| class | string | primary | Will be set as class name of the dot element. primary and accent can be used when using the angular material theme |\n\n\n## Polyfills\n\n### Smoothscroll\nWhen an entry is toggled, it will scroll into view. Smooth behavior is currently not supported in Chrome. A polyfill is available in [iamdustan's smoothscroll](https://github.com/iamdustan/smoothscroll)\n\n### ClassList\n`ClassList.toggle` was used at some points, including the second parameter. If you need to support [browsers which do not support this](https://caniuse.com/#feat=classlist), be sure to use a polyfill, e.g. [this one](https://github.com/eligrey/classList.js/).\n\n### Web Animations API\nAnimations are implemented with Angular animations which are based on the web animations API which has not landed in Safari and Edge yet. A polyfill is available in [Web Animations JS](https://github.com/web-animations/web-animations-js)\n\n## About\nThis project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.6.5.\nThe NPM Version was packend with [ng-packagr](https://github.com/dherges/ng-packagr).\n\n## License\nMIT License (c) Markus Glutting\n","readmeFilename":"README.md","bugs":{"url":"https://github.com/AndersTornkvist/angular-mgl-timeline/issues"},"homepage":"https://github.com/AndersTornkvist/angular-mgl-timeline#readme","_id":"@anderstornkvist/angular-mgl-timeline@0.3.2","_nodeVersion":"10.16.3","_npmVersion":"6.13.7","dist":{"integrity":"sha512-W0OTJND1TDRIEelZAGgjGvjiwgjJRQ2nX4h9kvDhdo7/k1a6FwureXy7yCvjiwEbhdpKFMTcXhnWxT6m5C2VwA==","shasum":"69d51241f7cb2f6fc26115bfcf2f5e17269ded24","tarball":"https://registry.npmjs.org/@anderstornkvist/angular-mgl-timeline/-/angular-mgl-timeline-0.3.2.tgz","fileCount":39,"unpackedSize":453095,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeOE5vCRA9TVsSAnZWagAAbcoP/2nx+M7F7FR5At/q0w7h\nafRIVRJAzqBHDzAQaAaezrsds734tKiA6CMI32n57lFFFfcrwx86c0vbrrQH\nLOQ1sllpZJdFKr8A37ILzLY53bUQdGeaI9wvMe6VxNT28al5a2jPF3Vc6M80\n5lOf9/dNaoaSj7DwDzAWmL/0IqrVRMlkI9sehfo9PSOh6U/jV3V+19d/Lg7k\nd1087RFHhJEdw6mAJhMM25M2KCwpeNlMk9Wro56W9BzbhnWUX8Twrd0lbBGF\n7S3DChjEIgKxDktvHHqjlSTNeQsy9w0UfZQCE57fCsGbyTNZJadMBdNOsOs8\nPt/j3JnHExI47z/f+YLYpTDO8BbUSCRG/rvEx7Cms/Sdq3mxTpE3Kb9auEH3\n5ug89eVX3XqMFJLX8/xG9xTIUgZqbXOXR1Q9pQhU6V65vtnY3WiHBDeI8w4E\naQRqQVwqmHGH+vy3O+Be16r7JEZd/0wUWfiOnWn+58b9C+2n4HCm5VRiEUd3\nfyk7SWweQoOqLZIToc4QSdbp8c/8cdjTCF9heFJDljofhbwXXYRyMZfSR/j6\nbPRPYA8MUjg8lHIwLZpeftgra6/DZmrJu+/KIq8jMqkH0lzWTJouaLOaM/vR\nBXt7va/2k7tN69kBsR1rUGMNxQA4Sz/bonS/w/hC0Up0BJqLJBvwyUFYAMnn\nE9nS\r\n=7n7o\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDrvSG3JRuvPyx9Nw31//pOdP5EZQjINqu3rHZKUsqwlAiEA+TteAmVsP1GaM8AUqKAbMryOp7whFzUW7/XmDEt3CBg="}]},"maintainers":[{"name":"anderstornkvist","email":"dev.npm@anderstornkvist.se"}],"_npmUser":{"name":"anderstornkvist","email":"dev.npm@anderstornkvist.se"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/angular-mgl-timeline_0.3.2_1580748399084_0.4374150470912064"},"_hasShrinkwrap":false}},"time":{"created":"2019-02-15T11:19:31.594Z","0.3.1":"2019-02-15T11:19:31.955Z","modified":"2022-04-04T13:58:09.836Z","0.3.2":"2020-02-03T16:46:39.226Z"},"maintainers":[{"name":"anderstornkvist","email":"dev.npm@anderstornkvist.se"}],"description":"[](https://badge.fury.io/js/angular-mgl-timeline)","homepage":"https://github.com/glutengo/angular-mgl-timeline#readme","repository":{"type":"git","url":"git+https://github.com/glutengo/angular-mgl-timeline.git"},"author":{"name":"Markus Glutting"},"bugs":{"url":"https://github.com/glutengo/angular-mgl-timeline/issues"},"license":"MIT","readme":"","readmeFilename":""}