test.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./assets/css/style.css">
</head>
<body>
    <div id="tableContainerId"></div>


    <script type="module">
        import TeaTable from "./index.js";
        const options = {
            data: [
                { id: 1, name: "Example Data 1", job: "Ekstra Info 1" },
                { id: 2, name: "Example Data 2" },
                { id: 3, name: "teatable", job: "table"}
            ],
            themeColor : "#6967ce",

            rowsPerPage: 5, // Opsiyonel: Sayfa başına satır sayısı (varsayılan: 5)
            // Opsiyonel: Callback fonksiyonları
            onCreate: (newData) => { console.log(newData) },
            onEdit: (id, newData) => { console.log(id, newData) },
            onDelete: (id) => { console.log(id) },
            // language support
            txtAdd     : "Add",
            txtUpdate  : "Update",
            txtDel     : "Delete",
            txtEdit    : "Edit",
            txtAct     : "Actions",
            txtSearch  : "Search...",
            txtPage    : "Page",
            txtConfirm : "Are you sure to delete this data?"
        };

        const myTable = new TeaTable('tableContainerId', options);
    </script>
</body>
</html>