{"id":20502143,"url":"https://github.com/srukshan98/smartchipcontainer","last_synced_at":"2026-04-17T22:31:12.274Z","repository":{"id":38459883,"uuid":"284386040","full_name":"srukshan98/SmartChipContainer","owner":"srukshan98","description":"This Library introduces an Intelligent way to hold Material Chips to make it only take the space needed.","archived":false,"fork":false,"pushed_at":"2023-07-05T11:29:16.000Z","size":2723,"stargazers_count":1,"open_issues_count":17,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-02-17T22:17:16.485Z","etag":null,"topics":["angular","angular-material","chips","minimal"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/ngs-chip-container","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/srukshan98.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/contributing.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-08-02T03:54:07.000Z","updated_at":"2022-02-21T09:40:33.000Z","dependencies_parsed_at":"2024-11-15T20:16:47.470Z","dependency_job_id":null,"html_url":"https://github.com/srukshan98/SmartChipContainer","commit_stats":{"total_commits":49,"total_committers":3,"mean_commits":"16.333333333333332","dds":"0.34693877551020413","last_synced_commit":"c745d7eb4e370efad8c81300dd3d778ce3fc534a"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srukshan98%2FSmartChipContainer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srukshan98%2FSmartChipContainer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srukshan98%2FSmartChipContainer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/srukshan98%2FSmartChipContainer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/srukshan98","download_url":"https://codeload.github.com/srukshan98/SmartChipContainer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242097419,"owners_count":20071252,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","angular-material","chips","minimal"],"created_at":"2024-11-15T19:19:55.954Z","updated_at":"2026-04-17T22:31:12.246Z","avatar_url":"https://github.com/srukshan98.png","language":"TypeScript","funding_links":["https://www.patreon.com/srukshan98"],"categories":[],"sub_categories":[],"readme":"# \u003cdiv align=\"center\"\u003e Angular Smart Chip Container \u003c/div\u003e\n\n![Maintenance](https://img.shields.io/badge/Maintained%3F-yes-green.svg)\n[![Ask Me Anything !](https://img.shields.io/badge/Ask%20me-anything-1abc9c.svg)](https://GitHub.com/srukshan98)\n[![GitHub issues](https://img.shields.io/github/issues/srukshan98/SmartChipContainer)](https://github.com/srukshan98/SmartChipContainer/issues)\n[![GitHub license](https://img.shields.io/github/license/srukshan98/SmartChipContainer)](https://github.com/srukshan98/SmartChipContainer)\n \n\nThis Library introduces an Intelligent way to hold Material Chips to make it only take the space needed.\n\n![Screenshot of Library in action](https://i.imgur.com/uZdbgNd.png)\n\n## How to use\n\n### Install\n\nRun `npm install ngs-chip-container@latest` to install the latest version of Ngs Chip Container.\n\n### Importing into Module with default Configuration\n\n```typescript\n@NgModule({\n  imports: [\n    NgsChipContainerModule.forRoot({\n      maxChipCount: 3, // Default Number of chips to be shown\n      tooltipLinebreak: true, // Default line break configuration for Tooltips\n      maxCharCount: 3, // Default Number of characters for chips to be shown\n      expandable: true // More chip will be expandable on click\n    })\n  ]\n})\n```\n\n### Importing into Module without default Configuration\n\n```typescript\n@NgModule({\n  imports: [\n    NgsChipContainerModule\n  ]\n})\n```\n\n### Using In Component - Simple\n\n```html\n\u003cmat-chip-list\u003e\n  \u003cngs-chip-container [maxChipCount]=\"3\" tooltipLinebreak expandable\u003e // optional component specific configuration\n      \u003cmat-chip *ngsChip=\"Name1\"\u003e{{Name1}}\u003c/mat-chip\u003e\n      \u003cmat-chip *ngsChip=\"Name2\"\u003e{{Name2}}\u003c/mat-chip\u003e\n      \u003cmat-chip *ngsChip=\"Name3\"\u003e{{Name3}}\u003c/mat-chip\u003e\n      \u003cmat-chip *ngsChip=\"Name4\"\u003e{{Name4}}\u003c/mat-chip\u003e\n  \u003c/ngs-chip-container\u003e\n\u003c/mat-chip-list\u003e\n```\n\n### Using In Component - with loops\n\n```html\n\u003cmat-chip-list\u003e\n  \u003cngs-chip-container [maxCharCount]=\"50\"\u003e // optional component specific configuration\n    \u003cng-container *ngFor=\"let name of Names\"\u003e\n      \u003cmat-chip *ngsChip=\"name\"\u003e{{name}}\u003c/mat-chip\u003e\n    \u003c/ng-container\u003e\n  \u003c/ngs-chip-container\u003e\n\u003c/mat-chip-list\u003e\n```\n\n## Further help\n\nPlease contact me via filing an [Issue](https://github.com/srukshan98/SmartChipContainer/issues) or directly E-mail at [sachithrukshanmail@gmail.com](mailTo:sachithrukshanmail@gmail.com).\n\n\u003cp align=\"center\"\u003e\n\t\u003ca href=\"https://github.com/srukshan98\"\u003e\u003cimg src=\"https://img.shields.io/github/followers/srukshan98.svg?label=GitHub\u0026style=social\" alt=\"GitHub Link\"\u003e\u003c/a\u003e\n\t\u003ca href=\"https://twitter.com/srukshan98\"\u003e\u003cimg src=\"https://img.shields.io/twitter/follow/srukshan98?label=Twitter\u0026style=social\" alt=\"Twitter\"\u003e\u003c/a\u003e\n\t\u003ca href=\"https://www.linkedin.com/in/srukshan98\"\u003e\u003cimg src=\"https://img.shields.io/badge/LinkedIn--_.svg?style=social\u0026logo=linkedin\" alt=\"LinkedIn\"\u003e\u003c/a\u003e\n\t\u003ca href=\"https://www.patreon.com/srukshan98\"\u003e\u003cimg src=\"https://img.shields.io/badge/Sponsors--_.svg?style=social\u0026logo=github\u0026logoColor=EA4AAA\" alt=\"Sponsors\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrukshan98%2Fsmartchipcontainer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsrukshan98%2Fsmartchipcontainer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrukshan98%2Fsmartchipcontainer/lists"}