Skip to contents

Service navigation

Source: R/service_navigation.R
service_navigation.Rd

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.

Usage

service_navigation(
  links,
  service_name = NULL,
  auto_page_title = TRUE,
  page_title_suffix = NULL,
  width = "standard"
)

Arguments

A vector of actionLinks to be added to the service navigation. inputIDs are auto-generated by lowercasing the link text and replacing all non-alphanumeric characters with underscores, e.g. "Overview page" becomes overview_page. For precise control over inputIDs, supply a named vector where names are the page titles and values are the inputIDs.

service_name

An optional character string containing the service name to be displayed in the navigation bar

auto_page_title

Logical. When TRUE (the default), the browser tab title is updated to match the active nav link whenever the user navigates — both by clicking a link and via update_service_navigation(). Set to FALSE to opt out and manage the page title yourself. Keeping the title in sync with the visible page is a GOV.UK Design System recommendation for accessibility.

page_title_suffix

Optional character string appended to the page title in the format "<link text> | <suffix>" — typically the service name. Only used when auto_page_title = TRUE. For finer control (e.g. when a page heading differs from its nav link label), call update_page_title() from your server code.

width

Width of the component. One of "standard" (the default, GOV.UK's usual 960px content width), "three-quarters" (three-quarters of the viewport, never narrower than standard), "full" (no max-width, so the container fills the viewport, with grid gutters also removed), or a CSS length (e.g. "1400px", "90vw") for a custom max-width.

Value

Shiny tag object

See also

Other Govstyle navigation: backlink_Input(), contents_link(), 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)