Icons

enabled

Type: Boolean
Default: true
Valid values: true or false

Defines visibility of icons for all toasts and popups.

options.icons = {
  enabled: false,
  ...
}

prefix

Type: String
Default: "<i class='fa fas fa-fw fa-"
Valid values: Any valid begining of HTML tag

Used internally to create first part of icon element.

options.icons = {
  prefix: "<i class='fas fa-fw fa-",
  ...
}

suffix

Type: String
Default: "'></i>"
Valid values: Any valid ending of HTML tag

Used internally to create third part of icon element.

options.icons = {
  suffix: "'></i>",
  ...
}

tip

Type: String
Default: question-circle
Preview:
Valid values: Any valid icon name/path

Icon name/path for tip toast.

options.icons = {
  tip: "question",
  ...
}

info

Type: String
Default: info-circle
Preview:
Valid values: Any valid icon name/path

Icon name/path for info toast.

options.icons = {
  info: "info",
  ...
}

success

Type: String
Default: check-circle
Preview:
Valid values: Any valid icon name/path

Icon name/path for success toast.

options.icons = {
  success: "check",
  ...
}

warning

Type: String
Default: exclamation-circle
Preview:
Valid values: Any valid icon name/path

Icon name/path for warning toast.

options.icons = {
  warning: "exclamation",
  ...
}

alert

Type: String
Default: exclamation-triangle
Preview:
Valid values: Any valid icon name/path

Icon name/path for alert toast.

options.icons = {
  alert: "exclamation",
  ...
}

async

Type: String
Default: cog fa-spin
Preview:
Valid values: Any valid icon name/path

Icon name/path for async toast.

options.icons = {
  async: "cog",
  ...
}

confirm

Type: String
Default: exclamation-triangle
Preview:
Valid values: Any valid icon name/path

Icon name/path for confirm popup.

options.icons = {
  confirm: "exclamation",
  ...
}

Overriding icon template

You’re not limited with default icons library. All icons are being build from 3 parts: icons.prefix, icons[typeName] and icons.suffix. Where prefix and suffix are common icon library wrapers and icons[typeName] is the proper name (or path) of icon itself.

Bellow you can find some of most popular examples.

Images

options.icons = {
  prefix: "<img src='",
  success: "https://www.examplepath.com/yourimg.svg",
  suffix: "'/>",
  ...
}

Google Icons (Material icons)

options.icons = {
  prefix: "<i class='material-icon'>",
  sucess: "face",
  suffix: "</i>",
  ...
}