add char count to babycode editor

data/static/js/bits/ui.js

@@ -1,5 +1,6 @@
 export const b = {
   babycodePreviewEndpoint: '/api/babycode-preview/',
+  init: 'babycodeEditorCharCountInit',
 }
 
 export function setTab(_, sender, el) {
@@ -79,6 +80,26 @@ export function insertBabycode(_, sender, el) {
     el.setSelectionRange(newCursor, newCursor);
   }
   el.focus();
+  b.send({ sender: el }, 'babycodeEditorCharCount');
+}
+
+export function babycodeEditorCharCount(evOrPayload, sender, el) {
+  if (!sender) { // sent from bitty, not input
+    sender = evOrPayload.sender;
+  }
+
+  if (!sender.parentNode.contains(el)) {
+    return;
+  }
+
+  const maxLength = sender.maxLength;
+  const currentLength = sender.value.length;
+
+  el.innerText = `${currentLength}/${maxLength}`
+}
+
+export function babycodeEditorCharCountInit(_, __, el) {
+  b.send({ sender: el }, 'babycodeEditorCharCount');
 }
 
 export function babycodePreviewInit(ev, sender, el) {