Custom icons not available for selection

Created on 13 February 2024, 9 months ago
Updated 6 March 2024, 9 months ago

Problem/Motivation

When using the CKEditor 5 Icons plugin with FontAwesome pro kit library files and the accompanying custom metadata, the custom icons do not load in the plugin; they do not appear in the preview window or in search and cannot be selected.

Steps to reproduce

To reproduce,
1. Add custom metadata [icons.yml and icon-families.yml] to your /libraries/fontawesome directory
2. Configure the plugin to use custom metadata from the /admin/config/formats/manage/{your_format} page
3. Navigate to a rich text field configured to use the format that contains the plugin
4. Begin typing the name for a custom icon; it will not appear in the list

Additional information

This issue was first mentioned in this thread: https://www.drupal.org/project/ckeditor5_icons/issues/3419525#comment-15... πŸ› JavaScript Error When Using "Custom" Option Fixed

(From the thread)
Here's some metadata for a custom icon:

learn:
  label: learn
  styles:
    - custom
  unicode: e000
  voted: false

vs the metadata for a FA icon:

key:
  aliases:
    unicodes:
      composite:
        - 1f511
      secondary:
        - 10f084
  changes:
    - 1.0.0
    - 5.0.0
    - 5.10.1
    - 6.0.0-beta1
    - 6.0.0
    - 6.2.0
    - 6.3.0
    - 6.4.0
    - 6.5.0
  label: Key
  search:
    terms:
      - key
      - lock
      - password
      - private
      - secret
      - unlock
  styles:
    - solid
  unicode: f084
  voted: false

So a lot more attributes there for the FA icon vs a custom kit icon as downloaded from FontAwesome; wondering which of these attributes may be required.

πŸ› Bug report
Status

Fixed

Version

1.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States ari.saves New Mexico

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024