- this.nav = {class: {}}
- this.nav.id = this.createId()
- this.nav.class.main = 'tablet:flex-1 mb-1'
- this.nav.class.heading = 'p-1 block'
- this.nav.class.item = 'flex p-1'
- this.nav.class.divider = 'border-b border-scale-3 mb-1 mt-1'
- this.nav.tabindex = false;

/ Inherit overrides
- if (typeof nav !== 'undefined')
  - this.nav = Object.assign(this.nav, nav);
  - this.nav.class = (nav.hasOwnProperty('class')) ? Object.assign(this.nav.class, nav.class) : this.nav.class;

nav role='navigation' aria-labelledby='navigation-main-${this.nav.id}' class='${this.nav.class.main}'
  span id='navigation-main-${this.nav.id}' class='${this.nav.class.heading} ${this.nav.class.divider}' Main

  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='index' Home
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='${this.package.cdn.source}/releases/tag/v${this.package.version}' target='_blank' rel='noopener nofollow' title='v${this.package.version}' Latest Release

  button class='link-icon ${this.nav.class.item}' data-js="themes" tabindex=(this.nav.tabindex ? '-1' : false)
    svg class='icon icon-ui' aria-hidden='true'
      use data-js-themes='icon' href='#lucide-moon'

    span class='sr-only' Toggle 
    span data-js-themes='label' Theme

  span class='${this.nav.class.heading} ${this.nav.class.divider}' Guides

  / a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' xhref='about' About
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='installation' Installation
  / a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='developer-tools' Developer Tools
  / a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item} ${this.nav.class.divider}' xhref='prototyping' Prototyping

  span class='${this.nav.class.heading} ${this.nav.class.divider}' Links

  a tabindex=(this.nav.tabindex ? '-1' : false) class='link-icon ${this.nav.class.item}' href='${this.package.cdn.figma}' target='_blank' rel='noopener nofollow'
    svg class='icon icon-ui' aria-hidden='true'
      use href='#lucide-figma'

    span Figma

  a tabindex=(this.nav.tabindex ? '-1' : false) class='link-icon ${this.nav.class.item}' href='${this.package.cdn.source}' target='_blank' rel='noopener nofollow'
    svg class='icon icon-ui' aria-hidden='true'
      use href='#lucide-github'

    span GitHub Repository

  a tabindex=(this.nav.tabindex ? '-1' : false) class='link-icon ${this.nav.class.item}' href='${this.package.cdn.npm}' target='_blank' rel='noopener nofollow'
    svg class='icon icon-ui' aria-hidden='true'
      use href='#lucide-package'

    span NPM Package

  a tabindex=(this.nav.tabindex ? '-1' : false) class='link-icon ${this.nav.class.item}' href='${this.links.nycopportunity.framework}' target='_blank' rel='noopener nofollow'
    svg class='icon icon-ui' aria-hidden='true'
      use href='#lucide-frame'

    span UI Patterns Framework

nav role='navigation' aria-labelledby='aria-lb-elements-${this.nav.id}' class='${this.nav.class.main} desktop:ps-4'
  span id='aria-lb-elements-${this.nav.id}' class='${this.nav.class.heading} ${this.nav.class.divider}' Elements

  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='badge' Badge
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='breadcrumbs' Breadcrumbs
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='buttons' Buttons
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='code' Code
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='color' Color
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='description-lists' Description Lists
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='dividers' Dividers
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='forms' Forms
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='icons' Icons
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='inputs' Inputs
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='labels' Labels
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='layouts' Layouts
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='links' Links
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='navs' Navs
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='options' Options
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='selects' Selects
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='spinner' Spinner
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='tables' Tables
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='typography' Fonts and Typography

nav role='navigation' aria-labelledby='aria-lb-components-${this.nav.id}' class='${this.nav.class.main} desktop:ps-4'
  span id='aria-lb-components-${this.nav.id}' class='${this.nav.class.heading} ${this.nav.class.divider}' Components

  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='accordion' Accordion
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='active-navigation' Active Navigation
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='alert' Alert
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='card' Card
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='disclaimer' Disclaimer
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='dropdown' Dropdown
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='household' Household
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='nearby-stops' Nearby Stops
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='popover' Popover
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='question' Question
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='share-form' Share Form
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='side-navigation' Side Navigation
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='utility' Utility
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='web-share' Web Share

nav role='navigation' aria-labelledby='aria-lb-objects-${this.nav.id}' class='${this.nav.class.main} desktop:ps-4'
  span id='aria-lb-objects-${this.nav.id}' class='${this.nav.class.heading} ${this.nav.class.divider}' Objects
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='application-header' Application Header (NYC.ID)
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='attribution' Attribution (Footer)
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='banner' Banner
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='feedback' Feedback
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='find-help' Find Help
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='header' Header
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='languages' Languages
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='menu' Menu
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='modal' Modal
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='navigation' Navigation
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='newsletter' Newsletter
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='search' Search
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='step-by-step' Step by Step

nav role='navigation' aria-labelledby='aria-lb-utilities-${this.nav.id}' class='${this.nav.class.main} desktop:ps-4'
  span id='aria-lb-utilities-${this.nav.id}' class='${this.nav.class.heading} ${this.nav.class.divider}' Utilities

  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='tailwindcss' Tailwindcss
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='misc' Miscellaneous
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='themes' Themes
  a tabindex=(this.nav.tabindex ? '-1' : false) class='${this.nav.class.item}' href='toggle' Toggle

- delete nav
- delete this.nav