{"id":19045521,"url":"https://github.com/yoast/extensiblereact","last_synced_at":"2026-05-10T04:30:18.616Z","repository":{"id":66244459,"uuid":"93460702","full_name":"Yoast/extensibleReact","owner":"Yoast","description":"An API (PoC) for making React components extensible.","archived":false,"fork":false,"pushed_at":"2022-09-29T13:36:20.000Z","size":13,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-01-02T08:31:43.110Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Yoast.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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}},"created_at":"2017-06-06T00:59:18.000Z","updated_at":"2022-09-29T13:36:23.000Z","dependencies_parsed_at":"2023-05-18T05:31:34.675Z","dependency_job_id":null,"html_url":"https://github.com/Yoast/extensibleReact","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Yoast%2FextensibleReact","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Yoast%2FextensibleReact/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Yoast%2FextensibleReact/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Yoast%2FextensibleReact/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Yoast","download_url":"https://codeload.github.com/Yoast/extensibleReact/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240102167,"owners_count":19747958,"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":[],"created_at":"2024-11-08T22:50:30.077Z","updated_at":"2026-05-10T04:30:18.580Z","avatar_url":"https://github.com/Yoast.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# extensibleReact\n\n:warning: This is a proof of concept (PoC). Not intended for use in a real world project! :warning:\n\nAPI for extending React components. The main function is `extendComponent`, a simple [higher order function / component](https://facebook.github.io/react/docs/higher-order-components.html) which allows people to extend a component in one of the following ways:\n\n- `insertBeforeComponent` allows you to insert a component before the extensible component.\n- `insertAfterComponent` allows you to insert a component after the extensible component.\n- `replaceComponent` allows you to replace the extensible component with your own component.\n- `removeComponent` allows you to remove the extensible component.\n\nPlease take a look at [index.js](https://github.com/Yoast/extensibleReact/blob/master/index.js) to see how simple it is to implement this.\n\nThe aim of this PoC is to help strengthen the case for introducing React (or at least JSX) to WordPress core JavaScript. A React based system makes it incredibly easy to make an API like this. Not only does React make this easy. Because of everything being JavaScript, we also have complete control over the components and the ways in which components can be extended. This gives us much needed possibilities:\n\n- When a component is removed, we can render a nullComponent in its place, showing what was removed and by who.\n- When a component gets replaced, we can ensure it is replaced by something with the same type, for example `react.component` or `string`.\n- [Not included in PoC] We could ensure a component only gets replaced with a component that has the same interface in terms of props. For example, we could decide we want props required by the extensible component to also be required by the replacement component. React makes this easy.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoast%2Fextensiblereact","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyoast%2Fextensiblereact","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyoast%2Fextensiblereact/lists"}