:recycle: b3-menu__checked

app/src/menus/Menu.ts

@@ -224,6 +224,9 @@ export class MenuItem {
             if (options.action) {
                 html += `<svg class="b3-menu__action${options.action === "iconCloseRound" ? " b3-menu__action--close" : ""}"><use xlink:href="#${options.action}"></use></svg>`;
             }
+            if (options.checked) {
+                html += '<svg class="b3-menu__checked"><use xlink:href="#iconSelect"></use></svg></span>'
+            }
             this.element.innerHTML = html;
         }
 

app/src/protyle/render/av/col.ts

@@ -854,7 +854,7 @@ const genUpdateColItem = (type: TAVCol, oldType: TAVCol, name: string) => {
     return `<button class="b3-menu__item" data-type="updateColType"  data-name="${name}" data-old-type="${oldType}" data-new-type="${type}">
     <svg class="b3-menu__icon"><use xlink:href="#${getColIconByType(type)}"></use></svg>
     <span class="b3-menu__label">${getColNameByType(type)}</span>
-    ${type === oldType ? '<span class="b3-menu__accelerator"><svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg></span>' : ""}
+    ${type === oldType ? '<svg class="b3-menu__checked"><use xlink:href="#iconSelect"></use></svg></span>' : ""}
 </button>`;
 };
 

app/src/protyle/render/av/select.ts

@@ -301,15 +301,15 @@ export const setColOption = (protyle: IProtyle, data: IAV, target: HTMLElement,
     menu.addSeparator();
     Array.from(Array(13).keys()).forEach(index => {
         menu.addItem({
-            accelerator: parseInt(color) === index + 1 ? '<svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg>' : undefined,
+            checked: parseInt(color) === index + 1,
             iconHTML: "",
             label: `<span class="color__square"  style="padding: 5px;margin: 2px;color: var(--b3-font-color${index + 1});background-color: var(--b3-font-background${index + 1});">A</span>`,
             click(element) {
-                if (element.lastElementChild.classList.contains("b3-menu__accelerator")) {
+                if (element.lastElementChild.classList.contains("b3-menu__checked")) {
                     return;
                 }
-                element.parentElement.querySelector(".b3-menu__accelerator")?.remove();
-                element.insertAdjacentHTML("beforeend", '<span class="b3-menu__accelerator"><svg class="svg" style="height: 30px; float: left;"><use xlink:href="#iconSelect"></use></svg></span>');
+                element.parentElement.querySelector(".b3-menu__checked")?.remove();
+                element.insertAdjacentHTML("beforeend", '<svg class="b3-menu__checked"><use xlink:href="#iconSelect"></use></svg></span>');
                 transaction(protyle, [{
                     action: "updateAttrViewColOption",
                     id: colId,

app/src/types/index.d.ts

@@ -708,6 +708,7 @@ interface IModels {
 }
 
 interface IMenu {
+    checked?: boolean,
     iconClass?: string,
     label?: string,
     click?: (element: HTMLElement, event: MouseEvent) => boolean | void | Promise<boolean | void>