Skip to content

toggleCharacter()

This function is part of IconSet class in Iconify Tools.

Function toggleCharacter() adds character to icon or removes it.

Usage

Function has the following parameters:

  • iconName, string. Icon name.
  • char, string. Character as hexadecimal string, such as "f001".
  • add, boolean. If true, character will be added to icon. If false, character will be removed from icon.

Function returns true on success, false on failure.

Character map

What is the purpose of characters map?

It is used to generate icon fonts. Each icon in an icon font has a character assigned to it. Even when using ligatures, ligatures point to a character, so character is needed.

How to find all characters?

You can get list of all assigned characters by using chars() method.

If you want to know characters assigned to an icon, use code like this:

tsconst item = iconSet.entries['some-icon'];
// Set<string>
console.log(item.chars);

It is safe to modify characters directly in entries property.

Example

chars-example.ts
tsimport { blankIconSet } from '@iconify/tools';

// Create icon set, add few icons and characters
const iconSet = blankIconSet('test-prefix');

iconSet.setIcon('add', {
   body: '<path d="M14 7v1H8v6H7V8H1V7h6V1h1v6h6z"/>',
});
iconSet.toggleCharacter('add', 'f001', true);

iconSet.setIcon('triangle-left', {
   body: '<g fill="currentColor"><path d="M10.44 2l.56.413v11.194l-.54.393L5 8.373v-.827L10.44 2z"/></g>',
});
iconSet.toggleCharacter('triangle-left', 'f002', true);

iconSet.setVariation('triangle-right', 'triangle-left', {
   hFlip: true,
});
iconSet.toggleCharacter('triangle-right', 'f003', true);

// Set character for icon that does not exist (will fail)
iconSet.toggleCharacter('whatever', 'f005', true);

// Export characters map
console.log(iconSet.chars());

// Characters map is also exported in export():
console.log(iconSet.export());

Released under the Apache 2.0 License.