elemental

import React from 'react'; import ReactDOM from 'react-dom'; import { Button, Alert, Spinner } from 'elemental'; // Elemental's styles are written in LESS and need to be imported or compiled. // For a modern setup, you would typically configure your build tool (e.g., Webpack) // to process LESS files and import the main stylesheet. // E.g., in your main JS/TS entry file or a global CSS file: // @import './node_modules/elemental/less/elemental.less'; // Or compile it via CLI: lessc ./node_modules/elemental/less/elemental.less styles.min.css function App() { const [showAlert, setShowAlert] = React.useState(false); return ( <div> <h1>Elemental UI Demo</h1> <Button onClick={() => alert('Hello from Elemental!')} type="primary"> Click Me </Button> <Button onClick={() => setShowAlert(!showAlert)} type="link"> Toggle Alert </Button> {showAlert && ( <Alert type="info"> This is an Elemental Alert! <Button type="link" onClick={() => setShowAlert(false)}>Close</Button> </Alert> )} <div style={{ padding: '20px' }}> <Spinner size="lg" /> </div> </div> ); } ReactDOM.render(<App />, document.getElementById('root'));