icon_trend_indicator: Add a trend indicator icon to cells in a column

In kcuilla/reactablefmtr: Streamlined Table Styling and Formatting for Reactable

Add a trend indicator icon to cells in a column

Description

The 'icon_trend_indicator()' function conditionally adds an up/down/no-change icon from the Font Awesome library (via shiny) to a column. There are four options available for the icons: angle-double, arrow, chevron, and arrow-circle. The icons can be positioned over, above, below, or to the right or left of the values. Three colors must be provided for the icons in order from down, no-change, to up. By default, the color of the text matches the colors of the corresponding icons, but can be changed within 'text_color'. The text for values of no change (0) will automatically be hidden but can be shown with 'show_zero_label'. It should be placed within the cell argument in reactable::colDef.

Usage

icon_trend_indicator(
  data,
  icons = "arrow",
  colors = c("#15607A", "#B2B2B2", "#FA8C00"),
  icon_position = "right",
  icon_size = 16,
  show_zero_label = FALSE,
  number_fmt = NULL,
  opacity = 1,
  text_color = NULL,
  bold_text = FALSE,
  tooltip = FALSE,
  animation = "1s ease"
)

Arguments

data	Dataset containing at least one numeric column.
icons	The name of the icons to be displayed. Options are "angle-double", "arrow", "chevron", and "arrow-circle". Default is "arrow".
colors	The color(s) to assign to the icons. Three colors must be provided in order from down, no-change, to up. Default colors provided are blue-grey-orange: c("#15607A", "#B2B2B2", "#FA8C00").
icon_position	Position of icon relative to numbers. Options are "left", "right", above", "below", or "over". Default is right.
icon_size	A value representing the size of the icon in px. Default is 16.
show_zero_label	Logical: show or hide the text (0) next to no-change icons. Default is FALSE.
number_fmt	Optionally format numbers using formats from the scales package. Default is set to NULL.
opacity	A value between 0 and 1 that adjusts the opacity in colors. A value of 0 is fully transparent, a value of 1 is fully opaque. Default is 1.
text_color	The color of the text next to the icon. Default is the same color as the corresponding icon.
bold_text	Logical: bold text. Default is FALSE.
tooltip	Logical: hover tooltip. Default is FALSE.
animation	Control the duration and timing function of the animation when sorting/updating values shown on a page. See [CSS transitions](https://developer.mozilla.org/en-US/docs/Web/CSS/transition) for available timing functions and examples. Animation can be turned off by setting to "none". Default is "1s ease".

Value

a function that applies an icon to a column of numeric values.

Examples

data <- data.frame(change = c(-0.2,0.0,0.9,-0.7,0.5))

## The default icons displayed are "arrow" with matching text color
reactable(data,
defaultColDef = colDef(cell = icon_trend_indicator(data)))

## Choose one of four icon options available
reactable(data,
defaultColDef = colDef(cell = icon_trend_indicator(data, icons = "chevron")))

## Change the color of the text next to the icons
reactable(data,
defaultColDef = colDef(cell = icon_trend_indicator(data, text_color = "black")))

## Change the position of the icons relative to the text
reactable(data,
defaultColDef = colDef(cell = icon_trend_indicator(data, icon_position = "left")))

kcuilla/reactablefmtr documentation built on Jan. 13, 2023, 11:36 p.m.