JSFiddle - React, Tailwind, and code Playground

by ysuper

HTML

<html>
<div>
    <button onclick="$('#log').html('')">Clear</button><br>
    <p>Log:</p>
    <div id='log' style='background-color:#c7eaff; border-radius:2px; color:#000; padding:20px'></div>
</div>
<script src="https://bossanova.uk/jspreadsheet/v4/jexcel.js"></script>
<script src="https://jsuites.net/v4/jsuites.js"></script>
<link rel="stylesheet" href="https://bossanova.uk/jspreadsheet/v4/jexcel.css" type="text/css" />
<link rel="stylesheet" href="https://jsuites.net/v4/jsuites.css" type="text/css" />
 
<div id="spreadsheet"></div>
 
<script>
var changed = function(instance, cell, x, y, value) {
		console.log(instance)
    console.log(cell)
    console.log(x)
    console.log(y)
    console.log(value)
    /* var cellName = jexcel.getColumnNameFromId([x,y]);
    $('#log').append('New change on cell ' + cellName + ' to: ' + value + ''); */
}
 
var beforeChange = function(instance, cell, x, y, value) {
		console.log(instance)
    console.log(cell)
    console.log(x)
    console.log(y)
    console.log(value)
    /* var cellName = jexcel.getColumnNameFromId([x,y]);
    $('#log').append('The cell ' + cellName + ' will be changed'); */
}
 
/* var insertedRow = function(instance) {
    $('#log').append('Row added');
}
 
var insertedColumn = function(instance) {
    $('#log').append('Column added');
}
 
var deletedRow = function(instance) {
    $('#log').append('Row deleted');
}
 
var deletedColumn = function(instance) {
    $('#log').append('Column deleted');
}
 
var sort = function(instance, cellNum, order) {
    var order = (order) ? 'desc' : 'asc';
    $('#log').append('The column  ' + cellNum + ' sorted by ' + order + '');
}
 
var resizeColumn = function(instance, cell, width) {
    $('#log').append('The column  ' + cell + ' resized to width ' + width + ' px');
}
 
var resizeRow = function(instance, cell, height) {
    $('#log').append('The row  ' + cell + ' resized to height ' + height + ' px');
}
 
var selectionActive = function(instance, x1, y1, x2, y2, origin)...