{"id":20947570,"url":"https://github.com/concordnow/ember-content-loader","last_synced_at":"2025-07-24T23:14:03.905Z","repository":{"id":35042179,"uuid":"199171685","full_name":"concordnow/ember-content-loader","owner":"concordnow","description":"Easy, customizable content placeholders / skeletons screens","archived":false,"fork":false,"pushed_at":"2023-09-11T02:37:49.000Z","size":16114,"stargazers_count":43,"open_issues_count":2,"forks_count":4,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-06-19T18:55:45.282Z","etag":null,"topics":["ember","ember-addon","ember-cli","ember-content-loader","hacktoberfest","loader","skeleton-screens"],"latest_commit_sha":null,"homepage":"https://concordnow.github.io/ember-content-loader/","language":"JavaScript","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/concordnow.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":"CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2019-07-27T13:59:10.000Z","updated_at":"2024-05-30T02:29:40.000Z","dependencies_parsed_at":"2024-06-21T02:13:46.389Z","dependency_job_id":"358df6b0-31cf-4062-a819-88e41ec45ee2","html_url":"https://github.com/concordnow/ember-content-loader","commit_stats":{"total_commits":420,"total_committers":8,"mean_commits":52.5,"dds":"0.43333333333333335","last_synced_commit":"abf00d545880ed7f761e94b6a4d725d7f5197838"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/concordnow/ember-content-loader","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/concordnow%2Fember-content-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/concordnow%2Fember-content-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/concordnow%2Fember-content-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/concordnow%2Fember-content-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/concordnow","download_url":"https://codeload.github.com/concordnow/ember-content-loader/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/concordnow%2Fember-content-loader/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266543132,"owners_count":23945728,"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","status":"online","status_checked_at":"2025-07-22T02:00:09.085Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["ember","ember-addon","ember-cli","ember-content-loader","hacktoberfest","loader","skeleton-screens"],"created_at":"2024-11-19T00:12:04.085Z","updated_at":"2025-07-24T23:14:03.863Z","avatar_url":"https://github.com/concordnow.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"ember-content-loader\n==============================================================================\n\n[![Build Status](https://github.com/concordnow/ember-content-loader/actions/workflows/main.yml/badge.svg?branch=master)](https://github.com/concordnow/ember-content-loader/actions/workflows/main.yml)\n[![Ember Observer Score](https://emberobserver.com/badges/ember-content-loader.svg)](https://emberobserver.com/addons/ember-content-loader)\n[![This project is using Percy.io for visual regression testing.](https://percy.io/static/images/percy-badge.svg)](https://percy.io/concordnow/ember-content-loader)\n\nSVG-Powered component to easily create skeleton screens / placeholder loadings (like Facebook's cards loading). Documentation can be found [here](https://concordnow.github.io/ember-content-loader/)\n\n\nCompatibility\n------------------------------------------------------------------------------\n\n* Ember.js v3.20 or above\n* Ember CLI v3.20 or above\n* Node.js v12 or above\n* ember-auto-import \u003e= 2\n\n\nInstallation\n------------------------------------------------------------------------------\n\n```\nember install ember-content-loader\n```\n\n\nUsage\n------------------------------------------------------------------------------\n\n![Facebook skeleton](https://user-images.githubusercontent.com/4838076/34308760-ec55df82-e735-11e7-843b-2e311fa7b7d0.gif)\n\nSimply add the `\u003cContentLoader\u003e` component in your code with the shapes that you want.\n\n```hbs\n\u003cContentLoader\u003e\n  {{!-- Only SVG shapes --}}\n  \u003crect x=\"70\" y=\"15\" rx=\"4\" ry=\"4\" width=\"117\" height=\"6.4\" /\u003e\n  \u003crect x=\"70\" y=\"35\" rx=\"3\" ry=\"3\" width=\"85\" height=\"6.4\" /\u003e\n  \u003crect x=\"0\" y=\"80\" rx=\"3\" ry=\"3\" width=\"350\" height=\"6.4\" /\u003e\n  \u003crect x=\"0\" y=\"100\" rx=\"3\" ry=\"3\" width=\"380\" height=\"6.4\" /\u003e\n  \u003crect x=\"0\" y=\"120\" rx=\"3\" ry=\"3\" width=\"201\" height=\"6.4\" /\u003e\n  \u003ccircle cx=\"30\" cy=\"30\" r=\"30\" /\u003e\n\u003c/ContentLoader\u003e\n```\n\nYou can use the [online editor](http://danilowoz.com/create-content-loader/) to create complex shapes.\n\n\u003e **Note:** This editor is made for React, so you need to translate the produced code.\n\n\nOptions\n------------------------------------------------------------------------------\n\nYou can find all `\u003cContentLoader\u003e` available options [here](https://concordnow.github.io/ember-content-loader/#/docs/components/content-loader)\n\n\nThanks\n------------------------------------------------------------------------------\n\n* [react-content-loader](https://github.com/danilowoz/react-content-loader)\n\n\nContributing\n------------------------------------------------------------------------------\n\nSee the [Contributing](CONTRIBUTING.md) guide for details.\n\n\nLicense\n------------------------------------------------------------------------------\n\nThis project is licensed under the [MIT License](LICENSE.md).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconcordnow%2Fember-content-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fconcordnow%2Fember-content-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fconcordnow%2Fember-content-loader/lists"}