{"_id":"@terminus/ui-tabs","_rev":"52-ee5d2dd2f550ff0fc12aba9c12b3a182","name":"@terminus/ui-tabs","dist-tags":{"next":"4.0.1","latest":"4.0.0"},"versions":{"1.0.0":{"name":"@terminus/ui-tabs","version":"1.0.0","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next"},"peerDependencies":{"@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^1.0.10","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0","tslib":"^1.10.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.0","_nodeVersion":"12.16.3","_npmVersion":"6.14.5","dist":{"integrity":"sha512-eP+P8cREwyq7vkXaEAyk4uqBduilZcVO9p7uon2iEGKApl10XicQFeyrOB3hCVPciOAcJxO/H/kK+AgQboLfHQ==","shasum":"5a30b05ee469d45230f8f0b2d8915db891d61594","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.0.tgz","fileCount":39,"unpackedSize":137286,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe2TZ6CRA9TVsSAnZWagAAqPgP/RweP6c5Z2brEURIjn5D\nv8MNnC3jgF9pQqq/lGZ0IsHz5Eu96UsTEczfJ///qz94FE9fhnVpcBLSPvjn\nOQnvyuAHJgKDD8YxpoyKe1pXRbbSyjyefc2pRofoxYx+hkg7rfd7pJ2Occr4\nrwfcklLJUHZXv20n9pKSPRRUuaHjNKxpj27N8X0radm0hoD3nwAYBuHkONbM\nxI0vgtosXqIMzsTJ9rjWH04qSI6bdDLK82K164XQp0WKdSQqf525u74dbBHD\na8jGbCinqVMsaTMy0eTFuo+9ktqRTt+TqeBgES9A7s+REJMuuE+VIjXVajkj\ni6V1JV8RY/dmwnNLN0wv1EakLpt9BSCf5Y/8e2XtrhacD3L/O5a3tbGS7kKz\n01KMuJyLG6Ca9ous2qq0Byoa+b784XJf5EVyOtUHqDYjPkSsEFkpqe1THsGf\nUPfHWXfo1vdCX1tXCaSFMoZvNQ5iUw8/m0Pipu+vh58CWwd7x9opNp0roqDB\n8OH5P0E3JObSVo+Sxa9yKu6sUOQU5XDmaDuIqAOy1g9evQDNqeccBmFaij5X\n4w9g+6DamRTT4M9V8/YKPX9xIa7tIYaBOi/C/Ddr3vbWwcrWl0toLv0HbNGd\nOCZ040aN4hAXAWtBroRxvtHB5uMH2EC3XHVpGElI52MsQMyONrEOBpwHleMQ\n6iOC\r\n=YmsR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDD3PPuQf0mFYwL6i50y87L2fBP4ZsHWBu5d8Aw8OZE4wIhAKMgdy4T6HxHav2RFy7aJhl8wh7tPBrlpfxZQsLrVHJm"}]},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.0_1591293562249_0.5729433531646282"},"_hasShrinkwrap":false},"1.0.1":{"name":"@terminus/ui-tabs","version":"1.0.1","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next"},"peerDependencies":{"@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^1.0.10","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0","tslib":"^1.10.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.1","_nodeVersion":"12.16.3","_npmVersion":"6.14.5","dist":{"integrity":"sha512-kZWeV+Up09aaU0efCscGBdVNcx5tuhZd87Eh4TeiU+bO5gWNuAlSWEDNic5MwpbhSAVuRdNz7NTvqXye6vDlCQ==","shasum":"2d87cb975f42663d7b5516cf2e67e93b76ec566c","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.1.tgz","fileCount":40,"unpackedSize":137340,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe2aidCRA9TVsSAnZWagAALGwP/jBPr3284Jk+0FpqyD++\naK06/mu4bJO+Gw0eT6wvEdNlzyV2dLHjhzcxvqJhqPjDEEOKozrS8AqZYNlx\nPS5eU23zRhkjH/yfPyKavHlYpIu5T2ePxcYIMcrelcWUAIZ8u38nUoI5De6C\nWHo8zmF2ntEV4h2qWa+wTtxFfeN1jDJxlkFcE/sSUpZaAZZ7j2Lg3iPmN+XV\noNYnetNWbr/lamkXNpn8jDwu61mrQ9IoQYxhDW/sDqIRZrzyB+Ga7+Ep63UP\n5x8xjB0Ss8MX7bPr6QQ8cH3OVdfXvIllJfYZFpksNUyvOpcN3F8rT1WenU1s\na6uUXY6Gx8OWkFO5/r5Xe0ZFrcml7GOeRseObeMoPRq4/G+5gjNCFi2B34S+\nZ8G/Hl2JpEgfZCTB5fh7iDSE4UhBDGvrWMecyvXCSugTW/jEHM6AFNTE69pt\n+/+fHS7gXrTVl+U/Yt2xsIVcqReEaDRtD/sAbTcaKptR6uYbWeWIamLhIv2j\nryDrSzszqqV1LvJ+I/ZYDhztCA2k5pO3YbuQYojwMVxmBNPttmKNxNfVxxKy\nK3Umb+afy7g7fZ7c5I1m5QWUxbzM3kj7g8GtFIWxowU8DD2wWvN2kKUKmwKe\nMyxE/SE5K55QTfUfIDTdlCxKs9XR9qOJ7FYx68MWgipbElW7RWKsOTlOMdoV\nrboG\r\n=3TUE\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFGJVWUp7s8BrtDHYQ1o0PK/BflXyeK3VDN3zt+Eua94AiEA+Wzt736Yw7/nLH3lEt8eqH0fBryHUSPx8e26QU/4mkk="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.1_1591322781474_0.903981339494321"},"_hasShrinkwrap":false},"1.0.2":{"name":"@terminus/ui-tabs","version":"1.0.2","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^1.0.10","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.3","@angular/forms":"9.1.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.2","_nodeVersion":"12.18.0","_npmVersion":"lerna/3.22.1/node@v12.18.0+x64 (linux)","dist":{"integrity":"sha512-Njnpvv3nKCjyTBAYb7RHcfX6zq576FUIkGhWeaNuPEAFgOV/KSs8TAQWYHjNrpXNUEpkFd6QicOS/RIg7QlyNA==","shasum":"66209466df717959fe8fb471640cd26f92af3ce7","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.2.tgz","fileCount":119,"unpackedSize":1142886,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4PPACRA9TVsSAnZWagAAZqUQAJFG36lLdn0Dt3nx+AvM\nwAWhgRL4vTKhO/W09qScjMo8tlSdKINrk0Sxnd0CT1hvj5D4xKTFR3kdWLB2\no+aByK7IFtdGQJSPGUMrBtH+/idERxfbgQQxT/7sQ3NBOZrgM57CfCAJ6bGS\ndbY3YXoPEf6WscVlR4u1p3Wx+PDPG1IwoMO+XDYobQDAZZfO+D9qeOOpzCgK\nZsWpJha0gNXgkZACGr7+KVJn2iZGP3xNNawXDsPZEUeJaTkHvDr8uW8OoUXK\nSm4sSEfqFXSj9nCTer2g3XIAMBKZ6arAMBrKvrlzo/klrzXQAkVL07Va3Vow\nmuvHfce4fzJt0dnJSDzDUcVse0+H/RQEn6KSYMIc/1/W8CUSDIjNlYDyvCNT\nursuD597eTC6ruFiFjddXTw5urZZXlmDDqBKQVJJ32lXrLkyZuuIHsA+FX36\nFMdLqoysDqH4Zj9Q2OVuAFjzs7aooH/JwETsOSVOt5cS0oEWWza223AKRjqz\nP6c9f9PFbs9trLHZj+qwcz7WKAS8i/cciHrgGnGKjKSI05+gD1wyKLD8pgpf\nDa1G9X97kY+bZwRlUYRoh21ECwDjJjoujKAI5glzGukthaMgm9sSOAChGSpW\no6q/TwSzV6poAuwqff3Ja3yjh7fL4j5H/J7gdvnucdRg+EOZ7q+6lmyMoClX\nhQvL\r\n=aqI+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCo8LMyU0zpooC365/qJDZExpCrQb2MRlQUyLIPt2xZRAIhAOV6Xbbr+qt0hIURpqkV5zZcFn4b0HrDcXHACW5QTp11"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.2_1591800767500_0.4938557396497798"},"_hasShrinkwrap":false},"1.0.3":{"name":"@terminus/ui-tabs","version":"1.0.3","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Github release][gh-release-badge]][gh-releases] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/master/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/master/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[gh-release-badge]: https://img.shields.io/github/release/GetTerminus/terminus-oss.svg\n[gh-releases]: https://github.com/GetTerminus/terminus-ui/releases/\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.3","_nodeVersion":"12.10.0","_npmVersion":"6.10.3","dist":{"integrity":"sha512-VENwyxTRwkc+kf0ITVbYCMns1tf5Yl6M2Xi3gS/HzEL6GPu0qUz0r+DXjQj0GgceN6W/1J11p35+PajzDZYR3A==","shasum":"39a972cef07109fdba43795a32324e04c7dc8fda","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.3.tgz","fileCount":118,"unpackedSize":1142009,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4TMECRA9TVsSAnZWagAATjoP/3Ro3cHzHd5bagujmdFK\nJLlUbZtf+ZN4G2/xQO2WJANy5jXB1K4a7pkSPbzMk+XP5VAUybQiwrJkubbe\nDYkiTmx56ZHOenfnwGTZfkPXWkAucDdIk0kLPe21Xsk35wVQAgow0pKV5b3v\nD46R2VhCKE3TiH0ttDRqPO+zJLQAdBYHfoHTGoIAu3casZBUv8rUDqnDL5uu\nQ0ug5xCQM9My6YJjStrCyu18kYq9VXr4zKwTSExGNFk31H1nIWLIAkW1CVV6\ngV4tA92lv1JbxiBJH56e/vboRuSUiL5k+yBB18TTOxYs0tEIHuVkuxd44GAw\ne2CR0/KrK0CvlbsLw+2a/SxbRfVkKJ/+dQJThWw/XSGfMgWuueLkCTWqdjka\n4GG8D/DNSy7BxdHoI8K8kny6ADMPJ0FQfnXVj4MoHl4/KHcXljkmNappNHB3\nhmnPll81jnrho4BX0L2vm0MWAFVy3sRxN0L3afDhgFW7VIipD8QN6gz8ahQ+\nJ4bThw0aWRLfvgLzsxg0g+d6ccKsZqDffEaorZh9vwY9hG1BcRnznoI7M0PX\n3K8iCQc3wXgddL5nHJeAQUUhUZvYgWkBxDFOiZPDwWYllIpAwvUGYQ8svPj+\nc8QfR0mYJomkM1iFjIl702eLehIvOEDePcritw1KM8ep858AWe/bGc4AgPxd\ndwf0\r\n=Zt7U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAQle1ezBLUjdRAUhMSdhrmsuxI7iH2hnfj/BGqWx91GAiEA39ua9WJoDq9eM9Q/fZrlvJAAFz7AA1/RJrRoXPS7Xr4="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"benjamincharity","email":"ben@benjamincharity.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.3_1591816964209_0.3847450698621493"},"_hasShrinkwrap":false},"1.0.4":{"name":"@terminus/ui-tabs","version":"1.0.4","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.3","@angular/forms":"9.1.0"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Github release][gh-release-badge]][gh-releases] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/master/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/master/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[gh-release-badge]: https://img.shields.io/github/release/GetTerminus/terminus-oss.svg\n[gh-releases]: https://github.com/GetTerminus/terminus-ui/releases/\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.4","_nodeVersion":"12.18.0","_npmVersion":"lerna/3.22.1/node@v12.18.0+x64 (linux)","dist":{"integrity":"sha512-/hqBfkhrAILE//JDFDQXuJyIP65poQz+E190Kc+aDyuMVLRGINOBWsdx+R/wuP/Q2xOnwZZNrGPcEZocAFjH5w==","shasum":"6d1f32aee96b8b37d906dcd01620bfbfe27198f2","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.4.tgz","fileCount":119,"unpackedSize":1143450,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4j2PCRA9TVsSAnZWagAA/UoP/1FqpF4BekDJxQ0HVbEo\nym3atTET7rkTUa79u+KW1aeFEzarRog/qhrGUxEN2iQbsINacrLRqJ2WbOcR\n8e29XjP8AeuLC8gJlMXb18NURj0Xvz+5pQZ1W01+fEWLdeHYQVF5pKpdTmbS\nAip+1M+fPjrcZ/aQV6X7Q6Xdt1V424Bnc/Unjtlc+yh2Y5Vhx9Ims96EvRoQ\noqH0/AR0cAF0G7PcHR3dBRh7Yfjvf0ewwpmuQNUeKvVZVY/6AJiYePymzgCX\nmLnxPUYZfs0LvCMybVrGX5SCKyQbCSbyk/aldDe5aFhQTjUtozG0y1odBNi1\nvlGr+ew0KQqTAv9dvYGjR0JTaElwXkKSWKejXa8tZt0P25/VEEqUYnx5B7hk\njC7FXZUxXlicAjU2CBa1zRk2hjNWTVf7dW2p5S3jrr9GZILI1dRDH78MiWVa\nfAhjXlrAUPkLTyZu8VtPLC0ICsdBgxCs+cKqnioJ2YLoxA5eodyqLMB9XEzE\nVM44dTq1TvCdNWw9ZxYjQiwJnsiR5A16eB7VR8PmoM7hLFex9rVq5vl59F6R\nSMzpOvf05LVBA9ammw8NHRbsgbMLrSCT59eZt6N5jTDrT/D0U6VIpisKQPvI\n5GAr3+yiR6xRNIuOQ3u6dEMwwn9iXsmwyBeCjIxPVnzEC02WYZt9gtixhzLR\nVa1K\r\n=sVB/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCshYzBr0jJHCR9U4sYjd6kQL+ugljShF+xKrJbU+pttgIgNruFBj6OtBe3VX7Xo522EwPO36hQp+zgNmsEofA6gyw="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.4_1591885191695_0.40111657863311123"},"_hasShrinkwrap":false},"1.0.5":{"name":"@terminus/ui-tabs","version":"1.0.5","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.5","_nodeVersion":"12.10.0","_npmVersion":"6.10.3","dist":{"integrity":"sha512-x1pqHfvnbf4lglXn43SUpV6N/gkTUDO3Kj0GS2dkLdd091WRzMFhg/XJm6IYYKQuYVkwpV3Fbqn888RG3Yv/vw==","shasum":"d0e13567c5fea5fefc3b115b95ea5ffd4cef566a","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.5.tgz","fileCount":118,"unpackedSize":1142531,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe4mIFCRA9TVsSAnZWagAAUssP/ivlB5FXkdxPLxSxV0GX\nf+o6ayOub9BiwQeRbXxq1R1ZeMXrTTH9UFTc4TVHF35i1iM9RaShzHLRxrr1\nKKhvbww1rB/4EbZLBb/GlploSVnXmbE7RdqFphHCLtVKyKSzVlfxexjbfqJW\nyLIPav+dsQdUeMZmOCZGMUZFFZKUJbM17T9zDEU9pRqB4DwCElJmlz39ePFL\n2HaEsSzKohEvFJSFd7loSZTfbjlK+wCAHPj04in2M6IlYIa2VNYMOPUDtRTe\nXkgM2Uf8sSyM76IMdx4a/X9onuaQ0L4h18pCbT+gV5ZAxuKRwiB1gHoTAOaa\nuouIBGVbR9vgPgj0tN4JME99e3jjRDswgiQtKvtGhKG9dq3BPLGeIoAUsSiU\nq6i43Ml32otlWVyWrYjaEpBFaXOV84bWiwzHCRqLLBiuGqd+FCkLatPWJALB\ntvMGKuXS2MUGm2FpBrZvQ4MqVtinytZbB3I4sm4QoCEnd06oetPa8XmomUni\nXCYqE3tE/eSRDsHe2ZzVC8X9vbnAGU0Y/ZWLmvbFTTJZprlK/1dcT/o27gfi\na3LIPIP+C0zg8X9wmlZSwtzaMuVo6nA5/YN41oWNlaTfd69U1pzckEj99/lx\nWQbBxS3kuufcpb7k7+GiMdrfUqrlMa/XgfoJDipHsP9dGi+RRsS/2jCvRfaY\n4ngV\r\n=TPhh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCID6gPpOOW1xwTZC2DlvfkG6vwWp9Zah/20dkhWus6eozAiEAsk/5AHcn2PkqXGUShoQjv1J9L7V+HBBXr+xdaej5StU="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"benjamincharity","email":"ben@benjamincharity.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.5_1591894532384_0.09097844198564031"},"_hasShrinkwrap":false},"1.0.6":{"name":"@terminus/ui-tabs","version":"1.0.6","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.6","_nodeVersion":"12.18.0","_npmVersion":"lerna/3.22.1/node@v12.18.0+x64 (linux)","dist":{"integrity":"sha512-ZeWAPZnKdgEQzijBIPNv6ueQFLrUAkc1qGlkz66sScqy0tSazb+UyGvnyBqmARLSk17av0WRJgTmT6D/f/sgcQ==","shasum":"55b93b33e89440ddeb066f2f25904eede4e122d0","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.6.tgz","fileCount":119,"unpackedSize":1143701,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe8iFXCRA9TVsSAnZWagAAa0YQAIuRx79I99MdNfXdSVqr\n4QKP1LAeOefwfxV+BpJZUQGmovs/3AWu8LrgUB9YuKGyWY9KKuvM98stHhrP\nwcxq1K6U9EOgwWLaM0KCq5pfPbmROepIdRpzdmozbxXUQ27OZg4EOoghEQU+\nO6jl72Kz5GYfYyBgt0P94jqrCgciXNQyvAn3ygC0EHwKZ4R8c6/szHnEyugs\nMclAFTnPc6vCGQxXp8NbAZH1EpbsqnTE7lqu/jSzgLV5oNKugipBJz9hdc+k\nvxN9VQYZXm047KQmwVwV55v0hggDkI5WE5HHwimpghxQEsWh7J0/1Veka2fP\nkLyKTjn3QWTd3y4RfK2GF2ahJ9aj1qUuMpVxD2BifAVzakzfYT66vi74C64P\njZbReGCkZ8P+yMTmBeiao48ex1V7r7EkyPsngA+viv+/70YVnIYXNS5lfAUF\n3/Yv7vq0bP6af8toS7wtXBqVp2WwI2EX8a2MTfMd+vizirOpsSEjXstAqEna\neeintj81dKtA+YAyY5tq3dxgVgfF/LAMgflM039keg9S6uftM8j/u9Jmi0Tv\nEyrE4Ed9+ykET0HxyfZwC6SNxFw7huXRT0hnIZBizrTMG21aMsD3n6OtcsW1\nZHxJ8xcTQaWgjCvlCEDZI/lq+WVpdwjolDzIrFakPjGfAm42ylWrSGtEQLO+\nF0d1\r\n=mDLc\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDbXvNosmy020McMEqNEOArLcetdbCN6OrfGwA4g6ySsAIgY7oUblfDRABrzMQ6CSrdLuowwpqDKc7fd21gKD1hKnI="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.6_1592926550612_0.12052294392102292"},"_hasShrinkwrap":false},"1.0.7":{"name":"@terminus/ui-tabs","version":"1.0.7","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.7","_nodeVersion":"12.18.1","_npmVersion":"lerna/3.22.1/node@v12.18.1+x64 (linux)","dist":{"integrity":"sha512-rrG2hQDXeS1EnlxVcFftVAUJhkAGxZxmkvhJuVVOyWuldRaLIyB/LeYJ5Y46s2GCRR2evsK08tWZT7C8sSvNlw==","shasum":"795ae7d60e15c5e66bafd1dab0d9658f07a86df1","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.7.tgz","fileCount":119,"unpackedSize":1143894,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfBJdUCRA9TVsSAnZWagAAjdEQAI2Q7eRWva3DQ2ZruO24\nPuMSlQewwJh2w0DdKVJmcfsGjrzIhalTg5hmVPXibleMeRKJ5ojXRGTO2XiI\nOdf/ONYMobM8wx8E7z1LZ+wWmgB7jHoTRzLG8rnqXk5oAOBiyz/LEpF4EjAJ\nm6/Jcv1gWu56N+y+nWmIoGm2rKKxXz0XT9Ms9zI+ucaQ1kuw4LCXNVQ5M9Es\nwVzRLa8nexQiN6qOX1uW5Ml2hcLSqFrhzVk5dOVz/tHPf94bv21909rc9lps\ncTnNWldw/Y83XXJPWWgmaCykwhrxpBX7Ri7on3WXcJ/+D/vryKxeGtRue5ia\neYENjMVhI2tYe+l2Wp9R/WqxITsINPMCBOf21IYys49zY/TEcDhy/l5bjW/M\n/jTh2KqFFjc103JVYccgPsuyDZWWFUZ4zhb9BLkQKHOlFFRWEFUw1QCP9Yje\nrRILCVt5R1xqimo36BQZGPIw9JQEaZBHGn89zcRo3jAJe6J3acsARM9Z47XZ\nyoCO8gm69EbZF4T0R1APrCyTczppBE3lEM2jfOhHNcsA2jEpKYUHLPtl4g8a\nHtLCjm0slf7lJ5agInqNwJSYkuSg3e/L7CPISVlwM2hyRZPkc5+Z/Zdvwrpx\n3qkALnIr/SIo78kkKjQIrAX3uh+WdbIYYVnbAtpT2+dIFsCnOzFtYUc4oG0R\nqqVK\r\n=+Sy9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHtgBLZdRe3GtAhAwzxV4tgYsMmAuG8PJ/ssPqJvj+joAiEA3YMaM5+ZsAp5IvEWdamQDh/R90ijMQvE2FwJn3oFgDI="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.7_1594136403966_0.24351355104545713"},"_hasShrinkwrap":false},"1.0.8":{"name":"@terminus/ui-tabs","version":"1.0.8","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.5","@angular/forms":"9.1.11","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Github release][gh-release-badge]][gh-releases] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n * @angular/cdk\n * @angular/common\n * @angular/core\n * @angular/flex-layout\n * @angular/forms\n * @angular/material\n * @angular/platform-browser\n * @terminus/design-tokens\n * @terminus/ngx-tools\n * @terminus/ui-utilities\n * @terminus/ui-tabs\n * date-fns\n\nUsing `ng add` command can help getting all the dependencies installed:\n\n```bash\n ng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n * BrowserAnimationsModule\n * TsTabsModule\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[gh-release-badge]: https://img.shields.io/github/release/GetTerminus/terminus-oss.svg\n[gh-releases]: https://github.com/GetTerminus/terminus-ui/releases/\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.8","_nodeVersion":"12.18.1","_npmVersion":"lerna/3.22.1/node@v12.18.1+x64 (linux)","dist":{"integrity":"sha512-jZ5uAX+95sjnfyv3dscpmtN4i3WuYjdLPbG6F68mItOc5ZxZVy73bDeke0E9yQQO1Gcc28sgKk077btQrgoLsg==","shasum":"3768455a34b21568d10bdfbce3eef6c4c0bb8bf0","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.8.tgz","fileCount":119,"unpackedSize":1144907,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDLUQCRA9TVsSAnZWagAAKRoP/AoZGLT7qdmM4X+jDW6M\nR5KhG06dwiqJo0y8nkSBXYFnzb1CvDrUQ0x5iF0weOilu2uoW3GVjVvWuzZi\naQrOjsZJV9Be51G8zWjemdt9nAPJn7pmROUpGPdNkALl6VlfMkmA22/8BWLh\nXStey8UEaI8EEA00sZ5opO7JRhf0uos2GEA3776/z6x0AAn/gLMVcN+50OMS\n4xvrWukF+LoHamSDAklHJPx2qtfgAEW/i4hdn53/FpFkJ6nHXmvcYyDUu9Ip\nezACoT7nsicBIHAtQ+3SRS+Uo/CcnqPsglwXxJUyfodK/ilAH6522kmhdAU9\nZb8dJ5Onps0N+QENZgABf2VN2cNtP+0tu1E9he5cHaR7ajrPR4z+idOWqrcQ\nb9UpiqQOYfedMFfxE+mc6Q5AGPanU1J3txEjHE4Q+9SkIr7BA9m98Dn3VtHI\ng4D8D2P1YOMJ7iuwHoa86ndhA0VCN6YzrQW8tLtQJ//hFPAOraI6trpVcxZy\nsT79LkLNrTpTRdArhYpI0lOCV6Ek0WvsfkIDoTUes3cHv7Od286eunUapgMA\nqjxMPMFACKkd7qcJGjpRGokcizHX9XzSCwSrLB5dFYHlZd5JENwzwKFxwkxI\noXphBUuAuCFkUrlCrF7/fphZ8SoHDmQVLmZTU4lmEu8J4V5n1iwuTbVs4hv6\nnFSb\r\n=dqzo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCR7+JMItNJtMQvIinfyRLCFX1ZbAhCiTJyEQqjTqICDgIhAIy3mFg6gHctMiLLcd27rEDNGcKMBanXKM14WVqojtHy"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.8_1594668304323_0.3972444543236535"},"_hasShrinkwrap":false},"1.0.9":{"name":"@terminus/ui-tabs","version":"1.0.9","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^2.0.2","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.5","@angular/forms":"9.1.11","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@1.0.9","_nodeVersion":"12.18.2","_npmVersion":"lerna/3.22.1/node@v12.18.2+x64 (linux)","dist":{"integrity":"sha512-3QYep1z9zQNR457NLyht1KgaFuSfOiTIVNo+YeOqkH2VrUYEEwaWTb+LW/v870wFEOi5oUZyrgvwbMcUP2e1uw==","shasum":"3936f97176f6d642efcf4f1f06e834ea4be656a4","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-1.0.9.tgz","fileCount":123,"unpackedSize":1149851,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfDf8iCRA9TVsSAnZWagAA/G0P/2/Ip01WhoY+vqfaMiSy\ndnHMt2FAI7UiEEyMfKZ0U/ijR7jviK7fWF1AyVILJ0WiyxzVcaIl7eKqoZGG\nHo3bpAzC9svER5yv/uq109c362uLmGghtCTgfMoXVl8XAxl/q1QM8j6tCIMb\nbNFd2o7gh+EeDtUyO2Rxm8MzSkJhMkfbE9b8sjfKZXWuXp0AXaF8pqqcVKtJ\nL9jroxVWmnyAe+NyS/iiJ7v2sat4w4JsiTSkCeLZxqIMXp/jr6QIINUvJrHa\nr+Oln52NXyrGEWlGaMw24iKr2+lPMCV7+1W+RTpFBTuts3xlUy6TdcmjXNUr\n5S5gGRbnTB/AqAY5GKNjJe4j3leJ920k2bCaMzUl4ZbUtV4acVYSLs+hya/n\ncNg2k9MavApoTmk85bpc8EKzvGRjdcAMXtOxfBNQ4uLPuCR74tNxIIlEQTie\nULAyV6A90PVLQQtHVQ+5djdEmh7yDirJ0R5P5tHexhdkAn5ousAyO7V8Cx0Y\nmaa/x37Ux2+kn+9crrqfG6qJi/7FLc4PnjFRm7VsIghDqiWLax8HAMdgpwsx\n8PXm0Wd8PZ1JXIXlc9Qc2Ga0eNi9F6qzhbwxbpZpVnn4m40goYB9AjJZD39x\n9jt7qkYyBIMaBlOY85YtYQPe7PyIybjcNPWUuQNE5pOVzodOV896GiNzPH1D\nRxKf\r\n=oqAu\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBU9q4/Bc98Z8FaThcbaEJHVns+x9RRLmLfJ1fLBTa/6AiEAjnEm0WYU60gaYxEzXbyZB04kdEpTlmXgUqW9uu8gyyU="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_1.0.9_1594752802119_0.907022618044413"},"_hasShrinkwrap":false},"2.0.0":{"name":"@terminus/ui-tabs","version":"2.0.0","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.7","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0","@angular/forms":"9.1.11"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/ngx-tools`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.0","_nodeVersion":"12.18.2","_npmVersion":"lerna/3.22.1/node@v12.18.2+x64 (linux)","dist":{"integrity":"sha512-G2wfO03PT5Xh4c2iR4GIn1z0DcYoMFG3ZDo08I+tIGLwDA9qYsw98XiJ30Qew26Ahp5X3cYFSifznIkPmD1R3w==","shasum":"c1abd320455bc3f500693d0cb8ecdca91e9214df","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.0.tgz","fileCount":123,"unpackedSize":1151072,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfHy27CRA9TVsSAnZWagAAl/EP/jeUNCMWgX7j25lmQDzU\nrupBthsHfpIEG7HmlblOxKJcXRV4xVlv3MbquDO/ICobr+UI+g9r8XM4lYC8\nndqj+Hvt/wlyQ4+r3hmVsbHpkjLbc2WJha5GMDSXNAXMUh/avHoZr6TLAOmI\nLNnEbYEte5P6/5MY3ctajNjiwNWsiHCZZxCtCUDvM+XI3nO51DV8y5hkmX1y\nSYi+z69+tZBacDHWdwxFsRe6okPktPQ2AB9KfYlsnTwjJ4LOkqtAiJRxXZLf\nm6vR7wteVLV5u0XcsJB6MVfFl9WFWS3smFx6i9jhINXpJ+9+fjjUffg1PvfO\noVOWJahKfy8LpZ76WykKEhFetQ2CcyFM6/uQkI0q7ztkooiyK2A3msKx4Xyk\nbd5y7M8Ppcd53wLlNex5qhCntS99COXD7HVKup0TLyPwHcXqF2c1YyXGUjz8\n+P0skovMRzHS2Rk4IEsfGBOxcPDsMLsUHA2AXqtwyszVEPrQgEY+t48yV5Q5\nSmEKfMa3RZ8JKtEXYnkT8doc2vu6awfiZqg7HqGq6S7Uv31j/kpP8wZ3flRC\nxiF5mGtww4+uEmOpTSfL6jmQhMQcpHDscU2Ms84tPYWsYGEVuGONMvpvUiZh\nIL/eawCBNk8XXKOXiaL6bpCq3zQQLnqtuFTIbeHCBmYXRIp3pHJf2D3AAwUD\ncnL5\r\n=iyOO\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD0rpGYQU2pOSxvfeeeZHo4YHBtNXvybzSEdBwuLFD4PwIgGStWmH3kodxtyEJDITtU8hqYmEdSzPb7kO/nlAK2dbw="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.0_1595878843271_0.756640215163598"},"_hasShrinkwrap":false},"2.0.1":{"name":"@terminus/ui-tabs","version":"2.0.1","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.8","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0","@angular/forms":"9.1.11"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.1","_nodeVersion":"12.18.2","_npmVersion":"lerna/3.22.1/node@v12.18.2+x64 (linux)","dist":{"integrity":"sha512-8CWoQDhBpPl/aXz4kBp4k0gL7ohOmmgg8VFZGWberoOD2uWaQoa2GqkOsPBYS9YX608FUgZ88smxJglon/X/jQ==","shasum":"98f5b48763e63369890c0c8df50729b47a19cdd5","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.1.tgz","fileCount":123,"unpackedSize":1151354,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfIER4CRA9TVsSAnZWagAAvtQQAJxNZBRTXx64zKpDHSlu\ni27q4nuLlouOAL4cw1jWrqcw4i4cS4Kx4iGOs/MsToSODvcsURJWMbK3vRtX\nlDJGn3LJj6DHzo6JpXIQmoRX8bmJfxEw2VK7ROpn45lRBtAWWcp6TzzmFb72\nyb/zQUmicWOvyeVqh59nnxQuDKRvXPnw5/PYr0TVOpAvmXEUed6+NFa5tMrH\nOrFPRZtE1kw0DJ/RsvCEqMq5iA++c0mcwSdKSFHl4z54vFUPxgEzW9MkHr8V\nu2D8J2ZSeGOEx0EHFZGLLB6GqfyEHu1tKvYfwmnedT94339PXs7PIknCMOvN\n+5cIX8PopWkIVqInfa20K9JMkI0mnDowwn2n+PmjnxiH2+jOnXg1IGgigZ9t\n+jBS/BMQX8gkXh6Ys2oliV8xc64+7PfS3O1rs72kQuXfRz6jf1zXykduR8EJ\nYDt8EcTTZI5UqlsQCkdp8JgZ2OEcgQzseWIw0gApIXHVc0CSElL5F6WHJrfm\n58+VPAzoDl8VJ7WPBn+cSDWqKb5awTgRH0jEg4mJv3PCMGxNVhq1bEpJd6T5\nAmnkks03XXhMRtjb+/Ee5F1mH6N/Lp90tEdpAUmd201bJ6C1RgwV/v0IfzD1\nT/eufhycWVUXrERwkrJ35DlStYH5lDWX4EP2j1FhTEcmzG/0jHgjC3uEkzFC\nn7Iq\r\n=RNyX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDxl8C9LWW3FR1xSCsV+sawrOl+7i1nT9/4HCyzHcAp5AiB0nT1pHEt9f7voWYqpbUrFDSPPFr7nI3vH/cu/R6hJVw=="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.1_1595950199563_0.9361361601160973"},"_hasShrinkwrap":false},"2.0.2":{"name":"@terminus/ui-tabs","version":"2.0.2","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.8","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0","@angular/forms":"9.1.11"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.2","_nodeVersion":"12.18.2","_npmVersion":"lerna/3.22.1/node@v12.18.2+x64 (linux)","dist":{"integrity":"sha512-WIqw3PvZ06w0U/bCdHpBGOUl5pS9UJ3xJacfj2Vppx8OXaTgvwD+GN7YXO6DmJe750q2ZhznfJ9Uz0+UbppsVQ==","shasum":"8e7847befc64d16bc4d5daf888274a5df4229b28","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.2.tgz","fileCount":123,"unpackedSize":1152018,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfIG50CRA9TVsSAnZWagAAj0IP/jprcx17ByW0S2ABjvu6\nMYf3zFCVED7le8VZb/lRJ9VxgIJswRThpThSVm2rv6tSiuXD9YZ42H1/hrcp\nzDKE7fsiRa97U9OWBgSZXk3RVt6X6WI+KXHgMMcwbQ/g90QTXEdOMETxW1zP\nN4CT6kJHrco4cVvOQRMZtkCRXRdNOTWGSJSLKHJ+GhPyopaAUAolLAxowOJk\njN2mVDQ+VP+0l9MX52mkgvmdT0eFr6FGpY08E67GlhDmiqPlCRbKfaCa5u7c\nsn+vi/T2AcvqCE12xoB8vXBvMP04ZuQyO6rNFMJOpBUfpYE0lTzoS62mEuy3\nVM4p1xztBr0cLGr3yXfuOV9r1OOMz+ynEJUA4QL+TDvE7o1M1lQQSRI/dxVV\nO+k1Hb3UaNc73cZhs+PuY9XRKzZjOPIby6NHj7MalkcruweUHPU3/EeMS6gj\nDY95tBAFws87LAafHq3IwLeT8I/FHfIS3O57jxHoCB6G5DVtbObTDEAf1waa\nMhY6uzV2dDF7j1vurXNo5se2c874vphPgMg+Oe30UzHkrJ8Q1D2HaWluCLMP\nthIe2FExyD6EPiauw2pCvXxr2Ktm6Ssb7QGwrydS6Dc/0UJjjCAtfIVdQGJ1\nS0CQRCYE3P7SAnyWqpx8piwb5DxyU8u3voYu26+KIqEAFqX5KoZX6sUL9F7V\nIFzW\r\n=1+0p\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCg+RQ7GlFvQdiIGDCnpbMRhc4qoUCt2liLZhwzNitDlgIgOKve+1P+cc0eBkMf1i5jyqBs3sxdzAo1GVABVnhOnko="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.2_1595960947969_0.14885731629319876"},"_hasShrinkwrap":false},"2.0.3":{"name":"@terminus/ui-tabs","version":"2.0.3","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.8","@angular-devkit/schematics":"9.1.9","@schematics/angular":"10.0.0","@angular/forms":"9.1.11"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.3","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-JLCafI1OuNWxf3U1v3YMVWE0vdcigvTCiM9zZbZlhJKK5bby2D0qEnfvujBKU50djDVxtn4m89C18tGKXRQMFQ==","shasum":"ea8fa639f6ac8b8925832fd08d0ae381963573f5","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.3.tgz","fileCount":123,"unpackedSize":1152215,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfIZcLCRA9TVsSAnZWagAAjIMP/0UT7pbPITGfzCiz0ZgP\nXxC62KjmwvsVthHfAJTpQ5EGAAbXuylau6NsMdzz80jWe+XUrePrqZpgOvkf\nZ5JUfO1j2DqV8A9Muw4IuX5Dic818GVamy7V2SRRSV+rA1R9LvCDY/v7Ryu3\nlZYEy3rr/l+7awaHm/miuHFFUKl2vyQ6DERj0iODtBJuxv0iw5ifpa5IrHR9\nSpFFXGjJVXLo6RGSWL7Ox1N/eoLoAzpN0YU6Sygd+8KNR6d6crE2Vlwk0gYn\nU/w5EMHVqmA7avVXV4CrBF/MzZ48vwlPkb2kTM3b9otl36/1mblbitG3pr8b\nIuveZkACrDoari5oHv+/F5bKvjvJhJJVaTSKWbkr7SZq2hvSagg1qrkofff7\ncmM+E+n1mgF2/GQiCK8+/uDq8A+sCRmYNtJ8Yhg11269IxHXapwcfftp2dVU\n4ybqfKrftB9K5nePJkuog2L08mk5MR2cE+VDgzsEaZQTftE5Adl2p5Z9LeTv\n1ajOWeuh8tQ7EAyut6DlwetNVLNo8TsD/hMEQctSeUqkZQSD/nq2QYvecNPf\n8nqCnYMSl/pO24rPVhSItWSt8UYG68c/ACVdlthHzb30iLVr6EzjkZfQ/h42\nqosluDQtq3PZ5aT1ilXItKfov70yiVUOJIsezzolLp6rquaLtmfdwITJ4W2o\nAEtm\r\n=x11f\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFyYLoDSFXhm4QD2ykuWRoBjTB1EYomKdEtqIs6wfZAdAiEA8BhARF1TzzEA8Oo13DlZFJT1EL/MUWU1COAl9Kg/mr8="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.3_1596036875084_0.564740140317854"},"_hasShrinkwrap":false},"2.0.4":{"name":"@terminus/ui-tabs","version":"2.0.4","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/ngx-tools":"^8.0.5","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@terminus/ui-utilities":"1.0.8","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@angular/forms":"9.1.11"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.4","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-ryl7oC7518gwlILuUI5HoCbUlTd6DIAcHl3BvxjeM3ICq92ahbkY9Lmj4eEwZB+QmuYIm3cjprQvLAH/MJr2ZQ==","shasum":"ea766ab504d8813fa67abc305cfd130f464df2be","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.4.tgz","fileCount":123,"unpackedSize":1157047,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfIy7xCRA9TVsSAnZWagAA1dcP/RiUmOX1dipcB9C9Pdwf\n45UHlt6eQxk+uhR/UXtM48GPWFZSwtltU8c33UPHG0l5nEwAXdoLfnutWuxz\nD0RMtN8hE6B3lEoELbADgWGLvDnQXo94IAPemPJPBcIUCoa9rI56SkK7sv3E\nKujOZ05JFy2UBt335FFObLX76eclWqU4qXsLiGu3Orrtd8xGOvT+0+ci8tIr\n7otmxu1r/6hw9Z15od5iGyBD4qeTNY2y7JTgQQZUBVxcqkUNpIr+oLtYJPxZ\n7UUa3L6CfFaTOKIZNvG8ccBA2XC9c/HxtKMXwmP8lXG4HXszI4whqH9fQ4g2\nGAgdtsJfBMkj64dnsxUo2bgsJRyFodcdz55Rdesd5iGm20d8nslX79UMHsRf\ndt81a4p5PxSQF0SKG0qwy5VS0gcHVpAhqtDctC6vIUqbo1g5ATpmSvjGy2zg\n8hu32FbG+VUk4tvKZVRBEJdjIbLy/VCEiygHvg8ALCxr5p7cvayeUpuV2DLo\nF2OIONfZzoj8pdtk68SDdmD9LcmzxxP24UpPFn3xI8GS4w/MviD9RccMATxt\ntFNRYk1J1Sl+D1Hvk9ZJMHSOxuZ+P5qXdrFtZ/2u2UDsxboSqiyKxs+6kKb7\n0T9ynkIO8JMCbLiGBcjBNCIrK695mda9T3zXK3f7K4CLkymwSfFcBZNq5xcg\nTJsg\r\n=/oEZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEMCH25JY5Imf2Oj3LXiNll7BnknZPgURAJg0yMpgTzuuVoCIFNn4j7DH3MkU7HA24izns/DJlW75bkueOk+snN8313U"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.4_1596141297228_0.5215238671482376"},"_hasShrinkwrap":false},"2.0.5":{"name":"@terminus/ui-tabs","version":"2.0.5","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.0.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.14.0","@terminus/ui-utilities":"1.0.9","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.5","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-a/1wTlOOI+8dTGZPupnilI+cB0onn+d9nM7fqhoO0YUE1DdfC2dIrESurgS0xIDGCVsCBtB6GfVRVjBfc2gSHQ==","shasum":"7ee7a3cb1430c36dd9911cef2a5674425a866e64","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.5.tgz","fileCount":123,"unpackedSize":1153965,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfJCQ+CRA9TVsSAnZWagAAOoYP/1YaZhlIZGhMjKjQ92NJ\nnwQaANSaFb8YpwPpzw5Ay0cTIti9ugdVbgUx9zHPv1gtgwzvzSOuu2zdM812\n/2QM8n0bVAUXfZHapOiU5ErPS2MfGP8yS3ozoBVAqIg44ZjKbcjScXbIVjw4\ncaRawu09XfQp4P3lFrND7A3Zg+rtU25Skg4HNNO/L/gAw8r87qE3Lir8fyC3\nXRP5PRKMGNak02Kc2sX9zIFFZiydp7U765uy3Aarngiw6HZDDKsChYaZqDVb\nF3u8qMu/7AkdagkCnciosPe4oi/tWzTcX7X2T0/sCgwS02s391bDwcy/4s+W\nxsrwISlUOdWOtJ6w5d1AXZ2R63EUWX8Fln4i+2DhynUhSY0jU7UoJ0dec30W\ncwV98p8D2ZhyhD68JIc+mgQybpl8hq4cKprqhsfG6HTk3MFpPSjWr2crCvjD\nOW+aggYMFs2eqi+z+rFCjPHttxONyxpEm6e5efsM5SPvx+OnL5Mz0X/b5nrO\nToRsB+i+0hKfj3lFDYC5StM5ZRMyRLjp/eb5gF37DiXickmsrro3OGhmxwPO\nqdoV2IrQS0sH39GcDCZ5UNTZ0hQAhyGtktHmScTDSowHJVNa/rfZrPpUya/v\nW67UZmUTRocM4G5iYVplmJ4z1c3GH4yhzpaRWiVk6C6qNcd+N61K6OtRAy91\nSyIh\r\n=Yr0h\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDZPuX6Ql3q4s8R5ZhO52/FgRIshdp/Q61iiBut53Cb8AiEA8avzaJXS9kbaNYmUyZMDKwT+E7Oo06P8w9lhvlTfo5o="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.5_1596204093852_0.5356841023019807"},"_hasShrinkwrap":false},"2.0.6":{"name":"@terminus/ui-tabs","version":"2.0.6","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.0.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@terminus/ui-utilities":"1.0.9","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n**Table of Contents**\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.6","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-4EnMcUGOs4rFHm6JNpUvGMCxHHeycUyJiHUtLu5r0k+jRlSfvyYPtnqRQ84T80dlmlATjbuMO48kG9m9owqmQw==","shasum":"e1816844fd0944a56e5dd1aa0c72c356b24c79d6","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.6.tgz","fileCount":123,"unpackedSize":1154973,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfKwSSCRA9TVsSAnZWagAAX6UP/ifSJrEb0eqxWNXD311N\nr6svE+llslBTeXYm/D3/Ao2hzn8nQAxvhQB9WBrJLu9rUOD4eO6w5ALkVnl6\nw02YnkPxddM7VO/1rSLbtQ7mULwyh7WW7Q9eZ2WFPMad5YCB0laTom+lCHTV\n1Bz4hYIjIWysyM35fu/JIMzVfjfx9F/ZodOPSzxEdEvrO7BykKPstFdgE2T5\nnSnn0cXvlhz+nFY4ptTtRE8jupX9wT40ns4+MA3P36KiOEYAhMzNkP4k94il\nqEgytv7uxTaVAddfA7xRc8K/bO+lnpK/DqpuE+QrrrQkUT9naW46/W2T5146\nzf9H8Cyzi5873UuwN34HWOVH2WTRNOKfu5mDB2C6FH08TwP/A6f9UD9t57ac\nIfdSLvqeAQLnPe/10IXmfHeXxJgkjjkkDzD6LBwCLXIlqfciyFqlQxj5AwaH\nxAvEs4a81t1ekzlfCV6fj7XvTqdvi/Z0OrebZcMYDZ8ydg7VZ+zZLlMeXtCY\nKoC2gqzakqHPXMmvccUg0uqxWK5haQIUvr6Ygy6i8WsHdyU3554nfOout2Wc\np3Sp74kfrUH8lN/FRbxOp2+DRCCNFb/RbPI/Z1On+bPTK6AO0R/a1vwGUFoH\nLdksdqstCUVQ3mFJSvvgX06RoaEMi1ibq0lcRt6IfS1EHqcAKVylwxKTO17V\nBwpJ\r\n=I52C\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDJ/nvnkp6zsIazlWHYNrfrPyYWOwpyrNjFGaWyQ02B6wIgZw7blxhBXFbucH1mxQR6sdMMS0gkud9muJD2afv+8dI="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.6_1596654738450_0.04142499670959676"},"_hasShrinkwrap":false},"2.0.7":{"name":"@terminus/ui-tabs","version":"2.0.7","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.0.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@terminus/ui-utilities":"1.0.9","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.7","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-83dPNtJQHVD1aNreauiHx3k90nBSkDlO3eNBgGx1sPyhcDjrkbC2/qR3h/T+xOw71DQlPa5l8OV7juKOiDKFjg==","shasum":"0c9007e3f0911d04a47455dcbcfe16a4a2adbdf2","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.7.tgz","fileCount":123,"unpackedSize":1155461,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfLDrjCRA9TVsSAnZWagAAbQ0P/iqu/t8yJuB0n8IxZFQG\nCuK98hgz5im6QWc090sdPRQwoelUVqmjD6qTHMlxJ18TC0lJw4tAcVv2QPaO\n0LYo58TQLlQXLODBqwP5a2rD25ciIYQetq6kCk4ipo1PAKpdEuKnONTxX8C6\nxhuE3uOumucggsB5O67JmmiR/q0huptsuo3McaSGjAL8qmUfmeDl11KqM40s\nCCO18bgJRoY5luqC3XUhjSGYI41LvfTPOFYsm90uY2yOzkgkGLSQj0spsafV\nogZdTCXRXXX7hPxk7BCNP25+GTf0klXqh1rgJmngVGmojBjFe3vGfB+QIPtB\nskvNIzJJLyuqTQ1BxlZKAOPwISdzF4yu0CUrOQ3L8Zi72zxjVbwwyLEVfdYi\n+CEzvtQgvmTNQX+ywp5NAJhxyGU1gOnXZLyYHNgCdlEnWr3NRx65u/wAXhvW\nY9C8laziGq5m/1Jy+eobeNB1XBGhPb1/5NBcfHp9kHKkgG8QvWALiO2m7aPO\n4C0k3h3JZLbFp86qksrZJtjczFvuGo82NtTenxw2Ps+NmZhq0VwGUrvpwr1o\ne/Ele/MLSkN2u2cXNbELI7OCZZFL+6WeZhTQjlwb052VsspUXP9VQyFx6gXu\nOnpnmlu5hzIX+JXpYX6lu5CCGvfgKGoMRl7PTDHdahhYAXK6npFIcMu7hTve\nulNy\r\n=Kaov\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDqFNhglO9YxO4jf/9LMbgNSUU0XSSwBVGNDhsISuBiCQIhAJJN6RHuvU7gxWBebvoh2YWQMmT/HHX6/NqQ6t4lJBJg"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.7_1596734178543_0.3537644631829284"},"_hasShrinkwrap":false},"2.0.8":{"name":"@terminus/ui-tabs","version":"2.0.8","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.0.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@terminus/ui-utilities":"1.0.10","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.8","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-/MIpyZs7WvOhgkL33x/7L99Erd9DiZiFx8uv0B3MjsM0xuq+n9C2FlEwvlJ586aFu/ZeTpySxeFWAnHN7jHrbA==","shasum":"bef2589c2e1c881c1ad5c30fae4331e567a2d7f1","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.8.tgz","fileCount":123,"unpackedSize":1155653,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfMXQLCRA9TVsSAnZWagAAdWkP/1h1/Y1PvY84jugwBPRC\nU8DfsZc/qWoCkulFyWmjKzVVuE+HN/XRfELG5aK94j6GmAhplQ3OWAJpa/7C\nxRcTD5Iga9YpeUEBg2kGzbMdQIIm2mELJVAKb43OIddpmuUidzHLb12w2z/7\nRR7lYX2K/MuHt43kZGo/O9onLntb0qN0QL13D/TPAZS8PA5bBzQxba10IFDx\nW69JldAJiB51Ibik2jg+UjJirOj4wxP+SRM+HCJ2uAuVoHqUA2b/1jSp1INu\nqgMnRjJQW1i7sCJWAxiFR9RGVClaFZyIuxmtAr0SFN/kEKAFR8xy1Mi+fP2y\nu33IubFy1lweyim/Ue7KNvfLPKDqZxzmXMYDfQypD6kRBb3Nw/SQXKkkvFkr\nWjXIZWgTBMuyALLktcfH/smewYBMjhtRQ1oIBA0po2jA7knsuW5+obW41lx5\n/FkA90Sl7XlBpFuqL3yJUqC/wQY+Wo4H4q81qzspV6SEBftZ57ZHRFogoWy8\nnIJsjYhvbrWDcNGlRu6yGi9BxCd1FeyPigfochs5RutvjDfRe/PVcD08fbur\nRiM0ZGwohOkalSzDnNt17zL6qrE1LuLu3QNTnuTjlE6em828DjWkmOK1SM+x\nLLGMBOsmXa01gJQsws3rjKO8F2RXu2MYMAAZVtZYSo1I0WkCLiOid1eQZ2wF\nKHUH\r\n=htRS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCaeZPyhobULl+8Up+p+WpmjyyqcaZc1pfw+4Obu2doWAIhALHt4C3efmxRNwF/EEQfmnZvtypF2Q31fFxA6d6aQX2R"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.8_1597076491032_0.02594313838654916"},"_hasShrinkwrap":false},"2.0.9":{"name":"@terminus/ui-tabs","version":"2.0.9","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@terminus/ui-utilities":"1.0.11","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.9","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-f8vcF4q5sY3XGC2NPzIviaok5pXvqJQl16yRXbQWR58tzNZT9zvaVQ88CjHtfeYCXlNyIwAUBdgqlAkDG5MN8g==","shasum":"77784330d1cd3721853bb881e2754c576a042fb5","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.9.tgz","fileCount":123,"unpackedSize":1155844,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfMYbjCRA9TVsSAnZWagAAPrEP/3NUoPtQyzxO/cr2VrLs\n0qECSN9RaEjNKw+I6jtmi1rGNlJHbV1RAo05f0wnqe3BwQdmt9ivbQoSCyrd\nClkbajRn7KKn/6cDkCpcxGcPocWvtfeu26snX800yEGjXooW1bmrO/VTQRs1\nr400Roxo4a5DP89POAbjGIcBeF9oOQpWHIpzOAUy+MN8EB7QKZ1A40H514B1\nkogIdaVrpB+yPCiHWgYbeEZeAMobNP2n+t1077F6QiJxhNhEMmBn3/R6DaSv\ni4wMg1FW4zj0ys5cllQCWKbaCrPmt6ES4hagXrh5ZtNbFg3EumQ0xSGMmyOs\nnsBsGkXeXheOF06udaear1XxZbQuZRWF5tMKndEf8sFbI7c6YGMkcsyDfG3Q\n7s5xYjNcTLLTOpGse+FZek30r7U6jj2VJHuQawLtiI5PWRZux3/+eLATuMGT\nekTVfFoXQZY935qNVx8cBzug/agBLnNVi2A1C3iaxW38GZNY2JluYtRUbOwU\n+1btFgCcwIabeZnzfB1W4e52skx+RmSEAncbWsnT2SVbkivtjc1WEZZMJ7Oz\nXbbjpBboXdG6olt4rZsggHdIplhs+TRH4HHFZLj+2htEhC6KSyKnodcu3nAP\nkk4kc0Ht/s0V2e8h3l1cjlAUDRMrhYlnzTYoAruPpJf/nWfnSLGIrEZLlRlE\nDO10\r\n=oCEL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCNtQDHRKzuM5W8kvBsfSVocj9b8wNW1bWE0uzGIeYKXgIgP/Y3BT6UMNZHhXvkEb+3MTtvvYBeemZPsoZPu5rrBII="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.9_1597081315457_0.7447286848951722"},"_hasShrinkwrap":false},"2.0.10":{"name":"@terminus/ui-tabs","version":"2.0.10","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@terminus/ui-utilities":"1.0.12","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.10","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-Al6m8y5Kce90t26cuKh9AtEylsLXfIL412uGlx/6F1CpqXQOYe6VwlUnPOSPUcLORO3YSASZYLW85ujWJocFMQ==","shasum":"d5672f2124e91ed5ab77dabc253cfe650ce1a3f9","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.10.tgz","fileCount":123,"unpackedSize":1155964,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfNq67CRA9TVsSAnZWagAAt+0P/jw+3RpZtT0wygDTqdwg\nZHFgxQhyKm+tOx4RNC/rpQ17xd7509VL/9XIwfqY3z/2XCAIG77eJ2g577jU\nDacBimtv0hhstk8JUy1ycBLnajTlNaDJm5X+ljqfnARwejxw0y8GNjbdY3Ib\n1s6bXry/QVjMiQLk+DiB62jEcAvHYXARV+9Y+riZ2TYzwKjSsjeVz+X08Nfa\ncTncIgVrnEpPTlP1VmAJvfmQyJWek2jqmEQotZDjeKkm9xwB50Hez0qP35Uj\nflbOnDEAn/jduKAvI38A0t1VBHsKMNJaddpz6lnHqjc/7b2TUXof6XS/6HB3\nQdMxLtbCq3msD7ddBwxqDLaTRKgp88j3QYOkux1q9vPwmZ5IIH7cKXVl34pJ\npMDcY61UM5ErhEw+UW0Nkb7LYLnTiuVR1WFyfTOpw7posDUIjt2GaUigAEth\ndA6PGRMb98/gBXSA78QeOfML5njXr+oHXCnkwhxdXohZcThHdaZqgFtksJre\ne8+eDtcfWVTYKJvDoW3+nstv7ORMtfxF1bz3i/mTo3msg9flS+Jmt4EkCd2s\nwiKV02ouuFHqnVq0RkiMe0axbnpXaa+2AWElTb/j73f7PAgPvsKN/7iBRbko\nJPvtjZRvFmK2USwlAqIuiCIahPXcxMoLiRZo8Q4xskQhLg4MUdrvoBEVD1xg\nXz/t\r\n=enJ2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCD62gKtlH28+HAysFkOzCERKPZKg41R7lXerb3ckfEBwIhAKCm1V24q1C3uLBN/3o9vq+ZctOCvugzEXIFP6908+gj"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.10_1597419195390_0.15872158850903628"},"_hasShrinkwrap":false},"2.0.11":{"name":"@terminus/ui-tabs","version":"2.0.11","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.0.12","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.0.9","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@terminus/ui-spacing":"1.0.14","@fortawesome/pro-solid-svg-icons":"5.14.0"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.11","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-48nLdOuMxjgZcidYCxDdLXmC8eb7TKWJ2kbawgFdLBiGxC8hDLefDdJ+3rPG91l168QqpYZOrLTRVCiH9Km62w==","shasum":"7361e1b01b3196894036bc883934ad1f6073eeff","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.11.tgz","fileCount":123,"unpackedSize":1158973,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfSRACCRA9TVsSAnZWagAAPvUP/R+G7lmQltnBeiT6zUcn\nlWOPTL0QzLwHYOB02d7ymLCmwhNHdphyioBGB/PQH/KKsenb0MivBp6lOEpU\nGKi9S+TlXQX48BqcKIugzNuuVBFyMYspzs4DyEO8bGrPvE9Oks49UWDhDcTf\nknmqSGm9I6g6KoUIZO/ub5CKlhJvuhI5XlrHbVA2X2tM2LJE5CbfNEy5SJ0j\nc8kcQUlOvfxJBY6wwB+LAPaQNvosxeObATCE3Whoj27hTQn4ZswRrasPsDqs\nP1kmVZnFwVQttdIPOMYQZlsQdh0cRw4tp8ZBcWvwpVj2bg14c2awbspfPjaS\nV8sN5HXIqPtvHvfaISYSW14EwPNA8Zpf4ANqCSLZsOHkUiEYkjqqnyIGeNcX\nffEdxfIzUc2UUWeojFkFpCZcxmE0Q8ntZBpkKa0ZG5CY8H9zombpIVC16p2V\nhoWD0sTv26SBqj7nfeUy7ZrBrhz2IqN5DNtP3gXsokToHq7nY8gZZl0Adx2T\nL+pCvgN3QH3m/i9nMwMjByd6pQVp7vdq/4QLava67Yl8CLbxgUoTLVYNCg2h\nFmIkoEuSKcCb71e/yLomyedxrtBifuUIzq4HOgxfH2mq1HFmf5EefjIw7ZVc\nE8NF0eTcYyDWdIaQ0neOyZScWexPSQcN8xiDIaOmF/VZGmB/fWJ7XB2RtarT\n8FU+\r\n=h2/6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCPNLBJNbr63e3zRtwxWn7+RyKV48cDuxdJ0o95V3yWcwIhAK3dukPz+gUU46X6F8bDs+U7J4VrWIF9LIvM7Rud7EPz"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.11_1598623746216_0.10708789174791256"},"_hasShrinkwrap":false},"2.0.12":{"name":"@terminus/ui-tabs","version":"2.0.12","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.0.12","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.0.11","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.0.14"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.12","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-KbAJEAEOcmzgxR70/ZJTgicExZpRlyaTCYwj0L0URhE1yJC8nqJQ5cJQ+HhG1SvT2aY9a2oHjma7zNGuDHrt5g==","shasum":"37ecf56edad40d24e4d2b79fb3691473db8c280e","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.12.tgz","fileCount":123,"unpackedSize":1159168,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfUXkuCRA9TVsSAnZWagAAmi8QAJhdMxWp59aok/xR8lnJ\neCW6bnMXB9+tBPsKhHwF0HBF4uyjP69+2fDlkgy9MNNBuw6ZQgu7lgR/zeeV\nUFrtIpQlDwH4z0oOmid4kJNAGt6KZ+2vmdkKo14mibw9oe1sBFdSkm4jYom4\nJSvWRYxbj59XVMsA0dYHiVlG6kPwYEeTB46jvwhqsjnlKYCjuvwhLlrXBp2m\nVd266k99BC33i7nbHkA1MGDK5Q6G3re4P88hNQSgnRTg7GkSJn0aNcCNyuzm\nSmFAV/Jq6n2Y4XoGFAnFsdeW2VC+ifNAFBq5GmD5rWTGfXGgts7K8qqXqqzO\nyzzUoNIWwd2a6pOoS5CZAiMI0v1/GQAxQAGhbVYP+NGsxwg3cGbSG0/IhiA1\nwk8o873sFpdBZ/ISnZ8J+wSkvrhVB0PAzLtcqq8V6GNrTVdELqzG2deAmUFr\npJZUCbjEQyB76LRHL1xOUh9cpnFhL2WxdsvHThOI/xMA/nib3utUyhcjSqRk\nISndPTZcdHB3ddchL9LW9YWR2eWxDfPXOankkdbV/Tvb7+K40pp2er2Z5VlK\nvgQH8G4N/XDHEq6J/1mBoCobpgx9+bTNBQXFIny35L6QZV0oL8rWS7IzM6GQ\nBcMxQ8VWVE+M0ilJuOB5xV+PhVk6vJezKjf1pRAFP3wD5du4EIY0RllXQ935\nI4Qf\r\n=Kpm6\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDwpP74aQKFaGTuqi6RvEQwHcb6DJuRVYoOQ4CK9MG8kQIhAP0QIpAcLNYSoAABVTDmIjvZB9weNxa51kTSjGKmVzgd"}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.12_1599174957788_0.43420174884729557"},"_hasShrinkwrap":false},"2.0.13":{"name":"@terminus/ui-tabs","version":"2.0.13","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.1.0","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.1.0","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.0.13","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.0.12","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.0.15"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.0.13","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-Qnne2vvwvHQhPVLRHglDZwBXC5Y8qzV9VDl8+xTd9EpTGzb92Qqn4k5V9SLLqZXmJVUkJYw4iIwNfWNZDqpk8w==","shasum":"6d0d71527d3281feda3fa1342dc174ae7d95b0f6","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.0.13.tgz","fileCount":123,"unpackedSize":1159384,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfUlcfCRA9TVsSAnZWagAA8BUP/3re8d/lsibkJ4a6Hc5q\nPpfc0q7hUVeJD4PfOr7rx9Xl6yZO27Q/eKZc7uhc7/YTBIYrA5ry4qMEcCFS\nM/s0cQQWOYgYURAgMC7KroFNBfdUmWWBulsVw8apqTQiIDR8Z1BNgBzWuY1n\nr5hkoQTs4DWj0h/QZGxw5JcU7Jyz4/G7Fwp+kmKkgwWqqej88kJBmFJTTrcL\nWRpYGJoNrThTnb4NIhQQXu1TjfCH6glPEyAv51HMDgDBBSZvFd+Hyvs0fda7\ngweDWq4nm6nY2OvzCCkBHELxNfeRGtH7PObNExxcqrE6s3LFHHqt8HvP8pTP\nTGRnO94bXr8Sh/nchGOJaZU6IGXLzeGPl6gBsMf2u7dK6CgZ8X9jfqQNffp/\nXQDVjaVygSOuEqnup9u3LjKZCRJhuwOc7+j+Xt59abbamKwrXCq9X+DFEUE2\n8sxNAiHYyRSlndxcK0wpMPKIi7brUEukCwhpjWAh9BbRmXndreJo7QyZ5Ynx\nryUpPT0hrJ8PSw0hZQVJ5bK79H/F1c4IhfdxlJY6Zw5NK8zfKBf1QNRYN+T1\n5N3tzsBg704mZ5RFUR5bgRfaVrze4s00ZyCvGSusxahWfISSc/VpcZ7hVH/V\nD1muaO7jiEQB7wr1xjHlIVyLba3KaEYb2I1KxDWMJ1O5+PEQX41H0mX2wzqQ\nqcKu\r\n=EX21\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICa3cN7b8vZ4oUeotxQGfu4hJ7aZPAKrE3WyUBjmI1lnAiEA9gcYcphDoREqsyD9684lRuYOjcQh1sjqbV0bLjN81gw="}]},"maintainers":[{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.0.13_1599231774813_0.395802379759576"},"_hasShrinkwrap":false},"2.1.0":{"name":"@terminus/ui-tabs","version":"2.1.0","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.1.0","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.1.0","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.1.0"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.1.0","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-5WYHfu9OZ5NOasCd9+t7c9KmjDgOQld8JW14l590LMMdIK0skwRkfedZySOMLESId+8OYdb056kLz5/bS3TpQg==","shasum":"47afc241bebeea6da775559898672e939c0abe27","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.1.0.tgz","fileCount":123,"unpackedSize":1159878,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfV9MaCRA9TVsSAnZWagAALSYQAJp4sAiA1ZTeLv71pFdv\naqcRhWoXXsZ1kX8GvFqT7yE7FrKTJkDQAnDap9cr99e7lasazHd+q2Mw9EtG\nLCJgAxEgXm3dlJqrC/kMRCaAiey/sub7ea0J1ELUJe+K8oFyKw6HvkGF68Jg\nxUbX26knH64i5xM4bJ6ocWN+N4XgV/1Fi/LpGVh0fmhzGG8fC5yWnHov7nRL\n+cbnutV6xh4Oxh4fBzj2mHFkI1iwS7Tm1TZxvEmXj4f213goSDp9FlU7ODtt\nP6/LFjbBwY7FcNVTgs6xE7mvIqh7lw4/BXda90Uq9iSd5ydjPYf7Fb0YNt+E\nmqhDTNThT+vNXaxF0qwvx2k6aDCchCOIeIl++Dw34q/i7CuzuZRz4796Y0t/\nvPp5f6XpN7gPmpX7OmoeF5uNYlCNFZChCktya5L19ZI1K3QZniR/fxvmHlQP\n5FQBLwY7k88rWQjC+iahhsKeSuDlFpBPb2KIW4oY8TTF4FD262vzGrOUiWVD\nmCdZF6b/gI4YRNF1U6NG0T8bgM1wnFKV5tD/Km6E1G70TwNrPprPCmPUgfcc\n/dn4StRunvftoSBEGtINRa/N3MhcEWn32fsKsvi7Jvv5gM7Si6VUtNmRm09W\nfLZZ6W0UZcYviY7sQurBLm349N6S88iP+Si7VFdSyXkrmdiiYfZhx6ntrAi2\njBQh\r\n=qppY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFsOWedM+mv94ejWYSHY3Kd2//rnxt4Vlc+yoJsiOR3uAiBk+026peLn9g86cRFBGELAfM31WJdP5oM80H0b3ZmFoQ=="}]},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.1.0_1599591194124_0.7064894275128535"},"_hasShrinkwrap":false},"2.1.1":{"name":"@terminus/ui-tabs","version":"2.1.1","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.1.0","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.1.1","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.1.1"},"description":"

Tabs

","_id":"@terminus/ui-tabs@2.1.1","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-EIkqo3uBZRvZRN0WwLhZQDnjudvve9mJA63L3JyOYbMbLWIYXageigzB63dbJp+i50kN7SczLPTU4ZVolkcAZA==","shasum":"f4bcc1d3dc500e5e0fe98cd144a89eab6ac6dd90","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.1.1.tgz","fileCount":123,"unpackedSize":1160069,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfW7WGCRA9TVsSAnZWagAAtoMQAIqsVg5+pgTwcj9wMk7Y\ntUzRHnlT66ISq6ndBC+spYeVFXF2L18Z9iP0UjlhAxwoIX0lgOipQsW5aESa\nCWqvnXJ5H2Motv6eLiGkASoIlZDu9tSqmlaE70DduLAsMfDP1PM92rtfriss\n9rIxOEy5VgZDJDeQbsNd0gdyF9A4yBhoZ8f/jqrJIo/W5DmulnWBXMmh8FvR\nII3OBq+yyI30hwNHRYM9vEfUyMuljmVox9MudAGBWTAS4AXKh473Uz3XiSdi\nPEUo6TUP+FCj6CcuEUiOG3RqRkE/1AujC5PYfX3k3FsTs58Pw14a0E/uwrUF\nkn1C9JVYGPf7sqtYRddgB4c80V3zRFSwa5d71M6mJs2gpe20mj713mnUgaLF\nvBBCXmRseutlb6/joc4o1/mTOkx6vvOaXYICVbaWwRoHFRAfphsqBb6XZ1UE\nTX99ZyNQE69vz5vcJEPwCaZMhG+t6j/v4JSbKCWhPSCvlkux1cjhJEIPlb2q\nybGYEy3RApwDAlaKfd2dBQCQ5c+qOTjjwClDeakWCOTxVNF+4ChSLmakA4Vk\n7Ojh4+/07Ec6h7F1WFFQeJ8G+r02foKRzX4izgO5Cn2qGf5ZUbqfCZZFZZRx\nuRRSTiUkhLxJ0qmnpdhARlQscMyz98Cgb7qIKkSSVh4LWFUmgv+H3/MnK/DL\nEF+K\r\n=f1LI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCUcrgt9E/WPObTlAfXFMzMd6WwLrlO7PbdR6uxLWg2KAIhAIpD4JfS7fSw5+cqB3ACZsOwFLqHK9NjrOagGI91QNTV"}]},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.1.1_1599845765476_0.20124252172449864"},"_hasShrinkwrap":false},"2.1.2":{"name":"@terminus/ui-tabs","version":"2.1.2","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.15.0","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-utilities":"1.1.0","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@terminus/ui-icon":"2.1.2","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.1.2"},"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [Packages that need to be installed](#packages-that-need-to-be-installed)\n - [Modules that need to be in NgModule](#modules-that-need-to-be-in-ngmodule)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\n### Packages that need to be installed\n\n- `@angular/cdk`\n- `@angular/common`\n- `@angular/core`\n- `@angular/flex-layout`\n- `@angular/forms`\n- `@angular/material`\n- `@angular/platform-browser`\n- `@terminus/design-tokens`\n- `@terminus/fe-utilities`\n- `@terminus/ui-utilities`\n- `@terminus/ui-tabs`\n- `date-fns`\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### Modules that need to be in NgModule\n\n- `BrowserAnimationsModule`\n- `TsTabsModule`\n\n### CSS imports\n\nIn your top level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@2.1.2","_nodeVersion":"12.18.3","_npmVersion":"lerna/3.22.1/node@v12.18.3+x64 (linux)","dist":{"integrity":"sha512-sfH/6DmOrAEgGAj3ezDPTxmZv45sFx+exULmn8wc6F7b+YH3Azd5yMdwEBwZycD3/vOglyLGhkdV6yMJmRc/Nw==","shasum":"60a86995fd27bb700cdcf55842a44cdb7f9de9ad","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-2.1.2.tgz","fileCount":123,"unpackedSize":1161028,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfX6rTCRA9TVsSAnZWagAAuWYP/3qiMjtavXjmsvOSDqYf\nhdvB4WP9ohHHAgwYeeX4h+HnWM/BVdD6iKwI7vOOHQizS6zoFQE5QkI1wSsq\nLj95LGTWzgHu+G8wPDIA6wV27qhgxvt994DDxrELOdMTrBdx/o7F5ohkIsWB\n45Jj8EH4wb1b5AA43rUZaG4OsYdQGgM6cDe+L14O/MHENpj4fVXBfFqA93vT\nykVWSkecWvgga6odIvprbeGyVWzcYM0nygM1oyxXFOJzc0iBRdQCE4ZbCBc9\nQnSIwx78CL3nQx7MX2NcJLWBaJsKuWPFDh27h/kwLh90AUkcRPOugqXP0wcS\nFur96Ggf3nuFVYR1CXmLdCQuXyidnowtDH/HsPtz+UYTn6DaJCuY4wKw6pYB\n3XgB3F+S0BMPVZcwKRVpmwCsgTiayRjZcNzZW/7oxXFqTAaWpKHxbC15oM69\nVD8cqTjcp1qed/NrJU5rrk4IQnjpIBoEFyVbXIrnplCj6u861xsd6AruV7Ej\nUoAWEe/HXhblO4JxwztmSHw2vtPZz9tbfQ9jauALLEaq1HoTZFYyZoq79SVS\n/4wAjjvu1aFrjsSxWcu0PkMneNeyfgllYPZ48fogJXiSJ5L3z22TpnZR0NNr\nJuGls0bFLZessMV8KapfXxJizB37jXSYl/yRMV4U+il9r8X8t9udKcRir25w\nrXKi\r\n=U7Z+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDSOxxeR7V1XdzhVZDDFtS93feUc8jnl2ePcksdvcwgjgIgI6h5VbqnQKVCPIZRVH8mS16g2xPzRT1cLcYRVUwCTjA="}]},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_2.1.2_1600105171324_0.6230639756752834"},"_hasShrinkwrap":false},"3.0.0":{"name":"@terminus/ui-tabs","version":"3.0.0","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular/forms":"9.1.11","date-fns":"2.16.1","@angular/router":"9.1.11","ngx-webstorage-service":"4.1.0","ngx-clipboard":"13.0.1","@terminus/ui-icon":"2.1.3","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12","@fortawesome/fontawesome-svg-core":"1.2.30","@fortawesome/angular-fontawesome":"0.6.0","@fortawesome/pro-solid-svg-icons":"5.14.0","@terminus/ui-spacing":"1.1.3"},"description":"

Tabs

","_id":"@terminus/ui-tabs@3.0.0","_nodeVersion":"12.18.4","_npmVersion":"lerna/3.22.1/node@v12.18.4+x64 (linux)","dist":{"integrity":"sha512-KztrfGHTbEQPtqYW6K4zoGewRvJJz4GeSfHkkttz6fpRG8p2/IRSrP+tAvWbizyf7bOFr8qIASP0bljJa88bMQ==","shasum":"5b834fcdcf59704bdf06a9ff1adfe848b5783fae","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-3.0.0.tgz","fileCount":123,"unpackedSize":1151322,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfe23GCRA9TVsSAnZWagAALRkP/1L29pGoCD8sQajWf8jp\nuB/yIRK7L7Cby0ORiX+gvR6QlB3TnxJEmG+CwiphUny6AngvrpHiV6+ijHv8\n69uyS/eFgHq+JsfJf4mavFV9NJeB5hdT7XvSDBDreUhiKbaTMbHygHzi1SmP\nlYnACcfr2tJKPQgNMRjfIn+gooWRBdDWf3KWpGwyhup5LgNfla/LB+kCOXTN\nbh9PtV+EwwAV790jC5jAFl3uugm164RhhElHfBQn8+DqBM5Ui2hQJwiTe4JZ\nWX5FcQbQiJ96OnpDbE0QsaMm0Gmzu5SAtUOWiVybEBPhoCfmujTxcVm+NAUa\nR1hb9KoOFD5tRMIomZxbnzvm1W9GmTWJS4b9ywdlWNP8TrThYnfVMK438beL\nmLDRdNbQtM3ATuQaAKb+2NH1xrKwuj6RmbYEjkv2QkBEqr7mc9GWUm27nTpA\nrpGkNG1aOCtYde5LBJnOFprsM0hz88TCWNM9Oa9HM6J74Xo8Cas+km/dg/WV\nADThlFtEfYN+Aj8nMaEB6DfOw7NpRnyPeYzCAOF5ZUrWJfCEP6VwupCH8uKS\nvRIM22zZW86lyCVd/C0NBqquLmEzB0YXZQA1t3wHmIu3+aRDFVbDln0pFCNe\n/R9DSAfhPp2q0ba9Z7DYaAgacKXJ37ZYn+6AFlPDw4Y3iaMfoNRvoroegbJ+\n0DhC\r\n=NhA+\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDFS/28S4ZXFaYP6kuTyrMiUgZOW8rdAUjsokR6tN/gjgIhAIqpBw7nKHPcjAj1762RnPrGwwiUGPRyXnjzWrR89XE4"}]},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_3.0.0_1601924549944_0.5941102399281755"},"_hasShrinkwrap":false},"3.0.1":{"name":"@terminus/ui-tabs","version":"3.0.1","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/forms":"^9.1.0","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","date-fns":"^2.16.1","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"description":"

