{"id":13629962,"url":"https://github.com/brycedorn/react-legos","last_synced_at":"2025-04-14T03:41:41.902Z","repository":{"id":27700199,"uuid":"114839297","full_name":"brycedorn/react-legos","owner":"brycedorn","description":"CSS-driven React LEGO brick components","archived":false,"fork":false,"pushed_at":"2023-10-27T07:20:13.000Z","size":4400,"stargazers_count":18,"open_issues_count":3,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2024-05-30T02:12:08.718Z","etag":null,"topics":["brick","javascript","lego","react","react-component","react-components"],"latest_commit_sha":null,"homepage":"https://bryce.io/react-legos","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/brycedorn.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"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}},"created_at":"2017-12-20T03:37:50.000Z","updated_at":"2023-10-02T10:29:32.000Z","dependencies_parsed_at":"2024-01-14T08:28:43.270Z","dependency_job_id":null,"html_url":"https://github.com/brycedorn/react-legos","commit_stats":{"total_commits":21,"total_committers":3,"mean_commits":7.0,"dds":"0.19047619047619047","last_synced_commit":"9c8640dfa4d352174662aad2c88dd739fffac86c"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brycedorn%2Freact-legos","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brycedorn%2Freact-legos/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brycedorn%2Freact-legos/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/brycedorn%2Freact-legos/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/brycedorn","download_url":"https://codeload.github.com/brycedorn/react-legos/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248818578,"owners_count":21166438,"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":["brick","javascript","lego","react","react-component","react-components"],"created_at":"2024-08-01T22:01:25.667Z","updated_at":"2025-04-14T03:41:41.870Z","avatar_url":"https://github.com/brycedorn.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# react-legos\n\n[![npm version](https://badge.fury.io/js/react-legos.svg)](https://badge.fury.io/js/react-legos)\n\n\u003cimg width=\"1041\" alt=\"screen shot 2017-12-19 at 11 57 11 pm\" src=\"https://user-images.githubusercontent.com/3171252/34193282-82468e80-e518-11e7-8b0c-c30ff0d6112e.png\"\u003e\n\nTry it out in [Storybook](https://bryce.io/react-legos).\n\n## Make a LEGO brick!\n\n```jsx\nimport Brick, { shapes } from 'react-legos'\n\n...\n\n\u003cBrick shape={shapes['twoByFour']} /\u003e\n```\n\n## Props\n\nProp | Default | Description\n---- | ------- | -----------\n`shape` || The shape of the brick. A grid of true/false values to determine if the index is a space or filled.\n`size` | `medium` | The size of the brick: small, medium, or large.\n`style` || Optional style param, useful for z-indexing and placing bricks on top of one another.\n`color` | `#eee` | The color of the brick, Can use colors in `lib/colors.js`, which correspond to [this list](http://www.peeron.com/cgi-bin/invcgis/colorguide.cgi).\n`opacity` | 1 | For making the brick transparent.\n`optimize` | `true` | Disable to render all sides of bricks, including invisible ones.\n\n## Issues\n\nIf you find any issues with this component, please [report](https://github.com/brycedorn/react-legos/issues) them!\n\n## Note\n\nLEGO and the LEGO logo are trademarks and/or copyrights of the LEGO Group. This is not at all affiliated with The LEGO Group, and was simply a project of mine using the LEGO name as a proprietary eponym.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrycedorn%2Freact-legos","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbrycedorn%2Freact-legos","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbrycedorn%2Freact-legos/lists"}