{"id":18264729,"url":"https://github.com/native-ly/native-color-cards","last_synced_at":"2026-03-07T03:02:09.016Z","repository":{"id":37067726,"uuid":"165243133","full_name":"native-ly/native-color-cards","owner":"native-ly","description":"🦄 Color cards (Shortcuts.app style) for React Native","archived":false,"fork":false,"pushed_at":"2023-01-26T15:56:59.000Z","size":1282,"stargazers_count":4,"open_issues_count":28,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-04T21:39:47.907Z","etag":null,"topics":["android","apple","card","color","component","expo","ios","list","mobile","react","react-native","shortcuts","style","web","workflow"],"latest_commit_sha":null,"homepage":"https://snack.expo.io/@jbiesiada/native-color-cards","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/native-ly.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-01-11T12:50:09.000Z","updated_at":"2023-04-22T21:17:40.000Z","dependencies_parsed_at":"2023-02-14T19:16:12.249Z","dependency_job_id":null,"html_url":"https://github.com/native-ly/native-color-cards","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/native-ly/native-color-cards","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-color-cards","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-color-cards/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-color-cards/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-color-cards/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/native-ly","download_url":"https://codeload.github.com/native-ly/native-color-cards/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/native-ly%2Fnative-color-cards/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30206339,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-06T19:07:06.838Z","status":"online","status_checked_at":"2026-03-07T02:00:06.765Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","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":["android","apple","card","color","component","expo","ios","list","mobile","react","react-native","shortcuts","style","web","workflow"],"created_at":"2024-11-05T11:15:45.637Z","updated_at":"2026-03-07T03:02:08.990Z","avatar_url":"https://github.com/native-ly.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# [native-color-cards](https://github.com/native-ly/native-color-cards) (WIP)\n\n[![NPM version](https://img.shields.io/npm/v/native-color-cards?style=flat-square)](https://www.npmjs.com/package/native-color-cards)\n[![NPM downloads](https://img.shields.io/npm/dm/native-color-cards?style=flat-square)](https://www.npmjs.com/package/native-color-cards)\n[![NPM license](https://img.shields.io/npm/l/native-color-cards?style=flat-square)](https://www.npmjs.com/package/native-color-cards)\n[![run in expo snack](https://img.shields.io/badge/Run%20in%20Snack-4630EB?style=flat-square\u0026logo=EXPO\u0026labelColor=FFF\u0026logoColor=000)](https://snack.expo.io/@jbiesiada/native-color-cards)\n[![Codecov](https://img.shields.io/codecov/c/github/native-ly/native-color-cards?style=flat-square)](https://codecov.io/gh/native-ly/native-color-cards)\n[![Travis](https://img.shields.io/travis/com/native-ly/native-color-cards/master?style=flat-square)](https://travis-ci.com/native-ly/native-color-cards)\n\n## About\n\nColor cards (Shortcuts.app style) for React Native\n\n## How to Install\n\nFirst, install the library in your project by npm:\n\n```sh\n$ npm install native-color-cards\n```\n\nOr Yarn:\n\n```sh\n$ yarn add native-color-cards\n```\n\n## Getting Started\n\n**• Connect library with project using ES6 import:**\n\n```js\nimport { List, Card } from 'native-color-cards'\n```\n\n## Options\n\n**List (extends FlatList)**\n\n**Card (extends TouchableScale props), Flat card (extends TouchableOpacity props)**\n\n| Name            | Type     | Default      | Description                                                   | Available options                                                                                                                                       |\n| --------------- | -------- | ------------ | ------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |\n| backgroundColor | string   | ` `          | Card element background color                                 | e.g.: `#D23440`                                                                                                                                         |\n| checkBoxProps   | object   | `null`       | Props for checkbox (`View` component)                         | `{ /* options here */ }`                                                                                                                                |\n| color           | string   | `adjust`     | Card title \u0026 icon color                                       | `adjust` - geterates color based on card color, `contrast` - chooses `#fff` or `#000` based on card background color, static color in `rgb`, `hex` etc. |\n| flat            | boolean  | `false`      | Make flat card (without options, gradient, animation, select) | `true` - enable, `false` - dusable                                                                                                                      |\n| gradient        | boolean  | `false`      | Enable or disable gradient layer over card                    | `true` - enable, `false` - disable                                                                                                                      |\n| icon            | string   | ` `          | Icon name                                                     | `@expo/vector-icons` icons                                                                                                                              |\n| gradientProps   | object   | `null`       | Props for gradient (`LinearGradient` component)               | `{ /* options here */ }`                                                                                                                                |\n| onLongPress     | function | `() =\u003e void` | Callback on long press                                        | `() =\u003e { /* code */ }`                                                                                                                                  |\n| optionsProps    | object   | `null`       | Props for options (`TouchableOpacity` component)              | `{ /* options here */ }`                                                                                                                                |\n| scalable        | boolean  | `true`       | Enable or disable scale change on card press                  | `true` - enable, `false` - disable                                                                                                                      |\n| shadow          | boolean  | `false`      | Display shadow for card                                       | `true` - enable, `false` - disable                                                                                                                      |\n| title           | string   | ` `          | Card title text                                               | Title of your card                                                                                                                                      |\n\n## License\n\nThis project is licensed under the MIT License © 2019-present Jakub Biesiada\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnative-ly%2Fnative-color-cards","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnative-ly%2Fnative-color-cards","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnative-ly%2Fnative-color-cards/lists"}