card: card

In shinyNextUI: 'HeroUI' 'React' Template for 'shiny' Apps

card

Description

Card is a container for text, photos, and actions in the context of a single subject.

Usage

card(...)

card_body(...)

card_header(...)

card_footer(...)

Arguments

...	Props to pass to the component. The allowed props are listed below in the Details section.

Details

• children. Type: ReactNode OR ReactNode[]. Default: NA.

• shadow. Type: none OR sm OR md OR lg. Default: "md".

• radius. Type: none OR sm OR md OR lg. Default: "lg".

• fullWidth. Type: boolean. Default: false.

• isHoverable. Type: boolean. Default: false.

• isPressable. Type: boolean. Default: false.

• isBlurred. Type: boolean. Default: false.

• isFooterBlurred. Type: boolean. Default: false.

• isDisabled. Type: boolean. Default: false.

• disableAnimation. Type: boolean. Default: false.

• disableRipple. Type: boolean. Default: false.

• allowTextSelectionOnPress. Type: boolean. Default: false.

• classNames. Type: Partial<Record<'base' OR 'header' OR 'body' OR 'footer', string>>. Default: NA.

• onPress. Type: (e: PressEvent) => void. Default: NA.

• onPressStart. Type: (e: PressEvent) => void. Default: NA.

• onPressEnd. Type: (e: PressEvent) => void. Default: NA.

• onPressChange. Type: (isPressed: boolean) => void. Default: NA.

• onPressUp. Type: (e: PressEvent) => void. Default: NA.

Value

An object of class shiny.tag containing the necessary configuration and including options such as JavaScript dependencies to instantiate a HeroUI card component.

See Also

See https://heroui.com/docs/components/card.

Examples

library(shiny)
library(shinyNextUI)
library(shiny.react)

ui <- nextui_page(
  div(
    class = "grid gap-4 grid-cols-3 grid-rows-3 m-5",
    card(card_body("Simple card without anything")),
    card(
      variant = "bordered",
      card_header("Card title"),
      divider(),
      card_body(h1("Card body")),
      divider(),
      card_footer("Card Footer")
    ),
    card(
      #isBlurred = TRUE,
      isPressable = TRUE,
      onPress = JS("() => alert('You pressed me')"),
      shadow = "sm",
      className = "border-none bg-background/60 dark:bg-default-100/50 max-w-[610px]",
      card_body("Press me!")
    )
  )
)

server <- function(input, output, session) {

}

if (interactive() || is_testing()) shinyApp(ui, server)

shinyNextUI documentation built on April 4, 2025, 5:36 a.m.