Tabs

","_id":"@terminus/ui-tabs@3.0.1","_nodeVersion":"12.19.0","_npmVersion":"lerna/3.22.1/node@v12.19.0+x64 (linux)","dist":{"integrity":"sha512-2NWDNr0TcjB1fPs3I8xVk43E0Cr9apZNWlvN2ZVZsdql3gPSgba6PwAg4UYTbbACH6w1Fr4QDg++dwaPORAwxA==","shasum":"a2605675740328d931aa389f61bee8781f9cf9be","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-3.0.1.tgz","fileCount":123,"unpackedSize":1152176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfq9M9CRA9TVsSAnZWagAAW+AQAJYY+672GKRe7kYdxxaJ\nSd3w1cQm4m2Vqix+FvGK+dCFPPS1WMPQPAolma7yvoTfxNUpdUfl26cThc7z\ndQm9VkKrLRyZ5+mq3eVjYyHfPG3bgPV+vpSXliR/muG775FkCRMmXdg8Ucl0\nGcU2Kdr3QrxHkmVIhkNonAkNZysuDbjdjb9FiI6rDHwfNllWBoBeyTuySNrq\nuizhswCZ1gAHy7It5meSinwFnos6cElOjwLmTRJ9P4aAH5t4XnnzXcukXSXd\ngpLkDKgfLS7fyqovXh6fklZyQbX3Q611g541To/37ajnBnvTsRLP43VhEHAt\nmShZhEGi1h2V3cREggB1Pj+bWIIG4iHdTDdeEIuUKWj+WgAnZuYUJov43pds\n+68XjrPiK4oK9iPlNhR9kD9B9PO8vMCAuthUqKUWJJVNIjBIKjYQcdTnRpne\nNzY6R7oQETgqaFvkBkfr85mWT0gwIJkJX2lUSWx4N0TccW3oEe15PjgGgfcE\nPg5+fBiUO9+9xyDUsbTyOu1dV7K8DAUtdMjqqCDVrFU8Awx7ITnxcIs9YYV2\nphaO6XxDx3Mu/lUq6zNKrhsLOdHGJZG+bPBM+M/13moLC4Pb10WoYA20MkBp\nunmpRa/qN4F7LG9ObxnZJ1n0RjbBXs7yaGhPMfx8qqpPkJ3z4iry6jolMWu5\nEGcG\r\n=8s4S\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC1ch7l59ea00m5spsHRXR2Eh4uxcQ/2KB2IZZNdXpfwAIhAI9S3nBdkFLaV9K4FZ/3uPhjeSEAyzeBNh1bRbop9tg9"}]},"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_3.0.1_1605096252879_0.786506252379187"},"_hasShrinkwrap":false},"3.0.2":{"name":"@terminus/ui-tabs","version":"3.0.2","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"peerDependencies":{"@angular/animations":"^9.1.0","@angular/cdk":"^9.2.4","@angular/common":"^9.1.0","@angular/core":"^9.1.0","@angular/flex-layout":"~9.0.0-beta.29","@angular/forms":"^9.1.0","@angular/material":"^9.2.4","@angular/platform-browser":"^9.1.0","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^1.1.0","@terminus/ui-styles":"^1.1.0","date-fns":"^2.16.1","rxjs":"^6.5.0"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm5/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm5":"esm5/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm5":"fesm5/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"dependencies":{"tslib":"^1.10.0","@angular-devkit/schematics":"9.1.9","@schematics/angular":"9.1.12"},"description":"

Tabs

","_id":"@terminus/ui-tabs@3.0.2","_nodeVersion":"12.19.0","_npmVersion":"lerna/3.22.1/node@v12.19.0+x64 (linux)","dist":{"integrity":"sha512-lyRgYZxFyymXSChHsICi4DaWa+ycq2xP+NSHSC11m5uIR+P/teYUfwERBr8fZ2RIQrsOnWzUG0I1DZZ2VYIMaA==","shasum":"e1c24bb0781b5f5ff2e580b756cef2544afa6f10","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-3.0.2.tgz","fileCount":123,"unpackedSize":1152558,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfrB3gCRA9TVsSAnZWagAAt2YP/jv4c1ql8xOs+DYpbucD\nL9GQXTnQakynsskQk2oMSNvc4uu8QnidzCShtBA7riGGeAs9dJeWAU3688+a\na2HDwaYrrm6rXSViHJlEvFxx0ip4WCF0EFkWDgbPLfq8l5/IIHIlGs9uy0N0\n6oRgcM3uUH7ln1bKU5IKMJybhgtzWMYjGxGuCgjPKDUNVS0N1ftvatrbkZB6\nSfiEGF6K+P9OdzZYmzQ1s/1k6IWjcCElk1DeuVq2PB4gdSisci83yptSwEG5\nvYus3uk0mhf7fPOAew6VqjxM0reIa0FnijriXkxdvZlnGGMhrZLdx1P4ct5F\nplzZk5zCjQWl8ityiX3vvJPDfGozAQ6abAQHuDfYqe37WBH4s85kiUPusCIJ\nv5s+EnJM/L+gBnYod/jW8K257hLeA+E4mfNWgQwDw2w09JyFV8ie5mttPsNl\nCrRYph+MV0ng7VJbaszDIeK2gZVtm0gNHwHbR7i8fpPmL1jdSLTOD6QwwIcw\nXyGzoerrzhljGX/cUt3mkk8sXyCHuehGXkKTNJUkwheYPggtEPVvBFrrpm5B\n0kO0FO7i/p8TdnBlPnutu4z9jrz+oGb8wxrCtnfMeccfPA8nJi0HfeFUh12C\nlzwHSq5mDirGO9bNC1mcILlC4peF2q/VHyxinEkLf3Hebvpat+X10Z/PMEkJ\nZpDf\r\n=9ChV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHMGYXA9Jt8PsBu+U6w1boUcRgnf8QXpHxxzLdImCaD6AiEAno4iZKV4ymsolAACgWDRxAqskm1Ht/rrjwA7g8Qki58="}]},"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"maintainers":[{"name":"terminus_devops","email":"devops@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"benjamincharity","email":"ben@benjamincharity.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_3.0.2_1605115359691_0.8630846557695906"},"_hasShrinkwrap":false},"4.0.0":{"name":"@terminus/ui-tabs","version":"4.0.0","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"dependencies":{"tslib":"^2.0.3","@angular-devkit/schematics":"11.0.4","@schematics/angular":"11.0.4"},"peerDependencies":{"@angular/animations":"^11.0.4","@angular/cdk":"^11.0.3","@angular/common":"^11.0.4","@angular/core":"^11.0.4","@angular/flex-layout":"~11.0.0-beta.33","@angular/forms":"^11.0.4","@angular/material":"^11.0.3","@angular/platform-browser":"^11.0.4","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^2.0.0","@terminus/ui-styles":"^2.0.0","date-fns":"^2.16.1","rxjs":"^6.6.3"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm2015/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"description":"

Tabs

","_id":"@terminus/ui-tabs@4.0.0","_nodeVersion":"12.20.0","_npmVersion":"lerna/3.22.1/node@v12.20.0+x64 (linux)","dist":{"integrity":"sha512-MvjS8cX0eTW/KkcARzotAjlNLRyu/Mq5uZ0/DGWP0IOsrhS4kQb9fXl9+fk71Ju5FBghEc5aUl/tsFIIIskEfA==","shasum":"82c14f23154bd5e74ca5b497b27e2e0a75db03df","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-4.0.0.tgz","fileCount":87,"unpackedSize":792206,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf2hf7CRA9TVsSAnZWagAAeyQQAJGafsxfmQ+PR4LOgNbK\ntbvCLL51oNzd30D4bv2Xwn+kCgde+UQHAd+HByxt5Tgb/va361Az3JIrrkXl\nnJ0nuqep4UcPqnGxYxMPNPeeYp8WwdwfsObRL+YqlbF+uE/2YaEHm8mVagmK\nf/Ccugw7fh9dw2NacAmrLRpPbdoqkO5svUtzxXzLF/8MjlRvAwMVJV0dRtqZ\nZyRh6UjAX9v0Jz9b5dLdrmMZb0YWl6rM6RLzCHvGFD3QtyRpYj/UWbXHc8SI\nzCElp+gXSkJvzG9gld5iB8a+55o/SOKZDUdMsRuQUzRXpXBo1jcigjje8XGC\n9+u2G7xXGGkOHQLbV3J3US74Kc85INMYyDyWQ6GCxKLgUBiSqQxH9SkqcE+n\nu2VwarNLTRf1XlEkX3rB0K3FWh6ow3fONbbF72E3oyR/ZKA7MOarQdARwn/2\ndSFKuER3SMwGcADVqlds1zRTE6SvjMuhp3tIIWG8W8mFNWzxv5J0X91AgHm3\nvIfzkY27CobiBV+2Ussuak40lQXoBWz9Pti+NbZnwNfU3cta6zY0wF6PLXC+\nTUiUlzC7ju04i4I1j4SnHbARUrmsZxRvqGpX8JUpr4qCCsZllEnzLnMiM9ql\nbf642I1Wo7HJeVkiug1RukAB4L55futhwA0979ybfebDOtxnYPOH00Ctzr+I\n/HVQ\r\n=cjGL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAtL88aFlFqHWK9/BM4zye/qcZmUthQWrQC+EPGnAQefAiEAqzc2bNbZDyMTFcbJKQym/dBA4LdVm2dCsGyBhPJN/CY="}]},"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"maintainers":[{"name":"benjamincharity","email":"ben@benjamincharity.com"},{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_4.0.0_1608128507446_0.4464502870951228"},"_hasShrinkwrap":false},"4.0.1":{"name":"@terminus/ui-tabs","version":"4.0.1","license":"MIT","author":{"name":"@terminus"},"private":false,"homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"publishConfig":{"access":"public","tag":"next","directory":"../../../dist/libs/ui/tabs"},"dependencies":{"tslib":"^2.0.3","@angular-devkit/schematics":"12.2.13","@schematics/angular":"11.0.4"},"peerDependencies":{"@angular/animations":"^11.0.4","@angular/cdk":"^11.0.3","@angular/common":"^11.0.4","@angular/core":"^11.0.4","@angular/flex-layout":"~11.0.0-beta.33","@angular/forms":"^11.0.4","@angular/material":"^11.0.3","@angular/platform-browser":"^11.0.4","@terminus/design-tokens":"^3.1.0","@terminus/fe-utilities":"^2.0.0","@terminus/ui-styles":"^2.0.0","date-fns":"^2.16.1","rxjs":"^6.6.3"},"schematics":"./schematics/collection.json","main":"bundles/terminus-ui-tabs.umd.js","module":"fesm2015/terminus-ui-tabs.js","es2015":"fesm2015/terminus-ui-tabs.js","esm2015":"esm2015/terminus-ui-tabs.js","fesm2015":"fesm2015/terminus-ui-tabs.js","typings":"terminus-ui-tabs.d.ts","metadata":"terminus-ui-tabs.metadata.json","sideEffects":false,"readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### CSS imports\n\nIn your top-level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md","description":"

Tabs

","_id":"@terminus/ui-tabs@4.0.1","_nodeVersion":"12.22.7","_npmVersion":"lerna/3.22.1/node@v12.22.7+x64 (linux)","dist":{"integrity":"sha512-z0yoUscq805gFtTrf0nKhVRGrdmDsvyWmAFMVkJMO4iJxeQ8dpeNkCzn9L4HUoCSvzulGnP6gA570S9F2tZhXg==","shasum":"87cd53e9d0113a9935d70e2fc072486de074a755","tarball":"https://registry.npmjs.org/@terminus/ui-tabs/-/ui-tabs-4.0.1.tgz","fileCount":82,"unpackedSize":660023,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhp6wCCRA9TVsSAnZWagAAKZEP/RKnwY32hATPgWTqAOf8\n0S3/O3/az+KNkV79YkmKnL/q2LoiRjFZJECPwQ5zw9VockyaXV0ScbuP3gHq\n1uFbOgY6WJSx+qIPAtRjaMY4y+vhVaM9GPnxFWkD2DjZ4KodQiWy8waFdniY\nAJVjh3OlJc8hajx2QMt1yQAKxarPEcTgcOp+QRLmg9elNhA8E9mYTWDXN0Xk\nZxorrfDF8dNK/cc0KBtOGMzlLJO3yjWfZjZl0PH9ZpASe+kWIwJxOcuQgb4H\nPactLCD4DG7VU5/0K/mTwyeE01QuXDmUu6AovB3pxVn2U9kCnLRCCSeiKFSw\n+Jp4qPYIVg2KbVhOyAv15Du3XkDdb+ICojlIm8yVQ3fClWt0LDn7hVjkqUUj\nrYNeA/UGn4gSU44ke6VAJuGeYrpSRkb3lp+YAui4U5qaU811wdq5oemnQTS9\nfZCXPb3af7sMNybkCRpIfhhDPEN86WQqsR9nBGBm4eAaBL+FqXA+ynK1c+QY\nX7Lfm6JghWrYVy5LN4O/sV3H70DRQ19BKPdyVhKHobxf2PCP6+0eav2EEj6c\nf4lYOAm3Gey1amzNS50i57sZo88w7ya2Swnb/zIok7JyyoRWmTPxj+fl5Oea\niD5rQ+MfiCYtaO7OvyHi6gAfyGipqAsKAkXeKggRzo6pTGEmrnEl2oe7Oeue\nUaQK\r\n=Nzva\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCEhobuFfeE4z1wB7G2281HNiksMXgTymtNHnhkFyQ45AIhALjralBe0iC1Uh+UxArBuN9LsbbDMoMmifpD7KKup+1S"}]},"_npmUser":{"name":"terminus_devops","email":"devops@terminus.com"},"directories":{},"maintainers":[{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/ui-tabs_4.0.1_1638378498834_0.9350483391719757"},"_hasShrinkwrap":false}},"time":{"created":"2020-06-04T17:59:19.594Z","1.0.0":"2020-06-04T17:59:22.544Z","modified":"2022-04-07T05:16:23.397Z","1.0.1":"2020-06-05T02:06:21.595Z","1.0.2":"2020-06-10T14:52:47.660Z","1.0.3":"2020-06-10T19:22:44.373Z","1.0.4":"2020-06-11T14:19:51.895Z","1.0.5":"2020-06-11T16:55:32.532Z","1.0.6":"2020-06-23T15:35:50.809Z","1.0.7":"2020-07-07T15:40:04.172Z","1.0.8":"2020-07-13T19:25:04.426Z","1.0.9":"2020-07-14T18:53:22.282Z","2.0.0":"2020-07-27T19:40:43.553Z","2.0.1":"2020-07-28T15:29:59.877Z","2.0.2":"2020-07-28T18:29:08.142Z","2.0.3":"2020-07-29T15:34:35.311Z","2.0.4":"2020-07-30T20:34:57.505Z","2.0.5":"2020-07-31T14:01:33.990Z","2.0.6":"2020-08-05T19:12:18.635Z","2.0.7":"2020-08-06T17:16:18.781Z","2.0.8":"2020-08-10T16:21:31.170Z","2.0.9":"2020-08-10T17:41:55.609Z","2.0.10":"2020-08-14T15:33:15.593Z","2.0.11":"2020-08-28T14:09:06.404Z","2.0.12":"2020-09-03T23:15:57.927Z","2.0.13":"2020-09-04T15:02:55.066Z","2.1.0":"2020-09-08T18:53:14.447Z","2.1.1":"2020-09-11T17:36:05.660Z","2.1.2":"2020-09-14T17:39:31.490Z","3.0.0":"2020-10-05T19:02:30.174Z","3.0.1":"2020-11-11T12:04:13.097Z","3.0.2":"2020-11-11T17:22:39.899Z","4.0.0":"2020-12-16T14:21:47.639Z","4.0.1":"2021-12-01T17:08:18.990Z"},"maintainers":[{"name":"bmalinconico-terminus","email":"brian.malinconico@terminus.com"},{"name":"atlwendy","email":"atlwendy@gmail.com"},{"name":"terminus_devops","email":"devops@terminus.com"}],"description":"

Tabs

","homepage":"https://github.com/GetTerminus/terminus-oss","repository":{"type":"git","url":"git+https://github.com/GetTerminus/terminus-oss.git"},"author":{"name":"@terminus"},"bugs":{"url":"https://github.com/GetTerminus/terminus-oss/issues"},"license":"MIT","readme":"

Tabs

\n\n[![CI/CD Status][github-action-badge]][github-action-link] [![Codecov][codecov-badge]][codecov-project] [![MIT License][license-image]][license-url] \n[![NPM version][npm-version-image]][npm-package] [![Library size][file-size-badge]][raw-distribution-js]\n\n\n\n## Table of Contents\n\n- [Installation](#installation)\n - [CSS imports](#css-imports)\n - [CSS resources](#css-resources)\n- [Usage](#usage)\n - [Label alignment](#label-alignment)\n - [Header position](#header-position)\n - [Dynamically insert a tab](#dynamically-insert-a-tab)\n - [Custom label template](#custom-label-template)\n - [Lazy load tab content](#lazy-load-tab-content)\n - [Events](#events)\n\n\n\n## Installation\n\nUse the `ng add` command to quickly install all the needed dependencies:\n\n```bash\nng add @terminus/ui-tabs\n```\n\n### CSS imports\n\nIn your top-level stylesheet, add these imports:\n\n```css\n@import '~@terminus/design-tokens/css/library-design-tokens.css';\n@import '~@terminus/ui-styles/terminus-ui.css';\n``` \n\n### CSS resources\n\nLoad the needed font families by adding this link to the `` of your application:\n\n```css\n\n```\n\n## Usage\n\nIn its most simple form this must consist of a collection with at least one tab:\n\n```html\n\n Content 1\n\n```\n\n### Label alignment\n\nThere are four horizontal layout options for tab labels.\n\n| Position | Description |\n|-----------|----------------------------------------------|\n| `start` | Align tab labels to the left (default) |\n| `center` | Center tab labels to content |\n| `end` | Align tab labels to the right |\n| `stretch` | Force tab labels to fill all available space |\n\n```html\n\n ...\n\n```\n\n### Header position\n\nThe collection of tab labels are positioned above the tab content by default. This can be inverted so the labels appear below the tab\ncontent:\n\n```html\n\n ...\n\n```\n\n### Dynamically insert a tab\n\nTabs can be dynamically added and removed by using a loop to generate the tabs:\n\n```html\n\n \n Content for {{ tab }} tab\n \n\n```\n\nOr by showing and hiding via `ngIf`:\n\n```html\n\n \n Content 1\n \n\n \n Content 2\n \n\n```\n\n### Custom label template\n\nIf label customization is needed a template can be defined to contain custom label markup by using the `tsTabLabel` directive on an\n`ng-template` tag:\n\n```html\n\n \n \n home\n First\n \n\n Content 1\n \n\n```\n\n### Lazy load tab content\n\nBy default tab content is eagerly loaded. Tab content can be lazily loaded by using the `tsTabContent` directive on an `ng-template` tag:\n\n```html\n\n \n \n Content 1\n \n \n\n```\n\n### Events\n\n| Event | Description | Payload |\n|:----------------------|:-------------------------------------------------|:-------------------|\n| `animationFinished` | Fired when the tab animation is finished | `void` |\n| `focusChange` | Fired when the tab labels focus changes | `TsTabChangeEvent` |\n| `selectedIndexChange` | Fired when the index of the selected tab changes | `number` |\n| `selectedTabChange` | Fired when the selected tab changes | `TsTabChangeEvent` |\n\n```html\n\n ...\n\n```\n\nThe `TsTabChangeEvent` structure:\n\n```typescript\nclass TsTabChangeEvent {\n constructor(\n // The tab's current index\n public index: number,\n // The tab\n public tab: TsTabComponent,\n ) {}\n}\n```\n\n\n[license-url]: https://github.com/GetTerminus/terminus-oss/blob/release/LICENSE\n[license-image]: http://img.shields.io/badge/license-MIT-blue.svg\n[codecov-project]: https://codecov.io/gh/GetTerminus/terminus-oss\n[codecov-badge]: https://codecov.io/gh/GetTerminus/terminus-oss/branch/release/graph/badge.svg\n[npm-version-image]: http://img.shields.io/npm/v/@terminus/ui-tabs.svg\n[npm-package]: https://www.npmjs.com/package/@terminus/ui-tabs\n[github-action-badge]: https://github.com/GetTerminus/terminus-oss/workflows/Release%20CI/badge.svg\n[github-action-link]: https://github.com/GetTerminus/terminus-oss/actions?query=workflow%3A%22CI+Release%22\n[file-size-badge]: http://img.badgesize.io/https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.min.js?compression=gzip\n[raw-distribution-js]: https://unpkg.com/@terminus/ui-tabs/bundles/terminus-ui-tabs.umd.js\n","readmeFilename":"README.md"}