0.6.0

Changed

• SiteBuilder is now Sapphire. The package is swift-sapphire, the library and module are Sapphire, and the command is sapphire. The old repository address redirects here. To move a site over, change the package name in Package.swift to swift-sapphire, the product to Sapphire, and import SiteBuilder to import Sapphire. Sites built before 0.6.0 still rebuild in place.

0.5.1

Added

• Site.stylesheet: CSS included on every page, after the base styles and before the styles of views, for @font-face rules, custom properties, and @media rules. See the Styling article.

SiteBuilder 0.5.0

SiteBuilder 0.5.0 adds layouts for long pages.

New

• SidebarLayout puts a sidebar beside the content when there's room, and below it when there isn't. It uses flex wrapping rather than media queries, so it responds to the space the layout has. Beside the content, the sidebar is as tall as the content, so a sticky view in it stays in sight as the page scrolls.
• MarkdownDocument.headings lists a document's headings with the IDs they get when it's rendered.
• TableOfContents links to the sections of a Markdown document. It's shown on screens wide enough to have it beside the content.

SiteBuilder 0.4.1

Fixed

• A menu's panel is now as wide as its longest link, within limits, instead of a fixed width, and its links line up with the menu's title, in a navigation bar and elsewhere.

SiteBuilder 0.4.0

SiteBuilder 0.4.0 adds menus and search.

New

• Menu opens a list of links from a button, like SwiftUI's Menu. It's built on a disclosure element, so it works with the keyboard and screen readers without JavaScript, and only one menu is open at a time.
• Menus in NavigationBar open below the bar. On narrow screens, a menu's links appear in the bar's menu, grouped under the menu's title.
• NavigationBar(search:) adds a search button that links to the site's search page, on every screen size.
• SearchField searches the site as the visitor types. When a page uses one, the build writes a search index of the site's pages and a small script that searches it. Results are ranked with matches in a title first, ignore case and accents, and are announced to screen readers. The query stays in the page's address, so a search can be bookmarked or shared.
• Page.isSearchable keeps pages that mostly list other pages, such as a home page, out of the search index. It defaults to true.
• Search, a new article, covers setting up search.

Search is the one feature of SiteBuilder that uses JavaScript, and its script is only included on pages with a search field.

SiteBuilder 0.3.0

SiteBuilder 0.3.0 adds a navigation bar, materials, and dividers.

New

• NavigationBar is a bar with a site's title and main links. It stays at the top of the window, over a blurred material. Its content is centered at a maxWidth that you match to the page's content. On screens narrower than 641 pixels, the links move into a menu built on a <details> element, so it works with touch, a pointer, the keyboard, and screen readers, without JavaScript.
• The current page is marked: every link to the page being viewed gets aria-current="page", and the navigation bar shows it in the tint.
• Material and background(_:) give views SwiftUI's translucent, blurred backgrounds, from ultraThin to ultraThick, plus bar. A material becomes nearly opaque when the browser reports a preference for reduced transparency, or can't blur.
• Divider draws a hairline across a VStack or down an HStack, and stays visible in forced colors mode.
• frame(maxWidth: .infinity) fills the available width, as in SwiftUI.

Changed

• Built-in views ship their styles only when a page uses them.

SiteBuilder 0.2.0

SiteBuilder 0.2.0 adds tint, badges, and a guide to writing your own views, and makes stacks space their children exactly.

New

• tint(_:) colors the links and form controls inside a view, like SwiftUI's modifier of the same name. Applied to a layout, it reaches every page, including links in Markdown. Color.tint gives other content the current tint.
• Color(light:dark:) uses one color in the light appearance and another in the dark.
• Badge is a short label, such as New or Updated, filled with the current tint. It stays readable in high contrast modes.
• Creating your own views, a new article, covers composing views, accepting content with a view builder, and sharing views between sites in a package.

Changed

• Stacks remove the margins browsers give paragraphs and headings, so the spacing you pass is the whole distance between children, as in SwiftUI. This can tighten existing layouts. Add spacing where you relied on those margins.
• A stack's child keeps its own modifiers. Before, frame(maxWidth:) on a stack's child had its width overridden.
• Headings balance their lines, and paragraphs avoid ending on a single word, in browsers that support text-wrap.
• Links without a tint use LinkText and VisitedText, which match the browser's own link colors.

0.1.1

What's changed

• Markdown lays out as a single block. A Markdown view now wraps its content in one element, so a stack spaces it as one view. Before, each paragraph and heading became its own child of the stack, which put the stack's spacing between every paragraph. Headings in Markdown also get more space above them than below. (#13)

Full changelog: 0.1.0...0.1.1

0.1.0

The first release of SiteBuilder, a library for building websites in Swift with a declarative, SwiftUI-inspired syntax that renders to static HTML and CSS.

struct Home: Page {
  let path = "/"
  let title = "Home"

  var body: some View {
    VStack(spacing: 24) {
      Heading(1, "Hello, world!")
        .font(.largeTitle)
      Link("About", destination: "/about")
    }
    .padding(32)
  }
}

What's included

• Views and layout. Text, Heading, Paragraph, Link, Image, and HTMLElement for any other tag. Views are composed with @ViewBuilder, which supports if, switch, for-in, and ForEach. VStack and HStack lay out with flexbox, and HStack wraps on narrow screens.
• Modifiers that compile to CSS.
  • padding, font, foregroundStyle, background, frame(maxWidth:), cornerRadius, and style(_:) for any other CSS.
  • Modifiers combine and nest the way they do in SwiftUI, and compile to a single style sheet with stable class names.
  • Pages contain no inline styles and no JavaScript.
• Sites and pages. The Site and Page protocols, with a shared layout, clean URLs, and a not found page.
• Markdown.
  • GitHub Flavored Markdown with front matter and heading anchors.
  • Swift code blocks are highlighted at build time to look like Xcode: SF Mono, with the colors of Xcode's default light and dark themes.
• Metadata and feeds. Canonical links, Open Graph and Twitter metadata for link previews, an RSS feed of dated pages, and a sitemap.
• Built for phones. The base styles keep pages readable on small screens. Text isn't inflated, long words wrap, and images, code, and tables stay within the width of the screen.
• Development server. swift run sitebuilder dev serves the site locally. It rebuilds on save, reloads open pages, and shows compiler errors in the browser.
• Safe builds.
  • Text and attribute values are always escaped, and tag and attribute names are validated.
  • A build only writes to a directory it owns.
  • Page paths are checked before anything is written.
• Documentation. Every public symbol is documented. Articles cover getting started, layouts, Markdown and static files, metadata and feeds, styling, and the development server.

Requirements

SiteBuilder requires Swift 6.2 or later. It supports macOS 14 and later, and Linux. The development server currently requires macOS.

Important

SiteBuilder is in early development, and its API may change before 1.0.