JSFiddle - React, Tailwind, and code Playground

by neonDog

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<div class="container">

<table class="table table-striped table-hover" width="100%">
	<tbody><tr>
		<th colspan="4" valign="top" align="left"><a href="#general" name="user-content-general">General</a></th>
	</tr>
  
	<tr>
		<th width="120px" valign="top" align="left">Setting</th>
		<th valign="top" align="left">Description</th>
		<th width="60px" valign="top" align="left">Type</th>
	</tr>
  
	<tr>
		<td><code>onInit()</code></td>
		<td>Your initalisation code should go here. This function is called after the component has been rendered</td>
		<td><code>function</code></td>
	</tr>
  
	<tr>
		<td><code>onUpdate(previousData)</code></td>
		<td>Called after the component has been updated</td>
		<td><code>function</code></td>
	</tr>
    
    <tr>
      <td><code>onFocus()</code></td>
      <td></td>
		  <td><code>function</code></td>
    </tr>
    
    <tr>
      <td><code>onClose()</code></td>
      <td>The wrapper for an optgroup. The <code>html</code> property in the data will be the raw html of the optgroup's header and options.</td>
      <td><code>function</code></td>
    </tr>
    
    <tr>
      <td><code>onShow(cause)</code></td>
      <td>Called when the component is requested to be shown (fires even if it is already visible). Return false to stop modal becoming visible.</td>
      <td><code>function</code></td>
    </tr>
    
    <tr>
      <td><code>onHide(cause)</code></td>
      <td>Called when the component is requested to be hidden (fires even if it is already hidden). Return false to stop modal becoming invisible</td>
      <td><code>function</code></td>
    </tr>
    
    <tr>
      <td><code>onSwitch()</code></td>
      <td>Called when a component's original target changes</td>
      <td><code>function</code></td>
    </tr>
    
    <tr>
      <td><code>onReset()</code></td>
      <td></td>
      <td><code>function</code></td>
    </tr>
    
   ...