<commit_before><template>
  <div class="min-h-[100px]">
    <form name="EditStory" method="post" action="/study/kanji/1">
      <!-- we still need this for the "Add to learned list" submit which is NOT ajax -->
      <input :value="kanjiData.ucs_id" type="hidden" name="ucs_code" />

      <div id="my-story" lang="ja">
        <div ref="maskArea" class="padding rtkframe flex">
          <!-- left -->
          <div class="w-[68px] mr-4 text-center">
            <div class="framenum" title="Frame number">{{
              kanjiData.framenum
            }}</div>

            <div :class="{ kanji: true, onhover: isReviewMode }">
              <cjk-lang-ja>{{ kanjiData.kanji }}</cjk-lang-ja>
            </div>

            <div class="strokecount" title="Stroke count"
              >[{{ kanjiData.strokecount }}]<br />
              <span class="text-[120%]"
                ><cjk-lang-ja>{{ kanjiData.onyomi }}</cjk-lang-ja></span
              >
            </div>
          </div>
          <!-- /left -->

          <!-- right -->
          <div class="flex-1">
            <div class="keyword">
              <span
                class="JSEditKeyword"
                title="Click to edit the keyword"
                @click="onKeyword"
                >{{ displayKeyword }}</span
              >
            </div>

            <div id="storybox">
              <!-- view / edit story -->

              <div v-if="isEditing" id="storyedit">
                <div v-if="formHasErrors()" class="formerrormessage">
                  <span v-html="formGetErrors()"></span>
                </div>

                <div v-if="cantsaveChars.length > 0" class="text-danger mb-4">
                  <span class="font-bold">
                    Sorry, the database currently is not able to store unicode
                    characters above hexadecimal 0xFFFF. Typically, this means
                    some emojis as well as rare forms of kanji/hanzi (CJK
                    Unified Ideographs Extension B and above).</span
                  >&nbsp;
                  <a
                    href="https://github.com/fabd/kanji-koohii/issues/169"
                    target="blank"
                    >See issue #169 for comments</a
                  >
                  <br />
                  <br />
                  <span class=""
                    >Characters which can't be saved in the story:</span
                  >
                  <span
                    v-for="(chr, i) in cantsaveChars"
                    :key="i"
                    class="bg-danger bg-opacity-10 mr-1 p-[0.25em] rounded"
                    >{{ chr }}</span
                  >
                </div>

                <textarea
                  id="frmStory"
                  v-model="postStoryEdit"
                  name="txtStory"
                ></textarea>

                <div class="flex justify-between items-center">
                  <div class="align-middle">
                    <input
                      id="storyedit_public"
                      v-model="postStoryPublic"
                      type="checkbox"
                      name="chkPublic"
                    />
                    <label for="storyedit_public" class="ml-2"
                      >Share this story</label
                    >
                  </div>
                  <div class="">
                    <koohii-chars-left
                      :text="postStoryEdit"
                      :max-length="512"
                      :warning-limit="20"<commit_msg>(KoohiiEditStory): use `form-label` class, align checkbox<commit_after><template>
  <div class="min-h-[100px]">
    <form name="EditStory" method="post" action="/study/kanji/1">
      <!-- we still need this for the "Add to learned list" submit which is NOT ajax -->
      <input :value="kanjiData.ucs_id" type="hidden" name="ucs_code" />

      <div id="my-story" lang="ja">
        <div ref="maskArea" class="padding rtkframe flex">
          <!-- left -->
          <div class="w-[68px] mr-4 text-center">
            <div class="framenum" title="Frame number">{{
              kanjiData.framenum
            }}</div>

            <div :class="{ kanji: true, onhover: isReviewMode }">
              <cjk-lang-ja>{{ kanjiData.kanji }}</cjk-lang-ja>
            </div>

            <div class="strokecount" title="Stroke count"
              >[{{ kanjiData.strokecount }}]<br />
              <span class="text-[120%]"
                ><cjk-lang-ja>{{ kanjiData.onyomi }}</cjk-lang-ja></span
              >
            </div>
          </div>
          <!-- /left -->

          <!-- right -->
          <div class="flex-1">
            <div class="keyword">
              <span
                class="JSEditKeyword"
                title="Click to edit the keyword"
                @click="onKeyword"
                >{{ displayKeyword }}</span
              >
            </div>

            <div id="storybox">
              <!-- view / edit story -->

              <div v-if="isEditing" id="storyedit">
                <div v-if="formHasErrors()" class="formerrormessage">
                  <span v-html="formGetErrors()"></span>
                </div>

                <div v-if="cantsaveChars.length > 0" class="text-danger mb-4">
                  <span class="font-bold">
                    Sorry, the database currently is not able to store unicode
                    characters above hexadecimal 0xFFFF. Typically, this means
                    some emojis as well as rare forms of kanji/hanzi (CJK
                    Unified Ideographs Extension B and above).</span
                  >&nbsp;
                  <a
                    href="https://github.com/fabd/kanji-koohii/issues/169"
                    target="blank"
                    >See issue #169 for comments</a
                  >
                  <br />
                  <br />
                  <span class=""
                    >Characters which can't be saved in the story:</span
                  >
                  <span
                    v-for="(chr, i) in cantsaveChars"
                    :key="i"
                    class="bg-danger bg-opacity-10 mr-1 p-[0.25em] rounded"
                    >{{ chr }}</span
                  >
                </div>

                <textarea
                  id="frmStory"
                  v-model="postStoryEdit"
                  name="txtStory"
                ></textarea>

                <div class="flex justify-between items-center">
                  <div class="flex items-center">
                    <input
                      id="storyedit_public"
                      v-model="postStoryPublic"
                      type="checkbox"
                      name="chkPublic"
                    />
                    <label for="storyedit_public" class="form-label mb-0 ml-2">Share this story</label
                    >
                  </div>
                  <div class="">
                    <koohii-chars-left
                      :text="postStoryEdit"
                      :max-length="512"
                      :warning-limit="20"
{'fraction_non_alphanumeric': 0.12905480984340045, 'fraction_numerical': 0.009088366890380313, 'mean_word_length': 1.1307715221924337, 'pattern_counts': {'":': 0, '<': 121, '<?xml version=': 0, '>': 121, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4135596', 'n_tokens_mistral': 2022, 'n_tokens_neox': 1797, 'n_words': 412}