{"id":16969505,"url":"https://github.com/codebayu/style-variants","last_synced_at":"2026-04-13T08:32:08.831Z","repository":{"id":234685257,"uuid":"789366361","full_name":"codebayu/style-variants","owner":"codebayu","description":"The Package for creating dynamic and reusable styles in React Native","archived":false,"fork":false,"pushed_at":"2024-06-30T17:37:36.000Z","size":239,"stargazers_count":0,"open_issues_count":2,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-08T14:48:23.495Z","etag":null,"topics":["react-native","style","variants"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@codebayu/style-variants","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/codebayu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","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},"funding":{"github":["codebayu"]}},"created_at":"2024-04-20T10:46:31.000Z","updated_at":"2024-04-20T12:51:44.000Z","dependencies_parsed_at":"2024-04-30T18:33:23.084Z","dependency_job_id":"4afec20b-f1a6-4877-922d-d344a466a37d","html_url":"https://github.com/codebayu/style-variants","commit_stats":{"total_commits":11,"total_committers":2,"mean_commits":5.5,"dds":"0.18181818181818177","last_synced_commit":"9cd4afd79c987b465724513184ffe4d07b6084c3"},"previous_names":["codebayu/style-variants"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/codebayu/style-variants","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebayu%2Fstyle-variants","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebayu%2Fstyle-variants/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebayu%2Fstyle-variants/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebayu%2Fstyle-variants/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/codebayu","download_url":"https://codeload.github.com/codebayu/style-variants/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/codebayu%2Fstyle-variants/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31746101,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-13T06:26:45.479Z","status":"ssl_error","status_checked_at":"2026-04-13T06:26:44.645Z","response_time":93,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":["react-native","style","variants"],"created_at":"2024-10-14T00:25:29.547Z","updated_at":"2026-04-13T08:32:08.816Z","avatar_url":"https://github.com/codebayu.png","language":"TypeScript","readme":"# @codebayu/style-variants\n\nThe Package for creating dynamic and reusable styles in React Native App\n\n## Installation\n\n```bash\n# npm\nnpm install @codebayu/style-variants\n\n# yarn\nyarn add @codebayu/style-variants\n```\n\n## Usage\n\n```tsx\n// ReusableButton.tsx\nimport { sv } from '@codebayu/style-variants';\n\nexport default function ReusableButton({\n  children,\n  color,\n  size,\n  style,\n  ...rest\n}) {\n  const buttonStyle = buttonVariant({ color, size });\n  const textStyle = textVariant({ color, size });\n  return (\n    \u003cPressable style={[buttonStyle, style]} {...rest}\u003e\n      \u003cText style={textStyle}\u003e{children}\u003c/Text\u003e\n    \u003c/Pressable\u003e\n  );\n}\n\nconst textVariant = sv({\n  base: {\n    fontWeight: '600',\n  },\n  variants: {\n    color: {\n      primary: {\n        color: 'green',\n      },\n      secondary: {\n        color: 'blue',\n      },\n      ghost: {\n        color: 'black',\n      },\n    },\n    size: {\n      small: {\n        fontSize: 14,\n      },\n      medium: {\n        fontSize: 16,\n      },\n      large: {\n        fontSize: 18,\n      },\n    },\n  },\n  defaultVariants: {\n    color: 'primary',\n    size: 'medium',\n  },\n});\n\nconst buttonVariant = sv({\n  base: {\n    height: 'auto',\n    alignItems: 'center',\n  },\n  variants: {\n    color: {\n      primary: {\n        backgroundColor: '#eee',\n        padding: 17,\n        fontWeight: '600',\n        borderRadius: 5,\n        width: '100%',\n        borderWidth: 1,\n        borderColor: '#eee',\n      },\n      secondary: {\n        backgroundColor: '#e3e3e3',\n        padding: 17,\n        fontWeight: '600',\n        borderRadius: 5,\n        width: '100%',\n        borderWidth: 1,\n        borderColor: '#eee',\n      },\n      ghost: {\n        backgroundColor: 'transparent',\n      },\n    },\n  },\n  defaultVariants: {\n    color: 'primary',\n  },\n});\n\n// Parent Component\n\u003cReusableButton color=\"ghost\" size=\"small\"\u003e\n  Sign Up Here\n\u003c/ReusableButton\u003e;\n```\n\n## License\n\nThis project is licensed under the [MIT License](https://opensource.org/licenses/MIT) - see the [LICENSE](LICENSE) file for details.\n","funding_links":["https://github.com/sponsors/codebayu"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebayu%2Fstyle-variants","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcodebayu%2Fstyle-variants","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcodebayu%2Fstyle-variants/lists"}