Documentation
¶
Overview ¶
templ: version: v0.3.1036
Package navigation provides navigation components including navbars, breadcrumbs, pagination, and mobile menus.
templ: version: v0.3.1036
templ: version: v0.3.1036
templ: version: v0.3.1036
templ: version: v0.3.1036
Index ¶
- func Breadcrumbs(props BreadcrumbsProps) templ.Component
- func Footer(brandText string) templ.Component
- func MobileMenu(links []NavLinkProps, currentPath string, nonce string) templ.Component
- func MobileMenuToggle(show bool) templ.Component
- func MobileNavLink(props NavLinkProps, currentPath string) templ.Component
- func Nav(props NavProps) templ.Component
- func NavLink(props NavLinkProps, currentPath string) templ.Component
- func Pagination(props PaginationProps) templ.Component
- func SimpleNav(brandText, brandHref string, links []NavLinkProps, currentPath string) templ.Component
- type BreadcrumbItem
- type BreadcrumbsProps
- type NavLinkProps
- type NavProps
- type PaginationProps
Examples ¶
Constants ¶
This section is empty.
Variables ¶
This section is empty.
Functions ¶
func Breadcrumbs ¶
func Breadcrumbs(props BreadcrumbsProps) templ.Component
Breadcrumbs renders a horizontal breadcrumb navigation
@navigation.Breadcrumbs(navigation.BreadcrumbsProps{
Items: []navigation.BreadcrumbItem{
{Text: "Home", Href: "/"},
{Text: "Users", Href: "/users"},
{Text: "Edit", Active: true},
},
})
Example ¶
package main
import (
"bytes"
"context"
"fmt"
"github.com/larsartmann/templ-components/navigation"
)
func main() {
props := navigation.BreadcrumbsProps{
Items: []navigation.BreadcrumbItem{
{Text: "Home", Href: "/"},
{Text: "Products", Href: "/products"},
{Text: "Laptops"},
},
}
var buf bytes.Buffer
_ = navigation.Breadcrumbs(props).Render(context.Background(), &buf)
fmt.Println(buf.String())
}
Output:
func MobileMenu ¶
func MobileMenu(links []NavLinkProps, currentPath string, nonce string) templ.Component
MobileMenu renders the collapsible mobile navigation menu
@navigation.MobileMenu(links, "/", "")
func MobileMenuToggle ¶
MobileMenuToggle renders the hamburger button for mobile menus
@navigation.MobileMenuToggle(true)
func MobileNavLink ¶
func MobileNavLink(props NavLinkProps, currentPath string) templ.Component
MobileNavLink renders a mobile-friendly navigation link
@navigation.MobileNavLink(navigation.NavLinkProps{Href: "/", Text: "Home"}, "/")
func Nav ¶
Nav renders a responsive navigation bar
@navigation.Nav(navigation.NavProps{
Brand: @myLogo(),
Links: []navigation.NavLinkProps{
{Href: "/", Text: "Home"},
{Href: "/about", Text: "About"},
},
CurrentPath: "/",
})
func NavLink ¶
func NavLink(props NavLinkProps, currentPath string) templ.Component
NavLink renders a single navigation link with active state styling
@navigation.NavLink(navigation.NavLinkProps{Href: "/", Text: "Home"}, "/")
func Pagination ¶
func Pagination(props PaginationProps) templ.Component
Pagination renders a page navigation bar
@navigation.Pagination(navigation.PaginationProps{
CurrentPage: 3,
TotalPages: 10,
BaseURL: "/users",
})
Example ¶
package main
import (
"bytes"
"context"
"fmt"
"github.com/larsartmann/templ-components/navigation"
)
func main() {
props := navigation.PaginationProps{
CurrentPage: 3,
TotalPages: 10,
BaseURL: "/items?page=",
}
var buf bytes.Buffer
_ = navigation.Pagination(props).Render(context.Background(), &buf)
fmt.Println(buf.String())
}
Output:
Types ¶
type BreadcrumbItem ¶
BreadcrumbItem represents a single breadcrumb segment
type BreadcrumbsProps ¶
type BreadcrumbsProps struct {
utils.BaseProps
Items []BreadcrumbItem
Separator string
JSONLD bool
}
BreadcrumbsProps configures a breadcrumb navigation component
func DefaultBreadcrumbsProps ¶
func DefaultBreadcrumbsProps() BreadcrumbsProps
DefaultBreadcrumbsProps returns sensible defaults
type NavLinkProps ¶
type NavLinkProps struct {
}
NavLinkProps configures a single navigation link
func DefaultNavLinkProps ¶
func DefaultNavLinkProps() NavLinkProps
DefaultNavLinkProps returns sensible defaults
type PaginationProps ¶
type PaginationProps struct {
utils.BaseProps
CurrentPage int
TotalPages int
BaseURL string
QueryParam string
MaxVisible int
}
PaginationProps configures a pagination component
func DefaultPaginationProps ¶
func DefaultPaginationProps() PaginationProps
DefaultPaginationProps returns sensible defaults