diff --git a/sln/src/Docs/Handlers.fs b/sln/src/Docs/Handlers.fs
index bc81ac3..f70e1e2 100644
--- a/sln/src/Docs/Handlers.fs
+++ b/sln/src/Docs/Handlers.fs
@@ -50,6 +50,9 @@ module Handlers =
let quickstartHandler : HttpHandler =
renderPage "Quickstart - FSharp.ViewEngine" "quickstart"
+ let customHandler : HttpHandler =
+ renderPage "Custom Elements & Attributes - FSharp.ViewEngine" "custom"
+
let alpineHandler : HttpHandler =
renderPage "Alpine.js - FSharp.ViewEngine" "alpine"
diff --git a/sln/src/Docs/Program.fs b/sln/src/Docs/Program.fs
index c3f2b34..cce6b3e 100644
--- a/sln/src/Docs/Program.fs
+++ b/sln/src/Docs/Program.fs
@@ -11,6 +11,7 @@ let webApp =
route "/" >=> homeHandler
route "/installation" >=> installationHandler
route "/quickstart" >=> quickstartHandler
+ route "/custom" >=> customHandler
route "/giraffe" >=> giraffeHandler
route "/extensions/alpine" >=> alpineHandler
route "/extensions/datastar" >=> datastarHandler
diff --git a/sln/src/Docs/Views.fs b/sln/src/Docs/Views.fs
index bd4991f..a701f5c 100644
--- a/sln/src/Docs/Views.fs
+++ b/sln/src/Docs/Views.fs
@@ -173,6 +173,7 @@ let private sidebarNavigation (currentPath: string) =
navLink currentPath "/" "Introduction"
navLink currentPath "/installation" "Installation"
navLink currentPath "/quickstart" "Quickstart"
+ navLink currentPath "/custom" "Custom Elements & Attributes"
navLink currentPath "/giraffe" "Giraffe"
}
}
diff --git a/sln/src/Docs/docs/custom.md b/sln/src/Docs/docs/custom.md
new file mode 100644
index 0000000..3d67109
--- /dev/null
+++ b/sln/src/Docs/docs/custom.md
@@ -0,0 +1,228 @@
+# Custom Elements & Attributes
+
+FSharp.ViewEngine covers all standard HTML elements and attributes, but you may need custom ones for web components or non-standard attributes.
+
+## Custom Elements
+
+### el
+
+Use `Html.el` to create a custom element with children. This is useful for web components:
+
+```fsharp
+open FSharp.ViewEngine
+open type Html
+
+el "my-component" {
+ _class "container"
+ p { "Hello from a web component!" }
+}
+```
+
+Renders:
+
+```html
+
+ Hello from a web component!
+
+```
+
+### elVoid
+
+Use `Html.elVoid` to create a custom self-closing (void) element:
+
+```fsharp
+elVoid "my-icon" {
+ _attr("name", "star")
+ _attr("size", "24")
+}
+```
+
+Renders:
+
+```html
+
+```
+
+### Nested Web Components
+
+Custom elements can be nested just like regular elements:
+
+```fsharp
+el "my-card" {
+ _attr("variant", "outlined")
+ el "my-card-header" {
+ h2 { "Card Title" }
+ }
+ el "my-card-body" {
+ p { "Card content goes here." }
+ }
+ el "my-card-footer" {
+ button { _onclick "handleClick()"; "Action" }
+ }
+}
+```
+
+## Custom Attributes
+
+### _attr
+
+Use `Html._attr` to add any attribute not covered by the built-in helpers.
+
+#### Key-value attribute
+
+```fsharp
+div {
+ _attr("my-custom-attr", "value")
+ "Content"
+}
+```
+
+Renders:
+
+```html
+Content
+```
+
+#### Boolean attribute
+
+Pass only the name to render a valueless (boolean) attribute:
+
+```fsharp
+div {
+ _attr "my-flag"
+ "Content"
+}
+```
+
+Renders:
+
+```html
+Content
+```
+
+### Combining with Built-in Attributes
+
+Custom attributes work alongside all built-in attributes:
+
+```fsharp
+el "sl-button" {
+ _attr("variant", "primary")
+ _attr("size", "large")
+ _attr "pill"
+ _onclick "handleClick()"
+ _class "my-button"
+ "Click Me"
+}
+```
+
+Renders:
+
+```html
+
+ Click Me
+
+```
+
+## Extending the Html Type
+
+F# supports [type extensions](https://learn.microsoft.com/en-us/dotnet/fsharp/language-reference/type-extensions) which let you add your own elements and attributes to the `Html` type. This is useful for project-specific conventions or design system components.
+
+### Adding Custom Elements
+
+```fsharp
+open FSharp.ViewEngine
+
+type Html with
+ static member val myCard = TagBuilder("my-card") with get
+ static member val myIcon = VoidBuilder("my-icon") with get
+```
+
+Then use them just like built-in elements:
+
+```fsharp
+open type Html
+
+myCard {
+ _class "shadow-lg"
+ h2 { "Title" }
+ p { "Card content" }
+}
+
+myIcon { _attr("name", "star") }
+```
+
+### Adding Custom Attributes
+
+```fsharp
+open FSharp.ViewEngine
+
+type Html with
+ static member inline _theme (v: string) = { Name = "data-theme"; Value = ValueSome v }
+ static member inline _variant (v: string) = { Name = "variant"; Value = ValueSome v }
+ static member inline _loading = { Name = "data-loading"; Value = ValueNone }
+```
+
+Then use them alongside built-in attributes:
+
+```fsharp
+open type Html
+
+div {
+ _theme "dark"
+ _variant "outlined"
+ _loading
+ "Content"
+}
+```
+
+### Design System Example
+
+You can build a full design system module with reusable elements and attributes:
+
+```fsharp
+open FSharp.ViewEngine
+
+type Ds =
+ static member val alert = TagBuilder("ds-alert") with get
+ static member val badge = TagBuilder("ds-badge") with get
+ static member val tooltip = TagBuilder("ds-tooltip") with get
+ static member inline _severity (v: string) = { Name = "severity"; Value = ValueSome v }
+ static member inline _placement (v: string) = { Name = "placement"; Value = ValueSome v }
+ static member inline _dismissible = { Name = "dismissible"; Value = ValueNone }
+```
+
+```fsharp
+open type Html
+open type Ds
+
+alert {
+ _severity "warning"
+ _dismissible
+ "This is a warning message."
+}
+
+tooltip {
+ _placement "top"
+ button { "Hover me" }
+}
+```
+
+## Shoelace Example
+
+Here's a more complete example using [Shoelace](https://shoelace.style/) web components:
+
+```fsharp
+el "sl-dialog" {
+ _attr("label", "Confirm")
+ _attr "open"
+ p { "Are you sure?" }
+ div {
+ _slot "footer"
+ el "sl-button" {
+ _attr("variant", "primary")
+ _onclick "this.closest('sl-dialog').hide()"
+ "Confirm"
+ }
+ }
+}
+```
diff --git a/sln/src/FSharp.ViewEngine/Html.fs b/sln/src/FSharp.ViewEngine/Html.fs
index b8294a1..9608421 100644
--- a/sln/src/FSharp.ViewEngine/Html.fs
+++ b/sln/src/FSharp.ViewEngine/Html.fs
@@ -8,6 +8,8 @@ type Html =
static member raw ([]v: string) = RawElement(v) :> HtmlElement
static member js ([]v: string) = RawElement(v) :> HtmlElement
static member text (v: string) = TextElement(v) :> HtmlElement
+ static member el (name: string) = TagBuilder(name)
+ static member elVoid (name: string) = VoidBuilder(name)
static member val html = TagBuilder("html") with get
static member val head = TagBuilder("head") with get
static member title (value: string) =
@@ -102,6 +104,15 @@ type Html =
static member val colgroup = TagBuilder("colgroup") with get
static member val tfoot = TagBuilder("tfoot") with get
static member val map = TagBuilder("map") with get
+ static member val ruby = TagBuilder("ruby") with get
+ static member val rt = TagBuilder("rt") with get
+ static member val rp = TagBuilder("rp") with get
+ static member val bdi = TagBuilder("bdi") with get
+ static member val bdo = TagBuilder("bdo") with get
+ static member val optgroup = TagBuilder("optgroup") with get
+ static member val menu = TagBuilder("menu") with get
+ static member val portal = TagBuilder("portal") with get
+ static member val style = TagBuilder("style") with get
static member val br = VoidElement("br") :> HtmlElement with get
static member val hr = VoidElement("hr") :> HtmlElement with get
static member val wbr = VoidElement("wbr") :> HtmlElement with get
@@ -114,42 +125,109 @@ type Html =
static member val col = VoidBuilder("col") with get
static member val area = VoidBuilder("area") with get
static member val embed = VoidBuilder("embed") with get
+ static member val ``base`` = VoidBuilder("base") with get
+ // Custom attributes
+ static member inline _attr (name: string) = { Name = name; Value = ValueNone }
+ static member inline _attr (name: string, v: string) = { Name = name; Value = ValueSome v }
+
+ // Global attributes
static member inline _id (v: string) = { Name = "id"; Value = ValueSome v }
static member inline _class (v: string) = { Name = "class"; Value = ValueSome v }
static member inline _class (v: string seq) = { Name = "class"; Value = ValueSome(v |> String.concat " ") }
static member inline _style (v: string) = { Name = "style"; Value = ValueSome v }
+ static member inline _title (v: string) = { Name = "title"; Value = ValueSome v }
static member inline _lang (v: string) = { Name = "lang"; Value = ValueSome v }
+ static member inline _dir (v: string) = { Name = "dir"; Value = ValueSome v }
+ static member inline _hidden (v: bool) = if v then { Name = "hidden"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _tabindex (v: int) = { Name = "tabindex"; Value = ValueSome(string v) }
+ static member inline _accesskey (v: string) = { Name = "accesskey"; Value = ValueSome v }
+ static member inline _translate (v: bool) = { Name = "translate"; Value = ValueSome(if v then "yes" else "no") }
+ static member inline _spellcheck (v: bool) = { Name = "spellcheck"; Value = ValueSome(if v then "true" else "false") }
+ static member inline _draggable (v: bool) = { Name = "draggable"; Value = ValueSome(if v then "true" else "false") }
+ static member inline _contenteditable (v: bool) = { Name = "contenteditable"; Value = ValueSome(if v then "true" else "false") }
+ static member inline _autofocus (v: bool) = if v then { Name = "autofocus"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _inert (v: bool) = if v then { Name = "inert"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _inputmode (v: string) = { Name = "inputmode"; Value = ValueSome v }
+ static member inline _enterkeyhint (v: string) = { Name = "enterkeyhint"; Value = ValueSome v }
+ static member inline _is (v: string) = { Name = "is"; Value = ValueSome v }
+ static member inline _slot (v: string) = { Name = "slot"; Value = ValueSome v }
+ static member inline _part (v: string) = { Name = "part"; Value = ValueSome v }
+ static member inline _nonce (v: string) = { Name = "nonce"; Value = ValueSome v }
+ static member inline _popover (v: string) = { Name = "popover"; Value = ValueSome v }
+ static member inline _data (attr: string, ?v: string) =
+ let key = $"data-{attr}"
+ match v with
+ | Some v -> { Name = key; Value = ValueSome v }
+ | None -> { Name = key; Value = ValueNone }
+
+ // Document and meta attributes
static member inline _charset (v: string) = { Name = "charset"; Value = ValueSome v }
static member inline _name (v: string) = { Name = "name"; Value = ValueSome v }
static member inline _content (v: string) = { Name = "content"; Value = ValueSome v }
+
+ // Link and resource attributes
static member inline _href (v: string) = { Name = "href"; Value = ValueSome v }
static member inline _rel (v: string) = { Name = "rel"; Value = ValueSome v }
static member inline _src (v: string) = { Name = "src"; Value = ValueSome v }
+ static member inline _srcset (v: string) = { Name = "srcset"; Value = ValueSome v }
+ static member inline _sizes (v: string) = { Name = "sizes"; Value = ValueSome v }
+ static member inline _media (v: string) = { Name = "media"; Value = ValueSome v }
+ static member inline _type (v: string) = { Name = "type"; Value = ValueSome v }
+ static member inline _target (v: string) = { Name = "target"; Value = ValueSome v }
+ static member inline _download (v: string) = { Name = "download"; Value = ValueSome v }
+ static member inline _download () = { Name = "download"; Value = ValueNone }
+ static member inline _referrerpolicy (v: string) = { Name = "referrerpolicy"; Value = ValueSome v }
+ static member inline _crossorigin = { Name = "crossorigin"; Value = ValueNone }
+ static member inline _integrity (v: string) = { Name = "integrity"; Value = ValueSome v }
+ static member inline _fetchpriority (v: string) = { Name = "fetchpriority"; Value = ValueSome v }
static member inline _async (v: bool) = if v then { Name = "async"; Value = ValueNone } else Html.EmptyAttr
static member inline _defer (v: bool) = if v then { Name = "defer"; Value = ValueNone } else Html.EmptyAttr
+
+ // Image and media attributes
+ static member inline _alt (v: string) = { Name = "alt"; Value = ValueSome v }
+ static member inline _width (v: string) = { Name = "width"; Value = ValueSome v }
+ static member inline _height (v: string) = { Name = "height"; Value = ValueSome v }
+ static member inline _loading (v: string) = { Name = "loading"; Value = ValueSome v }
+ static member inline _decoding (v: string) = { Name = "decoding"; Value = ValueSome v }
+ static member inline _usemap (v: string) = { Name = "usemap"; Value = ValueSome v }
+ static member inline _ismap (v: bool) = if v then { Name = "ismap"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _poster (v: string) = { Name = "poster"; Value = ValueSome v }
+ static member inline _controls (v: bool) = if v then { Name = "controls"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _autoplay (v: bool) = if v then { Name = "autoplay"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _loop (v: bool) = if v then { Name = "loop"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _muted (v: bool) = if v then { Name = "muted"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _preload (v: string) = { Name = "preload"; Value = ValueSome v }
+ static member inline _kind (v: string) = { Name = "kind"; Value = ValueSome v }
+ static member inline _srclang (v: string) = { Name = "srclang"; Value = ValueSome v }
+ static member inline _label (v: string) = { Name = "label"; Value = ValueSome v }
+ static member inline _default (v: bool) = if v then { Name = "default"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _coords (v: string) = { Name = "coords"; Value = ValueSome v }
+ static member inline _shape (v: string) = { Name = "shape"; Value = ValueSome v }
+
+ // Form attributes
static member inline _action (v: string) = { Name = "action"; Value = ValueSome v }
static member inline _method (v: string) = { Name = "method"; Value = ValueSome v }
- static member inline _formmethod (v: string) = { Name = "formmethod"; Value = ValueSome v }
- static member inline _type (v: string) = { Name = "type"; Value = ValueSome v }
+ static member inline _enctype (v: string) = { Name = "enctype"; Value = ValueSome v }
+ static member inline _novalidate (v: bool) = if v then { Name = "novalidate"; Value = ValueNone } else Html.EmptyAttr
static member inline _for (v: string) = { Name = "for"; Value = ValueSome v }
- static member inline _rows (v: int) = { Name = "rows"; Value = ValueSome(string v) }
- static member inline _cols (v: int) = { Name = "cols"; Value = ValueSome(string v) }
- static member inline _data (attr: string, ?v: string) =
- let key = $"data-{attr}"
- match v with
- | Some v -> { Name = key; Value = ValueSome v }
- | None -> { Name = key; Value = ValueNone }
- static member inline _datetime (v: string) = { Name = "datetime"; Value = ValueSome v }
- static member inline _width (v: string) = { Name = "width"; Value = ValueSome v }
- static member inline _height (v: string) = { Name = "height"; Value = ValueSome v }
static member inline _value (v: string) = { Name = "value"; Value = ValueSome v }
- static member inline _hidden (v: bool) = if v then { Name = "hidden"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _placeholder (v: string) = { Name = "placeholder"; Value = ValueSome v }
+ static member inline _autocomplete (v: string) = { Name = "autocomplete"; Value = ValueSome v }
+ static member inline _pattern (v: string) = { Name = "pattern"; Value = ValueSome v }
+ static member inline _accept (v: string) = { Name = "accept"; Value = ValueSome v }
static member inline _required (v: bool) = if v then { Name = "required"; Value = ValueNone } else Html.EmptyAttr
static member inline _disabled (v: bool) = if v then { Name = "disabled"; Value = ValueNone } else Html.EmptyAttr
static member inline _readonly (v: bool) = if v then { Name = "readonly"; Value = ValueNone } else Html.EmptyAttr
static member inline _multiple (v: bool) = if v then { Name = "multiple"; Value = ValueNone } else Html.EmptyAttr
static member inline _selected (v: bool) = if v then { Name = "selected"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _checked (v: bool) = if v then { Name = "checked"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _rows (v: int) = { Name = "rows"; Value = ValueSome(string v) }
+ static member inline _cols (v: int) = { Name = "cols"; Value = ValueSome(string v) }
+ static member inline _wrap (v: string) = { Name = "wrap"; Value = ValueSome v }
+ static member inline _size (v: int) = { Name = "size"; Value = ValueSome(string v) }
+ static member inline _list (v: string) = { Name = "list"; Value = ValueSome v }
+ static member inline _dirname (v: string) = { Name = "dirname"; Value = ValueSome v }
static member inline _min (v: string) = { Name = "min"; Value = ValueSome v }
static member inline _min (v: float) = { Name = "min"; Value = ValueSome(string v) }
static member inline _minlength (v: string) = { Name = "minlength"; Value = ValueSome v }
@@ -160,67 +238,121 @@ type Html =
static member inline _maxlength (v: int) = { Name = "maxlength"; Value = ValueSome(string v) }
static member inline _step (v: string) = { Name = "step"; Value = ValueSome v }
static member inline _step (v: float) = { Name = "step"; Value = ValueSome(string v) }
- static member inline _checked (v: bool) = if v then { Name = "checked"; Value = ValueNone } else Html.EmptyAttr
- static member inline _role (v: string) = { Name = "role"; Value = ValueSome v }
- static member inline _ariaLabelledby (v: string) = { Name = "aria-labelledby"; Value = ValueSome v }
- static member inline _ariaDescribedby (v: string) = { Name = "aria-describedby"; Value = ValueSome v }
- static member inline _ariaModal (v: string) = { Name = "aria-modal"; Value = ValueSome v }
- static member inline _placeholder (v: string) = { Name = "placeholder"; Value = ValueSome v }
- static member inline _autocomplete (v: string) = { Name = "autocomplete"; Value = ValueSome v }
- static member inline _pattern (v: string) = { Name = "pattern"; Value = ValueSome v }
- static member inline _accept (v: string) = { Name = "accept"; Value = ValueSome v }
- static member inline _title (v: string) = { Name = "title"; Value = ValueSome v }
- static member inline _wrap (v: string) = { Name = "wrap"; Value = ValueSome v }
- static member inline _size (v: int) = { Name = "size"; Value = ValueSome(string v) }
- static member inline _colspan (v: int) = { Name = "colspan"; Value = ValueSome(string v) }
- static member inline _onload (v: string) = { Name = "onload"; Value = ValueSome v }
- static member inline _crossorigin = { Name = "crossorigin"; Value = ValueNone }
- static member inline _alt (v: string) = { Name = "alt"; Value = ValueSome v }
- static member inline _target (v: string) = { Name = "target"; Value = ValueSome v }
- static member inline _tabindex (v: int) = { Name = "tabindex"; Value = ValueSome(string v) }
- static member inline _autofocus (v: bool) = if v then { Name = "autofocus"; Value = ValueNone } else Html.EmptyAttr
- static member inline _open (v: bool) = if v then { Name = "open"; Value = ValueNone } else Html.EmptyAttr
- static member inline _loading (v: string) = { Name = "loading"; Value = ValueSome v }
- static member inline _srcset (v: string) = { Name = "srcset"; Value = ValueSome v }
- static member inline _sandbox (v: string) = { Name = "sandbox"; Value = ValueSome v }
- static member inline _allow (v: string) = { Name = "allow"; Value = ValueSome v }
- static member inline _enctype (v: string) = { Name = "enctype"; Value = ValueSome v }
- static member inline _novalidate (v: bool) = if v then { Name = "novalidate"; Value = ValueNone } else Html.EmptyAttr
- static member inline _spellcheck (v: bool) = { Name = "spellcheck"; Value = ValueSome(if v then "true" else "false") }
- static member inline _draggable (v: bool) = { Name = "draggable"; Value = ValueSome(if v then "true" else "false") }
- static member inline _contenteditable (v: bool) = { Name = "contenteditable"; Value = ValueSome(if v then "true" else "false") }
- static member inline _accesskey (v: string) = { Name = "accesskey"; Value = ValueSome v }
- static member inline _dir (v: string) = { Name = "dir"; Value = ValueSome v }
- static member inline _translate (v: bool) = { Name = "translate"; Value = ValueSome(if v then "yes" else "no") }
- static member inline _inputmode (v: string) = { Name = "inputmode"; Value = ValueSome v }
- static member inline _enterkeyhint (v: string) = { Name = "enterkeyhint"; Value = ValueSome v }
- static member inline _list (v: string) = { Name = "list"; Value = ValueSome v }
static member inline _form (v: string) = { Name = "form"; Value = ValueSome v }
static member inline _formaction (v: string) = { Name = "formaction"; Value = ValueSome v }
+ static member inline _formmethod (v: string) = { Name = "formmethod"; Value = ValueSome v }
static member inline _formenctype (v: string) = { Name = "formenctype"; Value = ValueSome v }
static member inline _formnovalidate (v: bool) = if v then { Name = "formnovalidate"; Value = ValueNone } else Html.EmptyAttr
static member inline _formtarget (v: string) = { Name = "formtarget"; Value = ValueSome v }
+ static member inline _popovertarget (v: string) = { Name = "popovertarget"; Value = ValueSome v }
+ static member inline _popovertargetaction (v: string) = { Name = "popovertargetaction"; Value = ValueSome v }
+
+ // Table attributes
+ static member inline _colspan (v: int) = { Name = "colspan"; Value = ValueSome(string v) }
+ static member inline _rowspan (v: int) = { Name = "rowspan"; Value = ValueSome(string v) }
+ static member inline _scope (v: string) = { Name = "scope"; Value = ValueSome v }
+ static member inline _headers (v: string) = { Name = "headers"; Value = ValueSome v }
+
+ // Details and dialog attributes
+ static member inline _open (v: bool) = if v then { Name = "open"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _cite (v: string) = { Name = "cite"; Value = ValueSome v }
+ static member inline _datetime (v: string) = { Name = "datetime"; Value = ValueSome v }
+
+ // List attributes
+ static member inline _start (v: int) = { Name = "start"; Value = ValueSome(string v) }
+ static member inline _reversed (v: bool) = if v then { Name = "reversed"; Value = ValueNone } else Html.EmptyAttr
+
+ // Meter attributes
+ static member inline _high (v: float) = { Name = "high"; Value = ValueSome(string v) }
+ static member inline _low (v: float) = { Name = "low"; Value = ValueSome(string v) }
+ static member inline _optimum (v: float) = { Name = "optimum"; Value = ValueSome(string v) }
+
+ // Iframe attributes
+ static member inline _sandbox (v: string) = { Name = "sandbox"; Value = ValueSome v }
+ static member inline _allow (v: string) = { Name = "allow"; Value = ValueSome v }
+
+ // Microdata attributes
+ static member inline _itemscope (v: bool) = if v then { Name = "itemscope"; Value = ValueNone } else Html.EmptyAttr
+ static member inline _itemtype (v: string) = { Name = "itemtype"; Value = ValueSome v }
+ static member inline _itemprop (v: string) = { Name = "itemprop"; Value = ValueSome v }
+ static member inline _itemid (v: string) = { Name = "itemid"; Value = ValueSome v }
+ static member inline _itemref (v: string) = { Name = "itemref"; Value = ValueSome v }
+
+ // ARIA attributes
+ static member inline _role (v: string) = { Name = "role"; Value = ValueSome v }
static member inline _ariaLabel (v: string) = { Name = "aria-label"; Value = ValueSome v }
+ static member inline _ariaLabelledby (v: string) = { Name = "aria-labelledby"; Value = ValueSome v }
+ static member inline _ariaDescribedby (v: string) = { Name = "aria-describedby"; Value = ValueSome v }
static member inline _ariaHidden (v: string) = { Name = "aria-hidden"; Value = ValueSome v }
static member inline _ariaExpanded (v: string) = { Name = "aria-expanded"; Value = ValueSome v }
static member inline _ariaControls (v: string) = { Name = "aria-controls"; Value = ValueSome v }
static member inline _ariaLive (v: string) = { Name = "aria-live"; Value = ValueSome v }
static member inline _ariaCurrent (v: string) = { Name = "aria-current"; Value = ValueSome v }
- static member inline _rowspan (v: int) = { Name = "rowspan"; Value = ValueSome(string v) }
- static member inline _scope (v: string) = { Name = "scope"; Value = ValueSome v }
- static member inline _headers (v: string) = { Name = "headers"; Value = ValueSome v }
- static member inline _download (v: string) = { Name = "download"; Value = ValueSome v }
- static member inline _download () = { Name = "download"; Value = ValueNone }
- static member inline _referrerpolicy (v: string) = { Name = "referrerpolicy"; Value = ValueSome v }
- static member inline _media (v: string) = { Name = "media"; Value = ValueSome v }
- static member inline _sizes (v: string) = { Name = "sizes"; Value = ValueSome v }
- static member inline _poster (v: string) = { Name = "poster"; Value = ValueSome v }
- static member inline _controls (v: bool) = if v then { Name = "controls"; Value = ValueNone } else Html.EmptyAttr
- static member inline _autoplay (v: bool) = if v then { Name = "autoplay"; Value = ValueNone } else Html.EmptyAttr
- static member inline _loop (v: bool) = if v then { Name = "loop"; Value = ValueNone } else Html.EmptyAttr
- static member inline _muted (v: bool) = if v then { Name = "muted"; Value = ValueNone } else Html.EmptyAttr
- static member inline _preload (v: string) = { Name = "preload"; Value = ValueSome v }
- static member inline _start (v: int) = { Name = "start"; Value = ValueSome(string v) }
- static member inline _reversed (v: bool) = if v then { Name = "reversed"; Value = ValueNone } else Html.EmptyAttr
- static member inline _cite (v: string) = { Name = "cite"; Value = ValueSome v }
+ static member inline _ariaModal (v: string) = { Name = "aria-modal"; Value = ValueSome v }
+ static member inline _ariaDisabled (v: string) = { Name = "aria-disabled"; Value = ValueSome v }
+ static member inline _ariaSelected (v: string) = { Name = "aria-selected"; Value = ValueSome v }
+ static member inline _ariaChecked (v: string) = { Name = "aria-checked"; Value = ValueSome v }
+ static member inline _ariaRequired (v: string) = { Name = "aria-required"; Value = ValueSome v }
+ static member inline _ariaInvalid (v: string) = { Name = "aria-invalid"; Value = ValueSome v }
+ static member inline _ariaHaspopup (v: string) = { Name = "aria-haspopup"; Value = ValueSome v }
+ static member inline _ariaPressed (v: string) = { Name = "aria-pressed"; Value = ValueSome v }
+ static member inline _ariaValuenow (v: string) = { Name = "aria-valuenow"; Value = ValueSome v }
+ static member inline _ariaValuemin (v: string) = { Name = "aria-valuemin"; Value = ValueSome v }
+ static member inline _ariaValuemax (v: string) = { Name = "aria-valuemax"; Value = ValueSome v }
+ static member inline _ariaValuetext (v: string) = { Name = "aria-valuetext"; Value = ValueSome v }
+ static member inline _ariaAtomic (v: string) = { Name = "aria-atomic"; Value = ValueSome v }
+ static member inline _ariaBusy (v: string) = { Name = "aria-busy"; Value = ValueSome v }
+ static member inline _ariaPlaceholder (v: string) = { Name = "aria-placeholder"; Value = ValueSome v }
+ static member inline _ariaRoledescription (v: string) = { Name = "aria-roledescription"; Value = ValueSome v }
+
+ // Event handler attributes
+ static member inline _onclick ([]v: string) = { Name = "onclick"; Value = ValueSome v }
+ static member inline _ondblclick ([]v: string) = { Name = "ondblclick"; Value = ValueSome v }
+ static member inline _onchange ([]v: string) = { Name = "onchange"; Value = ValueSome v }
+ static member inline _oninput ([]v: string) = { Name = "oninput"; Value = ValueSome v }
+ static member inline _onbeforeinput ([]v: string) = { Name = "onbeforeinput"; Value = ValueSome v }
+ static member inline _onsubmit ([]v: string) = { Name = "onsubmit"; Value = ValueSome v }
+ static member inline _onreset ([]v: string) = { Name = "onreset"; Value = ValueSome v }
+ static member inline _oninvalid ([]v: string) = { Name = "oninvalid"; Value = ValueSome v }
+ static member inline _onselect ([]v: string) = { Name = "onselect"; Value = ValueSome v }
+ static member inline _onfocus ([]v: string) = { Name = "onfocus"; Value = ValueSome v }
+ static member inline _onblur ([]v: string) = { Name = "onblur"; Value = ValueSome v }
+ static member inline _onkeydown ([]v: string) = { Name = "onkeydown"; Value = ValueSome v }
+ static member inline _onkeyup ([]v: string) = { Name = "onkeyup"; Value = ValueSome v }
+ static member inline _onkeypress ([]v: string) = { Name = "onkeypress"; Value = ValueSome v }
+ static member inline _onmousedown ([]v: string) = { Name = "onmousedown"; Value = ValueSome v }
+ static member inline _onmouseup ([]v: string) = { Name = "onmouseup"; Value = ValueSome v }
+ static member inline _onmouseover ([]v: string) = { Name = "onmouseover"; Value = ValueSome v }
+ static member inline _onmouseout ([]v: string) = { Name = "onmouseout"; Value = ValueSome v }
+ static member inline _onmousemove ([]v: string) = { Name = "onmousemove"; Value = ValueSome v }
+ static member inline _onmouseenter ([]v: string) = { Name = "onmouseenter"; Value = ValueSome v }
+ static member inline _onmouseleave ([]v: string) = { Name = "onmouseleave"; Value = ValueSome v }
+ static member inline _oncontextmenu ([]v: string) = { Name = "oncontextmenu"; Value = ValueSome v }
+ static member inline _onwheel ([]v: string) = { Name = "onwheel"; Value = ValueSome v }
+ static member inline _onscroll ([]v: string) = { Name = "onscroll"; Value = ValueSome v }
+ static member inline _onresize ([]v: string) = { Name = "onresize"; Value = ValueSome v }
+ static member inline _oncopy ([]v: string) = { Name = "oncopy"; Value = ValueSome v }
+ static member inline _oncut ([]v: string) = { Name = "oncut"; Value = ValueSome v }
+ static member inline _onpaste ([]v: string) = { Name = "onpaste"; Value = ValueSome v }
+ static member inline _ondrag ([]v: string) = { Name = "ondrag"; Value = ValueSome v }
+ static member inline _ondragstart ([]v: string) = { Name = "ondragstart"; Value = ValueSome v }
+ static member inline _ondragend ([]v: string) = { Name = "ondragend"; Value = ValueSome v }
+ static member inline _ondragover ([]v: string) = { Name = "ondragover"; Value = ValueSome v }
+ static member inline _ondragenter ([]v: string) = { Name = "ondragenter"; Value = ValueSome v }
+ static member inline _ondragleave ([]v: string) = { Name = "ondragleave"; Value = ValueSome v }
+ static member inline _ondrop ([]v: string) = { Name = "ondrop"; Value = ValueSome v }
+ static member inline _ontouchstart ([]v: string) = { Name = "ontouchstart"; Value = ValueSome v }
+ static member inline _ontouchmove ([]v: string) = { Name = "ontouchmove"; Value = ValueSome v }
+ static member inline _ontouchend ([]v: string) = { Name = "ontouchend"; Value = ValueSome v }
+ static member inline _onanimationstart ([]v: string) = { Name = "onanimationstart"; Value = ValueSome v }
+ static member inline _onanimationend ([]v: string) = { Name = "onanimationend"; Value = ValueSome v }
+ static member inline _onanimationiteration ([]v: string) = { Name = "onanimationiteration"; Value = ValueSome v }
+ static member inline _ontransitionend ([]v: string) = { Name = "ontransitionend"; Value = ValueSome v }
+ static member inline _onload ([]v: string) = { Name = "onload"; Value = ValueSome v }
+ static member inline _onerror ([]v: string) = { Name = "onerror"; Value = ValueSome v }
+ static member inline _onabort ([]v: string) = { Name = "onabort"; Value = ValueSome v }
+ static member inline _ontoggle ([]v: string) = { Name = "ontoggle"; Value = ValueSome v }
+ static member inline _onplay ([]v: string) = { Name = "onplay"; Value = ValueSome v }
+ static member inline _onpause ([]v: string) = { Name = "onpause"; Value = ValueSome v }
+ static member inline _onended ([]v: string) = { Name = "onended"; Value = ValueSome v }