テーブル編集用UIライブラリ、a-table.jsをリリースしました。

<link rel="stylesheet" href="https://unpkg.com/a-table@1.1.2/fonts/a-table-icon.css">
<link rel="stylesheet" href="https://unpkg.com/a-table@1.1.2/css/a-table.css">
<script src="https://unpkg.com/a-table@1.1.2/build/a-table.min.js"></script>

npm install a-table

var aTable = require('a-table');
new aTable('.js-table',{lang:'ja'});

See the Pen a-table.js demo by appleple (@appleple) on CodePen.

See the Pen a-table.js demo by appleple (@appleple) on CodePen.

var table = new aTable('.js-table',{lang:'ja'});
table.insertRowAbove(1);

{
  showBtnList: true,/* ボタンリストを表示するかしないか*/
  lang: 'en', /*UIの言語（英語/日本語）*/
  mark: {
    align: {
      default: 'left', /*（テーブルのセルのデフォルトの配置）*/
      left: 'left', /*（左寄せの際にセルに付与されるクラス）*/
      center: 'center', /*（中央寄せの際にセルに付与されるクラス）*/
      right: 'right' /*（右寄せの際にセルに付与されるクラス）*/
    },
    btn: {
      group: 'a-table-btn-list', /* ボタンリストに付与されるクラス */
      item: 'a-table-btn', /*ボタンリストのボタンに付与されるクラス */
      itemActive: 'a-table-btn-active' /*ボタンが押された状態の時に付与されるクラス */
    },
    icon: {
      alignLeft: 'a-table-icon a-table-icon-left', /*左寄せアイコンに付与されるクラス*/
      alignCenter: 'a-table-icon a-table-icon-center', /*中央寄せアイコンに付与されるクラス*/
      alignRight: 'a-table-icon a-table-icon-right',/*右寄せアイコンに付与されるクラス*/
      undo: 'a-table-icon a-table-icon-undo', /*undoアイコンに付与されるクラス*/
      merge: 'a-table-icon a-table-icon-merge02', /*mergeアイコンに付与されるクラス*/
      split: 'a-table-icon a-table-icon-split02', /*splitアイコンに付与されるクラス*/
      table: 'a-table-icon a-table-icon-th02', /*tableアイコンに付与されるクラス*/
      source: 'a-table-icon a-table-icon-source01', /*sourceアイコンに付与されるクラス*/
      td: 'a-table-icon a-table-icon-td03', /*tdアイコンに付与されるクラス*/
      th: 'a-table-icon a-table-icon-th02' /*thアイコンに付与されるクラス*/
    },
    selector: {
      self: 'a-table-selector', /*セレクターに付与されるクラス*/
      option:[ /*セレクタのオプション*/
          {label:'red',value:'red'}, /*ラベル:red セルに付与されるクラス:red*/
          {label:'blue',value:'blue'}, /*ラベル:blue セルに付与されるクラス:blue*/
          {label:'yellow',value:'yellow'} /*ラベル:yellow セルに付与されるクラス:yellow*/
        ]
    }
  }
}