Contributing

• Copy-pasteable. No private dependencies, no project-specific imports. A developer should be able to copy the file into their app and run it.
• Documented props. Every prop, argument, or option is listed with its default.
• Minimal example. One short snippet showing the common case.
• Honest status. New additions land as Beta. Only mark Live when the code is used in real projects.

1. Fork the repository and create a branch for your addition.
2. Add an MDX doc in public/docs/contents/ following the existing content_Separator.mdx structure: !intro, !!steps with a CodeWithTabs block holding the full implementation, !!customization, !outro.
3. Register the entry in the allDocs array in src/components/componentsUi/data.tsx with real metadata: kind, platform, status, updated, sourcePath, and dependencies. Set published: false until the docs are complete.
4. Open a pull request describing what the block does, when to use it, and which environment you tested it in (React, React Native, or web).

// One file, no project-specific imports.
// Document every prop and default, then show one minimal example.
const MyHelper = ({ value = 0 }) => {
  return value;
}

export default MyHelper;

Maintainers review for correctness, copy-pasteability, and accurate metadata. Small, focused additions (one block per pull request) get reviewed fastest.

📚 Every documented block needs a clear path: what it is, a live example, copyable code, setup steps, and a source link. If your addition keeps that path intact, it belongs in Reactopia.