https://github.com/danielearwicker/react-classname

Allows elements to be created with a plain string specifying className
https://github.com/danielearwicker/react-classname

Last synced: about 2 months ago
JSON representation

Allows elements to be created with a plain string specifying className

• Host: GitHub
• URL: https://github.com/danielearwicker/react-classname
• Owner: danielearwicker
• License: mit
• Created: 2015-03-14T12:45:41.000Z (about 11 years ago)
• Default Branch: master
• Last Pushed: 2015-03-14T13:12:58.000Z (about 11 years ago)
• Last Synced: 2025-02-26T07:37:55.663Z (over 1 year ago)
• Language: JavaScript
• Size: 133 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# react-classname

Allows elements to be created with a plain string specifying className

## Purpose

To support the use of React without JSX - the unfortunate stain on an otherwise

interesting library. With this module, you can render structural elements that

just have a `className` very succinctly (more so than JSX).

## Installation

    npm install dre-react-classname --save

It's a commonJS module so you `require` it. If you're using fancy new ES6

transpilation, you can do this to import the specific elements you want to

render:

    import { div, span } from "dre-react-classname"

Then you can use them in your `render` function:

    return div("foo", span("bar"));

Here, `foo` and `span` are CSS class names. They get expanded automatically

so the above is equivalent to:

    return div({ className: "foo" }, span({ className: "bar" }));

If you're not using ES6 yet you can simulate the above import-and-declare

pattern:

    var X = require("dre-react-classname");

    var div = X.div, span = X.span;

## TypeScript

A declaration file is supplied in the `typings` folder.