diff options
| -rw-r--r-- | docs/gleam.js | 209 | ||||
| -rw-r--r-- | docs/highlightjs-gleam.js | 109 | ||||
| -rw-r--r-- | docs/index.css | 698 | ||||
| -rw-r--r-- | docs/index.html | 331 | ||||
| -rw-r--r-- | docs/lustre.html | 512 | ||||
| -rw-r--r-- | docs/lustre/attribute.html | 979 | ||||
| -rw-r--r-- | docs/lustre/cmd.html | 418 | ||||
| -rw-r--r-- | docs/lustre/element.html | 2397 | ||||
| -rw-r--r-- | docs/lustre/event.html | 602 |
9 files changed, 6255 insertions, 0 deletions
diff --git a/docs/gleam.js b/docs/gleam.js new file mode 100644 index 0000000..73530ce --- /dev/null +++ b/docs/gleam.js @@ -0,0 +1,209 @@ +"use strict"; + +window.Gleam = function() { + /* Global Object */ + const self = {}; + + /* Public Properties */ + + self.hashOffset = undefined; + + /* Public Methods */ + + self.getProperty = function(property) { + let value; + try { + value = localStorage.getItem(`Gleam.${property}`); + } + catch (_error) {} + if (-1 < [null, undefined].indexOf(value)) { + return gleamConfig[property].values[0].value; + } + return value; + }; + + self.icons = function() { + return Array.from(arguments).reduce( + (acc, name) => + `${acc} + <svg class="icon icon-${name}"><use xlink:href="#icon-${name}"></use></svg>`, + "" + ); + } + + self.scrollToHash = function() { + const locationHash = arguments[0] || window.location.hash; + const query = locationHash ? locationHash : "body"; + const hashTop = document.querySelector(query).offsetTop; + window.scrollTo(0, hashTop - self.hashOffset); + return locationHash; + }; + + self.toggleSidebar = function() { + const previousState = + bodyClasses.contains("drawer-open") ? "open" : "closed"; + + let state; + if (0 < arguments.length) { + state = false === arguments[0] ? "closed" : "open"; + } + else { + state = "open" === previousState ? "closed" : "open"; + } + + bodyClasses.remove(`drawer-${previousState}`); + bodyClasses.add(`drawer-${state}`); + + if ("open" === state) { + document.addEventListener("click", closeSidebar, false); + } + }; + + /* Private Properties */ + + const html = document.documentElement; + const body = document.body; + const bodyClasses = body.classList; + const sidebar = document.querySelector(".sidebar"); + const sidebarToggles = document.querySelectorAll(".sidebar-toggle"); + const displayControls = document.createElement("div"); + + displayControls.classList.add("display-controls"); + sidebar.appendChild(displayControls); + + /* Private Methods */ + + const initProperty = function(property) { + const config = gleamConfig[property]; + + displayControls.insertAdjacentHTML( + "beforeend", + config.values.reduce( + (acc, item, index) => { + const tooltip = + item.label + ? `alt="${item.label}" title="${item.label}"` + : ""; + let inner; + if (item.icons) { + inner = self.icons(...item.icons); + } + else if (item.label) { + inner = item.label; + } + else { + inner = ""; + } + return ` + ${acc} + <span class="label label-${index}" ${tooltip}> + ${inner} + </span> + `; + }, + `<button + id="${property}-toggle" + class="control control-${property} toggle toggle-0"> + ` + ) + ` + </button> + ` + ); + + setProperty(null, property, function() { + return self.getProperty(property); + }); + }; + + const setProperty = function(_event, property) { + const previousValue = self.getProperty(property); + + const update = + 2 < arguments.length ? arguments[2] : gleamConfig[property].update; + const value = update(); + + try { + localStorage.setItem("Gleam." + property, value); + } + catch (_error) {} + + bodyClasses.remove(`${property}-${previousValue}`); + bodyClasses.add(`${property}-${value}`); + + const isDefault = value === gleamConfig[property].values[0].value; + const toggleClasses = + document.querySelector(`#${property}-toggle`).classList; + toggleClasses.remove(`toggle-${isDefault ? 1 : 0}`); + toggleClasses.add(`toggle-${isDefault ? 0 : 1}`); + + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + + return value; + } + + const setHashOffset = function() { + const el = document.createElement("div"); + el.style.cssText = + ` + height: var(--hash-offset); + pointer-events: none; + position: absolute; + visibility: hidden; + width: 0; + `; + body.appendChild(el); + self.hashOffset = parseInt( + getComputedStyle(el).getPropertyValue("height") || "0" + ); + body.removeChild(el); + }; + + const closeSidebar = function(event) { + if (! event.target.closest(".sidebar-toggle")) { + document.removeEventListener("click", closeSidebar, false); + self.toggleSidebar(false); + } + }; + + const init = function() { + for (const property in gleamConfig) { + initProperty(property); + const toggle = document.querySelector(`#${property}-toggle`); + toggle.addEventListener("click", function(event) { + setProperty(event, property); + }); + } + + sidebarToggles.forEach(function(sidebarToggle) { + sidebarToggle.addEventListener("click", function(event) { + event.preventDefault(); + self.toggleSidebar(); + }); + }); + + setHashOffset(); + window.addEventListener("load", function(_event) { + self.scrollToHash(); + }); + window.addEventListener("hashchange", function(_event) { + self.scrollToHash(); + }); + + document.querySelectorAll(` + .module-name > a, + .member-name a[href^='#'] + `).forEach(function(title) { + title.innerHTML = + title.innerHTML.replace(/([A-Z])|([_/])/g, "$2<wbr>$1"); + }); + }; + + /* Initialise */ + + init(); + + return self; +}(); diff --git a/docs/highlightjs-gleam.js b/docs/highlightjs-gleam.js new file mode 100644 index 0000000..292b8ca --- /dev/null +++ b/docs/highlightjs-gleam.js @@ -0,0 +1,109 @@ +hljs.registerLanguage("gleam", function (hljs) { + const KEYWORDS = + "as assert case const external fn if import let " + + "opaque pub todo try tuple type"; + const STRING = { + className: "string", + variants: [{ begin: /"/, end: /"/ }], + contains: [hljs.BACKSLASH_ESCAPE], + relevance: 0, + }; + const NAME = { + className: "variable", + begin: "\\b[a-z][a-z0-9_]*\\b", + relevance: 0, + }; + const DISCARD_NAME = { + className: "comment", + begin: "\\b_[a-z][a-z0-9_]*\\b", + relevance: 0, + }; + const NUMBER = { + className: "number", + variants: [ + { + // binary + begin: "\\b0[bB](?:_?[01]+)+", + }, + { + // octal + begin: "\\b0[oO](?:_?[0-7]+)+", + }, + { + // hex + begin: "\\b0[xX](?:_?[0-9a-fA-F]+)+", + }, + { + // dec, float + begin: "\\b\\d(?:_?\\d+)*(?:\\.(?:\\d(?:_?\\d+)*)*)?", + }, + ], + relevance: 0, + }; + + return { + name: "Gleam", + aliases: ["gleam"], + contains: [ + hljs.C_LINE_COMMENT_MODE, + STRING, + { + // bit string + begin: "<<", + end: ">>", + contains: [ + { + className: "keyword", + beginKeywords: + "binary bytes int float bit_string bits utf8 utf16 utf32 " + + "utf8_codepoint utf16_codepoint utf32_codepoint signed unsigned " + + "big little native unit size", + }, + KEYWORDS, + STRING, + NAME, + DISCARD_NAME, + NUMBER, + ], + relevance: 10, + }, + { + className: "function", + beginKeywords: "fn", + end: "\\(", + excludeEnd: true, + contains: [ + { + className: "title", + begin: "[a-z][a-z0-9_]*\\w*", + relevance: 0, + }, + ], + }, + { + className: "keyword", + beginKeywords: KEYWORDS, + }, + { + // Type names and constructors + className: "title", + begin: "\\b[A-Z][A-Za-z0-9]*\\b", + relevance: 0, + }, + { + className: "operator", + begin: "[+\\-*/%!=<>&|.]+", + relevance: 0, + }, + NAME, + DISCARD_NAME, + NUMBER, + ], + }; +}); +document.querySelectorAll("pre code").forEach(block => { + if (block.className === "") { + block.classList.add("gleam"); + } + hljs.highlightBlock(block); +}); diff --git a/docs/index.css b/docs/index.css new file mode 100644 index 0000000..ce095d6 --- /dev/null +++ b/docs/index.css @@ -0,0 +1,698 @@ +@import url("https://fonts.googleapis.com/css2?family=Karla:wght@400;700&family=Ubuntu+Mono&display=swap"); + +:root { + /* Colours */ + --black: #2a2020; + --hard-black: #000; + --pink: #ffaff3; + --hot-pink: #d900b8; + --white: #fff; + --pink-white: #fff8fe; + --mid-grey: #dfe2e5; + --light-grey: #f5f5f5; + --boi-blue: #a6f0fc; + + /* Derived colours */ + --text: var(--black); + --background: var(--white); + --accented-background: var(--pink-white); + --code-border: var(--pink); + --code-background: var(--light-grey); + --table-border: var(--mid-grey); + --table-background: var(--pink-white); + --links: var(--hot-pink); + --accent: var(--pink); + + /* Sizes */ + --content-width: 680px; + --header-height: 60px; + --hash-offset: calc(var(--header-height) * 1.67); + --sidebar-width: 240px; + --gap: 24px; + --small-gap: calc(var(--gap) / 2); + --tiny-gap: calc(var(--small-gap) / 2); + --large-gap: calc(var(--gap) * 2); + --sidebar-toggle-size: 33px; + + /* etc */ + --shadow: + 0 0 0 1px rgba(50, 50, 93, .075), + 0 0 1px #e9ecef, + 0 2px 4px -2px rgba(138, 141, 151, .6); + --nav-shadow: 0 0 6px 2px rgba(0, 0, 0, .1); +} + +* { + box-sizing: border-box; +} + +body, +html { + padding: 0; + margin: 0; + font-family: "Karla", sans-serif; + font-size: 17px; + line-height: 1.4; + position: relative; + min-height: 100vh; + word-break: break-word; +} + +html { + /* This is necessary so hash targets appear below the fixed header */ + scroll-padding-top: var(--hash-offset); +} + +a, +a:visited { + color: var(--links); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +button, +select { + background: transparent; + border: 0 none; + cursor: pointer; + font-family: inherit; + font-size: 100%; + line-height: 1.15; + margin: 0; + text-transform: none; +} + +button::-moz-focus-inner { + border-style: none; + padding: 0; +} + +button:-moz-focusring { + outline: 1px dotted ButtonText; +} + +button { + -webkit-appearance: button; + line-height: 1; + margin: 0; + overflow: visible; + padding: 0; +} + +button:active, +select:active { + outline: 0 none; +} + +li { + margin-bottom: 4px; +} + +p { + margin: var(--small-gap) 0; +} + +.rendered-markdown h1, +.rendered-markdown h2, +.rendered-markdown h3, +.rendered-markdown h4, +.rendered-markdown h5 { + font-size: 1.3rem; +} + +/* Code */ + +pre, +code { + font-family: "Ubuntu Mono", monospace; + line-height: 1.2; + background-color: var(--code-background); +} + +pre { + margin: var(--gap) 0; + border-radius: 1px; + overflow: auto; + box-shadow: var(--shadow); +} + +pre > code, +code.hljs { + padding: var(--small-gap) var(--gap); + background: transparent; +} + +p code { + margin: 0 2px; + border-radius: 3px; + padding: 0 0.2em; + color: var(--inline-code); +} + +/* Page layout */ + +.page { + display: flex; +} + +.content { + margin-left: var(--sidebar-width); + padding: calc(var(--header-height) + var(--gap)) var(--gap) 0 var(--gap); + width: calc(100% - var(--sidebar-width)); + max-width: var(--content-width); +} + +/* Page header */ + +.page-header { + box-shadow: var(--nav-shadow); + height: var(--header-height); + color: black; + color: var(--hard-black); + background-color: var(--pink); + display: flex; + padding: var(--small-gap) var(--gap); + position: fixed; + left: 0; + right: 0; + top: 0; + z-index: 300; +} + +.page-header h2 { + align-items: baseline; + display: flex; + margin: 0; + max-width: 100%; +} + +.page-header a, +.page-header a:visited { + color: black; + color: var(--hard-black); + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.sidebar-toggle { + display: none; + font-size: var(--sidebar-toggle-size); + opacity: 0; + transition: opacity 1s ease; +} + +.page-header .sidebar-toggle { + color: white; + color: var(--white); + margin: 0 var(--small-gap) 0 0; +} + +/* Version selector */ + +#project-version { + --half-small-gap: calc(var(--small-gap) / 2); + --icon-size: .75em; + flex-shrink: 0; + font-size: .9rem; + font-weight: normal; + margin-left: var(--half-small-gap); +} + +#project-version > span { + padding-left: var(--half-small-gap); +} + +#project-version form { + align-items: center; + display: inline-flex; + justify-content: flex-end; +} + +#project-version select { + appearance: none; + -webkit-appearance: none; + padding: .6rem calc(1.3 * var(--icon-size)) .6rem var(--half-small-gap); + position: relative; + z-index: 1; +} + +#project-version option { + background-color: var(--code-background); +} + +#project-version .icon { + font-size: var(--icon-size); + margin-left: calc(-1.65 * var(--icon-size)); +} + +/* Module doc */ + +.module-name > a, +.module-member-kind > a { + color: inherit; +} + +.module-name > a:hover, +.module-member-kind > a:hover { + text-decoration: none; +} + +.module-name > .icon-gleam-chasse, +.module-member-kind > .icon-gleam-chasse, +.module-member-kind > .icon-gleam-chasse-2 { + color: var(--pink); + display: block; + font-size: 1rem; + margin: var(--small-gap) 0 0; +} + +.module-name { + color: var(--hard-black); + margin: 0 0 var(--gap); + font-weight: 700; +} + +/* Sidebar */ + +.sidebar { + background-color: var(--background); + font-size: .95rem; + max-height: calc(100vh - var(--header-height)); + overflow-y: auto; + overscroll-behavior: contain; + padding-top: var(--gap); + padding-bottom: calc(3 * var(--gap)); + padding-left: var(--gap); + position: fixed; + top: var(--header-height); + transition: transform .5s ease; + width: var(--sidebar-width); + z-index: 100; +} + +.sidebar h2 { + margin: 0; +} + +.sidebar ul { + list-style: none; + margin: var(--small-gap) 0; + padding: 0; +} + +.sidebar li { + line-height: 1.2; + margin-bottom: 4px; +} + +.sidebar .sidebar-toggle { + color: var(--pink); + font-size: calc(.8 * var(--sidebar-toggle-size)); +} + +body.drawer-closed .label-open, +body.drawer-open .label-closed { + display: none; +} + +.display-controls { + display: flex; + flex-wrap: wrap; + margin-top: var(--small-gap); + padding-right: var(--gap); +} + +.display-controls .control { + margin: .5rem 0; +} + +.display-controls .control:not(:first-child) { + margin-left: 1rem; +} + +.toggle { + align-items: center; + display: flex; + font-size: .96rem; +} + +.toggle-0 .label:not(.label-0), +.toggle-1 .label:not(.label-1) { + display: none; +} + +.label { + display: flex; +} + +.label .icon { + margin: 0 .28rem; +} + +/* Module members (types, functions) */ + +.module-members { + margin-top: var(--large-gap); +} + +.module-member-kind { + font-size: 2rem; + color: var(--text); +} + +.member { + margin: var(--large-gap) 0; + padding-bottom: var(--gap); +} + +.member-name { + display: flex; + align-items: center; + justify-content: space-between; + border-left: 4px solid var(--accent); + padding: var(--small-gap) var(--gap); + background-color: var(--accented-background); +} + +.member-name h2 { + display: flex; + font-size: 1.5rem; + margin: 0; +} + +.member-name h2 a { + color: var(--text); +} + +.member-source { + align-self: baseline; + flex-shrink: 0; + line-height: calc(1.4 * 1.5rem); + margin: 0 0 0 var(--small-gap); +} + +/* Custom type constructors */ + +.constructor-list { + list-style: none; + padding: 0; +} + +.constructor-row { + align-items: center; + display: flex; +} + +.constructor-item { + margin-bottom: var(--small-gap); +} + +.constructor-argument-item { + display: flex; +} + +.constructor-argument-label { + flex-shrink: 0; +} + +.constructor-argument-doc { + margin-left: var(--gap); +} + +.constructor-argument-list { + margin-bottom: var(--small-gap); +} + +.constructor-item-docs { + margin-left: var(--large-gap); + margin-bottom: var(--gap); +} + +.constructor-item .icon { + flex-shrink: 0; + font-size: .7rem; + margin: 0 .88rem; +} + +.constructor-name { + box-shadow: unset; + margin: 0; +} + +.constructor-name > code { + padding: var(--small-gap); +} + +/* Tables */ + +table { + border-spacing: 0; + border-collapse: collapse; +} + +table td, +table th { + padding: 6px 13px; + border: 1px solid var(--table-border); +} + +table tr:nth-child(2n) { + background-color: var(--table-background); +} + +/* Footer */ + +.pride { + width: 100%; + display: none; + flex-direction: row; + position: absolute; + bottom: 0; + z-index: 100; +} + +.show-pride .pride { + display: flex; +} + +.show-pride .sidebar { + margin-bottom: var(--gap); +} + +.pride div { + flex: 1; + text-align: center; + padding: var(--tiny-gap); +} + +.pride .white { + background-color: var(--white); +} +.pride .pink { + background-color: var(--pink); +} +.pride .blue { + background-color: var(--boi-blue); +} + +.pride-button { + position: absolute; + right: 2px; + bottom: 2px; + opacity: .2; + font-size: .9rem; +} + +.pride-button { + text-decoration: none; + cursor: default; +} + +/* Icons */ + +.svg-lib { + height: 0; + overflow: hidden; + position: absolute; + width: 0; +} + +.icon { + display: inline-block; + fill: currentColor; + height: 1em; + stroke: currentColor; + stroke-width: 0; + width: 1em; +} + +.icon-gleam-chasse { + width: 8.182em; +} + +.icon-gleam-chasse-2 { + width: 4.909em; +} + +/* Pre-Wrap Option */ + +body.prewrap-on code, +body.prewrap-on pre { + white-space: pre-wrap; +} + +/* Dark Theme Option */ + +body.theme-dark { + /* Colour palette adapted from: + * https://github.com/dustypomerleau/yarra-valley + */ + + --argument-atom: #c651e5; + --class-module: #ff89b5; + --comment: #7e818b; + --escape: #7cdf89; + --function-call: #abb8c0; + --function-definition: #8af899; + --interpolation-regex: #ee37aa; + --keyword-operator: #ff9d35; + --number-boolean: #f14360; + --object: #99c2eb; + --punctuation: #4ce7ff; + --string: #aecc00; + + --inline-code: #ff9d35; + + --bg: #292d3e; + --bg-tint-1: #3e4251; --bg-tint-2: #535664; --bg-tint-3: #696c77; --bg-tint-4: #7e818b; + --bg-shade-1: #242837; --bg-shade-2: #202431; --bg-shade-3: #1c1f2b; + --bg-mono-1: #33384d; --bg-mono-2: #3d435d; --bg-mono-3: #474e6c; --bg-mono-4: #51597b; + + --fg: #cac0a9; + --fg-tint-1: #fdf2d8; --fg-tint-2: #fdf3dc; --fg-tint-3: #fdf5e0; + --fg-shade-1: #e3d8be; --fg-shade-2: #cac0a9; --fg-shade-3: #b1a894; --fg-shade-4: #97907f; + + --orange-shade-1: #e58d2f; --orange-shade-2: #cc7d2a; --orange-shade-3: #b26d25; + + --taupe-mono-1: #fdf1d4; --taupe-mono-2: #fce9bc; --taupe-mono-3: #fbe1a3; + + /* Theme Overrides */ + + --accent: var(--pink); + --accented-background: var(--bg-shade-1); + --background: var(--bg); + --code-background: var(--bg-shade-2); + --table-background: var(--bg-mono-1); + --hard-black: var(--taupe-mono-1); + --links: var(--pink); + --text: var(--taupe-mono-1); + + --shadow: + 0 0 0 1px rgba(50, 50, 93, .075), + 0 0 1px var(--fg-shade-3), + 0 2px 4px -2px rgba(138, 141, 151, .2); + --nav-shadow: 0 0 5px 5px rgba(0, 0, 0, .1); +} + +body.theme-dark { + background-color: var(--bg); + color: var(--fg-shade-1); +} + +body.theme-dark .page-header { + background-color: var(--bg-mono-1); +} + +body.theme-dark .page-header h2 { + color: var(--fg-shade-1); +} + + +body.theme-dark .page-header a, +body.theme-dark .page-header a:visited { + color: var(--pink); +} + +body.theme-dark .page-header .sidebar-toggle { + color: var(--fg-shade-1); +} + +body.theme-dark #project-version select, +body.theme-dark .control { + color: var(--fg-shade-1); +} + +body.theme-dark .module-name { + color: var(--taupe-mono-1); +} + +body.theme-dark .pride { + color: var(--bg-shade-3); +} + +body.theme-dark .pride .white { + background-color: var(--fg-shade-1); +} + +body.theme-dark .pride .pink { + background-color: var(--argument-atom); +} + +body.theme-dark .pride .blue { + background-color: var(--punctuation); +} + +/* Medium and larger displays */ +@media (min-width: 680px) { + #prewrap-toggle { + display: none; + } +} + +/* Small displays */ +@media (max-width: 920px) { + .page-header { + padding-left: var(--small-gap); + padding-right: var(--small-gap); + } + + .page-header h2 { + max-width: calc(100% - var(--sidebar-toggle-size) - var(--small-gap)); + } + + .content { + width: 100%; + max-width: unset; + margin-left: unset; + } + + .sidebar { + box-shadow: var(--nav-shadow); + height: 100vh; + max-height: unset; + top: 0; + transform: translate(calc(-10px - var(--sidebar-width))); + z-index: 500; + } + + body.drawer-open .sidebar { + transform: translate(0); + } + + .sidebar-toggle { + display: block; + opacity: 1; + } + + .sidebar .sidebar-toggle { + height: var(--sidebar-toggle-size); + position: absolute; + right: var(--small-gap); + top: var(--small-gap); + width: var(--sidebar-toggle-size); + } +} diff --git a/docs/index.html b/docs/index.html new file mode 100644 index 0000000..e21d25a --- /dev/null +++ b/docs/index.html @@ -0,0 +1,331 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre</title> + <link rel="stylesheet" href="./index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="./docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="./">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="./index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="./lustre.html">lustre</a></li> + + <li><a href="./lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="./lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="./lustre/element.html">lustre/element</a></li> + + <li><a href="./lustre/event.html">lustre/event</a></li> + + </ul> + + + </nav> + + <main class="content"> + +<h1>Lustre</h1> +<blockquote> +<p>A framework for building create web apps – powered by Gleam and React!</p> +</blockquote> +<p><a href="https://hex.pm/packages/lustre"><img src="https://img.shields.io/hexpm/v/lustre" alt="Package Version" /></a> +<a href="https://hexdocs.pm/lustre/"><img src="https://img.shields.io/badge/hex-docs-ffaff3" alt="Hex Docs" /></a></p> +<pre><code class="language-gleam">import gleam/int +import lustre +import lustre/element.{ button, div, p, text } +import lustre/event.{ dispatch, on_click } + +pub fn main () { + let app = lustre.application(0, update, render) + lustre.start(app, "#app") +} + +type Action { + Incr + Decr +} + +fn update (state, action) { + case action { + Incr -> state + 1 + Decr -> state - 1 + } +} + +fn render (state) { + div([], [ + button([ on_click(dispatch(Decr)) ], [ text("-") ]), + p([], [ text(int.to_string(state)) ]), + button([ on_click(dispatch(Incr)) ], [ text("+") ]) + ]) +} +</code></pre> +<blockquote> +<p>❗️ This package relies on Gleam’s JavaScript FFI and will not work if your are +targeting Erlang.</p> +</blockquote> +<hr /> +<h2>Installation</h2> +<p>If available on Hex, this package can be added to your Gleam project:</p> +<pre><code class="language-sh">gleam add lustre +</code></pre> +<p>and its documentation can be found at <a href="https://hexdocs.pm/eval">https://hexdocs.pm/eval</a>. You will also +need to install <code>react</code> and <code>react-dom</code> from npm:</p> +<pre><code class="language-sh">npm i react react-dom +</code></pre> +<hr /> +<h2>Development</h2> +<p>First, make sure you have both Gleam and Node.js installed, then:</p> +<pre><code class="language-bash">npm i +npm start +</code></pre> +<p>This sets up <code>chokidar</code> to watch our gleam source code and runs the compiler +whenever we make a change. It also starts a server that will serve the examples +located in <code>test/examples/</code>.</p> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="./highlightjs-gleam.js?v=0.21.0"></script> + + <script src="./gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file diff --git a/docs/lustre.html b/docs/lustre.html new file mode 100644 index 0000000..5c851e8 --- /dev/null +++ b/docs/lustre.html @@ -0,0 +1,512 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre - lustre</title> + <link rel="stylesheet" href="./index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="./docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="./">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="./index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="./lustre.html">lustre</a></li> + + <li><a href="./lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="./lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="./lustre/element.html">lustre/element</a></li> + + <li><a href="./lustre/event.html">lustre/event</a></li> + + </ul> + + + +<h2>Types</h2> +<ul> + + <li><a href="#Attribute">Attribute</a></li> + + <li><a href="#Cmd">Cmd</a></li> + + <li><a href="#Element">Element</a></li> + + <li><a href="#Error">Error</a></li> + + <li><a href="#Program">Program</a></li> + +</ul> + + + + + + +<h2>Functions</h2> +<ul> + + <li><a href="#application">application</a></li> + + <li><a href="#basic">basic</a></li> + + <li><a href="#start">start</a></li> + +</ul> + + + </nav> + + <main class="content"> + +<h1 id="module-name" class="module-name"> + <a href="#module-name">lustre</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> +</h1> + + + +<section class="module-members"> + <h1 id="module-types" class="module-member-kind"> + <a href="#module-types">Types</a> + <svg class="icon icon-gleam-chasse-2"><use xlink:href="#icon-gleam-chasse-2"></use></svg> + </h1> + + + <div class="member"> + <div class="member-name"> + <h2 id="Attribute"> + <a href="#Attribute"> + Attribute + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub type Attribute(action) = + attribute.Attribute(action)</code></pre> + + + </div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="Cmd"> + <a href="#Cmd"> + Cmd + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub type Cmd(action) = + cmd.Cmd(action)</code></pre> + + + </div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="Element"> + <a href="#Element"> + Element + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub type Element(action) = + element.Element(action)</code></pre> + + + </div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="Error"> + <a href="#Error"> + Error + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub type Error { + ElementNotFound +}</code></pre> + + <h3> + Constructors + </h3> + <ul class="constructor-list"> + + <li class="constructor-item"> + <div class="constructor-row"> + <svg class="icon icon-star"><use xlink:href="#icon-star"></use></svg> + <pre class="constructor-name"><code class="hljs gleam">ElementNotFound</code></pre> + </div> + + <div class="constructor-item-docs"> + + + + + </div> + </li> + + </ul> + + </div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="Program"> + <a href="#Program"> + Program + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub opaque type Program(state, action)</code></pre> + + + </div> + </div> + +</section> + + + + + + +<section class="module-members"> + <h1 id="module-functions" class="module-member-kind"> + <a href="#module-functions">Functions</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> + </h1> + + <div class="member"> + <div class="member-name"> + <h2 id="application"> + <a href="#application"> + application + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn application(init: #(a, Cmd(b)), update: fn(a, b) -> + #(a, Cmd(b)), render: fn(a) -> Element(b)) -> Program(a, b)</code></pre> + <div class="rendered-markdown"><p>Create a more complex application mimicing TEA – the Elm architecture. We +start with some initial <code>state</code>, a function to update that state, and then +a render function to derive our program’s view from that state.</p> +<p>Events produced by elements are passed a <code>dispatch</code> function that can be +used to emit actions that trigger your <code>update</code> function to be called and +trigger a rerender.</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="basic"> + <a href="#basic"> + basic + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn basic(element: Element(a)) -> Program(Nil, a)</code></pre> + <div class="rendered-markdown"><p>Create a basic lustre program that just renders some element on the page. +Note that this doesn’t mean the content is static! With <code>element.stateful</code> +you can still create components with local state.</p> +<p>Basic lustre programs don’t have any <em>global</em> application state and so the +plumbing is a lot simpler. If you find yourself passing lot’s state of state +around, you might want to consider using <code>application</code> instead.</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="start"> + <a href="#start"> + start + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn start(program: Program(a, b), selector: String) -> Result( + fn(b) -> Nil, + Error, +)</code></pre> + <div class="rendered-markdown"><p>Once you have created a program with either <code>basic</code> or <code>application</code>, you +need to actually start it! This function will mount your program to the DOM +node that matches the query selector you provide.</p> +<p>If everything mounted OK, we’ll get back a dispatch function that you can +call to send actions to your program and trigger an update. </p> +</div> + </div> + +</section> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="./highlightjs-gleam.js?v=0.21.0"></script> + + <script src="./gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file diff --git a/docs/lustre/attribute.html b/docs/lustre/attribute.html new file mode 100644 index 0000000..cebc46d --- /dev/null +++ b/docs/lustre/attribute.html @@ -0,0 +1,979 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre/attribute - lustre</title> + <link rel="stylesheet" href="../index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="../docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="../">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="../index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="../lustre.html">lustre</a></li> + + <li><a href="../lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="../lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="../lustre/element.html">lustre/element</a></li> + + <li><a href="../lustre/event.html">lustre/event</a></li> + + </ul> + + + +<h2>Types</h2> +<ul> + + <li><a href="#Attribute">Attribute</a></li> + +</ul> + + + + + + +<h2>Functions</h2> +<ul> + + <li><a href="#accept">accept</a></li> + + <li><a href="#accept_charset">accept_charset</a></li> + + <li><a href="#action">action</a></li> + + <li><a href="#alt">alt</a></li> + + <li><a href="#attribute">attribute</a></li> + + <li><a href="#autocomplete">autocomplete</a></li> + + <li><a href="#autofocus">autofocus</a></li> + + <li><a href="#autoplay">autoplay</a></li> + + <li><a href="#checked">checked</a></li> + + <li><a href="#class">class</a></li> + + <li><a href="#classes">classes</a></li> + + <li><a href="#cols">cols</a></li> + + <li><a href="#controls">controls</a></li> + + <li><a href="#disabled">disabled</a></li> + + <li><a href="#download">download</a></li> + + <li><a href="#event">event</a></li> + + <li><a href="#for">for</a></li> + + <li><a href="#height">height</a></li> + + <li><a href="#href">href</a></li> + + <li><a href="#id">id</a></li> + + <li><a href="#loop">loop</a></li> + + <li><a href="#max">max</a></li> + + <li><a href="#min">min</a></li> + + <li><a href="#name">name</a></li> + + <li><a href="#pattern">pattern</a></li> + + <li><a href="#placeholder">placeholder</a></li> + + <li><a href="#property">property</a></li> + + <li><a href="#readonly">readonly</a></li> + + <li><a href="#rel">rel</a></li> + + <li><a href="#require">require</a></li> + + <li><a href="#rows">rows</a></li> + + <li><a href="#selected">selected</a></li> + + <li><a href="#src">src</a></li> + + <li><a href="#step">step</a></li> + + <li><a href="#style">style</a></li> + + <li><a href="#target">target</a></li> + + <li><a href="#type_">type_</a></li> + + <li><a href="#value">value</a></li> + + <li><a href="#width">width</a></li> + + <li><a href="#wrap">wrap</a></li> + +</ul> + + + </nav> + + <main class="content"> + +<h1 id="module-name" class="module-name"> + <a href="#module-name">lustre/attribute</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> +</h1> + + + +<section class="module-members"> + <h1 id="module-types" class="module-member-kind"> + <a href="#module-types">Types</a> + <svg class="icon icon-gleam-chasse-2"><use xlink:href="#icon-gleam-chasse-2"></use></svg> + </h1> + + + <div class="member"> + <div class="member-name"> + <h2 id="Attribute"> + <a href="#Attribute"> + Attribute + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub opaque type Attribute(action)</code></pre> + + + </div> + </div> + +</section> + + + + + + +<section class="module-members"> + <h1 id="module-functions" class="module-member-kind"> + <a href="#module-functions">Functions</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> + </h1> + + <div class="member"> + <div class="member-name"> + <h2 id="accept"> + <a href="#accept"> + accept + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn accept(types: List(String)) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="accept_charset"> + <a href="#accept_charset"> + accept_charset + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn accept_charset(types: List(String)) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="action"> + <a href="#action"> + action + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn action(uri: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="alt"> + <a href="#alt"> + alt + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn alt(text: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="attribute"> + <a href="#attribute"> + attribute + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn attribute(name: String, value: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="autocomplete"> + <a href="#autocomplete"> + autocomplete + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn autocomplete(should_autocomplete: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="autofocus"> + <a href="#autofocus"> + autofocus + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn autofocus(should_autofocus: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="autoplay"> + <a href="#autoplay"> + autoplay + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn autoplay(should_autoplay: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="checked"> + <a href="#checked"> + checked + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn checked(is_checked: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="class"> + <a href="#class"> + class + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn class(name: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="classes"> + <a href="#classes"> + classes + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn classes(names: List(#(String, Bool))) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="cols"> + <a href="#cols"> + cols + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn cols(val: Int) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="controls"> + <a href="#controls"> + controls + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn controls(visible: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="disabled"> + <a href="#disabled"> + disabled + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn disabled(is_disabled: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="download"> + <a href="#download"> + download + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn download(filename: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="event"> + <a href="#event"> + event + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn event(name: String, handler: fn(Dynamic, fn(a) -> Nil) -> + Nil) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="for"> + <a href="#for"> + for + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn for(id: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="height"> + <a href="#height"> + height + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn height(val: Int) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="href"> + <a href="#href"> + href + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn href(uri: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="id"> + <a href="#id"> + id + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn id(name: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="loop"> + <a href="#loop"> + loop + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn loop(should_loop: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="max"> + <a href="#max"> + max + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn max(val: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="min"> + <a href="#min"> + min + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn min(val: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="name"> + <a href="#name"> + name + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn name(name: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="pattern"> + <a href="#pattern"> + pattern + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn pattern(regex: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="placeholder"> + <a href="#placeholder"> + placeholder + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn placeholder(text: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="property"> + <a href="#property"> + property + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn property(name: String, value: Dynamic) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="readonly"> + <a href="#readonly"> + readonly + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn readonly(is_readonly: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="rel"> + <a href="#rel"> + rel + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn rel(relationship: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="require"> + <a href="#require"> + require + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn require(is_required: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="rows"> + <a href="#rows"> + rows + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn rows(val: Int) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="selected"> + <a href="#selected"> + selected + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn selected(is_selected: Bool) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="src"> + <a href="#src"> + src + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn src(uri: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="step"> + <a href="#step"> + step + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn step(val: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="style"> + <a href="#style"> + style + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn style(properties: List(#(String, String))) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="target"> + <a href="#target"> + target + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn target(target: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="type_"> + <a href="#type_"> + type_ + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn type_(name: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="value"> + <a href="#value"> + value + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn value(val: Dynamic) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="width"> + <a href="#width"> + width + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn width(val: Int) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="wrap"> + <a href="#wrap"> + wrap + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn wrap(mode: String) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + +</section> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="../highlightjs-gleam.js?v=0.21.0"></script> + + <script src="../gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file diff --git a/docs/lustre/cmd.html b/docs/lustre/cmd.html new file mode 100644 index 0000000..5f5220a --- /dev/null +++ b/docs/lustre/cmd.html @@ -0,0 +1,418 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre/cmd - lustre</title> + <link rel="stylesheet" href="../index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="../docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="../">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="../index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="../lustre.html">lustre</a></li> + + <li><a href="../lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="../lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="../lustre/element.html">lustre/element</a></li> + + <li><a href="../lustre/event.html">lustre/event</a></li> + + </ul> + + + +<h2>Types</h2> +<ul> + + <li><a href="#Cmd">Cmd</a></li> + +</ul> + + + + + + +<h2>Functions</h2> +<ul> + + <li><a href="#batch">batch</a></li> + + <li><a href="#from">from</a></li> + + <li><a href="#map">map</a></li> + + <li><a href="#none">none</a></li> + + <li><a href="#to_list">to_list</a></li> + +</ul> + + + </nav> + + <main class="content"> + +<h1 id="module-name" class="module-name"> + <a href="#module-name">lustre/cmd</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> +</h1> + + + +<section class="module-members"> + <h1 id="module-types" class="module-member-kind"> + <a href="#module-types">Types</a> + <svg class="icon icon-gleam-chasse-2"><use xlink:href="#icon-gleam-chasse-2"></use></svg> + </h1> + + + <div class="member"> + <div class="member-name"> + <h2 id="Cmd"> + <a href="#Cmd"> + Cmd + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub opaque type Cmd(action)</code></pre> + + + </div> + </div> + +</section> + + + + + + +<section class="module-members"> + <h1 id="module-functions" class="module-member-kind"> + <a href="#module-functions">Functions</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> + </h1> + + <div class="member"> + <div class="member-name"> + <h2 id="batch"> + <a href="#batch"> + batch + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn batch(cmds: List(Cmd(a))) -> Cmd(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="from"> + <a href="#from"> + from + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn from(cmd: fn(fn(a) -> Nil) -> Nil) -> Cmd(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="map"> + <a href="#map"> + map + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn map(cmd: Cmd(a), f: fn(a) -> b) -> Cmd(b)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="none"> + <a href="#none"> + none + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn none() -> Cmd(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="to_list"> + <a href="#to_list"> + to_list + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn to_list(cmd: Cmd(a)) -> List(fn(fn(a) -> Nil) -> Nil)</code></pre> + <div class="rendered-markdown"></div> + </div> + +</section> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="../highlightjs-gleam.js?v=0.21.0"></script> + + <script src="../gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file diff --git a/docs/lustre/element.html b/docs/lustre/element.html new file mode 100644 index 0000000..b392213 --- /dev/null +++ b/docs/lustre/element.html @@ -0,0 +1,2397 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre/element - lustre</title> + <link rel="stylesheet" href="../index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="../docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="../">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="../index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="../lustre.html">lustre</a></li> + + <li><a href="../lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="../lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="../lustre/element.html">lustre/element</a></li> + + <li><a href="../lustre/event.html">lustre/event</a></li> + + </ul> + + + +<h2>Types</h2> +<ul> + + <li><a href="#Element">Element</a></li> + +</ul> + + + + + + +<h2>Functions</h2> +<ul> + + <li><a href="#a">a</a></li> + + <li><a href="#abbr">abbr</a></li> + + <li><a href="#address">address</a></li> + + <li><a href="#area">area</a></li> + + <li><a href="#article">article</a></li> + + <li><a href="#aside">aside</a></li> + + <li><a href="#audio">audio</a></li> + + <li><a href="#b">b</a></li> + + <li><a href="#base">base</a></li> + + <li><a href="#bdi">bdi</a></li> + + <li><a href="#bdo">bdo</a></li> + + <li><a href="#blockquote">blockquote</a></li> + + <li><a href="#body">body</a></li> + + <li><a href="#br">br</a></li> + + <li><a href="#button">button</a></li> + + <li><a href="#canvas">canvas</a></li> + + <li><a href="#caption">caption</a></li> + + <li><a href="#cite">cite</a></li> + + <li><a href="#code">code</a></li> + + <li><a href="#col">col</a></li> + + <li><a href="#colgroup">colgroup</a></li> + + <li><a href="#datalist">datalist</a></li> + + <li><a href="#dd">dd</a></li> + + <li><a href="#del">del</a></li> + + <li><a href="#details">details</a></li> + + <li><a href="#dfn">dfn</a></li> + + <li><a href="#dialog">dialog</a></li> + + <li><a href="#div">div</a></li> + + <li><a href="#dl">dl</a></li> + + <li><a href="#dt">dt</a></li> + + <li><a href="#em">em</a></li> + + <li><a href="#embed">embed</a></li> + + <li><a href="#fieldset">fieldset</a></li> + + <li><a href="#figcaption">figcaption</a></li> + + <li><a href="#figure">figure</a></li> + + <li><a href="#footer">footer</a></li> + + <li><a href="#form">form</a></li> + + <li><a href="#fragment">fragment</a></li> + + <li><a href="#h1">h1</a></li> + + <li><a href="#h2">h2</a></li> + + <li><a href="#h3">h3</a></li> + + <li><a href="#h4">h4</a></li> + + <li><a href="#h5">h5</a></li> + + <li><a href="#h6">h6</a></li> + + <li><a href="#head">head</a></li> + + <li><a href="#header">header</a></li> + + <li><a href="#hr">hr</a></li> + + <li><a href="#html">html</a></li> + + <li><a href="#i">i</a></li> + + <li><a href="#iframe">iframe</a></li> + + <li><a href="#img">img</a></li> + + <li><a href="#input">input</a></li> + + <li><a href="#ins">ins</a></li> + + <li><a href="#kbd">kbd</a></li> + + <li><a href="#label">label</a></li> + + <li><a href="#legend">legend</a></li> + + <li><a href="#li">li</a></li> + + <li><a href="#main">main</a></li> + + <li><a href="#map">map</a></li> + + <li><a href="#map_">map_</a></li> + + <li><a href="#mark">mark</a></li> + + <li><a href="#mathml">mathml</a></li> + + <li><a href="#menu">menu</a></li> + + <li><a href="#meta">meta</a></li> + + <li><a href="#meter">meter</a></li> + + <li><a href="#nav">nav</a></li> + + <li><a href="#node">node</a></li> + + <li><a href="#noscript">noscript</a></li> + + <li><a href="#object">object</a></li> + + <li><a href="#ol">ol</a></li> + + <li><a href="#optgroup">optgroup</a></li> + + <li><a href="#option">option</a></li> + + <li><a href="#output">output</a></li> + + <li><a href="#p">p</a></li> + + <li><a href="#param">param</a></li> + + <li><a href="#picture">picture</a></li> + + <li><a href="#portal">portal</a></li> + + <li><a href="#pre">pre</a></li> + + <li><a href="#progress">progress</a></li> + + <li><a href="#rp">rp</a></li> + + <li><a href="#rt">rt</a></li> + + <li><a href="#ruby">ruby</a></li> + + <li><a href="#s">s</a></li> + + <li><a href="#samp">samp</a></li> + + <li><a href="#section">section</a></li> + + <li><a href="#select">select</a></li> + + <li><a href="#slot">slot</a></li> + + <li><a href="#small">small</a></li> + + <li><a href="#source">source</a></li> + + <li><a href="#span">span</a></li> + + <li><a href="#stateful">stateful</a></li> + + <li><a href="#strong">strong</a></li> + + <li><a href="#style">style</a></li> + + <li><a href="#sub">sub</a></li> + + <li><a href="#summary">summary</a></li> + + <li><a href="#sup">sup</a></li> + + <li><a href="#svg">svg</a></li> + + <li><a href="#table">table</a></li> + + <li><a href="#tbody">tbody</a></li> + + <li><a href="#td">td</a></li> + + <li><a href="#template">template</a></li> + + <li><a href="#text">text</a></li> + + <li><a href="#textarea">textarea</a></li> + + <li><a href="#tfoot">tfoot</a></li> + + <li><a href="#th">th</a></li> + + <li><a href="#thead">thead</a></li> + + <li><a href="#time">time</a></li> + + <li><a href="#title">title</a></li> + + <li><a href="#tr">tr</a></li> + + <li><a href="#track">track</a></li> + + <li><a href="#u">u</a></li> + + <li><a href="#ul">ul</a></li> + + <li><a href="#var_">var_</a></li> + + <li><a href="#video">video</a></li> + + <li><a href="#wbr">wbr</a></li> + +</ul> + + + </nav> + + <main class="content"> + +<h1 id="module-name" class="module-name"> + <a href="#module-name">lustre/element</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> +</h1> + + + +<section class="module-members"> + <h1 id="module-types" class="module-member-kind"> + <a href="#module-types">Types</a> + <svg class="icon icon-gleam-chasse-2"><use xlink:href="#icon-gleam-chasse-2"></use></svg> + </h1> + + + <div class="member"> + <div class="member-name"> + <h2 id="Element"> + <a href="#Element"> + Element + </a> + </h2> + + + </div> + <div class="custom-type-constructors"> + <div class="rendered-markdown"></div> + <pre><code class="hljs gleam">pub external type Element(action)</code></pre> + + + </div> + </div> + +</section> + + + + + + +<section class="module-members"> + <h1 id="module-functions" class="module-member-kind"> + <a href="#module-functions">Functions</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> + </h1> + + <div class="member"> + <div class="member-name"> + <h2 id="a"> + <a href="#a"> + a + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn a(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="abbr"> + <a href="#abbr"> + abbr + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn abbr(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="address"> + <a href="#address"> + address + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn address(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="area"> + <a href="#area"> + area + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn area(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="article"> + <a href="#article"> + article + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn article(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="aside"> + <a href="#aside"> + aside + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn aside(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="audio"> + <a href="#audio"> + audio + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn audio(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="b"> + <a href="#b"> + b + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn b(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="base"> + <a href="#base"> + base + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn base(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="bdi"> + <a href="#bdi"> + bdi + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn bdi(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="bdo"> + <a href="#bdo"> + bdo + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn bdo(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="blockquote"> + <a href="#blockquote"> + blockquote + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn blockquote(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="body"> + <a href="#body"> + body + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn body(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="br"> + <a href="#br"> + br + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn br(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="button"> + <a href="#button"> + button + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn button(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="canvas"> + <a href="#canvas"> + canvas + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn canvas(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="caption"> + <a href="#caption"> + caption + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn caption(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="cite"> + <a href="#cite"> + cite + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn cite(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="code"> + <a href="#code"> + code + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn code(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="col"> + <a href="#col"> + col + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn col(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="colgroup"> + <a href="#colgroup"> + colgroup + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn colgroup(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="datalist"> + <a href="#datalist"> + datalist + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn datalist(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="dd"> + <a href="#dd"> + dd + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dd(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="del"> + <a href="#del"> + del + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn del(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="details"> + <a href="#details"> + details + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn details(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="dfn"> + <a href="#dfn"> + dfn + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dfn(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="dialog"> + <a href="#dialog"> + dialog + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dialog(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="div"> + <a href="#div"> + div + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn div(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="dl"> + <a href="#dl"> + dl + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dl(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="dt"> + <a href="#dt"> + dt + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dt(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="em"> + <a href="#em"> + em + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn em(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="embed"> + <a href="#embed"> + embed + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn embed(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="fieldset"> + <a href="#fieldset"> + fieldset + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn fieldset(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="figcaption"> + <a href="#figcaption"> + figcaption + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn figcaption(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="figure"> + <a href="#figure"> + figure + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn figure(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="footer"> + <a href="#footer"> + footer + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn footer(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="form"> + <a href="#form"> + form + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn form(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="fragment"> + <a href="#fragment"> + fragment + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub external fn fragment( + children: List(Element(action)), +) -> Element(action)</code></pre> + <div class="rendered-markdown"><p>A fragment doesn’t appear in the DOM, but allows us to treat a list of elements +as if it were a single one. </p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h1"> + <a href="#h1"> + h1 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h1(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h2"> + <a href="#h2"> + h2 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h2(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h3"> + <a href="#h3"> + h3 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h3(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h4"> + <a href="#h4"> + h4 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h4(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h5"> + <a href="#h5"> + h5 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h5(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="h6"> + <a href="#h6"> + h6 + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn h6(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="head"> + <a href="#head"> + head + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn head(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="header"> + <a href="#header"> + header + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn header(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="hr"> + <a href="#hr"> + hr + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn hr(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="html"> + <a href="#html"> + html + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn html(attributes: List(Attribute(a)), head: Element(a), body: Element( + a, + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="i"> + <a href="#i"> + i + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn i(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="iframe"> + <a href="#iframe"> + iframe + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn iframe(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="img"> + <a href="#img"> + img + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn img(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="input"> + <a href="#input"> + input + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn input(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="ins"> + <a href="#ins"> + ins + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn ins(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="kbd"> + <a href="#kbd"> + kbd + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn kbd(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="label"> + <a href="#label"> + label + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn label(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="legend"> + <a href="#legend"> + legend + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn legend(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="li"> + <a href="#li"> + li + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn li(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="main"> + <a href="#main"> + main + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn main(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="map"> + <a href="#map"> + map + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub external fn map( + element: Element(a), + f: fn(a) -> b, +) -> Element(b)</code></pre> + <div class="rendered-markdown"><p>Transforms the actions produced by some element.</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="map_"> + <a href="#map_"> + map_ + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn map_(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="mark"> + <a href="#mark"> + mark + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn mark(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="mathml"> + <a href="#mathml"> + mathml + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn mathml(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="menu"> + <a href="#menu"> + menu + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn menu(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="meta"> + <a href="#meta"> + meta + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn meta(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="meter"> + <a href="#meter"> + meter + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn meter(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="nav"> + <a href="#nav"> + nav + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn nav(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="node"> + <a href="#node"> + node + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub external fn node( + tag: String, + attributes: List(Attribute(action)), + children: List(Element(action)), +) -> Element(action)</code></pre> + <div class="rendered-markdown"><p>Construct a plain HTML element or registered Web Component by providing the +tag name, a list of attributes (including event handlers), and a list of +child elements.</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="noscript"> + <a href="#noscript"> + noscript + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn noscript(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="object"> + <a href="#object"> + object + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn object(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="ol"> + <a href="#ol"> + ol + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn ol(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="optgroup"> + <a href="#optgroup"> + optgroup + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn optgroup(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="option"> + <a href="#option"> + option + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn option(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="output"> + <a href="#output"> + output + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn output(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="p"> + <a href="#p"> + p + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn p(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="param"> + <a href="#param"> + param + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn param(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="picture"> + <a href="#picture"> + picture + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn picture(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="portal"> + <a href="#portal"> + portal + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn portal(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="pre"> + <a href="#pre"> + pre + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn pre(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="progress"> + <a href="#progress"> + progress + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn progress(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="rp"> + <a href="#rp"> + rp + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn rp(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="rt"> + <a href="#rt"> + rt + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn rt(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="ruby"> + <a href="#ruby"> + ruby + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn ruby(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="s"> + <a href="#s"> + s + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn s(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="samp"> + <a href="#samp"> + samp + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn samp(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="section"> + <a href="#section"> + section + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn section(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="select"> + <a href="#select"> + select + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn select(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="slot"> + <a href="#slot"> + slot + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn slot(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="small"> + <a href="#small"> + small + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn small(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="source"> + <a href="#source"> + source + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn source(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="span"> + <a href="#span"> + span + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn span(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="stateful"> + <a href="#stateful"> + stateful + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub external fn stateful( + init: state, + render: fn(state, fn(state) -> Nil) -> Element(action), +) -> Element(action)</code></pre> + <div class="rendered-markdown"><p>A stateful element is exactly what it sounds like: some element with local +encapsulated state! The <code>render</code> function we must provide is called with the +element’s current state as well as a function to set a new state. Whenever +that function is called, the element is re-rendered.</p> +<p>You might be wondering where the <code>stateless</code> version of this function is. +Those are just regular Gleam functions that return <code>Element</code>s!</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="strong"> + <a href="#strong"> + strong + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn strong(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="style"> + <a href="#style"> + style + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn style(attributes: List(Attribute(a)), css: String) -> Element( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="sub"> + <a href="#sub"> + sub + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn sub(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="summary"> + <a href="#summary"> + summary + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn summary(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="sup"> + <a href="#sup"> + sup + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn sup(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="svg"> + <a href="#svg"> + svg + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn svg(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="table"> + <a href="#table"> + table + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn table(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="tbody"> + <a href="#tbody"> + tbody + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn tbody(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="td"> + <a href="#td"> + td + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn td(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="template"> + <a href="#template"> + template + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn template(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="text"> + <a href="#text"> + text + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub external fn text(content: String) -> Element(action)</code></pre> + <div class="rendered-markdown"><p>Render a Gleam string as an HTML text node.</p> +</div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="textarea"> + <a href="#textarea"> + textarea + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn textarea(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="tfoot"> + <a href="#tfoot"> + tfoot + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn tfoot(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="th"> + <a href="#th"> + th + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn th(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="thead"> + <a href="#thead"> + thead + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn thead(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="time"> + <a href="#time"> + time + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn time(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="title"> + <a href="#title"> + title + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn title(attributes: List(Attribute(a)), name: String) -> Element( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="tr"> + <a href="#tr"> + tr + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn tr(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="track"> + <a href="#track"> + track + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn track(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="u"> + <a href="#u"> + u + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn u(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="ul"> + <a href="#ul"> + ul + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn ul(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="var_"> + <a href="#var_"> + var_ + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn var_(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="video"> + <a href="#video"> + video + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn video(attributes: List(Attribute(a)), children: List( + Element(a), + )) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="wbr"> + <a href="#wbr"> + wbr + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn wbr(attributes: List(Attribute(a))) -> Element(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + +</section> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="../highlightjs-gleam.js?v=0.21.0"></script> + + <script src="../gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file diff --git a/docs/lustre/event.html b/docs/lustre/event.html new file mode 100644 index 0000000..109f30b --- /dev/null +++ b/docs/lustre/event.html @@ -0,0 +1,602 @@ +<!DOCTYPE html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>lustre/event - lustre</title> + <link rel="stylesheet" href="../index.css?v=0.21.0" type="text/css" /> + <!-- The docs_config.js file is provided by HexDocs and shared + between multiple versions of the same package. --> + <script src="../docs_config.js"></script> + <link id="syntax-theme" rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/styles/atom-one-light.min.css"> + </head> + <body class="prewrap-off theme-light drawer-closed"> + <script> + "use strict"; + + /* gleamConfig format: + * // object with one or more options + * {option: { + * // array of values + * values: [{ + * // this value + * value: "off", + * // optional button label + * label: "default", + * // optional array of icons + * icons: ["star", "toggle-left", ...], + * }, ...], + * + * // value update function + * update: () => {...}, + * + * // optional callback function + * callback: (value) => {...}, + * }, ...}; + */ + const gleamConfig = { + theme: { + values: (() => { + const dark = { + value: "dark", + label: "Switch to light mode", + icons: ["moon"], + }; + const light = { + value: "light", + label: "Switch to dark mode", + icons: ["sun"], + }; + return ( + window.matchMedia("(prefers-color-scheme: dark)").matches + ? [dark, light] + : [light, dark] + ).map((item, index) => { + item.icons.push(`toggle-${0 === index ? "left" : "right"}`); + return item; + }); + })(), + + update: () => "light" === Gleam.getProperty("theme") ? "dark" : "light", + + callback: function(value) { + const syntaxThemes = { + dark: "atom-one-dark", + light: "atom-one-light", + }; + const syntaxTheme = document.querySelector("#syntax-theme"); + const hrefParts = syntaxTheme.href.match( + /^(.*?)([^/\\#?]+?)((?:\.min)?\.css.*)$/i + ); + if (syntaxThemes[value] !== hrefParts[2]) { + hrefParts[2] = syntaxThemes[value]; + hrefParts.shift(); + syntaxTheme.href = hrefParts.join(""); + } + }, + }, + prewrap: { + values: [ + { + value: "off", + label: "Switch to line-wrapped snippets", + icons: ["more-horizontal", "toggle-left"], + }, + { + value: "on", + label: "Switch to non-wrapped snippets", + icons: ["more-vertical", "toggle-right"], + }, + ], + + update: () => "off" === Gleam.getProperty("prewrap") ? "on" : "off", + }, + }; + </script> + + <script> + "use strict"; + + /* Initialise options before any content loads */ + void function() { + for (const property in gleamConfig) { + const name = `Gleam.${property}`; + + let value; + + try { + value = localStorage.getItem(name); + if (value.startsWith('"') && value.endsWith('"')) { + localStorage.setItem(name, value.slice(1, value.length - 1)); + } + } + catch (_error) {} + + const defaultValue = gleamConfig[property].values[0].value; + try { + value = localStorage.getItem(name); + } + catch(_error) {} + if (-1 < [null, undefined].indexOf(value)) { + value = defaultValue; + } + const bodyClasses = document.body.classList; + bodyClasses.remove(`${property}-${defaultValue}`); + bodyClasses.add(`${property}-${value}`); + try { + gleamConfig[property].callback(value); + } + catch(_error) {} + } + }(); + </script> + + <header class="page-header"> + <button class="sidebar-toggle" tabindex="0"> + <svg class="label label-closed icon icon-menu" alt="Open Menu" title="Open Menu"><use xlink:href="#icon-menu"></use></svg> + <svg class="label label-open icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + <h2> + <a href="../">lustre</a> + <span id="project-version"> + <span> - v0.1.0 </span> + </span> + <script> + "use strict"; + + if ("undefined" !== typeof versionNodes) { + const currentVersion = "v0.1.0"; + if (! versionNodes.find(element => element.version === currentVersion)) { + versionNodes.unshift({ version: currentVersion, url: "#" }); + } + document.querySelector("#project-version").innerHTML = + versionNodes.reduce( + (acc, element) => { + const status = + currentVersion === element.version ? "selected disabled" : ""; + return ` + ${acc} + <option value="${element.url}" ${status}> + ${element.version} + </option> + `; + }, + ` + <form autocomplete="off"> + <select onchange="window.location.href = this.value"> + ` + ) + ` + </select> + <svg class="icon icon-chevrons-down"><use xlink:href="#icon-chevrons-down"></use></svg> + </form> + `; + } + </script> + </h2> + </header> + + <div class="page"> + <nav class="sidebar"> + <button class="sidebar-toggle" tabindex="1"> + <svg class="label icon icon-x-circle" alt="Close Menu" title="Close Menu"><use xlink:href="#icon-x-circle"></use></svg> + </button> + + + <h2>Pages</h2> + <ul> + + <li><a href="../index.html">README</a></li> + + </ul> + + + + + + <h2>Modules</h2> + <ul> + + <li><a href="../lustre.html">lustre</a></li> + + <li><a href="../lustre/attribute.html">lustre/attribute</a></li> + + <li><a href="../lustre/cmd.html">lustre/cmd</a></li> + + <li><a href="../lustre/element.html">lustre/element</a></li> + + <li><a href="../lustre/event.html">lustre/event</a></li> + + </ul> + + + + + + + + + +<h2>Functions</h2> +<ul> + + <li><a href="#dispatch">dispatch</a></li> + + <li><a href="#on">on</a></li> + + <li><a href="#on_blur">on_blur</a></li> + + <li><a href="#on_check">on_check</a></li> + + <li><a href="#on_click">on_click</a></li> + + <li><a href="#on_focus">on_focus</a></li> + + <li><a href="#on_input">on_input</a></li> + + <li><a href="#on_keydown">on_keydown</a></li> + + <li><a href="#on_keypress">on_keypress</a></li> + + <li><a href="#on_keyup">on_keyup</a></li> + + <li><a href="#on_mouse_down">on_mouse_down</a></li> + + <li><a href="#on_mouse_enter">on_mouse_enter</a></li> + + <li><a href="#on_mouse_leave">on_mouse_leave</a></li> + + <li><a href="#on_mouse_out">on_mouse_out</a></li> + + <li><a href="#on_mouse_over">on_mouse_over</a></li> + + <li><a href="#on_mouse_up">on_mouse_up</a></li> + + <li><a href="#on_submit">on_submit</a></li> + +</ul> + + + </nav> + + <main class="content"> + +<h1 id="module-name" class="module-name"> + <a href="#module-name">lustre/event</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> +</h1> + + + + + + + + + +<section class="module-members"> + <h1 id="module-functions" class="module-member-kind"> + <a href="#module-functions">Functions</a> + <svg class="icon icon-gleam-chasse"><use xlink:href="#icon-gleam-chasse"></use></svg> + </h1> + + <div class="member"> + <div class="member-name"> + <h2 id="dispatch"> + <a href="#dispatch"> + dispatch + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn dispatch(action: a) -> fn(fn(a) -> Nil) -> Nil</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on"> + <a href="#on"> + on + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on(name: String, handler: fn(Dynamic, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_blur"> + <a href="#on_blur"> + on_blur + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_blur(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_check"> + <a href="#on_check"> + on_check + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_check(handler: fn(Bool, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_click"> + <a href="#on_click"> + on_click + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_click(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_focus"> + <a href="#on_focus"> + on_focus + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_focus(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_input"> + <a href="#on_input"> + on_input + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_input(handler: fn(String, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_keydown"> + <a href="#on_keydown"> + on_keydown + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_keydown(handler: fn(String, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_keypress"> + <a href="#on_keypress"> + on_keypress + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_keypress(handler: fn(String, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_keyup"> + <a href="#on_keyup"> + on_keyup + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_keyup(handler: fn(String, fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_down"> + <a href="#on_mouse_down"> + on_mouse_down + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_down(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_enter"> + <a href="#on_mouse_enter"> + on_mouse_enter + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_enter(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_leave"> + <a href="#on_mouse_leave"> + on_mouse_leave + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_leave(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_out"> + <a href="#on_mouse_out"> + on_mouse_out + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_out(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_over"> + <a href="#on_mouse_over"> + on_mouse_over + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_over(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_mouse_up"> + <a href="#on_mouse_up"> + on_mouse_up + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_mouse_up(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute( + a, +)</code></pre> + <div class="rendered-markdown"></div> + </div> + + <div class="member"> + <div class="member-name"> + <h2 id="on_submit"> + <a href="#on_submit"> + on_submit + </a> + </h2> + + + </div> + <pre><code class="hljs gleam">pub fn on_submit(handler: fn(fn(a) -> Nil) -> Nil) -> Attribute(a)</code></pre> + <div class="rendered-markdown"></div> + </div> + +</section> + + + </main> + </div> + + <script> + "use strict"; + const pride = () => document.body.classList.toggle("show-pride"); + </script> + <a class="pride-button" onclick="pride()">✨</a> + <footer class="pride" onclick="pride()"> + <div class="blue">Lucy</div> + <div class="pink">says</div> + <div class="white">trans</div> + <div class="pink">rights</div> + <div class="blue">✨</div> + </footer> + + <svg class="svg-lib" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <symbol id="icon-chevrons-down" viewBox="0 0 24 24"><path d="M6.293 13.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM6.293 6.707l5 5c0.391 0.391 1.024 0.391 1.414 0l5-5c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-4.293 4.293-4.293-4.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + + <symbol id="icon-gleam-chasse" viewBox="0 0 180 22"><path d="m0.00798 15.6c0.784-1.73 0.754-2.11 1.94-3.97 1.17-0.28 2.66-0.119 3.71-0.524 1.12 0.501 1.85 0.729 3.35-0.466 0.942-0.806 2.41 0.656 3.41-0.0865 2.53-1.48 0.972-1.03 5.14-0.585 1.79-0.493 3.46-0.852 6.64-1.06 3.8-0.331 0.0108-1.06 5.16-1.16 0.874-0.835 3.43-1.34 5.49-0.963 2.17-1.41 0.488-1.58 2.64-0.426 4.36-0.0592 0.83-1.08 5.39-1.22 3.27-0.264 0.843-0.471 2.82 0.187 2.13-0.254 1.36-0.525 3.67 0.709 1.77 1.66 0.962 0.181 1.9 2.32 0.26 0.593 0.304 1.71 0.814 1.74 3.67-0.833-0.0875 0.536 4.63-0.838 0.719-0.891 4.42 0.255 3.8-0.806 2.07 0.119 2.75-0.7 6.07-0.822 1.48-1.17 2.26 0.943 3.4-0.974 0.391 0.166-1.61-0.548 3.88-0.154 2.93-1.26-1.74 0.103 4.21-0.851 3.52 8e-3 0.233-0.263 3.33-0.811 1.06-1.46-0.459-1.02 5.55-0.963 2.61-2.11 0.281-1.59 4.88-0.572 0.699 0.597 3.05 1.65 3.99 3.26 0.863-0.152 2.77 0.0659 3.41-0.626 2.24-1.04-0.0635-1.05 3.37-1.34 2.1 0.115 2.2-1.21 2.77-0.679 5.91-0.778 1.96-1.63 4.89-1.49 5.47 0.212 0.204 1.22 3.99-0.265 2.14-0.0482 0.411-0.776 2.93-0.892 2.17-0.148 0.604-0.262 2.54-1.52 0.804 0.0911 1.11 0.562 1.23 1.57 0.468 1.54 0.966 3.31 1.86 4.62 2.67-0.472-0.76-0.582 4.72-0.393 3.14 0.131 3.72-0.565 6.16-0.724 4.54-0.853 1.37-0.939 5.89-0.58 10.1-1.7 2.9-0.523 10.2-1.15 4.86-0.211 4.69-0.969 7.4-1.04 3.46-0.0576 3.13 0.58 3.83 0 3.63 0.257 2.5-0.141 7.74-0.46 2.23 1.09-0.13 0.518 5.9 0.145 1.12-0.0184 2.85-6e-3 3.83-0.186 0.748 0.694 1.01 1.4 1.58 2.33-0.112 0.687-0.306 0.992-0.454 1.51 0.0805 0.459-0.0486 0.901 0.226 1.36 0.057 0.859-1.34 1.08-2.69 0.127-3.53-0.828-1.21-0.849-7.23 0.974-5.16-0.286-1.66-0.354-7.64 0.321-1.48 0.961-4.73 0.287-6.76 0.551-4.01 0.178-1.95-0.517-3.33 0.624-5.29 1.8-3.12 1.47-5.66 0.941-5.26 0.0339-2.08-0.772-4.75 0.424-6.08 2.5-3.35 1.33-7.54 2.02-6.37-0.269-3.02 1.17-6.76 0.468-0.975 0.1-2.43 0.343-3.46 0.786-1.5-0.748-1.92 0.689-3.38 0.363-0.83-0.0851-2.1-0.343-3.5-0.0239-1.28 0.81-3.87-0.666-5.67-2.17-0.131-0.478-0.106-0.902-0.403-1.69-1.63 0.392-0.668 0.395-4.29 1.14-2.71 0.289 0.131 0.495-3.22 0.964-0.638 0.331-0.998 1.17-3.15 1.04-3.09 0.469-4.48 2.1-3.66 0.577-2.95 0.347-2.9 1.82-5.86 1.85-3.3 0.815 0.192 0.978-5.2 1.66-2.81 2.66 0.0387 0.735-4.21 1.29-1.43-0.911-2.24-2.29-3.89-3.63-0.363-0.679 0.258-1.84-0.375-2.28-5.28 1.39 0.176-0.925-5.08 1.01-10.6 1.42-4.55 1.88-9.18 1.66-6.73 1.35-4.11 1.99-10.2 2.31-4.53 1.09-1.63-0.398-5.52 1.02-3.15 0.522-2.41-0.0562-4.51 1.04-0.76 0.379-0.865-0.416-2.75-0.0493-3.5-3.45-2.85-0.892-2.93-6.14-4.41 0.837 0.477 0.703-6.18 1.2-4.59 0.0171-1.93 1.02-7.41 1.04-0.815 0.505-2.55 0.453-4.13 0.791-5 0.71-5.97 2-8.46 1.61-1.39 1.09-2.58 1.53-4.22 2.62-0.919 0.756-3.45 0.596-4.48 0.492-0.525-0.406-0.751-1.2-1.82-3.28 0.149-0.902-0.325-1.44-0.248-2.8z"></path></symbol> + + <symbol id="icon-gleam-chasse-2" viewBox="0 0 108 22"><path d="m0.585 18.5c-0.578-1.54-0.65-1.33-0.543-2.64 0.271-1.19 0.153-1.06 1.27-1.71 0.993 0.124 1.94-0.662 2.94-0.869 2.48 0.119 0.772 0.443 2.99-0.366 1.66-1.91 0.764 0.783 3.36-0.992 2.37 0.314 4.26-1.5 5.16-1.26 0.387 0.627 0.202 0.412 2.52-0.776 4.89-1.57 3.91-1.47 5-0.972 2.05-1.09-0.0615-0.49 2.79-1.2 4.47-0.514 3.62 0.127 4.18-1.19 4.3-0.613 2.56-1.49 4.09-0.847 1.8-1.51 1.01 0.157 2.64-0.722 4.91-1.28 1.39 0.553 4.43-0.843 1.28-0.387 2.72-0.427 4.05-0.748 0.332-0.942 1.93 0.121 2.75-0.817 3 0.294-0.74-0.514 3.35-0.219 2.34-1.12 0.474 0.505 3.01-1.33 0.779-0.552 0.958 0.919 2.76-0.331 1.26-0.027 0.231 0.642 1.71 0.0417 1.08-0.234-0.332-0.25 1.4-0.727 1.07 0.281 0.347 0.858 2.47 1.86 1.02 2.09-0.0407 0.967 0.473 3.88-0.19 1.31 0.095 0.629-1.34 1.44-0.351 0.381-0.494 0.132-0.0505 0.773 5.7-0.865 2.24-0.0704 4.31-0.722 1.39-0.602 3.12 0.189 3.85-0.396 5.52-1.74 1.2 0.802 5.56-0.972 5.77-0.78 5.5-0.0267 5.87-0.622 1.29-0.593 0.466-0.184 2.73-0.0872 0.586-0.907-0.0863-0.919 1.23-0.644 0.471-1.23 3.03 0.227 3.86-0.234 1.2 0.319 2.27 0.00513 2.55 0.264 0.378 0.998 1.18 1.79 1.78 2.57-0.109 0.798 0.472 1.14 0.254 2.4 2.25-0.43 1.69-0.298 4.1-0.338 2.35-1.11 0.595 0.263 3.12-0.813 1.5-0.153 2.17 0.044 3.29-0.328 1.39-0.699 0.859-0.135 1.88-0.671 1.35 0.779 0.389 0.64 1.39 1.7 0.132 1.37 0.34 1.03 0.117 2.21-0.619 0.327-0.757 0.0587-1.28 0.739-2.68 0.688-0.161 0.395-2.5 0.734-1.97-0.203-0.915-0.0737-3.21 0.454-1.76 1.41-0.982 1.12-2.36 1.43-1.65 0.974 0.119-0.784-2.27 0.501-0.883 0.361-1.2 0.471-1.88 0.827-2.84 1.1-1.72-0.0496-3.18 1.37-2.38 0.689-1.82 0.324-2.65 1.27-3.52 0.658-2.07-0.49-3.27-0.419-1.85-2.19 0.14-0.414-1.87-2.62-0.551-2.06-0.527-0.977 0.131-2.63 0.366-1.44 0.369-0.627 1.15-1.88-1.79 0.433-1.64 0.163-5.6 0.781-3.59 1.82-0.592-0.17-4.29 0.729-0.705 0.598-0.369 0.995-1.59-0.0892-0.655 0.638-0.104 0.42-2.9 0.621-3.6 1.1-2.83 1.29-4.17 0.742 0.0193-1.05-1.8 1.24-2.18 0.454-2.51 0.61-1.36 0.795-3.64 0.594-0.211 0.804-4.14-0.139-5.09 0.879-3.61 0.381 0.127-0.296-3.51-1.03-1.44-1.87-1.14-0.196-1.22-3.01 0.14-1.2-0.505-0.638-0.0251-2.39-2.64 0.466-1.25-0.372-3.55 0.344-4.12 0.781-0.26 1.32-4.36 1.02-1.78 0.235 0.327 0.568-3.16 0.555-1.36 0.861-0.709 0.778-2.01 0.649-4.07 1.1-0.948 0.904-4.54 1.17-1.27 0.686-4.67 0.341-4.6 1.04-2.47 0.466-0.707 1.46-3.49 0.582-2.93 1.39-0.739 1.31-4.38 1.56-3.21 1.23-0.735 1.93-3.87 1.14-2.82 1.91-0.676 1.23-4.04 1.82-1.97 1.47 0.312 0.745-2.95 0.812-3.51 1.54 0.0965-0.473-4.27 1.39-2.68 0.382-1.75 0.682-3.32-0.585-1.65-1.61 0.361-0.307-1.37-2.31z"></path></symbol> + + <symbol id="icon-menu" viewBox="0 0 24 24"><path d="M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z"></path></symbol> + + <symbol id="icon-moon" viewBox="0 0 24 24"><path d="M21.996 12.882c0.022-0.233-0.038-0.476-0.188-0.681-0.325-0.446-0.951-0.544-1.397-0.219-0.95 0.693-2.060 1.086-3.188 1.162-1.368 0.092-2.765-0.283-3.95-1.158-1.333-0.985-2.139-2.415-2.367-3.935s0.124-3.124 1.109-4.456c0.142-0.191 0.216-0.435 0.191-0.691-0.053-0.55-0.542-0.952-1.092-0.898-2.258 0.22-4.314 1.18-5.895 2.651-1.736 1.615-2.902 3.847-3.137 6.386-0.254 2.749 0.631 5.343 2.266 7.311s4.022 3.313 6.772 3.567 5.343-0.631 7.311-2.266 3.313-4.022 3.567-6.772zM19.567 14.674c-0.49 1.363-1.335 2.543-2.416 3.441-1.576 1.309-3.648 2.016-5.848 1.813s-4.108-1.278-5.417-2.854-2.016-3.648-1.813-5.848c0.187-2.032 1.117-3.814 2.507-5.106 0.782-0.728 1.71-1.3 2.731-1.672-0.456 1.264-0.577 2.606-0.384 3.899 0.303 2.023 1.38 3.934 3.156 5.247 1.578 1.167 3.448 1.668 5.272 1.545 0.752-0.050 1.496-0.207 2.21-0.465z"></path></symbol> + + <symbol id="icon-more-horizontal" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM21 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM7 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-more-vertical" viewBox="0 0 24 24"><path d="M14 12c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 5c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414zM14 19c0-0.552-0.225-1.053-0.586-1.414s-0.862-0.586-1.414-0.586-1.053 0.225-1.414 0.586-0.586 0.862-0.586 1.414 0.225 1.053 0.586 1.414 0.862 0.586 1.414 0.586 1.053-0.225 1.414-0.586 0.586-0.862 0.586-1.414z"></path></symbol> + + <symbol id="icon-star" viewBox="0 0 24 24"><path d="M12.897 1.557c-0.092-0.189-0.248-0.352-0.454-0.454-0.495-0.244-1.095-0.041-1.339 0.454l-2.858 5.789-6.391 0.935c-0.208 0.029-0.411 0.127-0.571 0.291-0.386 0.396-0.377 1.029 0.018 1.414l4.623 4.503-1.091 6.362c-0.036 0.207-0.006 0.431 0.101 0.634 0.257 0.489 0.862 0.677 1.351 0.42l5.714-3.005 5.715 3.005c0.186 0.099 0.408 0.139 0.634 0.101 0.544-0.093 0.91-0.61 0.817-1.155l-1.091-6.362 4.623-4.503c0.151-0.146 0.259-0.344 0.292-0.572 0.080-0.546-0.298-1.054-0.845-1.134l-6.39-0.934zM12 4.259l2.193 4.444c0.151 0.305 0.436 0.499 0.752 0.547l4.906 0.717-3.549 3.457c-0.244 0.238-0.341 0.569-0.288 0.885l0.837 4.883-4.386-2.307c-0.301-0.158-0.647-0.148-0.931 0l-4.386 2.307 0.837-4.883c0.058-0.336-0.059-0.661-0.288-0.885l-3.549-3.457 4.907-0.718c0.336-0.049 0.609-0.26 0.752-0.546z"></path></symbol> + + <symbol id="icon-sun" viewBox="0 0 24 24"><path d="M18 12c0-1.657-0.673-3.158-1.757-4.243s-2.586-1.757-4.243-1.757-3.158 0.673-4.243 1.757-1.757 2.586-1.757 4.243 0.673 3.158 1.757 4.243 2.586 1.757 4.243 1.757 3.158-0.673 4.243-1.757 1.757-2.586 1.757-4.243zM16 12c0 1.105-0.447 2.103-1.172 2.828s-1.723 1.172-2.828 1.172-2.103-0.447-2.828-1.172-1.172-1.723-1.172-2.828 0.447-2.103 1.172-2.828 1.723-1.172 2.828-1.172 2.103 0.447 2.828 1.172 1.172 1.723 1.172 2.828zM11 1v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM11 21v2c0 0.552 0.448 1 1 1s1-0.448 1-1v-2c0-0.552-0.448-1-1-1s-1 0.448-1 1zM3.513 4.927l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM17.653 19.067l1.42 1.42c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-1.42-1.42c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414zM1 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM21 13h2c0.552 0 1-0.448 1-1s-0.448-1-1-1h-2c-0.552 0-1 0.448-1 1s0.448 1 1 1zM4.927 20.487l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0zM19.067 6.347l1.42-1.42c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-1.42 1.42c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"></path></symbol> + + <symbol id="icon-toggle-left" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM12 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM10 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-toggle-right" viewBox="0 0 24 24"><path d="M8 4c-2.209 0-4.21 0.897-5.657 2.343s-2.343 3.448-2.343 5.657 0.897 4.21 2.343 5.657 3.448 2.343 5.657 2.343h8c2.209 0 4.21-0.897 5.657-2.343s2.343-3.448 2.343-5.657-0.897-4.21-2.343-5.657-3.448-2.343-5.657-2.343zM8 6h8c1.657 0 3.156 0.67 4.243 1.757s1.757 2.586 1.757 4.243-0.67 3.156-1.757 4.243-2.586 1.757-4.243 1.757h-8c-1.657 0-3.156-0.67-4.243-1.757s-1.757-2.586-1.757-4.243 0.67-3.156 1.757-4.243 2.586-1.757 4.243-1.757zM20 12c0-1.104-0.449-2.106-1.172-2.828s-1.724-1.172-2.828-1.172-2.106 0.449-2.828 1.172-1.172 1.724-1.172 2.828 0.449 2.106 1.172 2.828 1.724 1.172 2.828 1.172 2.106-0.449 2.828-1.172 1.172-1.724 1.172-2.828zM18 12c0 0.553-0.223 1.051-0.586 1.414s-0.861 0.586-1.414 0.586-1.051-0.223-1.414-0.586-0.586-0.861-0.586-1.414 0.223-1.051 0.586-1.414 0.861-0.586 1.414-0.586 1.051 0.223 1.414 0.586 0.586 0.861 0.586 1.414z"></path></symbol> + + <symbol id="icon-x-circle" viewBox="0 0 24 24"><path d="M23 12c0-3.037-1.232-5.789-3.222-7.778s-4.741-3.222-7.778-3.222-5.789 1.232-7.778 3.222-3.222 4.741-3.222 7.778 1.232 5.789 3.222 7.778 4.741 3.222 7.778 3.222 5.789-1.232 7.778-3.222 3.222-4.741 3.222-7.778zM21 12c0 2.486-1.006 4.734-2.636 6.364s-3.878 2.636-6.364 2.636-4.734-1.006-6.364-2.636-2.636-3.878-2.636-6.364 1.006-4.734 2.636-6.364 3.878-2.636 6.364-2.636 4.734 1.006 6.364 2.636 2.636 3.878 2.636 6.364zM8.293 9.707l2.293 2.293-2.293 2.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l2.293-2.293 2.293 2.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-2.293-2.293 2.293-2.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-2.293 2.293-2.293-2.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z"></path></symbol> + </defs> + </svg> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/highlight.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/erlang.min.js"></script> + + <script src="https://unpkg.com/@highlightjs/cdn-assets@10.5.0/languages/elixir.min.js"></script> + + <script src="../highlightjs-gleam.js?v=0.21.0"></script> + + <script src="../gleam.js?v=0.21.0"></script> + </body> +</html>
\ No newline at end of file |