{"id":13725815,"url":"https://github.com/LucasBassetti/react-css-loaders","last_synced_at":"2025-05-07T21:30:31.789Z","repository":{"id":65412035,"uuid":"91192755","full_name":"LucasBassetti/react-css-loaders","owner":"LucasBassetti","description":":o: A collection of pure CSS React loading components","archived":false,"fork":false,"pushed_at":"2020-01-21T04:28:32.000Z","size":2232,"stargazers_count":396,"open_issues_count":2,"forks_count":31,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-04-04T18:09:22.104Z","etag":null,"topics":["loaders","pure-css","react"],"latest_commit_sha":null,"homepage":"https://lucasbassetti.com.br/react-css-loaders/","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/LucasBassetti.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"contributing.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-13T17:52:14.000Z","updated_at":"2024-10-14T22:55:40.000Z","dependencies_parsed_at":"2023-01-23T10:55:00.613Z","dependency_job_id":null,"html_url":"https://github.com/LucasBassetti/react-css-loaders","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucasBassetti%2Freact-css-loaders","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucasBassetti%2Freact-css-loaders/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucasBassetti%2Freact-css-loaders/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LucasBassetti%2Freact-css-loaders/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LucasBassetti","download_url":"https://codeload.github.com/LucasBassetti/react-css-loaders/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252957014,"owners_count":21831420,"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":["loaders","pure-css","react"],"created_at":"2024-08-03T01:02:36.252Z","updated_at":"2025-05-07T21:30:31.483Z","avatar_url":"https://github.com/LucasBassetti.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# React CSS Loaders\n\n\u003ca href=\"https://travis-ci.org/LucasBassetti/react-css-loaders\"\u003e\u003cimg src=\"https://travis-ci.org/LucasBassetti/react-css-loaders.svg?branch=master\" alt=\"Travis CI\" /\u003e\u003c/a\u003e \u003ca href=\"https://badge.fury.io/js/react-css-loaders\"\u003e\u003cimg src=\"https://badge.fury.io/js/react-css-loaders.svg\" alt=\"npm version\"\u003e [![Coverage Status](https://coveralls.io/repos/github/LucasBassetti/react-css-loaders/badge.svg)](https://coveralls.io/github/LucasBassetti/react-css-loaders)\n\n\nA collection of pure CSS React loading components. Based on Luke Haas [css-loaders](https://github.com/lukehaas/css-loaders) project.\n\n\u003ca href=\"https://lucasbassetti.com.br/react-css-loaders/\"\u003e\n\u003cimg src=\"https://cloud.githubusercontent.com/assets/1014326/26028622/d4de8bbe-37fa-11e7-95c4-a58c2779f4a3.gif\" width=\"600\" /\u003e\n\u003c/a\u003e\n\n## Contents\n- [Getting Started](#getting-started)\n- [Usage](#usage)\n- [Components](#components)\n  - [BarLoader](#barloader)\n  - [BubbleLoader](#bubbleloader)\n  - [BubbleSpinLoader](#bubblespinloader)\n  - [CometSpinLoader](#cometspinloader)\n  - [CylinderSpinLoader](#cylinderspinloader)\n  - [ResizeSpinLoader](#resizespinloader)\n  - [RotateSpinLoader](#rotatespinloader)\n  - [SpinLoader](#spinloader)\n- [How to Contribute](#how-to-contribute)\n\n## Getting Start\n\n```bash\nnpm install react-css-loaders --save\n```\n\n## Usage\n\n``` javascript\n  import { BarLoader } from 'react-css-loaders';\n  ...\n  \u003cBarLoader /\u003e\n  ...\n```\n\n## Components\n\n### BarLoader\n\n##### Usage\n\n`\u003cBarLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1` |\n| `size` | `PropTypes.number`  | `11` |\n\n### BubbleLoader\n\n##### Usage\n\n`\u003cBubbleLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.8` |\n| `size` | `PropTypes.number`  | `10` |\n\n### BubbleSpinLoader\n\n##### Usage\n\n`\u003cBubbleSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.3` |\n| `size` | `PropTypes.number`  | `20` |\n\n### CometSpinLoader\n\n##### Usage\n\n`\u003cCometSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.7` |\n| `size` | `PropTypes.number`  | `90` |\n\n### CylinderSpinLoader\n\n##### Usage\n\n`\u003cCylinderSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.1` |\n| `size` | `PropTypes.number`  | `25` |\n\n### ResizeSpinLoader\n\n##### Usage\n\n`\u003cResizeSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `background` | `PropTypes.string`  | `#000` |\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `2` |\n| `size` | `PropTypes.number`  | `11` |\n\n### RotateSpinLoader\n\n##### Usage\n\n`\u003cRotateSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.1` |\n| `size` | `PropTypes.number`  | `10` |\n\n### SpinLoader\n\n##### Usage\n\n`\u003cSpinLoader /\u003e`\n\n##### Properties\n\n| Name | Type | Default |\n|---|---|---|\n| `background` | `PropTypes.string`  | `#fff` |\n| `color` | `PropTypes.string`  | `#000` |\n| `duration` | `PropTypes.number`  | `1.4` |\n| `size` | `PropTypes.number`  | `10` |\n\n## Authors\n\n| ![Lucas Bassetti](https://avatars3.githubusercontent.com/u/1014326?v=3\u0026s=150)|\n|:---------------------:|\n|  [Lucas Bassetti](https://github.com/LucasBassetti/)   |\n\nSee also the list of [contributors](https://github.com/LucasBassetti/react-css-loaders/contributors) who participated in this project.\n\n## How to Contribute\n\nPlease check the [contributing guide](https://github.com/LucasBassetti/react-css-loaders/blob/master/contributing.md)\n\n## License\n\nMIT · [Lucas Bassetti](http://lucasbassetti.com.br)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FLucasBassetti%2Freact-css-loaders","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FLucasBassetti%2Freact-css-loaders","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FLucasBassetti%2Freact-css-loaders/lists"}