Size select element is not working correctly

[mustafaekim]

Hi,

I have the select element below inside the toolbar HTML:

<select class="ql-size">
            <option value="small">Small</option>
            <option selected>Normal </option>
            <option value="large">Large</option>
            <option value="huge">Huge</option>
</select>

PROBLEM: If I click on text that has a size format of small, large, or huge, the select element displays the correct value. However, when I click on text that does not have any size formatting, the select element does not show the default (Normal) value but instead retains the previous value.

I don't think these are related, but here is the code I have to register the size format:

      const Size = Quill.import("attributors/class/size");
      Size.whitelist = ["small", "normal", "large", "huge"];

I am not sure if this list should include "normal" because "normal" actually means that there is no size formatting.

I tried to register a size handler, but that still does not fix the issue:

            size: (value: string) => {
              console.log(`Setting size as: ${value}`);
              if (!value) quill.format("size", false);
              quill.format("size", value);
              submit();
            }