@cross-ui/react

Wrapper of @cross-ui/core for react projects

RECOMMENDATION: To use this library comfortably, is needed to install TailwindCSS and PostCSS, so, follow the next instructions.

NOTE: This is an ALPHA version, maybe the next improvements will have TailwindCSS as an option.

Install

npm users: npm install --save @cross-ui/react

yarn users: yarn add @cross-ui/react

Usage

//... your others css's
@import '~@cross-ui/core/dist/cross-ui/cross-ui.css';

//...

import './index.scss'

import React from 'react'
import ReactDOM from 'react-dom'
import App from './App'

// import library setup
import { InitCrossUIReact } from '@cross-ui/react'

ReactDOM.render(<App />, document.getElementById('root'))

// Execute the settings after render the application.
// This function will do the same like the official doc: https://stenciljs.com/docs/react
InitCrossUIReact();

now, in your your-component.jsx

const YourComponent = () => {
  return <div>
    <CuiButton>my button</CuiButton>
  </div>
}

you can see an example here: /playground/src/App.js

Check the /playground project to see an example.

Docker

You have a Dockerfile ready to server the example in a simple environment.

• build the image docker build --no-cache -t cross-ui-react .

• run the container docker run --name cross-react-components -p 8080:80 -d cross-ui-react

• open http://localhost:8080 in your browser.

Author

{
	license: "MIT",
	name: "Dimas López",
	role: "FullStack Software development",
	alias: "dimaslz",
	twitter: "https://twitter.com/dimaslz",
	site: "https://dimaslz.dev",
	linkedin: "https://www.linkedin.com/in/dimaslopezzurita"
}