| Title: | Custom Gov Style Inputs for Shiny |
| Version: | 0.3.0 |
| Description: | Provides 'shiny' components styled using the GOV.UK Design System. See https://design-system.service.gov.uk/components/ for component guidance. |
| License: | GPL (≥ 3) |
| URL: | https://github.com/dfe-analytical-services/shinyGovstyle, https://dfe-analytical-services.github.io/shinyGovstyle/ |
| BugReports: | https://github.com/dfe-analytical-services/shinyGovstyle/issues |
| Depends: | R (≥ 4.1.0) |
| Imports: | bslib (≥ 0.9.0), htmltools, jsonlite, lifecycle, purrr, reactable, readODS, readr, shiny (≥ 0.14), shinyjs, stringr, writexl |
| Suggests: | brand.yml, knitr, nanonext (≥ 1.8.0), pkgdown (≥ 2.1.1), rlang, rmarkdown, shinytest2, testthat |
| VignetteBuilder: | knitr |
| Config/testthat/edition: | 3 |
| Encoding: | UTF-8 |
| Language: | en-GB |
| LazyData: | true |
| Config/roxygen2/version: | 8.1.0 |
| NeedsCompilation: | no |
| Packaged: | 2026-10-15 20:29:19 UTC; camra |
| Author: | Ross Wyatt [aut], Cam Race [aut, cre], Sarah Wong [aut], Richard Bielby [ctb], Charlotte Foster [ctb], Jeni Martin [ctb], Andrew Baker [ctb] |
| Maintainer: | Cam Race <camrace8@gmail.com> |
| Repository: | CRAN |
| Date/Publication: | 2026-10-15 20:40:02 UTC |
Accordion Function
Description
This function inserts a accordion
Usage
accordion(inputId, titles, descriptions)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
titles |
Add the titles for the accordion |
descriptions |
Add the main content for each accordion section. Each
item accepts a plain character string (rendered as a |
Value
an accordion HTML shiny tag object
See Also
Other Govstyle tables tabs and accordions:
govReactable(),
govReactable-shiny,
govTable(),
govTabs()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice logo"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
accordion(
"acc1",
c(
"Writing well for the web",
"Writing well for specialists",
"Know your audience",
"How people read"
),
list(
"This is the content for Writing well for the web.",
"This is the content for Writing well for specialists.",
"This is the content for Know your audience.",
# Rich content: a paragraph followed by a bulleted list
# with a link
shiny::tagList(
shinyGovstyle::gov_text(
"People read in different ways, including:"
),
shinyGovstyle::gov_list(
list(
"scanning for key words",
shiny::tags$a(
href = "https://www.gov.uk",
"following links"
)
),
style = "bullet"
)
)
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Back Link Function
Description
This function adds a back link to the page
Usage
backlink_Input(inputId, label = "Back")
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
The link text for the backlink, default is "Back" |
Value
a backlink HTML shiny tag object
See Also
Other Govstyle navigation:
navigate_to(),
service_navigation(),
service_navigation_server(),
update_page_title(),
update_service_navigation()
Examples
ui <- shinyGovstyle::gov_page(
header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shiny::navlistPanel(
"",
id = "nav",
widths = c(2, 10),
well = FALSE,
# Create first panel
shiny::tabPanel(
"Select Types",
value = "panel1",
gov_main_layout(
backlink_Input("link1"),
gov_text("Placeholder text")
)
),
shiny::tabPanel(
"Tab2",
value = "panel2"
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Slightly confused in that it goes forward rather than back
# but shows how to use
observeEvent(input$link1, {
updateTabsetPanel(session, "nav", selected = "panel2")
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Lookup for bad link text
Description
A single column data frame, listing out known examples of bad link text that
check for in the external_link() function.
Usage
bad_link_text
Format
bad_link_text
A data frame with 53 rows and 1 columns:
- bad_link_text
Lower cased examples of non-descriptive link text
Details
We've started curating this list so we can create automated checks to help all link text to be as descriptive as possible in line with WCAG 2.2 success criteria 2.4.4: Link Purpose (In Context).
Source
Curated by explore.statistics@education.gov.uk
Banner (deprecated)
Description
banner() was renamed to phase_banner() in shinyGovstyle 0.3.0 to match
the name of the GOV.UK Design System component. The arguments and output
are unchanged. banner() will be removed in shinyGovstyle 1.0.0.
Usage
banner(inputId, type, label = NULL, feedback_url = NULL, width = "standard")
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
type |
Main type of label e.g. alpha or beta. Can be any word |
label |
Text to display. Accepts a plain character string, or |
feedback_url |
Optional URL used to auto-generate the standard GOV.UK
phase banner feedback text, e.g. "This is a new service - your feedback
(opens in new tab) will help us to improve it.", with |
width |
Width of the component. One of |
Value
a phase banner HTML shiny tag object
Examples
# Before
# banner("banner", "Beta", "This is a new service")
# After
phase_banner("banner", "Beta", "This is a new service")
Button Function
Description
This function create a gov style button
Usage
button_Input(inputId, label, type = "default")
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
type |
The type of button. Options are default, start, secondary and warning. Defaults to "default" |
Value
a HTML button shiny tag object
See Also
Other Govstyle select inputs:
checkbox_Input(),
file_Input(),
radio_button_Input(),
select_Input(),
update_radio_button_Input()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::button_Input(
inputId = "btn1",
label = "Continue",
type = "default"
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Case data
Description
Simple example dataset containing case management data, used to demonstrate tabs in the example app.
Usage
case_data
Format
A data frame with 12 rows and 4 variables:
- tabs
The tab the data belongs to
- case_manager
The name of the case manager
- cases_open
Number of open cases
- cases_closed
Number of closed cases
Source
Random data generated for the shinyGovstyle package
Checkbox Function
Description
This function inserts a checkbox group
Usage
checkbox_Input(
inputId,
cb_labels,
checkboxIds,
label,
hint_label = NULL,
small = FALSE,
error = FALSE,
error_message = NULL,
label_size = c("m", "s", "l", "xl"),
heading_level = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
cb_labels |
Add the names of the options that will appear |
checkboxIds |
Add the values for each checkbox |
label |
Display label for the control, or |
hint_label |
Display hint label for the control, or |
small |
change the sizing to a small version of the checkbox. Defaults
to |
error |
If |
error_message |
Text shown when |
label_size |
Size modifier for the legend. One of |
heading_level |
Optional heading level for the legend. If supplied
(an integer 1-6), the legend text is wrapped in a |
Value
a checkbox HTML shiny tag object
See Also
Other Govstyle select inputs:
button_Input(),
file_Input(),
radio_button_Input(),
select_Input(),
update_radio_button_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'),
shinyGovstyle::gov_main_layout(
# Simple checkbox
shinyGovstyle::checkbox_Input(
inputId = "check1",
cb_labels = c("Option 1", "Option 2", "Option 3"),
checkboxIds = c("op1", "op2", "op3"),
label = "Choice option"
),
# Error checkbox
shinyGovstyle::checkbox_Input(
inputId = "check2",
cb_labels = c("Option 1", "Option 2", "Option 3"),
checkboxIds = c("op1", "op2", "op3"),
label = "Choice option",
hint_label = "Select the best fit",
error = TRUE,
error_message = "Select one"
),
# Rich content: a link in the hint
shinyGovstyle::checkbox_Input(
inputId = "check3",
cb_labels = c("Option 1", "Option 2", "Option 3"),
checkboxIds = c("op1", "op2", "op3"),
label = "Choice option",
hint_label = shiny::tagList(
"See the ",
shinyGovstyle::external_link(
"https://www.gov.uk",
"GOV.UK guidance"
)
)
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of eventId2
observeEvent(input$submit, {
if (is.null(input$check2)){
shinyGovstyle::error_on(inputId = "check2")
} else {
shinyGovstyle::error_off(inputId = "check2")
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Clean heading text function
This internal function is used in heading_text()
to create an automated link between the two
Description
Clean heading text function
This internal function is used in heading_text()
to create an automated link between the two
Usage
clean_heading_text(text)
Arguments
text |
string |
Value
a string
Confirmation panel
Description
This function creates the GOV.UK panel component, a visible container used on confirmation or results pages to highlight important content.
Usage
confirmation_panel(inputId, title, content)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
title |
The panel heading, rendered as the page's |
content |
The body of the panel. Accepts a plain character string, or
|
Value
a panel HTML shiny tag object
See Also
Other Govstyle feedback types:
details(),
gov_summary(),
gov_tag(),
inset_text(),
label_hint(),
noti_banner(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::confirmation_panel(
inputId = "panel1",
title = "Application complete",
content = paste(
"Thank you for submitting your application.",
"Your reference is xvsiq"
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Contents link function
Description
This function creates an action link to nav between tabs and optionally link to subcontents headers.
contents_link() was deprecated in shinyGovstyle 0.2.0 and will be removed
in shinyGovstyle 1.0.0. For multi-page layouts, service_navigation() is
the recommended approach: it gives users the GOV.UK service navigation bar
for moving between pages (tab panels), with service_navigation_server()
and navigate_to() to switch panels from the server.
service_navigation() is not a drop-in replacement. It has no equivalent
of the subcontents links, and it does not create links to headings within a
page. For those, use ordinary links to heading ids, e.g.
heading_text("Methodology", id = "methodology") with
shiny::tags$a(href = "#methodology", class = "govuk-link", "Methodology").
Usage
contents_link(link_text, input_id, subcontents_text_list, subcontents_id_list)
Arguments
link_text |
vector of link text for contents |
input_id |
contents button Id |
subcontents_text_list |
vector of link text for subcontents |
subcontents_id_list |
vector of link Ids for subcontents. If missing
automatically matches to Id in |
Value
an action button HTML shiny tag object
Examples
# Multi-page layout: service_navigation() moves between tab panels
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(org_name = "Example", service_name = "My service"),
shinyGovstyle::service_navigation(
c("Summary" = "summary", "Methodology" = "methodology")
),
shinyGovstyle::gov_main_layout(
bslib::navset_hidden(
id = "pages",
bslib::nav_panel_hidden(
"summary",
shinyGovstyle::heading_text("Summary", size = "l"),
# In-page anchor links are ordinary links to heading ids
shiny::tags$a(
href = "#key-findings",
class = "govuk-link",
"Key findings"
),
shinyGovstyle::heading_text(
"Key findings",
size = "m",
level = 2,
id = "key-findings"
)
),
bslib::nav_panel_hidden(
"methodology",
shinyGovstyle::heading_text("Methodology", size = "l")
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
shinyGovstyle::service_navigation_server(
session,
tabset_id = "pages",
link_to_panel = c("summary", "methodology")
)
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Shared parameter documentation
Description
Internal documentation object holding the standard descriptions for the
label and hint arguments shared across the form-control components. Pull
these into a function with @inheritParams control_label_params so the
rich-content wording stays consistent in one place.
Arguments
label |
Display label for the control, or |
hint_label |
Display hint label for the control, or |
hint_input |
Display hint label for the control, or |
Cookie Banner Function
Description
This function creates a cookie banner. You need to have
shinyjs::useShinyjs() enabled for this to work. All the Ids are preset.
See example for how to structure.
Usage
cookieBanner(service_name, width = "standard")
Arguments
service_name |
Name for this service to add to banner |
width |
Width of the component. One of |
Value
a cookie banner HTML shiny tag object
See Also
Other Govstyle page structure:
footer(),
gov_page(),
header(),
layouts,
phase_banner(),
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"),
#Needs shinyjs to work
shinyjs::useShinyjs(),
shinyGovstyle::cookieBanner("The best thing"),
shinyGovstyle::gov_main_layout(),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Set of observeEvent to create a path through the cookie banner
observeEvent(input$cookieAccept, {
shinyjs::show(id = "cookieAcceptDiv")
shinyjs::hide(id = "cookieMain")
})
observeEvent(input$cookieReject, {
shinyjs::show(id = "cookieRejectDiv")
shinyjs::hide(id = "cookieMain")
})
observeEvent(input$hideAccept, {
shinyjs::toggle(id = "cookieDiv")
})
observeEvent(input$hideReject, {
shinyjs::toggle(id = "cookieDiv")
})
observeEvent(input$cookieLink, {
# Need to link here to where further info is located. You can use
# updateTabsetPanel to have a cookie page for instance
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Date Input Function
Description
This function create a date input that follows GDS component
Usage
date_Input(
inputId,
label,
hint_label = NULL,
error = FALSE,
error_message = NULL,
day = NULL,
month = NULL,
year = NULL,
label_size = c("m", "s", "l", "xl"),
heading_level = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
hint_label |
Display hint label for the control, or |
error |
If |
error_message |
Text shown when |
day |
Select a default day on start up. Defaults to |
month |
Select a default month on start up. Defaults to |
year |
Select a default year on start up. Defaults to |
label_size |
Size modifier for the legend. One of |
heading_level |
Optional heading level for the legend. If supplied
(an integer 1-6), the legend text is wrapped in a |
Value
a data input HTML shiny tag object
See Also
Other Govstyle text types:
gov_list(),
heading_text(),
input_field(),
text_Input(),
text_area_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function.
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
# Simple date input
shinyGovstyle::date_Input(
inputId = "dob_input",
label = "Please enter your birthday"
),
# Error date input
shinyGovstyle::date_Input(
inputId = "dob_input2",
label = "Please enter your birthday",
hint_label = "For example, 12 11 2007",
error = TRUE
),
# Rich content: a link in the hint
shinyGovstyle::date_Input(
inputId = "dob_input3",
label = "Please enter your birthday",
hint_label = shiny::tagList(
"Check the format in the ",
shinyGovstyle::external_link(
"https://www.gov.uk",
"GOV.UK guidance"
)
)
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of dob_input2
observeEvent(input$submit, {
if (input$dob_input2 == "//") {
shinyGovstyle::error_on(inputId = "dob_input2")
} else {
shinyGovstyle::error_off(inputId = "dob_input2")
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Details Function
Description
This function create a detail component that you can click for further details.
Usage
details(inputId, label, help_text)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Main label text |
help_text |
Additional help information in the component. Accepts a
plain character string, or |
Value
a details box HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
gov_summary(),
gov_tag(),
inset_text(),
label_hint(),
noti_banner(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::details(
inputId = "help_div",
label = "Help with form",
help_text = "To complete the form you need to fill it in..."
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Shared download arguments (internal)
Description
Documentation-only function. Holds the canonical @param entries for
outputId, file_type and file_size, inherited by the download-button
family via @inheritParams.
Usage
download_args(outputId, file_type, file_size)
Arguments
outputId |
The name of the output slot that the
|
file_type |
File extension shown to the user (e.g. |
file_size |
Optional human-readable file size; a string ending in
|
Download button
Description
The download_button() provides a standard way to provide a download
link, which facilitates important accessible / positive user experience
elements, namely:
file type
file size
These are necessary in order for users to understand what they are downloading, both in terms of being able to decide if they are comfortable with downloading the file over their current connection and if it's in a form they're able to deal with once it is downloaded. If the exact file size is not easily determined, then it may be acceptable to provide an estimate or an upper limit.
Usage
download_button(outputId, button_label, file_type = "CSV", file_size = NULL)
Arguments
outputId |
The name of the output slot that the
|
button_label |
Text that will appear describing the download action. Vague text like 'click here' or 'here' will cause an error, as will ending in a full stop. Leading and trailing white space will be automatically trimmed. If the string is shorter than 7 characters a console warning will be thrown. There is no way to hush this other than providing more detail |
file_type |
File extension shown to the user (e.g. |
file_size |
Optional human-readable file size; a string ending in
|
Value
shiny tag object
See Also
Other Govstyle actions:
download_link(),
download_radios(),
download_radios_handler(),
external_link()
Examples
ui <- shinyGovstyle::gov_page(
gov_text("Choose a data set to download."),
select_Input(
"dataset",
"Data set",
select_text = c("Car road tests", "New York air quality"),
select_value = c("mtcars", "airquality")
),
download_button(
"download_data",
"Download selected data set",
file_size = "4 KB"
)
)
server <- function(input, output) {
# The requested data set
data <- reactive({
get(input$dataset)
})
output$download_data <- downloadHandler(
filename = function() {
# Use the selected dataset as the suggested file name
paste0(input$dataset, ".csv")
},
content = function(file) {
# Write the dataset to the `file` that will be downloaded
write.csv(data(), file)
}
)
}
if (interactive()) shiny::shinyApp(ui, server)
Download link
Description
The download_link() provides a standard way to provide a download
link, which facilitates important accessible / positive user experience
elements, namely:
file type
file size
These are necessary in order for users to understand what they are downloading, both in terms of being able to decide if they are comfortable with downloading the file over their current connection and if it's in a form they're able to deal with once it is downloaded. If the exact file size is not easily determined, then it may be acceptable to provide an estimate or an upper limit.
Usage
download_link(outputId, link_text, file_type = "CSV", file_size = NULL)
Arguments
outputId |
The name of the output slot that the
|
link_text |
Text that will appear describing the download action. Vague text like 'click here' or 'here' will cause an error, as will ending in a full stop. Leading and trailing white space will be automatically trimmed. If the string is shorter than 7 characters a console warning will be thrown. There is no way to hush this other than providing more detail |
file_type |
File extension shown to the user (e.g. |
file_size |
Optional human-readable file size; a string ending in
|
Value
shiny tag object
See Also
Other Govstyle actions:
download_button(),
download_radios(),
download_radios_handler(),
external_link()
Examples
ui <- shinyGovstyle::gov_page(
gov_text("Choose a data set to download."),
select_Input(
"dataset",
"Data set",
select_text = c("Car road tests", "New York air quality"),
select_value = c("mtcars", "airquality")
),
gov_text(
download_link(
"download_data",
"Download selected data set",
file_size = "4 KB"
)
)
)
server <- function(input, output) {
# The requested data set
data <- reactive({
get(input$dataset)
})
output$download_data <- downloadHandler(
filename = function() {
# Use the selected dataset as the suggested file name
paste0(input$dataset, ".csv")
},
content = function(file) {
# Write the dataset to the `file` that will be downloaded
write.csv(data(), file)
}
)
}
if (interactive()) shiny::shinyApp(ui, server)
Download with extension radios
Description
Download with extension radios
Usage
download_radios(
id = "download_radios",
download_type = "table",
file_types = c("CSV", "ODS", "XLSX"),
file_sizes = c("< 1 GB", "< 1 GB", "< 1 GB"),
small = FALSE
)
Arguments
id |
Shiny element Id. Default is "download_radios", but must be
customised to be unique if multiple instances of this module are being
used in a single app. Must match up to the ID
of a |
download_type |
Element being downloaded. Expected to be along the lines of "underlying data", "table", "current data view". Default is "table" |
file_types |
File formats to offer, can be any combination of "CSV", "XLSX", "ODS". Default is a vector of all 3 |
file_sizes |
Estimated file sizes for each file format. This needs to be a vector of the same length as file_types |
small |
Set radio buttons to small size (logical, default: FALSE) |
Value
UI containing radio selection and download button
See Also
Other Govstyle actions:
download_button(),
download_link(),
download_radios_handler(),
external_link()
Examples
ui <- shinyGovstyle::gov_page(
download_radios("download_file",
file_types = c("CSV", "ODS"),
file_sizes = c("2 KB", "5 KB")
)
)
server <- function(input, output, session) {
output$download_file <- download_radios_handler(
"download_file",
file_name = "simple_data_frame",
file_contents = mtcars
)
}
if (interactive()) shinyApp(ui, server)
Download with extension radios handler
Description
Download with extension radios handler
Usage
download_radios_handler(id = "download_radios", file_name, file_contents)
Arguments
id |
Shiny element Id. Default is "download_radios", but must be
customised to be unique if multiple instances of this module are being
used in a single app. Must match up to the ID of a |
file_name |
Name of the file to be downloaded |
file_contents |
Contents to write to the download file |
Value
Output for use with download_radios()
See Also
Other Govstyle actions:
download_button(),
download_link(),
download_radios(),
external_link()
Examples
ui <- shinyGovstyle::gov_page(
download_radios("download_file",
file_types = c("CSV", "ODS"),
file_sizes = c("2 KB", "5 KB")
)
)
server <- function(input, output, session) {
output$download_file <- download_radios_handler(
"download_file",
file_name = "simple_data_frame",
file_contents = mtcars
)
}
if (interactive()) shinyApp(ui, server)
Shared error-state arguments (internal)
Description
Documentation-only function. Holds the canonical @param entries for the
pair of params that describe an input's error state (error,
error_message), inherited by functions via @inheritParams. Used by
components whose label/hint_label docs are instead covered by
control_label_params, to avoid documenting hint_label twice.
Usage
error_args(error, error_message)
Arguments
error |
If |
error_message |
Text shown when |
Error off Function
Description
This function turns off the the error o the component, once issues have been sorted.
Usage
error_off(inputId)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
Value
no return value. This toggles off error CSS
See Also
Other Govstyle errors:
error_on(),
error_summary(),
error_summary_update()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
# Error text box
shinyGovstyle::text_Input(
inputId = "eventId",
label = "Event Name",
error = TRUE
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of eventId2
observeEvent(input$submit, {
if (input$eventId != "") {
shinyGovstyle::error_off(inputId = "eventId")
} else {
shinyGovstyle::error_on(
inputId = "eventId",
error_message = "Please complete"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Error on Function
Description
This function turns on the error for the component. Can be used to validate inputs.
Usage
error_on(inputId, error_message = NULL)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
error_message |
if you want to add an additional error message
Defaults to NULL, showing the original designed error message. Plain
character strings are escaped and render as literal text; pass a |
Value
no return value. This toggles on error CSS
See Also
Other Govstyle errors:
error_off(),
error_summary(),
error_summary_update()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
# Error text box
shinyGovstyle::text_Input(
inputId = "eventId",
label = "Event Name",
error = TRUE),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of eventId2
observeEvent(input$submit, {
if (input$eventId != ""){
shinyGovstyle::error_off(inputId = "eventId")
} else {
shinyGovstyle::error_on(
inputId = "eventId",
error_message = "Please complete"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Error Summary Function
Description
This function loads the error summary component to display error text. This replicates the gov style error boxes linked below: https://design-system.service.gov.uk/components/error-summary/
Usage
error_summary(inputId, error_title, error_list)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
error_title |
The title for the error summary |
error_list |
A list of text values to be displayed in the error body |
Value
an error_summary HTML shiny tag object
See Also
Other Govstyle errors:
error_off(),
error_on(),
error_summary_update()
Examples
ui <- shinyGovstyle::gov_page(
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
error_summary(
inputId = "errorId",
error_title = "Error title",
error_list = c("error item1", "error item2")
)
),
shinyGovstyle::button_Input("btn1", "Change error summary"),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
shiny::observeEvent(input$btn1, {
error_summary_update(
"errorId",
c("error item1", "error item2", "error item3")
)},
ignoreInit = TRUE
)
}
if (interactive()) shinyApp(ui = ui, server = server)
Error Summary Update Function
Description
This function changes the text that displays in the error summary box.
Requires shinyjs::useShinyjs() to work.
Usage
error_summary_update(inputId, error_list)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
error_list |
An updated list of text values to be displayed in the error body |
Value
an update error summary box
See Also
Other Govstyle errors:
error_off(),
error_on(),
error_summary()
Examples
ui <- shinyGovstyle::gov_page(
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
error_summary(
inputId = "errorId",
error_title = "Error title",
error_list = c("error item1", "error item2")
)
),
shinyGovstyle::button_Input("btn1", "Change error summary"),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
shiny::observeEvent(input$btn1, {
error_summary_update(
"errorId",
c("error item1", "error item2", "error item3")
)
},
ignoreInit = TRUE
)
}
if (interactive()) shinyApp(ui = ui, server = server)
External link
Description
It is commonplace for external links to open in a new tab, and when we do this we should be careful...
This function automatically adds the following to your link:
-
target="_blank"to open in new tab -
rel="noopener noreferrer"to prevent reverse tabnabbing
By default this function also adds "(opens in new tab)" to your link text to warn users of the behaviour.
This also adds "This link opens in a new tab" as a visually hidden span element within the HTML outputted to warn non-visual users of the behaviour.
The function will error if you end with a full stop, give a warning for particularly short link text and will automatically trim any leading or trailing white space inputted into link_text.
If you are displaying lots of links together and want to save space by avoiding repeating (opens in new tab), then you can set add_warning = FALSE and add a line of text above all of the links saying something like 'The following links open in a new tab'.
Setting add_warning = FALSE removes the visible text warning entirely, so sighted users lose the visual cue that the link behaves differently. Set add_warning = "icon" instead to add a small decorative arrow icon after the link text, giving sighted users a visual warning without repeating the full "(opens in new tab)" text. The icon is purely decorative (hidden from screen readers, which still get the same hidden warning as add_warning = FALSE), so it should be paired with an explanatory sentence above a group of links, not relied on as the only warning.
If href starts with mailto: (case-insensitive), the new-tab behaviour
is skipped entirely: no target="_blank"/rel="noopener noreferrer", no
"(opens in new tab)" text or hidden span, and add_warning = "icon" has no
effect, since a mailto link hands off to the mail client rather than
opening a new browser tab. link_text validation still applies as normal.
Related links and guidance:
Usage
external_link(href, link_text, add_warning = TRUE, footer = FALSE)
Arguments
href |
URL that you want the link to point to |
link_text |
Text that will appear describing your link, must be descriptive of the page you are linking to. Vague text like 'click here' or 'here' will cause an error, as will ending in a full stop. Leading and trailing white space will be automatically trimmed. If the string is shorter than 7 characters a console warning will be thrown. There is no way to hush this other than providing more detail |
add_warning |
One of TRUE (default), FALSE, or "icon", controlling how
users are warned that the link opens in a new tab. TRUE appends "(opens in
new tab)" to the visible link text. FALSE removes the visible text (a
visually hidden span still warns screen reader users) with no replacement
visual cue, for use with an explanatory sentence above a group of links.
"icon" behaves like FALSE but also adds a small decorative arrow icon
after the link text, giving sighted users a visual cue without repeating
the full text. Be careful and consider accessibility before moving away
from the default. Has no effect when |
footer |
Apply standard GDS footer CSS styling. Logical, default = FALSE |
Details
Intentionally basic wrapper for HTML anchor elements making it easier to
create safe external links with standard and accessible behaviour. For more
information on how the tag is generated, see htmltools::tags().
Value
shiny tag object
See Also
Other Govstyle actions:
download_button(),
download_link(),
download_radios(),
download_radios_handler()
Examples
external_link("https://shiny.posit.co/", "R Shiny")
external_link(
"https://shiny.posit.co/",
"R Shiny",
add_warning = FALSE
)
# Give sighted users a visual warning without repeating the text
external_link(
"https://shiny.posit.co/",
"R Shiny",
add_warning = "icon"
)
# This will trim and show as 'R Shiny'
external_link("https://shiny.posit.co/", " R Shiny")
# mailto: links skip the new-tab attributes, text, and icon
external_link("mailto:feedback@example.com", "feedback@example.com")
# Example of within text
shiny::tags$p(
"Oi, ", external_link("https://shiny.posit.co/", "R Shiny"), " is great."
)
# Example of multiple links together
shiny::tags$h2("Related resources")
shiny::tags$p("The following links open in a new tab.")
gov_list(
list = list(
external_link(
"https://shiny.posit.co/",
"R Shiny documentation",
add_warning = FALSE
),
external_link(
"https://www.python.org/",
"Python documentation",
add_warning = FALSE
),
external_link(
"https://nextjs.org/",
"Next.js documentation",
add_warning = FALSE
)
),
style = "bullet"
)
Shared fieldset arguments (internal)
Description
Documentation-only function. Holds the canonical @param entries for
label_size and heading_level, which are inherited by the input
functions that build on govFieldset() via @inheritParams.
Usage
fieldset_args(label_size, heading_level)
Arguments
label_size |
Size modifier for the legend. One of |
heading_level |
Optional heading level for the legend. If supplied
(an integer 1-6), the legend text is wrapped in a |
File Input Function
Description
This function create a file upload component. It uses the basis of the shiny fileInput function, but restyles the label and adds error onto it.
Usage
file_Input(
inputId,
label,
multiple = FALSE,
accept = NULL,
width = NULL,
buttonLabel = "Choose file",
placeholder = "No file chosen",
error = FALSE,
error_message = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
multiple |
Whether the user should be allowed to select and upload multiple files at once. Does not work on older browsers, including Internet Explorer 9 and earlier |
accept |
A character vector of MIME types; gives the browser a hint of what kind of files the server is expecting |
width |
The width of the input, e.g. |
buttonLabel |
The label used on the button. Can be text or an HTML tag object |
placeholder |
The text to show before a file has been uploaded |
error |
If |
error_message |
Text shown when |
Value
a file input HTML shiny tag object
See Also
Other Govstyle select inputs:
button_Input(),
checkbox_Input(),
radio_button_Input(),
select_Input(),
update_radio_button_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
# Simple file input
shinyGovstyle::file_Input(
inputId = "file1",
label = "Upload a file"
),
# Error file
shinyGovstyle::file_Input(
inputId = "file2",
label = "Upload a file",
error = TRUE
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of file2
observeEvent(input$submit, {
if (is.null(input$file2)){
shinyGovstyle::error_on(inputId = "file2")
} else {
shinyGovstyle::error_off(
inputId = "file2"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Font Function
Description
Loads the GDS Transport font for use in your app. GDS Transport is a restricted typeface that must only be used on GOV.UK domains. If your app is not hosted on a GOV.UK domain, do not call this function — the GOV.UK Frontend CSS will fall back to Helvetica or Arial automatically.
Usage
font()
Details
See the GOV.UK typeface guidance for full details on when GDS Transport is permitted.
Value
no value returned. This loads the font CSS file
Examples
ui <- shinyGovstyle::gov_page(
font(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png")
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Footer Function
Description
This function create a gov style footer for your page
Usage
footer(full = FALSE, links = NULL, width = "standard")
Arguments
full |
Whenever you want to have blank footer or official gov version.
Defaults to |
links |
A vector of actionLinks to be added to the footer, inputIDs are auto-generated and are the snake case version of the link text, e.g. "Accessibility Statement" will have an inputID of accessibility_statement |
width |
Width of the component. One of |
Details
You can add links in the footer to content either within the dashboard or content external to the dashboard using the links_list argument.
Links in the footer should be used sparingly and are usually for supporting information pages such as the accessibility statement, privacy notice, cookies information or link to a statement of voluntary adoption of the statistics code of practice.
If adding a link to an internal page, generally you will be controlling a hidden tabset so to the end user it looks like it is a new page.
Value
a footer HTML shiny tag object
See Also
Other Govstyle page structure:
cookieBanner(),
gov_page(),
header(),
layouts,
phase_banner(),
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice logo"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", "This is a new service"
),
shinyGovstyle::gov_text("Placeholder text"),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
# Add links
footer(links = c("Accessibility statement", "Cookies"))
# Add links, internal and external
footer(
links = c(
"Accessibility statement",
"Cookies",
`Government Digital Service` =
"https://www.gov.uk/government/organisations/government-digital-service"
)
)
# Full app with link controlling a hidden tab and a link to an external page
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice logo"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", "This is a new service"
),
shiny::tabsetPanel(
type = "hidden",
id = "tabs",
shiny::tabPanel(
"Main content",
value = "main",
heading_text("Hello world!")
),
shiny::tabPanel(
"Accessibility statement",
value = "accessibility-panel",
heading_text("Accessibility statement")
),
shiny::tabPanel(
"Cookies",
value = "cookies-panel",
heading_text("Cookies")
),
),
shinyGovstyle::footer(
full = TRUE,
links = c(
`Accessibility statement` = "accessibility_footer_link",
`Cookies` = "cookies_footer_link",
`Government Digital Service` =
paste0(
"https://www.gov.uk/government/",
"organisations/government-digital-service"
)
)
)
)
server <- function(input, output, session) {
shiny::observeEvent(input$accessibility_footer_link, {
shiny::updateTabsetPanel(
session,
"tabs",
selected = "accessibility-panel"
)
})
shiny::observeEvent(input$cookies_footer_link, {
shiny::updateTabsetPanel(
session,
"tabs",
selected = "cookies-panel"
)
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Create a footer link for use in footer() function
Description
Create a footer link for use in footer() function
Usage
footer_link(link, link_name = NULL)
Arguments
link |
Character string containing either link text or url. |
link_name |
Name of a link where a URL has been provided in |
Value
HTML tag list item
Examples
# Internal (i.e. within dashboard) link
shinyGovstyle:::footer_link("Cookie statement")
# Named internal link
shinyGovstyle:::footer_link("cookie_statement", "Cookies")
# External link
shinyGovstyle:::footer_link(
"https://www.gov.uk/government/organisations/government-digital-service",
"Government Digital Service"
)
Interactive govTable
Description
This function is opinionated and sets table defaults that are in
keeping with the wider GOV.UK design system. Some defaults can be overridden,
such as highlight=TRUE and borderless=TRUE, however some are fixed, such
as showSortIcon=FALSE as the default sort icon is inaccessible. Additional
arguments from reactable::reactable can be passed to customise the table.
Usage
govReactable(
df,
right_col = NULL,
page_size = 10,
highlight = TRUE,
borderless = TRUE,
min_widths = list(),
columns = list(),
...
)
Arguments
df |
A dataframe used to generate the table |
right_col |
A vector of column names that should be right-aligned. By default, numeric data is right-aligned, and character data is left-aligned |
page_size |
The default number of rows displayed per page (default: 10) |
highlight |
Highlight table rows on hover |
borderless |
Remove inner borders from table |
min_widths |
Customise minimum column width using a list of columns and minimum width in pixels |
columns |
Customise individual columns, for example to fix the
number of decimal places shown. Give a named list, where each name
matches a column in |
... |
Additional arguments passed to |
Details
This function inserts a government-styled table using reactable.
You can use this in R markdown or Quarto documents, or use
renderGovReactable() and govReactableOutput() for tables in R Shiny.
govReactableOutput() gives the ability to add a caption, for static
tables made using just govReactable(), use heading_text() to add
captions to tables.
Value
A reactable HTML widget styled with GOV.UK classes
See Also
Other Govstyle tables tabs and accordions:
accordion(),
govReactable-shiny,
govTable(),
govTabs()
Examples
# Example static table using govReactable
if (interactive()) {
govReactable(
iris,
right_col = c(
"Sepal.Length", "Sepal.Width", "Petal.Length", "Petal.Width"
)
)
govReactable(
iris,
right_col = c(
"Sepal.Length", "Sepal.Width", "Petal.Length", "Petal.Width"
),
highlight = FALSE,
page_size = 5,
min_widths = list(
Sepal.Length = 75,
Sepal.Width = 75,
Petal.Length = 75,
Petal.Width = 75
)
)
# Show one column to a fixed number of decimal places, leaving every
# other column and style (sorting, alignment, etc.) untouched
sales_data <- data.frame(
shop = c("Shop A", "Shop B", "Shop C"),
growth = c(4, 4.7, 12.34)
)
govReactable(
sales_data,
columns = list(
growth = reactable::colDef(
format = reactable::colFormat(digits = 1)
)
)
)
# A more involved example: only `percent` is customised, so `region`
# and `count` keep the normal GOV.UK defaults untouched
# (counts shown as whole numbers alongside a percentage column fixed
# to 1 decimal place)
count_pct_data <- data.frame(
region = c("North", "South", "East"),
count = c(1234, 56, 789),
percent = c(4, 4.7, 12.34)
)
govReactable(
count_pct_data,
right_col = c("count", "percent"),
columns = list(
percent = reactable::colDef(
format = reactable::colFormat(digits = 1)
)
)
)
}
Shiny bindings for govReactable Output and render functions for using govReactable within shiny apps
Description
Shiny bindings for govReactable Output and render functions for using govReactable within shiny apps
Usage
govReactableOutput(
output_table_name,
caption,
caption_size = "l",
heading_level = 2L
)
renderGovReactable(expr, env = parent.frame(), quoted = FALSE)
Arguments
output_table_name |
Output variable to read from |
caption |
Adds a caption to the table as a header |
caption_size |
Adjust the size of caption. One of |
heading_level |
The HTML heading level for the caption, an integer
from |
expr |
An expression that generates a |
env |
The environment in which to evaluate |
quoted |
Is |
Value
govReactableOutput() returns a reactable output element
that can be included in a Shiny UI
renderGovReactable() returns a reactable render function that
can be assigned to a Shiny output slot
See Also
Other Govstyle tables tabs and accordions:
accordion(),
govReactable(),
govTable(),
govTabs()
Examples
ui <- shinyGovstyle::gov_page(
govReactableOutput(
"table",
caption = "Example table"
)
)
server <- function(input, output, session) {
output$table <- renderGovReactable({
govReactable(iris)
})
}
if (interactive()) shinyApp(ui, server)
Table Function
Description
This function inserts a gov styled table. Format is with header looking rows and columns
Usage
govTable(
inputId,
df,
caption,
caption_size = "l",
num_col = NULL,
width_overwrite = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
df |
expects a dataframe to create a table |
caption |
adds a caption to the table as a header |
caption_size |
adjust the size of caption. One of |
num_col |
adds numeric class format to these columns |
width_overwrite |
change width. Need to include width for every column.
Columns must add up to 1.
Options are three-quarters, two-thirds, one-half, one-third, one-quarter.
Default is |
Details
For very large or interactive tables, consider
govReactable() instead. govTable() renders a static HTML table, which
becomes slow to render and harder to navigate as the number of rows grows.
A warning is emitted when df has more than 50 rows.
Value
a table HTML shiny tag object
See Also
Other Govstyle tables tabs and accordions:
accordion(),
govReactable(),
govReactable-shiny,
govTabs()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::gov_main_layout(
shinyGovstyle::govTable(
"tab1",
shinyGovstyle::transport_data_small,
"Test",
"l",
num_col = c(2,3),
width_overwrite = c("one-half", "one-quarter", "one-quarter")
)
)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Tabs Function
Description
This function creates a tabs based table. It requires a single dataframe with a grouping variable.
Usage
govTabs(inputId, df, group_col)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
df |
A single dataframe with all data. See example for structure |
group_col |
The column name with the groups to be used as tabs |
Value
a tab table HTML shiny tag object
See Also
Other Govstyle tables tabs and accordions:
accordion(),
govReactable(),
govReactable-shiny,
govTable()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice logo"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::govTabs("tabs", shinyGovstyle::case_data, "tabs")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Page layout (deprecated)
Description
gov_layout() was deprecated in shinyGovstyle 0.3.0 and will be removed in
shinyGovstyle 1.0.0. Use gov_main_layout() with gov_row() and
gov_box() instead, which also gives the page its <main> landmark:
# Before gov_layout(..., inputID = "main", size = "two-thirds", width = "standard") # After gov_main_layout( gov_row(gov_box(..., size = "two-thirds")), inputID = "main", width = "standard" )
inputID moves to gov_main_layout(inputID = ), size to
gov_box(size = ) and width to gov_main_layout(width = ). The inner
<inputID>_sub element is not recreated, so wrap the content in
shiny::tags$div(id = ...) if your own CSS or JavaScript targets it. With
the default size = "full" you don't need gov_row() or gov_box() at
all: put the content straight into gov_main_layout(...). Use one
gov_main_layout() per page; where gov_layout() was repeated inside tab
panels, put the content directly inside each panel instead (wrapped in
gov_row(gov_box(..., size = )) only if you set a narrower size).
Usage
gov_layout(..., inputID = "main", size = "full", width = "standard")
Arguments
... |
include the components of the UI that you want within the main page. |
inputID |
ID of the main div. Defaults to "main" |
size |
Layout of the page. Optional are full, one-half, two-thirds, one-third and one-quarter. Defaults to "full" |
width |
Width of the component. One of |
Value
a HTML shiny layout div
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::heading_text("Page heading", size = "l")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Gov List function
Description
Gov List function
Usage
gov_list(list, style = "none")
Arguments
list |
vector or list of items. Each item accepts a plain character
string, or |
style |
options: "none", "bullet", "number". defaults to "none" |
Value
A Shiny tag representing an ordered or unordered HTML list.
See Also
Other Govstyle text types:
date_Input(),
heading_text(),
input_field(),
text_Input(),
text_area_Input()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::heading_text("gov_list", size = "s"),
shinyGovstyle::gov_text("List:"),
gov_list(list = c("a", "b", "c")),
shinyGovstyle::gov_text("Bulleted list:"),
gov_list(list = c("a", "b", "c"), style = "bullet"),
shinyGovstyle::gov_text("Numbered list:"),
gov_list(list = c("one", "two", "three"), style = "number"),
shinyGovstyle::gov_text("List with a link:"),
gov_list(
list = list(
"Plain item",
shiny::tags$a(href = "https://www.gov.uk", "A link"),
shiny::tagList("Item with ", shiny::tags$b("bold"), " text")
),
style = "bullet"
)
)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
GOV.UK styled page wrapper
Description
gov_page() wraps bslib::page_fluid() so a shinyGovstyle app starts
from GOV.UK-friendly defaults instead of a blank page. bslib is now
generally the recommended way to build R Shiny UIs (rather than
shiny::fluidPage()), so shinyGovstyle builds on it too; you can mix
other bslib components into a shinyGovstyle app freely. gov_page()
sets the page language (important for screen readers), lets you add a
page description, and lets you set a default width for every
shinyGovstyle component in the page in one place, instead of repeating
width = on each of them.
Usage
gov_page(
...,
title = NULL,
lang = "en",
description = NULL,
width = "full",
theme = bslib::bs_theme()
)
Arguments
... |
The rest of your page: |
title |
Browser tab title, passed straight to
|
lang |
The page's language, as an
ISO language code # nolint
(e.g. |
description |
Short summary of the page, added as a
|
width |
Default width for every shinyGovstyle component used inside
|
theme |
A |
Value
a page HTML shiny tag object
See Also
Other Govstyle page structure:
cookieBanner(),
footer(),
header(),
layouts,
phase_banner(),
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
title = "My dashboard",
description = "A dashboard showing my department's latest statistics",
width = "three-quarters",
shinyGovstyle::header(
org_name = "Example",
service_name = "My dashboard"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::heading_text("Welcome", size = "l", level = 1)
),
shinyGovstyle::footer()
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Tabs Function
Description
This function creates a tabs based table. It requires a single dataframe with a grouping variable.
Usage
gov_summary(inputId, headers, info, action = FALSE, border = TRUE)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
headers |
input for the row headers value |
info |
Summary information values for the table. Each value accepts a
plain character string, or |
action |
whenever a change link is needed. Sets input to the value of
the headers using lowercase and with underscore to replace gaps. Default
set to |
border |
set if the table should have borders. Default set
to |
Value
a summary list table HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_tag(),
inset_text(),
label_hint(),
noti_banner(),
value_box(),
warning_text()
Examples
# Create an example dataset
headers <- c(
"Name",
"Date of birth",
"Contact information",
"Contact details"
)
info <- c(
"Sarah Philips",
"5 January 1978",
"72 Guild Street <br> London <br> SE23 6FH",
"07700 900457 <br> sarah.phillips@example.com"
)
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::gov_summary("sumID", headers, info, action = FALSE)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Tag
Description
This function creates the GOV.UK tag component, used to show users the status of something.
Usage
gov_tag(inputId, text, colour = "navy")
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
text |
The text in the tag |
colour |
The colour of the tag. Default is navy. Other options are grey, green, teal, blue, purple, magenta, red, orange and yellow. Any other value gives a warning listing these options |
Value
a tag HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
inset_text(),
label_hint(),
noti_banner(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::gov_tag("tag1", "Complete"),
shinyGovstyle::gov_tag("tag2", "Incomplete", "red")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Header Function
Description
This function create a header banner. For use at top of the screen
Usage
header(
org_name = "Shiny example app",
service_name = NULL,
logo = "shinyGovstyle/images/Dept_logo.svg",
main_text = lifecycle::deprecated(),
secondary_text = lifecycle::deprecated(),
main_link = lifecycle::deprecated(),
secondary_link = lifecycle::deprecated(),
logo_alt_text = "Departmental logo",
main_alt_text = lifecycle::deprecated(),
secondary_alt_text = lifecycle::deprecated(),
logo_width = 66,
logo_height = 34,
width = "standard"
)
Arguments
org_name |
Organisation name that goes in the header |
service_name |
Service name to supplement the organisation name |
logo |
Add a link to a logo which will apply in the header. Use crown to use the crown SVG version on GOV UK |
main_text |
|
secondary_text |
|
main_link |
|
secondary_link |
|
logo_alt_text |
Add alternative text for the logo. Should be used when a logo is used |
main_alt_text |
|
secondary_alt_text |
|
logo_width |
Change the logo size width CSS to improve fit |
logo_height |
Change the logo size height CSS to improve fit |
width |
Width of the component. One of |
Value
a header HTML shiny tag object
See Also
Other Govstyle page structure:
cookieBanner(),
footer(),
gov_page(),
layouts,
phase_banner(),
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice Logo"
)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Heading Text Function
Description
This function creates heading text
Usage
heading_text(text_input, size = "xl", id, level = 1)
Arguments
text_input |
Text to display |
size |
Text size, one of |
id |
Custom header id |
level |
Heading level, integer between 1 and 6. Defaults to 1 |
Value
a heading text HTML shiny tag object
See Also
Other Govstyle text types:
date_Input(),
gov_list(),
input_field(),
text_Input(),
text_area_Input()
Examples
shinyGovstyle::heading_text("This is great text")
shinyGovstyle::heading_text("This is great text", size = "l", level = 2)
Shared input-state arguments (internal)
Description
Documentation-only function. Holds the canonical @param entries for the
trio of params that describe an input's visible state (hint_label,
error, error_message), inherited by functions via @inheritParams.
Functions without a hint_label in their signature inherit only the
applicable subset.
Usage
hint_error_args(hint_label, error, error_message)
Arguments
hint_label |
Optional hint text shown beneath the label to guide the
user. |
error |
If |
error_message |
Text shown when |
Shared id argument (internal)
Description
Documentation-only function. Holds the canonical @param entry for
inputId, inherited by consumers via @inheritParams.
Usage
id_arg(inputId)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
Input Field Function
Description
This function inserts number of text inputs. Useful for addresses.
Usage
input_field(
legend,
labels,
inputIds,
widths = NULL,
types = "text",
error = FALSE,
error_message = NULL
)
Arguments
legend |
Legend that goes above the fieldset |
labels |
A list of labels for the text inputs |
inputIds |
A list input slots that will be used to access the value |
widths |
control the size of the box based on number of characters required. Options are 30, 20, 10, 5, 4, 3, 2. NULL will not limit the size |
types |
text box types. Will default to text |
error |
If |
error_message |
Text shown when |
Value
a input field of HTML as a shiny tag object
See Also
Other Govstyle text types:
date_Input(),
gov_list(),
heading_text(),
text_Input(),
text_area_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::input_field(
legend ="List of three text boxes in a field",
labels = c("Field 1", "Field 2", "Field 3"),
inputIds = c("field1", "field2", "field3"),
widths = c(30,20,10),
error = TRUE
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of field2
observeEvent(input$submit, {
if (input$field2 == ""){
shinyGovstyle::error_on(
inputId = "field2",
error_message = "Please complete"
)
} else {
shinyGovstyle::error_off(
inputId = "field2"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Insert text (deprecated)
Description
insert_text() was renamed to inset_text() in shinyGovstyle 0.3.0 to
match the name of the GOV.UK Design System component. It will be removed in
shinyGovstyle 1.0.0.
Usage
insert_text(inputId, content, text = lifecycle::deprecated())
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
content |
Content to display in the inset. Accepts a plain character
string, or |
text |
Value
an inset text HTML shiny tag object
Examples
# Before
# insert_text(inputId = "note", content = "Some supporting text")
# After
inset_text(inputId = "note", content = "Some supporting text")
Inset text
Description
This function creates the GOV.UK inset text component, used to differentiate a block of text from the content that surrounds it, for example a quote, example, or additional information about the page.
Usage
inset_text(inputId, content)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
content |
Content to display in the inset. Accepts a plain character
string, or |
Value
an inset text HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
gov_tag(),
label_hint(),
noti_banner(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::inset_text(
inputId = "note",
content = paste(
"It can take up to 8 weeks to register a lasting power of",
"attorney if there are no mistakes in the application."
)
),
shinyGovstyle::inset_text(
inputId = "note-rich",
content = shiny::tagList(
shiny::tags$b("Important: "),
"you can also pass tag objects."
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Label with Hint Function
Description
This function inserts a label and optional hint.
Usage
label_hint(inputId, label, hint_input = NULL)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
hint_input |
Display hint label for the control, or |
Value
a label hint HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
gov_tag(),
inset_text(),
noti_banner(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
label_hint(
inputId = "label1",
label = "This is a label",
hint_input = "This is a hint"
),
# Rich content: a link in the hint
label_hint(
inputId = "label2",
label = "Bold label",
hint_input = shiny::tagList(
"See the ",
shinyGovstyle::external_link(
"https://www.gov.uk",
"GOV.UK guidance"
)
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Page Layout Functions
Description
Build the main content area of a GOV.UK page. gov_main_layout() creates
the page's <main> landmark, and content can go straight inside it: items
simply stack one below the other. Use gov_row() and gov_box() only when
you need GOV.UK grid columns, such as two boxes side by side or a section
with a set column width. gov_text() is a container for body text.
Usage
gov_main_layout(..., inputID = "main", width = "standard")
gov_row(...)
gov_box(..., size = "full")
gov_text(...)
Arguments
... |
include the components of the UI that you want within the main page. These components are made to flow through each other. See example |
inputID |
ID of the main div. Defaults to "main" |
width |
Width of the component. One of |
size |
size of the box in the row. Optional are full, one-half, two-thirds, one-third, three-quarters and one-quarter. Defaults to "full" |
Value
a HTML shiny layout div
See Also
Other Govstyle page structure:
cookieBanner(),
footer(),
gov_page(),
header(),
phase_banner(),
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"),
shinyGovstyle::gov_main_layout(
# Content with no columns goes straight into gov_main_layout()
shinyGovstyle::heading_text("Page heading", size = "l"),
shinyGovstyle::gov_text("Items stack one below the other."),
# Use gov_row() and gov_box() for side-by-side columns
shinyGovstyle::gov_row(
shinyGovstyle::gov_box(
size = "one-half",
shinyGovstyle::gov_text("govuk-grid-column-one-half")
),
shinyGovstyle::gov_box(
size = "one-half",
shinyGovstyle::gov_text("govuk-grid-column-one-half")
)
),
shinyGovstyle::gov_row(
shinyGovstyle::gov_box(
size = "one-third",
shinyGovstyle::gov_text("govuk-grid-column-one-third")
),
shinyGovstyle::gov_box(
size = "two-thirds",
shinyGovstyle::gov_text("govuk-grid-column-two-thirds")
)
),
shinyGovstyle::gov_row(
shinyGovstyle::gov_box(
size = "one-quarter",
shinyGovstyle::gov_text("govuk-grid-column-one-quarter")
),
shinyGovstyle::gov_box(
size = "three-quarters",
shinyGovstyle::gov_text("govuk-grid-column-three-quarters")
)
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Shared link arguments (internal)
Description
Documentation-only function. Holds the canonical @param entries for
link and link_name, inherited by the internal link helpers used by
footer() and service_navigation().
Usage
link_args(link, link_name)
Arguments
link |
Character string containing either link text or url. |
link_name |
Name of a link where a URL has been provided in |
Navigate to a page in one call
Description
Switches the visible tab panel and updates the active service navigation link in a single call. Use this for programmatic navigation — next / back buttons, modal links, footer shortcuts to a main page — where the user has not clicked a nav link directly.
When service_navigation() is used with auto_page_title = TRUE (the
default), the browser tab title is updated automatically too, because
update_service_navigation() triggers the title sync via the
JavaScript binding.
By default the nav link inputId is also used as the target tab panel
value. When they differ — for example when nav inputIds carry a prefix
like sn_ to disambiguate from panel values — pass panel explicitly.
Usage
navigate_to(session, tabset_id, inputId, panel = inputId)
Arguments
session |
The Shiny session object |
tabset_id |
The |
inputId |
The nav link inputId to set as the active item in the
service navigation. It is cleaned up the same way as in
|
panel |
The |
Value
NULL, called for side effects
See Also
Other Govstyle navigation:
backlink_Input(),
service_navigation(),
service_navigation_server(),
update_page_title(),
update_service_navigation()
Examples
# Next / back buttons that cross page boundaries — inputId and panel
# value match, so a single id is enough.
ui <- shinyGovstyle::gov_page(
shinyGovstyle::service_navigation(c("Page one", "Page two")),
bslib::navset_hidden(
id = "tabs",
bslib::nav_panel("page_one", shiny::actionButton("next_btn", "Next")),
bslib::nav_panel("page_two", "Page two content")
)
)
server <- function(input, output, session) {
shiny::observeEvent(input$next_btn, {
shinyGovstyle::navigate_to(session, "tabs", "page_two")
})
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
# Mismatched inputId and panel value — name the panel explicitly.
# The nav links use an `sn_` prefix on their inputIds so they don't clash
# with any other inputs in the app. The panel values are unrelated names.
ui <- shinyGovstyle::gov_page(
shinyGovstyle::service_navigation(
# names = link text shown to the user, values = nav inputIds
c(Home = "sn_home", Cookies = "sn_cookies")
),
bslib::navset_hidden(
id = "tabs",
# first arg of nav_panel() is the panel value
bslib::nav_panel("start", shiny::actionButton("cookies_btn", "Cookies")),
bslib::nav_panel("policy", "Cookies content")
)
)
server <- function(input, output, session) {
shiny::observeEvent(input$cookies_btn, {
# inputId = nav link to highlight; panel = tab panel to show
shinyGovstyle::navigate_to(
session, "tabs", inputId = "sn_cookies", panel = "policy"
)
})
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Notification Banner Function
Description
This function creates a notification banner.
Usage
noti_banner(
inputId,
title_txt = "Important",
body_txt = NULL,
type = "standard"
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
title_txt |
The wording that appears in the title |
body_txt |
The wording that appears in the banner body. Accepts a
plain character string, or |
type |
The type of banner. Options are standard and success. Standard is default |
Value
a notification HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
gov_tag(),
inset_text(),
label_hint(),
value_box(),
warning_text()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::noti_banner(
inputId = "banner", title_txt = "Important", body_txt = "Example text"
)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Panel output (deprecated)
Description
panel_output() was renamed to confirmation_panel() in shinyGovstyle
0.3.0, with main_text becoming title and sub_text becoming content.
The output is unchanged. panel_output() will be removed in shinyGovstyle
1.0.0.
Usage
panel_output(inputId, main_text, sub_text)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
main_text |
Use |
sub_text |
Use |
Value
a panel HTML shiny tag object
Examples
# Before
# panel_output("panel1", main_text = "Application complete",
# sub_text = "Your reference is xvsiq")
# After
confirmation_panel(
"panel1",
title = "Application complete",
content = "Your reference is xvsiq"
)
Phase banner
Description
This function creates the GOV.UK phase banner component, used to show that a service is still being worked on, for example in alpha or beta.
Usage
phase_banner(
inputId,
type,
label = NULL,
feedback_url = NULL,
width = "standard"
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
type |
Main type of label e.g. alpha or beta. Can be any word |
label |
Text to display. Accepts a plain character string, or |
feedback_url |
Optional URL used to auto-generate the standard GOV.UK
phase banner feedback text, e.g. "This is a new service - your feedback
(opens in new tab) will help us to improve it.", with |
width |
Width of the component. One of |
Value
a phase banner HTML shiny tag object
See Also
Other Govstyle page structure:
cookieBanner(),
footer(),
gov_page(),
header(),
layouts,
skip_to_main()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "Beta", 'This is a new service'
)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
# Auto-generate the standard feedback text from a URL
shinyGovstyle::phase_banner(
inputId = "banner",
type = "Beta",
feedback_url = "https://example.com/feedback"
)
# Auto-generate contact text from a mailto: link
shinyGovstyle::phase_banner(
inputId = "banner",
type = "Beta",
feedback_url = "mailto:feedback@example.com"
)
Radio Button Function
Description
This function create radio buttons
Usage
radio_button_Input(
inputId,
label,
choices = NULL,
selected = NULL,
inline = FALSE,
small = FALSE,
choiceNames = NULL,
choiceValues = NULL,
hint_label = NULL,
error = FALSE,
error_message = NULL,
custom_class = "",
label_size = c("m", "s", "l", "xl"),
heading_level = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
choices |
List of values to select from (if elements of the list are named then that name rather than the value is displayed to the user) |
selected |
The initially selected value. |
inline |
If you want the radio inline or not, Default is FALSE |
small |
If you want the smaller versions of radio buttons, Default is FALSE |
choiceNames, choiceValues |
Same as in
|
hint_label |
Display hint label for the control, or |
error |
If |
error_message |
Text shown when |
custom_class |
If you want to add additional classes to the radio buttons |
label_size |
Size modifier for the legend. One of |
heading_level |
Optional heading level for the legend. If supplied
(an integer 1-6), the legend text is wrapped in a |
Value
radio buttons HTML shiny tag object
See Also
Other Govstyle select inputs:
button_Input(),
checkbox_Input(),
file_Input(),
select_Input(),
update_radio_button_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", "This is a new service"
),
shinyGovstyle::gov_main_layout(
# Simple radio
shinyGovstyle::radio_button_Input(
inputId = "radio1",
choices = c("Yes", "No", "Maybe"),
label = "Choice option"
),
# Error radio
shinyGovstyle::radio_button_Input(
inputId = "radio2",
choices = c("Yes", "No", "Maybe"),
label = "Choice option",
hint_label = "Select the best fit",
inline = TRUE,
error = TRUE,
error_message = "Select one"
),
# Rich content: a link in the hint
shinyGovstyle::radio_button_Input(
inputId = "radio3",
choices = c("Yes", "No", "Maybe"),
label = "Choice option",
hint_label = shiny::tagList(
"See the ",
shinyGovstyle::external_link(
"https://www.gov.uk",
"GOV.UK guidance"
)
)
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of eventId2
observeEvent(input$submit, {
if (is.null(input$radio2)) {
shinyGovstyle::error_on(inputId = "radio2")
} else {
shinyGovstyle::error_off(
inputId = "radio2"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Run examples
Description
This function runs an example R Shiny app showcasing different parts of the package. Code for the app can be found in the inst/example_app folder in the source code.
Usage
run_example()
Details
The app uses the bslib package as is generally recommended for Shiny apps.
The app is also deployed at the following URL: https://department-for-education.shinyapps.io/shinygovstyle-example-app/
Value
runs an R Shiny app with examples in
Examples
if (interactive()) run_example()
Select Function
Description
This function inserts a select box
Usage
select_Input(inputId, label, select_text, select_value)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
select_text |
Add the text that will apply in the drop down as a list |
select_value |
Add the value that will be used for each selection |
Value
a select input HTML shiny tag object
See Also
Other Govstyle select inputs:
button_Input(),
checkbox_Input(),
file_Input(),
radio_button_Input(),
update_radio_button_Input()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png",
logo_alt_text = "Ministry of Justice logo"
),
shinyGovstyle::gov_main_layout(
select_Input(
inputId = "sorter",
label = "Sort by",
select_text = c(
"Recently published",
"Recently updated",
"Most views",
"Most comments"
),
select_value = c("published", "updated", "view", "comments")
),
shinyGovstyle::gov_text("Placeholder text")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)
Service navigation
Description
Service navigation component consistent with the GDS service navigation. # nolint
Note: This component uses a hardcoded element ID
for the navigation list and mobile menu toggle. Using
multiple service_navigation() instances on the same
page will cause ID conflicts and the mobile menu toggle
may not work correctly.
The first link is marked as the current page when the app loads, matching
the first tab panel Shiny shows by default. If your app starts on a
different page, call update_service_navigation() when the session starts.
Put service_navigation() in your app's top-level UI and wire it up from
the top-level server function. It is not designed to be used inside a
Shiny module: an inputID wrapped in ns() is cleaned up like any other
(so NS("mod", "summary") becomes mod_summary), and no longer matches
the module's namespaced input.
Usage
service_navigation(
links,
service_name = NULL,
auto_page_title = TRUE,
page_title_suffix = NULL,
width = "standard"
)
Arguments
links |
A character vector of link text for the service navigation.
Each link's inputID is generated by lowercasing the text and replacing every
non-alphanumeric character with an underscore, e.g. "Overview page" becomes
|
service_name |
An optional character string containing the service name to be displayed in the navigation bar |
auto_page_title |
Logical. When |
page_title_suffix |
Optional character string
appended to the page title in the format
|
width |
Width of the component. One of |
Value
Shiny tag object
See Also
Other Govstyle navigation:
backlink_Input(),
navigate_to(),
service_navigation_server(),
update_page_title(),
update_service_navigation()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header("Title", "Secondary heading"),
shinyGovstyle::service_navigation(
c("Summary data", "Detailed stats 1", "User guide")
),
bslib::navset_hidden(
id = "main_panels",
bslib::nav_panel(
"summary_data",
shiny::tags$h2("Summary data")
),
bslib::nav_panel(
"detailed_stats_1",
shiny::tags$h2("Detailed stats 1")
),
bslib::nav_panel(
"user_guide",
shiny::tags$h2("User guide")
)
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
observeEvent(
input$summary_data,
bslib::nav_select("main_panels", "summary_data")
)
observeEvent(
input$detailed_stats_1,
bslib::nav_select("main_panels", "detailed_stats_1")
)
observeEvent(
input$user_guide,
bslib::nav_select("main_panels", "user_guide")
)
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Auto-wire service navigation links to tabset panels
Description
Sets up one observer per nav link that switches the corresponding tab
panel when the link is clicked. Eliminates the per-link
observeEvent() boilerplate that multi-page apps would otherwise need.
Call once in your server function, after service_navigation() has been
added to the UI. The active nav highlight and (when
auto_page_title = TRUE) the browser tab title are already handled
client-side, so no additional wiring is needed.
Usage
service_navigation_server(session, tabset_id, link_to_panel)
Arguments
session |
The Shiny session object |
tabset_id |
The |
link_to_panel |
A character vector mapping nav link inputIds to
tab panel values. Pass a named vector when inputIds differ from
panel values (names = inputIds, values = panel values). Pass an
unnamed vector as shorthand for the 1:1 case — each element is
used as both the nav inputId and the panel value. InputIds are cleaned
up the same way as in |
Value
NULL, called for side effects
See Also
Other Govstyle navigation:
backlink_Input(),
navigate_to(),
service_navigation(),
update_page_title(),
update_service_navigation()
Examples
ui <- shinyGovstyle::gov_page(
shinyGovstyle::service_navigation(
c(Summary = "sn_summary", Detail = "sn_detail")
),
bslib::navset_hidden(
id = "tabs",
bslib::nav_panel("summary", "Summary content"),
bslib::nav_panel("detailed_data", "Detail content")
)
)
server <- function(input, output, session) {
# Nav inputIds differ from panel values
shinyGovstyle::service_navigation_server(
session,
tabset_id = "tabs",
link_to_panel = c(
sn_summary = "summary",
sn_detail = "detailed_data"
)
)
# Or, when inputIds match panel values exactly:
# shinyGovstyle::service_navigation_server(
# session,
# tabset_id = "tabs",
# link_to_panel = c("summary", "detailed_data")
# )
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Skip to main content link
Description
This function generates a 'Skip to main content' link, which is typically used by keyboard users to bypass content and navigate directly to the main content of a page.
Usage
skip_to_main(id = "main")
Arguments
id |
An optional parameter to specify the Id of the main content
section, will be automatically preceded by a hash '#'. Default is
"main" to match the "#main" Id within |
Value
A Shiny tag representing the 'Skip to main content' link
See Also
Other Govstyle page structure:
cookieBanner(),
footer(),
gov_page(),
header(),
layouts,
phase_banner()
Examples
ui <- shinyGovstyle::gov_page(
skip_to_main(),
header(
org_name = "Example",
service_name = "User Examples",
logo="shinyGovstyle/images/moj_logo.png"
),
gov_main_layout(
heading_text("Example heading"),
)
)
server <- function(input, output, session){}
if (interactive()) shinyApp(ui = ui, server = server)
Tag input (deprecated)
Description
tag_Input() was renamed to gov_tag() in shinyGovstyle 0.3.0. The tag is
a display component rather than a Shiny input, so the _Input suffix was
misleading. The arguments and output are unchanged. tag_Input() will be
removed in shinyGovstyle 1.0.0.
Usage
tag_Input(inputId, text, colour = "navy")
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
text |
The text in the tag |
colour |
The colour of the tag. Default is navy. Other options are grey, green, teal, blue, purple, magenta, red, orange and yellow. Any other value gives a warning listing these options |
Value
a tag HTML shiny tag object
Examples
# Before
# tag_Input("tag1", "Complete")
# After
gov_tag("tag1", "Complete")
Text Input Function
Description
This function create a text input.
Usage
text_Input(
inputId,
label,
hint_label = NULL,
type = "text",
width = NULL,
error = FALSE,
error_message = NULL,
prefix = NULL,
suffix = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
hint_label |
Display hint label for the control, or |
type |
Type of text input to accept. Defaults to text |
width |
control the size of the box based on number of characters required. Options are 30, 20, 10, 5, 4, 3, 2. NULL will not limit the size |
error |
If |
error_message |
Text shown when |
prefix |
Add a prefix to the box. Defaults to NULL |
suffix |
Add a suffix to the box. Defaults to NULL |
Value
a text input HTML shiny tag object
See Also
Other Govstyle text types:
date_Input(),
gov_list(),
heading_text(),
input_field(),
text_area_Input()
Examples
ui <- shinyGovstyle::gov_page(
# Required for error handling function
shinyjs::useShinyjs(),
shinyGovstyle::header(
org_name = "Example",
service_name = "User Examples",
logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::phase_banner(
inputId = "banner", type = "beta", 'This is a new service'
),
shinyGovstyle::gov_main_layout(
# Simple text box
shinyGovstyle::text_Input(inputId = "eventId", label = "Event Name"),
# Error text box
shinyGovstyle::text_Input(
inputId = "eventId2",
label = "Event Name",
hint_label = "This can be found on the letter",
error = TRUE
),
# Rich content: a link in the hint
shinyGovstyle::text_Input(
inputId = "eventId3",
label = "Event Name",
hint_label = shiny::tagList(
"As shown on your ",
shinyGovstyle::external_link(
"https://www.gov.uk",
"confirmation letter"
)
)
),
# Button to trigger error
shinyGovstyle::button_Input(inputId = "submit", label = "Submit")
),
shinyGovstyle::footer(full = TRUE)
)
server <- function(input, output, session) {
# Trigger error on blank submit of eventId2
observeEvent(input$submit, {
if (input$eventId2 != "") {
shinyGovstyle::error_off(inputId = "eventId2")
} else {
shinyGovstyle::error_on(
inputId = "eventId2",
error_message = "Please complete"
)
}
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Text Area Input Function
Description
This function create a text area input.
Usage
text_area_Input(
inputId,
label,
hint_label = NULL,
row_no = 5,
error = FALSE,
error_message = NULL,
word_limit = NULL
)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
label |
Display label for the control, or |
hint_label |
Display hint label for the control, or |
row_no |
Size of the text entry box. Defaults to 5 |
error |
If |
error_message |
Text shown when |
word_limit |
Add a word limit to the display. Defaults to |
Value
a text area box HTML shiny tag object
See Also
Other Govstyle text types:
date_Input(),
gov_list(),
heading_text(),
input_field(),
text_Input()
Examples
text_area_Input(
"taId",
"Can you provide more detail?",
paste(
"Do not include personal or financial information, like your",
"National Insurance number or credit card details."
)
)
# Rich content: a link in the hint
text_area_Input(
"taId2",
"Can you provide more detail?",
shiny::tagList(
"Read the ",
shinyGovstyle::external_link("https://www.gov.uk", "guidance on detail")
)
)
Transport data
Description
Simple example dataset containing transport data, used to demonstrate various table styles in the example app.
Usage
transport_data
Format
A data frame with 10 rows and 5 variables:
- months
The month the data belongs to
- colours
The colour of the vehicle
- bikes
Cost of bikes
- vans
Cost of vans
- buses
Cost of buses
Source
Random data generated for the shinyGovstyle package
Transport data small
Description
Smaller example dataset containing transport data, used to demonstrate various table styles in the example app.
Usage
transport_data_small
Format
A data frame with 3 rows and 3 variables:
- months
The month the data belongs to
- bikes
Cost of bikes
- cars
Cost of cars
Source
Random data generated for the shinyGovstyle package
Update the browser page title
Description
Sends a message to the browser to update document.title — the text shown
in the browser tab. Use this to keep the page title in sync with the
content currently on display.
Keeping the page title in sync with the visible page is a GOV.UK Design System recommendation: screen readers announce the title on navigation, and the tab text helps users orient themselves when many tabs are open.
When you need this function: when navigation is triggered programmatically (next / back buttons, footer links pointing to a main page, modal dialogue links) and the visible page changes without the user clicking a nav link directly. Also useful when the page heading differs from the nav link label and you want the tab title to match the heading.
When you don't need this function: when the user clicks a
service_navigation() link directly and the page title should just match
the link text. service_navigation() syncs the title automatically by
default — see its auto_page_title argument.
The JavaScript handler ships with every shinyGovstyle component, so
update_page_title() works in any app that uses at least one
shinyGovstyle function in its UI.
Usage
update_page_title(session, page_title, service_name = NULL)
Arguments
session |
The Shiny session object |
page_title |
Character string with the new page title (typically the page heading or nav link text) |
service_name |
Optional character string. When supplied, the browser
tab title is set to |
Value
NULL, called for side effects
See Also
Other Govstyle navigation:
backlink_Input(),
navigate_to(),
service_navigation(),
service_navigation_server(),
update_service_navigation()
Examples
# Programmatic navigation — keep the page title in sync with the new page.
ui <- shinyGovstyle::gov_page(
shinyGovstyle::service_navigation(c("Page one", "Page two")),
bslib::navset_hidden(
id = "tabs",
bslib::nav_panel("page_one", shiny::actionButton("next_btn", "Next")),
bslib::nav_panel("page_two", "Page two content")
)
)
server <- function(input, output, session) {
shiny::observeEvent(input$next_btn, {
bslib::nav_select("tabs", "page_two")
shinyGovstyle::update_service_navigation(session, "page_two")
shinyGovstyle::update_page_title(
session,
page_title = "Page two",
service_name = "My service"
)
})
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Update a Govstyle radio button input on the client
Description
Server-side companion to radio_button_Input(), mirroring
shiny::updateRadioButtons(). Use it to change the selected option, the
available choices, or the label of an existing radio button group from
within an observer, for example to keep a cookies settings radio in sync
with a choice the user made elsewhere.
Usage
update_radio_button_Input(
session = shiny::getDefaultReactiveDomain(),
inputId,
label = NULL,
choices = NULL,
selected = NULL,
inline = FALSE,
small = FALSE,
choiceNames = NULL,
choiceValues = NULL
)
Arguments
session |
The |
inputId |
The id of the |
label |
New label for the input, or |
choices |
New vector of choices, or |
selected |
The value to select, or |
inline |
Whether the radios are inline. Only applies when |
small |
Whether to use the smaller radios. Only applies when |
choiceNames, choiceValues |
As in |
Details
Only the arguments you supply are sent to the client; everything left at its
default of NULL is left untouched. Because it relies on
session$sendInputMessage(), the inputId is namespaced automatically when
called inside a Shiny module, so pass the unnamespaced id just as you would
to shiny::updateRadioButtons().
This function is deliberately agnostic about why you are updating the radio, which makes it a useful building block for packages that layer extra behaviour (such as analytics cookie consent) on top of shinyGovstyle. See the cookies and analytics vignette for an example of extending it.
Value
Called for its side effect of sending a message to the client; no return value
See Also
Other Govstyle select inputs:
button_Input(),
checkbox_Input(),
file_Input(),
radio_button_Input(),
select_Input()
Examples
ui <- shinyGovstyle::gov_page(
shinyjs::useShinyjs(),
shinyGovstyle::radio_button_Input(
inputId = "cookies",
label = "Do you want to accept analytics cookies?",
choices = c("Yes" = "yes", "No" = "no"),
selected = "no",
inline = TRUE
),
shinyGovstyle::button_Input(inputId = "accept", label = "Accept cookies")
)
server <- function(input, output, session) {
# Keep the radio in sync with a choice made elsewhere
shiny::observeEvent(input$accept, {
shinyGovstyle::update_radio_button_Input(
session,
inputId = "cookies",
selected = "yes"
)
})
}
if (interactive()) shinyApp(ui = ui, server = server)
Update the active item in a service navigation component
Description
Sends a message to the browser to update the highlighted active item in the service navigation bar.
When you need this function: when navigation is triggered
programmatically — for example, via a next / back button or a footer link
that points to a main page. In those cases the nav link itself is not
clicked, so the JavaScript binding does not fire and the active state does
not update automatically. Call update_service_navigation() alongside
your tab-switching call to keep them in sync.
When you don't need this function: when the user clicks a service
navigation link directly. The JavaScript binding updates the active state
automatically, so you only need to switch the tab panel in your
observeEvent().
inputId is cleaned up the same way as in service_navigation(), so you
can pass either the inputID you supplied there (e.g. "Page-Two") or its
cleaned form ("page_two").
Usage
update_service_navigation(session, inputId)
Arguments
session |
The Shiny session object |
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
Value
NULL, called for side effects
See Also
Other Govstyle navigation:
backlink_Input(),
navigate_to(),
service_navigation(),
service_navigation_server(),
update_page_title()
Examples
# Works the same with shiny::tabsetPanel() + shiny::updateTabsetPanel().
ui <- shinyGovstyle::gov_page(
shinyGovstyle::service_navigation(c("Page one", "Page two")),
bslib::navset_hidden(
id = "tabs",
bslib::nav_panel("page_one", shiny::actionButton("next_btn", "Next")),
bslib::nav_panel("page_two", "Page two content")
)
)
server <- function(input, output, session) {
# Nav link clicked — JS handles the active state, just switch the panel.
shiny::observeEvent(input$page_two, {
bslib::nav_select("tabs", "page_two")
})
# Programmatic navigation — the nav link is not clicked, so call
# update_service_navigation() explicitly.
shiny::observeEvent(input$next_btn, {
bslib::nav_select("tabs", "page_two")
shinyGovstyle::update_service_navigation(session, "page_two")
})
}
if (interactive()) shiny::shinyApp(ui = ui, server = server)
Create a value text box with optional description and colour
Description
This function generates a value text box with an optional description and customisable colour.
Usage
value_box(value = "your value goes here", text = NA, colour = "blue")
Arguments
value |
Character. The primary value to display in the value box. Defaults to "your value goes here" |
text |
Character or NA. An optional description to appear below the value. If not provided (default is NA), the description will not be displayed |
colour |
Character. A colour to apply to the value box. Defaults to "blue". Choose from the following: "grey", "purple", "teal", "blue", "yellow", "orange", "red", "magenta", or "green". Any other value gives a warning listing these options |
Details
The text box can be used in Shiny applications to display highlighted information, such as statistics or key metrics.
Value
A Shiny div tag representing the value box, styled according
to the specified parameters
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
gov_tag(),
inset_text(),
label_hint(),
noti_banner(),
warning_text()
Examples
value_box(
value = "1,000,000",
text = "This is the latest value for the selected inputs.",
colour = "purple"
)
Warning Text Function
Description
This function create warning text.
Usage
warning_text(inputId, text)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
text |
Text that goes in the main. Accepts a plain character string,
or |
Value
a warning box HTML shiny tag object
See Also
Other Govstyle feedback types:
confirmation_panel(),
details(),
gov_summary(),
gov_tag(),
inset_text(),
label_hint(),
noti_banner(),
value_box()
Examples
shinyGovstyle::warning_text(
inputId = "warn1",
text = "You can be fined up to £5,000 if you do not register."
)
Shared width argument (internal)
Description
Documentation-only function. Holds the canonical @param entry for a
component's own width, inherited via @inheritParams by every
component that wraps a .govuk-width-container. gov_page() documents
its width separately, since there it sets an ambient default for child
components rather than the component's own width.
Usage
width_arg(width)
Arguments
width |
Width of the component. One of |
Word Count Function
Description
word_count() was deprecated in shinyGovstyle 0.3.0 and will be removed in
shinyGovstyle 1.0.0. text_area_Input() now counts words in the browser and
announces the count to screen readers, so no server code is needed. Set the
limit with text_area_Input(word_limit = ) and delete the observeEvent()
that called word_count().
Usage
word_count(inputId, input, word_limit = NULL)
Arguments
inputId |
The id assigned to the component's root element. For Shiny
input components this is also the name used to access the value via
|
input |
The text input that is associated with the box |
word_limit |
Change the word limit if needed. Default will keep as what was used in text area component |
Value
no value returned. Updates the word count in a shiny app
Examples
# The word count is handled by text_area_Input() alone; no server-side
# word_count() observer is needed.
ui <- shinyGovstyle::gov_page(
shinyGovstyle::header(
"Justice", "", logo = "shinyGovstyle/images/moj_logo.png"
),
shinyGovstyle::gov_main_layout(
shinyGovstyle::text_area_Input(
inputId = "text_area",
label = "Can you provide more detail?",
hint_label = paste(
"Do not include personal or financial information,",
"like your National Insurance number or credit card details."
),
word_limit = 300
)
),
shinyGovstyle::footer(TRUE)
)
server <- function(input, output, session) {}
if (interactive()) shinyApp(ui = ui, server = server)