Giraffe.ViewEngine.Htmx 4.0.0-alpha6a

This is a prerelease version of Giraffe.ViewEngine.Htmx.
dotnet add package Giraffe.ViewEngine.Htmx --version 4.0.0-alpha6a
                    
NuGet\Install-Package Giraffe.ViewEngine.Htmx -Version 4.0.0-alpha6a
                    
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Giraffe.ViewEngine.Htmx" Version="4.0.0-alpha6a" />
                    
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="Giraffe.ViewEngine.Htmx" Version="4.0.0-alpha6a" />
                    
Directory.Packages.props
<PackageReference Include="Giraffe.ViewEngine.Htmx" />
                    
Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add Giraffe.ViewEngine.Htmx --version 4.0.0-alpha6a
                    
#r "nuget: Giraffe.ViewEngine.Htmx, 4.0.0-alpha6a"
                    
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
#:package Giraffe.ViewEngine.Htmx@4.0.0-alpha6a
                    
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=Giraffe.ViewEngine.Htmx&version=4.0.0-alpha6a&prerelease
                    
Install as a Cake Addin
#tool nuget:?package=Giraffe.ViewEngine.Htmx&version=4.0.0-alpha6a&prerelease
                    
Install as a Cake Tool

Giraffe.ViewEngine.Htmx

This package enables htmx support within the Giraffe view engine.

htmx version: 4.0.0-alpha6

Upgrading from v2.x: see the migration guide for changes, which are plentiful. htmx switches from XMLHTTPRequest to fetch, and many changes are related to the new event cycle.

Inheritance is now explicit; to have an attribute's value inherited to its children, wrap the attribute in hxInherited (ex. hxInherited (_hxTarget "#main")). Values can be appended to inherited values as well using the hxAppend modifier.

Several constructs have been marked obsolete in this release, and will be removed from the first production release of v4. With the exception of _hxDisable, though (which now functions as the deprecated _hxDisabledElt did), this should not introduce compile errors. Rather, this package will raise warnings for deprecated constructs, along with suggestions of what to use instead.

Setup

  1. Install the package.
  2. Prior to using the attribute or support modules, open Giraffe.ViewEngine.Htmx.

Use

Following Giraffe View Engine's lead, there are a set of attribute functions for htmx; for many of the attributes, there are also helper modules to assist with typing the values. The example below utilizes both:

let autoload =
    div [ _hxGet "/this/data"; _hxTrigger HxTrigger.Load ] [ str "Loading..." ]

Support modules include:

  • HxConfig (new in v4)
  • HxEncoding
  • HxHeaders
  • HxParams (removed in v4)
  • HxRequest (renamed to HxConfig)
  • HxSwap (requires open Giraffe.Htmx)
  • HxTrigger
  • HxVals

Htmx.Script.local creates an XmlNode to load the package-provided htmx library. There are also two XmlNodes that will load the htmx script from jsdelivr; Htmx.Script.cdnMinified loads the minified version, and Htmx.Script.cdnUnminified loads the unminified version (useful for debugging). When using the CDN nodes and a Content Security Policy (CSP) header, cdn.jsdelivr.net needs to be listed as an allowable script-src.

This also supports fragment rendering, providing the flexibility to render an entire template, or only a portion of it (based on the element's id attribute).

Learn

htmx's attributes and these attribute functions map one-to-one. There are two exceptions:

  • _hxBoost implies true; use _hxNoBoost to set it to false.
  • _hxSwapWithTransition renders the standard hx-swap attribute and appends transition:true to the specified swap value.

The htmx hx-on attribute supports multiple events if they are separated with a newline (\n) character. The value provided to this attribute will be attribute-escaped, but in testing, it was interpreted correctly.

The support modules contain named properties for known values (as illustrated with HxTrigger.Load above). A few of the modules are more than collections of names, though:

  • HxRequest has a Configure function, which takes a list of strings; the other functions in the module allow for configuring the request.
HxRequest.Configure [ HxRequest.Timeout 500 ] |> _hxRequest 
  • HxTrigger is (by far) the most complex of these modules. Most uses won't need that complexity; however, complex triggers can be defined by piping into or composing with other functions. For example, to define an event that responds to a shift-click anywhere on the document, with a delay of 3 seconds before firing:
HxTrigger.Click
|> HxTrigger.Filter.Shift
|> HxTrigger.FromDocument
|> HxTrigger.Delay "3s"
|> _hxTrigger

// or

(HxTrigger.Filter.Shift >> HxTrigger.FromDocument >> HxTrigger.Delay "3s") HxTrigger.Click
|> _hxTrigger
Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 is compatible.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 is compatible.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
4.0.0-alpha6a 97 1/7/2026
2.0.8 180 12/28/2025
2.0.6 361 7/3/2025
2.0.4 654 12/13/2024
2.0.3 515 10/18/2024
2.0.2 548 8/13/2024
2.0.1 248 7/29/2024
2.0.0 3,166 6/18/2024
2.0.0-beta4 226 5/23/2024
2.0.0-beta3 201 4/18/2024
2.0.0-beta1 202 3/19/2024
2.0.0-alpha2 208 2/12/2024
2.0.0-alpha1 222 1/31/2024
1.9.12 2,832 4/18/2024
1.9.11 2,029 3/19/2024
1.9.10 753 1/3/2024
1.9.8 541 11/22/2023
1.9.6 318 9/28/2023
1.9.5 420 8/25/2023
1.9.4 396 7/26/2023
Loading failed

First htmx 4 alpha release of these libraries
- [Server] Marked removed headers as obsolete; added new HX-Source header
- [View Engine] Marked removed attributes as obsolete
- [View Engine] Added new attributes, modifiers, and support for new hx-partial tag
- Updated script tags to pull htmx 4.0.0-alpha6

See package READMEs; this is not an update-and-forget-it release