ionicons

  • Version 7.4.0
  • Published
  • 6.44 MB
  • 1 dependency
  • MIT license

Install

npm i ionicons
yarn add ionicons
pnpm add ionicons

Overview

Premium icons for Ionic.

Index

Functions

function addIcons

addIcons: (icons: { [name: string]: string }) => void;

    function setAssetPath

    setAssetPath: (path: string) => string;
    • Used to manually set the base path where assets can be found. For lazy-loaded builds the asset path is automatically set and assets copied to the correct build directory. However, for custom elements builds, the setAssetPath(path) could be used to customize the asset path depending on how the script file is consumed. If the script is used as "module", it's recommended to use "import.meta.url", such as setAssetPath(import.meta.url). Other options include setAssetPath(document.currentScript.src), or using a bundler's replace plugin to dynamically set the path at build time, such as setAssetPath(process.env.ASSET_PATH). But do note that this configuration depends on how your script is bundled, or lack of bundling, and where your assets can be loaded from. Additionally custom bundling will have to ensure the static assets are copied to its build directory.

      Parameter path

      the asset path to set

      Returns

      the set path

    Namespaces

    namespace Components

    namespace Components {}

      interface IonIcon

      interface IonIcon {}

        property "color"

        color?: string;
        • The color to use for the background of the item.

        property "flipRtl"

        flipRtl?: boolean;
        • Specifies whether the icon should horizontally flip when dir is "rtl".

        property "icon"

        icon?: any;
        • A combination of both name and src. If a src url is detected it will set the src property. Otherwise it assumes it's a built-in named SVG and set the name property.

        property "ios"

        ios?: string;
        • Specifies which icon to use on ios mode.

        property "lazy"

        lazy: boolean;
        • If enabled, ion-icon will be loaded lazily when it's visible in the viewport. Default, false.

        property "md"

        md?: string;
        • Specifies which icon to use on md mode.

        property "mode"

        mode: string;
        • The mode determines which platform styles to use.

        property "name"

        name?: string;
        • Specifies which icon to use from the built-in set of icons.

        property "sanitize"

        sanitize: boolean;
        • When set to false, SVG content that is HTTP fetched will not be checked if the response SVG content has any <script> elements, or any attributes that start with on, such as onclick. true

        property "size"

        size?: string;
        • The size of the icon. Available options are: "small" and "large".

        property "src"

        src?: string;
        • Specifies the exact src of an SVG file to use.

        namespace JSX

        namespace JSX {}

          interface IntrinsicElements

          interface IntrinsicElements {}

            property "ion-icon"

            'ion-icon': IonIcon;

              interface IonIcon

              interface IonIcon {}

                property "color"

                color?: string;
                • The color to use for the background of the item.

                property "flipRtl"

                flipRtl?: boolean;
                • Specifies whether the icon should horizontally flip when dir is "rtl".

                property "icon"

                icon?: any;
                • A combination of both name and src. If a src url is detected it will set the src property. Otherwise it assumes it's a built-in named SVG and set the name property.

                property "ios"

                ios?: string;
                • Specifies which icon to use on ios mode.

                property "lazy"

                lazy?: boolean;
                • If enabled, ion-icon will be loaded lazily when it's visible in the viewport. Default, false.

                property "md"

                md?: string;
                • Specifies which icon to use on md mode.

                property "mode"

                mode?: string;
                • The mode determines which platform styles to use.

                property "name"

                name?: string;
                • Specifies which icon to use from the built-in set of icons.

                property "sanitize"

                sanitize?: boolean;
                • When set to false, SVG content that is HTTP fetched will not be checked if the response SVG content has any <script> elements, or any attributes that start with on, such as onclick. true

                property "size"

                size?: string;
                • The size of the icon. Available options are: "small" and "large".

                property "src"

                src?: string;
                • Specifies the exact src of an SVG file to use.

                Package Files (4)

                Dependencies (1)

                Dev Dependencies (14)

                Peer Dependencies (0)

                No peer dependencies.

                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/ionicons.

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