はじめまして。
戸井と申します

Cocoonカスタマイズのサポート範疇は超えていると思いますが、もし可能であれば助言をいただきたく書き込ませていただきました。

不都合あれば、削除いただけたらと思います。

ブロックエディタで、Cocoonでいうトグルボックスのような機能を実装しようとしていますが、独自のid設定に困っています。

Cocoonでは以下のようにidとforを設定していると思います。

<div class="wp-block-cocoon-blocks-toggle-box-1 toggle-wrap toggle-box block-box"><input id="toggle-checkbox-20191218133137" class="toggle-checkbox" type="checkbox"/><label class="toggle-button" for="toggle-checkbox-20191218133137">トグルボックス見出し</label><div class="toggle-content"><!-- wp:paragraph -->
<p>あああ</p>
<!-- /wp:paragraph --></div></div>

「20191218133137」に該当する部分は、タイムスタンプを入れているのだと思いますが、これをどのように実装しているのか、教えていただけないでしょうか。

単純にタイムスタンプを挿入するだけならこちらでもできました。

しかし、保存→エディタから抜ける→編集で再表示、という流れになった時、1回目の初回保存時のタイムスタンプとは変わってしまうため、「Block validation」というエラーになってしまい、ブロックエディタが解除されてしまいます

わいひら様は初回保存と同じタイムスタンプを復元して、うまく解決しているのだろうとは思うのですが、この実装方法がしりたく……。

もし可能であれば、Reactをビルドする前の実装をサンプルとしてご開示いただけたりしますと、大変助かります。
※その他の方法でも問題ございません

よろしくお願いしますいたします。