popup: Create Fomantic UI Popup

In fomantic.plus: Add Extra 'Fomantic UI' Components to 'shiny.semantic'

Description

Add a tooltip to an element that on hover will show extra information

addTooltip will only use a basic CSS tooltip with a limited amount of functionality, whereas addPopup is initialised with JS, and can include more functionality

Usage

addPopup(
  el,
  text,
  position = NULL,
  variation = NULL,
  inverted = FALSE,
  title = NULL,
  offset = NULL,
  settings = NULL,
  html = FALSE
)

addTooltip(el, text, position = NULL, variation = NULL, inverted = FALSE)

Arguments

el	A UI element that the tooltip will be applied to
text	Contents of the tooltip. Can either be a character string or an HTML object
position	(Optional) Force the popup to appear in a direction relative to el. Choose a vertical position from "top", "bottom", "" and a horizontal from "left", "center", "right", ""
variation	(Optional) Add certain features to the popup mini, tiny, small, medium, large, huge Affect the size of the font in the popup basic Removes the pointing arrow of the popup fixed, wide (addPopup only), very wide (addPopup only) Affect the width of the popup
inverted	Should the colours of the popup be inverted?
title	(Optional) Add a title to the popup. Only appears when html = FALSE
offset	(Optional) A numeric value of the number of pixel to offset the tooltip by
settings	Named list of settings to be applied to the popup. Check Fomantic UI website for full list. For example list(on = "click") will mean the popup appears on a click rather than a hover.
html	Is text valid HTML code? Defaults to FALSE

Value

addTooltip will return el with extra attributes added to the top level tag.

addPopup will return a shiny.tag.list, first similar to addTooltip an updated version of el. Then a small JS script has been added to enable the popup.

See Also

https://fomantic-ui.com/modules/popup.html

Examples

addPopup(
  fui_el$label(id = "help_label", class = "small circular", "?"),
  "This can be used as a help icon in a shiny app",
  inverted = TRUE
)

addTooltip(
  fui_el$label(class = "small circular", "?"),
  "This can be used as a help icon in a shiny app"
)

fomantic.plus documentation built on Jan. 25, 2022, 1:15 a.m.