{"id":25931119,"url":"https://github.com/mahmoudibrahim03/ng-flag-pipe","last_synced_at":"2026-05-09T08:40:11.537Z","repository":{"id":203417922,"uuid":"709560150","full_name":"Mahmoudibrahim03/ng-flag-pipe","owner":"Mahmoudibrahim03","description":"Cutom pipe returns flags pipe dynamically with options [Shape , Size , extention]","archived":false,"fork":false,"pushed_at":"2023-10-31T22:11:47.000Z","size":353,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-10-14T12:02:42.420Z","etag":null,"topics":["angular","open-source","pipe","ts","typescript"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/flag-pipe","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Mahmoudibrahim03.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-10-24T23:45:24.000Z","updated_at":"2024-10-13T19:38:35.000Z","dependencies_parsed_at":null,"dependency_job_id":"f519b5b3-1f87-459c-b222-0beada91b1a2","html_url":"https://github.com/Mahmoudibrahim03/ng-flag-pipe","commit_stats":{"total_commits":27,"total_committers":2,"mean_commits":13.5,"dds":0.03703703703703709,"last_synced_commit":"d27348204853c213324566f9a7303547f960c040"},"previous_names":["mahmoudibrahim03/ng-angular-flags","mahmoudibrahim03/ng-flag-pipe"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mahmoudibrahim03%2Fng-flag-pipe","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mahmoudibrahim03%2Fng-flag-pipe/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mahmoudibrahim03%2Fng-flag-pipe/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Mahmoudibrahim03%2Fng-flag-pipe/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Mahmoudibrahim03","download_url":"https://codeload.github.com/Mahmoudibrahim03/ng-flag-pipe/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241758969,"owners_count":20015247,"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","open-source","pipe","ts","typescript"],"created_at":"2025-03-03T23:57:38.163Z","updated_at":"2026-05-09T08:40:11.487Z","avatar_url":"https://github.com/Mahmoudibrahim03.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ng-Flag Pipe\n\n[ Component In-progress ]\n\n## Flag Pipe : is an Angular library\n\n#### that provides a pipe to `[src]` attribute on `\u003cimg\u003e` to dynamically import flag image path.\n\n## Getting Started\n\n### Dependencies\n\n-   Angular 11.2.0 -\u003e latest version\n\n### Installing\n\n-   `npm install flag-pipe` OR\n    `yarn add flag-pipe` OR\n    `pnpm add flag-pipe`\n-   #### Import `FlagPipeModule` in your `AppModule` or `SharedModule`:\n\n```typescript [AppModule.ts] linenums = \"1\"\nimport { FlagPipeModule } from \"flag-pipe\";\n```\n\n-   #### Import `FlagPipeModule` in `ngModule`:\n\n```typescript [AppModule.ts] linenums = \"1\"\n@NgModule({\n  imports: [\n\t\tflagPipeModule.forRoot({\n\t\t\tconfig: {\n\t\t\t\tflagExtensions: \"png\",\n\t\t\t\tflagType: \"FIXED_HEIGHT\",\n\t\t\t\tflagSize: \"h20\",\n\t\t\t},\n\t\t}),\n  ]\n})\n```\n\n### Usage :\n\n-   #### Use `flag` pipe in your template (Required):\n-   #### Use CountryCode as `[ ISO 3166-1 alpha-2 ]` format\n    \u003csub\u003e -\u003e `CountryCode` type already implemented in `flag-pipe` library you can use it as `CountryCode` type.\n    REF : [ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) +\n    [Country Codes in Json](https://flagcdn.com/en/codes.json)\n    \u003c/sub\u003e\n-   #### Use `flagExtension` as [ \"png\" | \"svg\" | \"webp\" ]\n    \u003csub\u003e -\u003e `flagExtension` type already implemented in `flag-pipe` library you can use it as `flagExtension` type.\u003c/sub\u003e\n-   #### Use `flagTypies` [ 'WAVY' | 'FIXED_HEIGHT' | 'FIXED_WIDTH' ]\n    \u003csub\u003e -\u003e `flagTypies` type already implemented in `flag-pipe` library you can use it as `flagTypies` type.\u003c/sub\u003e\n-   #### Use `flagSize` [ \"w160\" | \"h240\" | \"256x192\" ]\n\n    \u003csub\u003e -\u003e `FlagSize` type already implemented in `flag-pipe` library you can use it as `FlagSize` type.\u003c/sub\u003e\n\n    | flag Type        | FIXED_HEIGHT                                                  | FIXED_WIDTH                                                  | WAVY                                                               |\n    | ---------------- | ------------------------------------------------------------- | ------------------------------------------------------------ | ------------------------------------------------------------------ |\n    | flag Size Format | ` h20`                                                        | `w20`                                                        | `36x27`                                                            |\n    | Img              | ![Fixed height](https://flagpedia.net/data/flags/h20/ua.webp) | ![Fixed Width](https://flagpedia.net/data/flags/w20/ua.webp) | ![Wavy image](https://flagpedia.net/data/flags/icon/36x27/ua.webp) |\n\n---\n\n\u003cbr/\u003e\nFull Example :\n\n```html [app.component.html] linenums = \"1\"\n\u003cimg [src]=\"'qa' | flag : 'svg' : flagType : 'w160'\" /\u003e\n```\n\n## Future Plans\n\n-   [ In-Progress ] Create a component to use it as `\u003cflag\u003e` tag.\n-   [ ] Add more features to the component.\n-   [ ] CI/CD with Github Actions.\n\n## Acknowledgments\n\nInspirations.\n\n-   [FlagPedia](https://flagpedia.net/download/api)\n\n## Contributions\n\nThis project is an easy and simple project to contribute to. Feel free to open issues and pull requests.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmahmoudibrahim03%2Fng-flag-pipe","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmahmoudibrahim03%2Fng-flag-pipe","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmahmoudibrahim03%2Fng-flag-pipe/lists"}