TWLogAIAN:ログソースの編集画面で悩む

今朝は６時まで寝てしまいました。
Wails + Svelte + Primer/CSS + Grid.jsの組み合わせに少し慣れてきました。
昨日途中だった設定画面でログソースの追加、編集の部分を作っています。
ログソースは、

ログソースの追加/編集

赤い矢印の＜追加＞ボタンで新規の編集画面

ログソースの編集画面

で追加できました。
黄色い矢印の＜編集＞ボタンから編集できるようにする部分で悪戦苦闘しています。
昨日考えた

HTML in cells | Grid.js

を使う方法だと編集処理のイベントが発生しませんでした。そこで

Row buttons | Grid.js

を使う方法に変えました。ボタンを作成しているところは、

  const actionButtons = (_, row) => {
    const no = row.cells[0].data;
    return h('button',
      {
        className: 'btn btn-sm',
        onClick: () => editLogSource(no),
      },
      html(`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M11.013 1.427a1.75 1.75 0 012.474 0l1.086 1.086a1.75 1.75 0 010 2.474l-8.61 8.61c-.21.21-.47.364-.756.445l-3.251.93a.75.75 0 01-.927-.928l.929-3.25a1.75 1.75 0 01.445-.758l8.61-8.61zm1.414 1.06a.25.25 0 00-.354 0L10.811 3.75l1.439 1.44 1.263-1.263a.25.25 0 000-.354l-1.086-1.086zM11.189 6.25L9.75 4.81l-6.286 6.287a.25.25 0 00-.064.108l-.558 1.953 1.953-.558a.249.249 0 00.108-.064l6.286-6.286z"></path></svg>`));
  };

のようしました。この結果、ボタンにアイコンを使ってイベントを発生させることもできました。
でも、保存している値が表示されないために編集できない状態です。
今日は、長時間開発していたので眠くなってきました。
昼寝しようと思います。

明日に続く