const liveStateDataConfig = {
	listenToNewChangesOnly: true  // default is false
};

let subscription = liveStateSyncElement.getLiveStateData(LIVE_STATE_DATA_KEY, liveStateDataConfig).subscribe((data) => {
	console.log('[Debug] getLiveStateData 31-05-2024-2 in html', data);
});

const liveStateDataConfig = {
	listenToNewChangesOnly: true // default is false
};

const liveStateData = useLiveStateData(LIVE_STATE_DATA_KEY, liveStateDataConfig)

const [counter, setCounter] = useLiveState < number > ("counter", 0, {
  syncDuration: 100,
  resetLiveState: true,
  listenToNewChangesOnly: true // default is false
});

const liveStateSyncElement = client.getLiveStateSyncElement();
let subscription = liveStateSyncElement.onServerConnectionStateChange().subscribe((data) => {
  console.log('server connection state change: ', data);
});

subscription?.unsubscribe()

export enum ServerConnectionState {
  ONLINE = 'online',
  OFFLINE = 'offline',
  PENDING_INIT = 'pendingInit',
  PENDING_DATA = 'pendingData',
}

const serverConnectionState = useServerConnectionStateChangeHandler();

<div>
  <velt-comment-tool></velt-comment-tool>
  <div class="table">
    <div class="cell" data-velt-target-comment-element-id="cell-id-A" id="cell-id-A">

    </div>
    <div class="cell" data-velt-target-comment-element-id="cell-id-B" id="cell-id-B">

    </div>
  </div>
</div>