@fortawesome/angular-fontawesome

  • Version 0.12.1
  • Published
  • 304 kB
  • 1 dependency
  • MIT license

Install

npm i @fortawesome/angular-fontawesome
yarn add @fortawesome/angular-fontawesome
pnpm add @fortawesome/angular-fontawesome

Overview

Angular Fontawesome, an Angular library

Index

Classes

class FaConfig

class FaConfig {}

    property defaultPrefix

    defaultPrefix: IconPrefix;
    • Default prefix to use, when one is not provided with the icon name.

      'fas'

    property fallbackIcon

    fallbackIcon: IconDefinition;
    • Provides a fallback icon to use whilst main icon is being loaded asynchronously. When value is null, then fa-icon component will throw an error if icon input is missing. When value is not null, then the provided icon will be used as a fallback icon if icon input is missing.

      null

    property fixedWidth

    fixedWidth?: boolean;
    • Set icons to the same fixed width.

      See Also

      • {@link: https://fontawesome.com/how-to-use/on-the-web/styling/fixed-width-icons} false

    property ɵfac

    static ɵfac: i0.ɵɵFactoryDeclaration<FaConfig, never>;

      property ɵprov

      static ɵprov: i0.ɵɵInjectableDeclaration<FaConfig>;

        class FaDuotoneIconComponent

        class FaDuotoneIconComponent extends FaIconComponent {}

          property ɵcmp

          static ɵcmp: i0.ɵɵComponentDeclaration<
          FaDuotoneIconComponent,
          'fa-duotone-icon',
          never,
          {
          swapOpacity: 'swapOpacity';
          primaryOpacity: 'primaryOpacity';
          secondaryOpacity: 'secondaryOpacity';
          primaryColor: 'primaryColor';
          secondaryColor: 'secondaryColor';
          },
          {},
          never,
          never,
          false,
          never
          >;

            property ɵfac

            static ɵfac: i0.ɵɵFactoryDeclaration<FaDuotoneIconComponent, never>;

              property primaryColor

              primaryColor?: string;
              • Customize the color of the primary icon layer. Accepts any valid CSS color value.

                CSS inherited color

              property primaryOpacity

              primaryOpacity?: string | number;
              • Customize the opacity of the primary icon layer. Valid values are in range [0, 1.0].

                1.0

              property secondaryColor

              secondaryColor?: string;
              • Customize the color of the secondary icon layer. Accepts any valid CSS color value.

                CSS inherited color

              property secondaryOpacity

              secondaryOpacity?: string | number;
              • Customize the opacity of the secondary icon layer. Valid values are in range [0, 1.0].

                0.4

              property swapOpacity

              swapOpacity?: boolean | 'true' | 'false';
              • Swap the default opacity of each duotone icon’s layers. This will make an icon’s primary layer have the default opacity of 40% rather than its secondary layer.

                false

              method buildParams

              protected buildParams: () => {
              title: string;
              transform: import('@fortawesome/fontawesome-svg-core').Transform;
              classes: string[];
              mask: IconDefinition;
              styles: import('@fortawesome/fontawesome-svg-core').Styles;
              symbol: import('@fortawesome/fontawesome-svg-core').FaSymbol;
              attributes: { role: string };
              };

                method findIconDefinition

                protected findIconDefinition: (
                i: IconProp | IconDefinition
                ) => IconDefinition | null;

                  class FaIconComponent

                  class FaIconComponent implements OnChanges {}

                    constructor

                    constructor(
                    sanitizer: DomSanitizer,
                    config: FaConfig,
                    iconLibrary: FaIconLibrary,
                    stackItem: FaStackItemSizeDirective,
                    stack: FaStackComponent
                    );

                      property a11yRole

                      a11yRole: string;
                      • Specify the role attribute for the rendered element.

                        'img'

                      property animation

                      animation?: AnimationProp;
                      • Icon animation.

                        Most of the animations are only available when using Font Awesome 6. With Font Awesome 5, only 'spin' and 'spin-pulse' are supported.

                      property border

                      border?: boolean;

                        property classes

                        classes?: string[];
                        • Set class attribute on the SVG element rendered by the component.

                          Deprecated

                          This input breaks view encapsulation and is not recommended. For simple cases (like colors), use class on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                        property fixedWidth

                        fixedWidth?: boolean;

                          property flip

                          flip?: FlipProp;

                            property icon

                            icon: IconProp;

                              property inverse

                              inverse?: boolean;

                                property mask

                                mask?: IconProp;

                                  property ɵcmp

                                  static ɵcmp: i0.ɵɵComponentDeclaration<
                                  FaIconComponent,
                                  'fa-icon',
                                  never,
                                  {
                                  icon: 'icon';
                                  title: 'title';
                                  animation: 'animation';
                                  spin: 'spin';
                                  pulse: 'pulse';
                                  mask: 'mask';
                                  styles: 'styles';
                                  flip: 'flip';
                                  size: 'size';
                                  pull: 'pull';
                                  border: 'border';
                                  inverse: 'inverse';
                                  symbol: 'symbol';
                                  rotate: 'rotate';
                                  fixedWidth: 'fixedWidth';
                                  classes: 'classes';
                                  transform: 'transform';
                                  a11yRole: 'a11yRole';
                                  },
                                  {},
                                  never,
                                  never,
                                  false,
                                  never
                                  >;

                                    property ɵfac

                                    static ɵfac: i0.ɵɵFactoryDeclaration<
                                    FaIconComponent,
                                    [null, null, null, { optional: true }, { optional: true }]
                                    >;

                                      property pull

                                      pull?: PullProp;

                                        property renderedIconHTML

                                        renderedIconHTML: SafeHtml;

                                          property rotate

                                          rotate?: RotateProp;

                                            property size

                                            size?: SizeProp;

                                              property styles

                                              styles?: Styles;
                                              • Set style attribute on the SVG element rendered by the component.

                                                Deprecated

                                                This input breaks view encapsulation and is not recommended. For simple cases (like colors), use style on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                                              property symbol

                                              symbol?: FaSymbol;

                                                property title

                                                title?: string;
                                                • Specify a title for the icon.

                                                  This text will be displayed in a tooltip on hover and presented to the screen readers.

                                                property transform

                                                transform?: any;

                                                  method buildParams

                                                  protected buildParams: () => {
                                                  title: string;
                                                  transform: Transform;
                                                  classes: string[];
                                                  mask: IconDefinition;
                                                  styles: Styles;
                                                  symbol: FaSymbol;
                                                  attributes: { role: string };
                                                  };

                                                    method findIconDefinition

                                                    protected findIconDefinition: (
                                                    i: IconProp | IconDefinition
                                                    ) => IconDefinition | null;

                                                      method ngOnChanges

                                                      ngOnChanges: (changes: SimpleChanges) => void;

                                                        method render

                                                        render: () => void;
                                                        • Programmatically trigger rendering of the icon.

                                                          This method is useful, when creating FaIconComponent dynamically or changing its inputs programmatically as in these cases icon won't be re-rendered automatically.

                                                        class FaIconLibrary

                                                        class FaIconLibrary implements FaIconLibraryInterface {}

                                                          property ɵfac

                                                          static ɵfac: i0.ɵɵFactoryDeclaration<FaIconLibrary, never>;

                                                            property ɵprov

                                                            static ɵprov: i0.ɵɵInjectableDeclaration<FaIconLibrary>;

                                                              method addIconPacks

                                                              addIconPacks: (...packs: IconPack[]) => void;

                                                                method addIcons

                                                                addIcons: (...icons: IconDefinition[]) => void;

                                                                  method getIconDefinition

                                                                  getIconDefinition: (prefix: IconPrefix, name: IconName) => IconDefinition | null;

                                                                    class FaLayersComponent

                                                                    class FaLayersComponent implements OnInit, OnChanges {}
                                                                    • Fontawesome layers.

                                                                    constructor

                                                                    constructor(renderer: Renderer2, elementRef: ElementRef, config: FaConfig);

                                                                      property fixedWidth

                                                                      fixedWidth?: boolean;

                                                                        property ɵcmp

                                                                        static ɵcmp: i0.ɵɵComponentDeclaration<
                                                                        FaLayersComponent,
                                                                        'fa-layers',
                                                                        never,
                                                                        { size: 'size'; fixedWidth: 'fixedWidth' },
                                                                        {},
                                                                        never,
                                                                        ['*'],
                                                                        false,
                                                                        never
                                                                        >;

                                                                          property ɵfac

                                                                          static ɵfac: i0.ɵɵFactoryDeclaration<FaLayersComponent, never>;

                                                                            property size

                                                                            size?: SizeProp;

                                                                              method ngOnChanges

                                                                              ngOnChanges: (changes: SimpleChanges) => void;

                                                                                method ngOnInit

                                                                                ngOnInit: () => void;

                                                                                  class FaLayersCounterComponent

                                                                                  class FaLayersCounterComponent implements OnChanges {}

                                                                                    constructor

                                                                                    constructor(parent: FaLayersComponent, sanitizer: DomSanitizer);

                                                                                      property classes

                                                                                      classes?: string[];
                                                                                      • Set class attribute on the SVG element rendered by the component.

                                                                                        Deprecated

                                                                                        This input breaks view encapsulation and is not recommended. For simple cases (like colors), use class on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                                                                                      property content

                                                                                      content: string;

                                                                                        property ɵcmp

                                                                                        static ɵcmp: i0.ɵɵComponentDeclaration<
                                                                                        FaLayersCounterComponent,
                                                                                        'fa-layers-counter',
                                                                                        never,
                                                                                        {
                                                                                        content: 'content';
                                                                                        title: 'title';
                                                                                        styles: 'styles';
                                                                                        classes: 'classes';
                                                                                        position: 'position';
                                                                                        },
                                                                                        {},
                                                                                        never,
                                                                                        never,
                                                                                        false,
                                                                                        never
                                                                                        >;

                                                                                          property ɵfac

                                                                                          static ɵfac: i0.ɵɵFactoryDeclaration<
                                                                                          FaLayersCounterComponent,
                                                                                          [{ optional: true }, null]
                                                                                          >;

                                                                                            property position

                                                                                            position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';

                                                                                              property renderedHTML

                                                                                              renderedHTML: SafeHtml;

                                                                                                property styles

                                                                                                styles?: Styles;
                                                                                                • Set style attribute on the SVG element rendered by the component.

                                                                                                  Deprecated

                                                                                                  This input breaks view encapsulation and is not recommended. For simple cases (like colors), use style on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                                                                                                property title

                                                                                                title?: string;

                                                                                                  method buildParams

                                                                                                  protected buildParams: () => CounterParams;

                                                                                                    method ngOnChanges

                                                                                                    ngOnChanges: (changes: SimpleChanges) => void;

                                                                                                      class FaLayersTextComponent

                                                                                                      class FaLayersTextComponent implements OnChanges {}

                                                                                                        constructor

                                                                                                        constructor(parent: FaLayersComponent, sanitizer: DomSanitizer);

                                                                                                          property border

                                                                                                          border?: boolean;

                                                                                                            property classes

                                                                                                            classes?: string[];
                                                                                                            • Set class attribute on the SVG element rendered by the component.

                                                                                                              Deprecated

                                                                                                              This input breaks view encapsulation and is not recommended. For simple cases (like colors), use class on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                                                                                                            property content

                                                                                                            content: string;

                                                                                                              property fixedWidth

                                                                                                              fixedWidth?: boolean;

                                                                                                                property flip

                                                                                                                flip?: FlipProp;

                                                                                                                  property inverse

                                                                                                                  inverse?: boolean;

                                                                                                                    property ɵcmp

                                                                                                                    static ɵcmp: i0.ɵɵComponentDeclaration<
                                                                                                                    FaLayersTextComponent,
                                                                                                                    'fa-layers-text',
                                                                                                                    never,
                                                                                                                    {
                                                                                                                    content: 'content';
                                                                                                                    title: 'title';
                                                                                                                    styles: 'styles';
                                                                                                                    classes: 'classes';
                                                                                                                    spin: 'spin';
                                                                                                                    pulse: 'pulse';
                                                                                                                    flip: 'flip';
                                                                                                                    size: 'size';
                                                                                                                    pull: 'pull';
                                                                                                                    border: 'border';
                                                                                                                    inverse: 'inverse';
                                                                                                                    rotate: 'rotate';
                                                                                                                    fixedWidth: 'fixedWidth';
                                                                                                                    transform: 'transform';
                                                                                                                    },
                                                                                                                    {},
                                                                                                                    never,
                                                                                                                    never,
                                                                                                                    false,
                                                                                                                    never
                                                                                                                    >;

                                                                                                                      property ɵfac

                                                                                                                      static ɵfac: i0.ɵɵFactoryDeclaration<
                                                                                                                      FaLayersTextComponent,
                                                                                                                      [{ optional: true }, null]
                                                                                                                      >;

                                                                                                                        property pull

                                                                                                                        pull?: PullProp;

                                                                                                                          property renderedHTML

                                                                                                                          renderedHTML: SafeHtml;

                                                                                                                            property rotate

                                                                                                                            rotate?: RotateProp;

                                                                                                                              property size

                                                                                                                              size?: SizeProp;

                                                                                                                                property styles

                                                                                                                                styles?: Styles;
                                                                                                                                • Set style attribute on the SVG element rendered by the component.

                                                                                                                                  Deprecated

                                                                                                                                  This input breaks view encapsulation and is not recommended. For simple cases (like colors), use style on the component itself, for more complex usages, explicitly opt-in to break the view encapsulation. This input is deprecated since 0.12.0 and will be removed in 0.13.0.

                                                                                                                                property title

                                                                                                                                title?: string;

                                                                                                                                  property transform

                                                                                                                                  transform?: any;

                                                                                                                                    method buildParams

                                                                                                                                    protected buildParams: () => TextParams;
                                                                                                                                    • Updating params by component props.

                                                                                                                                    method ngOnChanges

                                                                                                                                    ngOnChanges: (changes: SimpleChanges) => void;

                                                                                                                                      class FaStackComponent

                                                                                                                                      class FaStackComponent implements OnInit, OnChanges {}

                                                                                                                                        constructor

                                                                                                                                        constructor(renderer: Renderer2, elementRef: ElementRef);

                                                                                                                                          property ɵcmp

                                                                                                                                          static ɵcmp: i0.ɵɵComponentDeclaration<
                                                                                                                                          FaStackComponent,
                                                                                                                                          'fa-stack',
                                                                                                                                          never,
                                                                                                                                          { size: 'size' },
                                                                                                                                          {},
                                                                                                                                          never,
                                                                                                                                          ['*'],
                                                                                                                                          false,
                                                                                                                                          never
                                                                                                                                          >;

                                                                                                                                            property ɵfac

                                                                                                                                            static ɵfac: i0.ɵɵFactoryDeclaration<FaStackComponent, never>;

                                                                                                                                              property size

                                                                                                                                              size?: SizeProp;
                                                                                                                                              • Size of the stacked icon. Note that stacked icon is by default 2 times bigger, than non-stacked icon. You'll need to set size using custom CSS to align stacked icon with a simple one. E.g. fa-stack { font-size: 0.5em; }.

                                                                                                                                              method ngOnChanges

                                                                                                                                              ngOnChanges: (changes: SimpleChanges) => void;

                                                                                                                                                method ngOnInit

                                                                                                                                                ngOnInit: () => void;

                                                                                                                                                  class FaStackItemSizeDirective

                                                                                                                                                  class FaStackItemSizeDirective implements OnChanges {}

                                                                                                                                                    property ɵdir

                                                                                                                                                    static ɵdir: i0.ɵɵDirectiveDeclaration<
                                                                                                                                                    FaStackItemSizeDirective,
                                                                                                                                                    'fa-icon[stackItemSize],fa-duotone-icon[stackItemSize]',
                                                                                                                                                    never,
                                                                                                                                                    { stackItemSize: 'stackItemSize'; size: 'size' },
                                                                                                                                                    {},
                                                                                                                                                    never,
                                                                                                                                                    never,
                                                                                                                                                    false,
                                                                                                                                                    never
                                                                                                                                                    >;

                                                                                                                                                      property ɵfac

                                                                                                                                                      static ɵfac: i0.ɵɵFactoryDeclaration<FaStackItemSizeDirective, never>;

                                                                                                                                                        property stackItemSize

                                                                                                                                                        stackItemSize: '1x' | '2x';
                                                                                                                                                        • Specify whether icon inside FaStackComponent should be rendered in regular size (1x) or as a larger icon (2x).

                                                                                                                                                        method ngOnChanges

                                                                                                                                                        ngOnChanges: (changes: SimpleChanges) => void;

                                                                                                                                                          class FontAwesomeModule

                                                                                                                                                          class FontAwesomeModule {}

                                                                                                                                                            property ɵfac

                                                                                                                                                            static ɵfac: i0.ɵɵFactoryDeclaration<FontAwesomeModule, never>;

                                                                                                                                                              property ɵinj

                                                                                                                                                              static ɵinj: i0.ɵɵInjectorDeclaration<FontAwesomeModule>;

                                                                                                                                                                property ɵmod

                                                                                                                                                                static ɵmod: i0.ɵɵNgModuleDeclaration<
                                                                                                                                                                FontAwesomeModule,
                                                                                                                                                                [
                                                                                                                                                                typeof i1.FaIconComponent,
                                                                                                                                                                typeof i2.FaDuotoneIconComponent,
                                                                                                                                                                typeof i3.FaLayersComponent,
                                                                                                                                                                typeof i4.FaLayersTextComponent,
                                                                                                                                                                typeof i5.FaLayersCounterComponent,
                                                                                                                                                                typeof i6.FaStackComponent,
                                                                                                                                                                typeof i7.FaStackItemSizeDirective
                                                                                                                                                                ],
                                                                                                                                                                never,
                                                                                                                                                                [
                                                                                                                                                                typeof i1.FaIconComponent,
                                                                                                                                                                typeof i2.FaDuotoneIconComponent,
                                                                                                                                                                typeof i3.FaLayersComponent,
                                                                                                                                                                typeof i4.FaLayersTextComponent,
                                                                                                                                                                typeof i5.FaLayersCounterComponent,
                                                                                                                                                                typeof i6.FaStackComponent,
                                                                                                                                                                typeof i7.FaStackItemSizeDirective
                                                                                                                                                                ]
                                                                                                                                                                >;

                                                                                                                                                                  Interfaces

                                                                                                                                                                  interface FaIconLibraryInterface

                                                                                                                                                                  interface FaIconLibraryInterface {}

                                                                                                                                                                    method addIconPacks

                                                                                                                                                                    addIconPacks: (...packs: IconPack[]) => void;

                                                                                                                                                                      method addIcons

                                                                                                                                                                      addIcons: (...icons: IconDefinition[]) => void;

                                                                                                                                                                        method getIconDefinition

                                                                                                                                                                        getIconDefinition: (prefix: IconPrefix, name: IconName) => IconDefinition | null;

                                                                                                                                                                          interface FaProps

                                                                                                                                                                          interface FaProps {}
                                                                                                                                                                          • Fontawesome props.

                                                                                                                                                                          property animation

                                                                                                                                                                          animation?: AnimationProp;

                                                                                                                                                                            property border

                                                                                                                                                                            border?: boolean;

                                                                                                                                                                              property className

                                                                                                                                                                              className?: string;

                                                                                                                                                                                property counter

                                                                                                                                                                                counter?: boolean;

                                                                                                                                                                                  property fixedWidth

                                                                                                                                                                                  fixedWidth?: boolean;

                                                                                                                                                                                    property flip

                                                                                                                                                                                    flip?: FlipProp;

                                                                                                                                                                                      property inverse

                                                                                                                                                                                      inverse?: boolean;

                                                                                                                                                                                        property mask

                                                                                                                                                                                        mask?: IconProp;

                                                                                                                                                                                          property pull

                                                                                                                                                                                          pull?: PullProp;

                                                                                                                                                                                            property rotate

                                                                                                                                                                                            rotate?: RotateProp;

                                                                                                                                                                                              property size

                                                                                                                                                                                              size?: SizeProp;

                                                                                                                                                                                                property stackItemSize

                                                                                                                                                                                                stackItemSize?: '1x' | '2x';

                                                                                                                                                                                                  property style

                                                                                                                                                                                                  style?: Styles;

                                                                                                                                                                                                    property symbol

                                                                                                                                                                                                    symbol?: FaSymbol;

                                                                                                                                                                                                      property transform

                                                                                                                                                                                                      transform?: string | Transform;

                                                                                                                                                                                                        Type Aliases

                                                                                                                                                                                                        type AnimationProp

                                                                                                                                                                                                        type AnimationProp =
                                                                                                                                                                                                        | 'beat'
                                                                                                                                                                                                        | 'fade'
                                                                                                                                                                                                        | 'beat-fade'
                                                                                                                                                                                                        | 'bounce'
                                                                                                                                                                                                        | 'flip'
                                                                                                                                                                                                        | 'shake'
                                                                                                                                                                                                        | 'spin'
                                                                                                                                                                                                        | 'spin-reverse'
                                                                                                                                                                                                        | 'spin-pulse'
                                                                                                                                                                                                        | 'spin-pulse-reverse';

                                                                                                                                                                                                          Package Files (12)

                                                                                                                                                                                                          Dependencies (1)

                                                                                                                                                                                                          Dev Dependencies (0)

                                                                                                                                                                                                          No dev dependencies.

                                                                                                                                                                                                          Peer Dependencies (2)

                                                                                                                                                                                                          Badge

                                                                                                                                                                                                          To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                                                          You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@fortawesome/angular-fontawesome.

                                                                                                                                                                                                          • Markdown
                                                                                                                                                                                                            [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@fortawesome/angular-fontawesome)
                                                                                                                                                                                                          • HTML
                                                                                                                                                                                                            <a href="https://www.jsdocs.io/package/@fortawesome/angular-fontawesome"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>