so://phie

blob: 0dbe1afc10387e6d33a636a74d3a2902518aaa2a (814 bytes)[doc][blame][raw]

 1# figure
 2The vanilla alternative for writing JSX-based React applications
 3
 4### Example
 5
 6```javascript
 7import figure from '...';
 8
 9// initialize figure
10const { dict } = figure(React.createElement);
11
12// add your component to the dictionary
13const html = dict({
14  el: {
15    button: Button,
16  },
17});
18
19function App() {
20  return html`
21    <main>
22      <el:button
23        type="primary"
24        on:click=${() => console.log('It works!')}
25      >
26        <span>Click me</span>
27      </el:button>
28    </main>
29  `;
30}
31
32function Button() {
33  return html`
34    <button
35      on:click=${props?.onClick}
36      class="btn btn--${props?.type}"
37    >
38      ${props?.children}
39    </button>
40  `;
41}
42
43// render your App component as usual
44const root = document.querySelector('#root');
45ReactDOM.render(React.createElement(App), root);
46```