https://github.com/hamlim/babel-slot-fill

A simple babel plugin to allow extremely composable React components.
https://github.com/hamlim/babel-slot-fill

babel magic react

Last synced: 10 days ago
JSON representation

A simple babel plugin to allow extremely composable React components.

• Host: GitHub
• URL: https://github.com/hamlim/babel-slot-fill
• Owner: hamlim
• Created: 2017-08-26T19:21:50.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2023-01-27T11:48:49.000Z (almost 2 years ago)
• Last Synced: 2024-10-11T20:20:06.656Z (26 days ago)
• Topics: babel, magic, react
• Language: JavaScript
• Size: 179 KB
• Stars: 1
• Watchers: 3
• Forks: 0
• Open Issues: 6
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Babel-Slot-Fill 

Babel Slot Fill is a simple babel plugin that allows you to write React components like this:

```JSX

const Heading = withSlots(props => (

  

    

  

));

const MyApp = props => (

  

    

      

        
Title

      

    

  

);

```


which compiles out to:

```JSX

const Heading = props => (

  

    {props.title}

  

);

const MyApp = props => (

  

    Title} />

  

);

```

This gives you the developer experience of composing components while also allowing you to pass in more than just `children` to

your components.

## How to use

First install:

```Javascript

yarn add babel-slot-fill

```

then add to your `.babelrc` file:

```JSON

{

  "plugins": [

    "babel-slot-fill"

  ]

}

```