mortar

README

Mortar Components Library

This library provides commonly-used components for global inclusion. All components reference their source files in the upstream git repository at https://www.jnichols.info/source.

Common Concepts

Components use the bricks keyword argument system, a set of key-value pairs. Here's a card for example:

{{ call .Render "Card" 
    "title" "Components"
    "body" "Create reusable, shareable components using Go"
    "link" "features#components"
    "linkText" "Learn More"
}}

Some components have additional positional arguments or use this key-value pair pattern for different things, which will be specified in this documentation.

Styling

Mortar provides suggested CSS for each component in the suggested-styles directory, but does not ship them as part of the components. The goal is to provide common web layout semantics, not to prescribe how your website should look. Styles are only included inline when A. a component isn't meant to be replicated frequently and B. the style is required for the intended behavior.

Card

Cards are a div of vertically-aligned content, commonly used for listings or similar features.

• title: Header of the card
• body: Text body of the card
• link, linkText: HREF and visible text for a link at the bottom of the card respectively

Navbar

• logoText, logoImage: Left-aligned section of navbar
• any other key-value pair: If the value is a string, the key will be the displayed text and the value will be the target URI.

Documentation

Overview

Copyright 2024 Jake Nichols (MIT License)

Copyright 2024 Jake Nichols (MIT License)

Index

• Variables

Variables

var Card = bricks.ComponentMust("Card",
	bricks.Source("card.html"),
	bricks.OnLoad(func(r *http.Request, args ...any) (data any, err error) {
		card := new(cardData)
		err = errors.Join(
			bricks.Kwarg("title", &card.Title, "", args...),
			bricks.Kwarg("body", &card.Body, "", args...),
			bricks.Kwarg("link", &card.Link, "", args...),
			bricks.Kwarg("linkText", &card.LinkText, "", args...),
		)
		data = card
		return
	}),
)

var Navbar = bricks.ComponentMust("Navbar",
	bricks.Source("navbar.html"),
	bricks.OnLoad(func(r *http.Request, args ...any) (data any, err error) {
		nd := new(navbarData)
		data = nd
		err = errors.Join(
			bricks.Kwarg("logoText", &nd.LogoText, "", args...),
			bricks.Kwarg("logoImage", &nd.LogoImg, "", args...),
			bricks.Kwarg("breakpoint", &nd.Breakpoint, 1000, args...),
		)
		if err != nil {
			return
		}
		var rest []bricks.Arg
		rest, err = bricks.Kwargs(args...)
		if err != nil {
			return
		}
		nd.Links = make([]navbarLink, 0)
		for _, arg := range rest {
			text, href := arg.Key, arg.Value
			if slices.Contains(ignoreKeys, text) {
				continue
			}
			hrefStr, ok := href.(string)
			if !ok {
				continue
			}
			nd.Links = append(nd.Links, navbarLink{
				Text: text,
				Href: hrefStr,
			})
		}
		return
	}),
)