Merge pull request #2792 from LenAnderson/fa-picker-alt-classnames Make alternative class names searchable in FontAwesome icon picker | /pick-icon

b83cfa07c931f0c4ac7b2721ea5a0414df5f708b

Cohee <18619528+Cohee1207@users.noreply.github.com>

Signed

public/scripts/utils.js+8 -5 Viewed

     document.head.append(style);
     const sheet = style.sheet;
     style.remove();
-    return [...sheet.cssRules].filter(it => it.style?.content).map(it => it.selectorText.split('::').shift().slice(1));
+    return [...sheet.cssRules]
+        .filter(rule => rule.style?.content)
+        .map(rule => rule.selectorText.split(/,\s*/).map(selector=>selector.split('::').shift().slice(1)))
+    ;
+}
 export async function fetchFa() {
     return [...new Set((await Promise.all([

                 qry.placeholder = 'Filter icons';
                 qry.autofocus = true;
                 const qryDebounced = debounce(() => {
-                    const result = faList.filter(it => it.includes(qry.value));
+                    const result = faList.filter(fa => fa.find(className=>className.includes(qry.value.toLowerCase())));
                     for (const fa of faList) {
                         if (!result.includes(fa)) {
                             fas[fa].classList.add('hidden');

                     fas[fa] = opt;
                     opt.classList.add('menu_button');
                     opt.classList.add('fa-solid');
-                    opt.classList.add(fa);
+                    opt.classList.add(fa[0]);
-                    opt.title = fa.slice(3);
+                    opt.title = fa.map(it=>it.slice(3)).join(', ');
                     opt.dataset.result = POPUP_RESULT.AFFIRMATIVE.toString();
-                    opt.addEventListener('click', () => value = fa);
+                    opt.addEventListener('click', () => value = fa[0]);
                     grid.append(opt);
+                }
+            }

public/style.css+1 -0 Viewed

     content: 'No icons found';
     color: var(--SmartThemeBodyColor);
     opacity: 0.7;
+    width: max-content;
+}
 #AdvancedFormatting .autoSetHeight {