brut 0.14.0 → 0.15.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d6954b7b2b7dd919d891eb6ee7a734e3c4279f7781eeb899c88ac80982662ba6
-  data.tar.gz: b02e176ae104ab3214d52877f13a81e17fa32c4de53d57c5bbe193cd9209f9ad
+  metadata.gz: b85e8f08f4b6505e4eb6b0eccf7954116e843e29a2fe44701510fb48a5453530
+  data.tar.gz: ee48f403522914288e3a6ee5a4c5182907da98102fe0080cd27a6afee4f63b33
 SHA512:
-  metadata.gz: a7f6684baab276fcaab1db9eee5427c9e79d5e50a09032bcaf4e417dbee109fa0c4b77322884304a13310ae6b013fbd23d880b1928c83f1a5db627bb09f403b9
-  data.tar.gz: db5de2626cdeabe12ce571fd046c0472a5295d8831684c9a95b4e2b251f59217c7ec7e5de9ae5c473a2ead812d675d76de1d8e38730dbe4cca7e960bf8cf3839
+  metadata.gz: 894635a9a6137e99a5b48726e8c57266835741682591ff1c8121b9fc9d68f3ce752172a403018e8b3d6d64ddac197ef4ed11a58da0fe5a3b9bbe49663f4053b7
+  data.tar.gz: 36d4f093177d2a0f79f698c46eb5615225cf59c82562f990ef102feb9e8bd54c7e2655cfed9b8eaa2af35a134f0510adc7b06a91262cfaacfccddb233588a561

data/CHANGELOG.md

@@ -1,5 +1,10 @@
 # Brut CHANGELOG
 
+## v0.15.0 - Sep 16, 2025
+
+* Added `<brut-toast>` to help with toast notifications.  They rely on CSS for showing, hiding, and animations, all your
+  client-side JS needs to do is set the `key` attribute to show the Toast with an i18n-provided message
+
 ## v0.14.0 - Sep 9, 2025
 
 * **BREAKING CHANGE** Layouts now have access to the page object they are 

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    brut (0.14.0)
+    brut (0.15.0)
       concurrent-ruby
       i18n
       irb

data/brut-css/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "brut-css",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "brut-css",
-      "version": "0.14.0",
+      "version": "0.15.0",
       "license": "Hippocratic-2.1",
       "devDependencies": {
         "comment-parser": "^1.4.1",

data/brut-css/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brut-css",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Utility CSS Library for Full Stack Developers",
   "keywords": [
     "css"

data/brut-js/package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "brut-js",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "brut-js",
-      "version": "0.14.0",
+      "version": "0.15.0",
       "license": "Hippocratic-2.1",
       "devDependencies": {
         "esbuild": "^0.24.2",

data/brut-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brut-js",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "type": "module",
   "keywords": [
     "WebComponents",

data/brut-js/specs/Toast.spec.js

@@ -0,0 +1,34 @@
+import { withHTML } from "./SpecHelper.js"
+
+describe("<brut-toast>", () => {
+  withHTML(`
+    <div>
+     <brut-i18n-translation key="toast.saved" value="Save successful"></brut-i18n-translation>
+     <brut-toast show-warnings>
+       <div>
+         <output><span>Message here</span></output>
+         <button>Close</button>
+       </div>
+       <button>Close</button>
+     </brut-toast>
+   </div>
+  `).test("setting the key shows the message, then it's removed when closed", ({window,document,assert}) => {
+
+    const toast = document.querySelector("brut-toast")
+    assert(toast, "brut-toast element should be present")
+
+    toast.setAttribute("key", "toast.saved")
+    const output = toast.querySelector("output")
+    assert.equal(output.textContent.trim(), "Save successful")
+    const message = output.querySelector("brut-message")
+    assert(message, "brut-message should be present")
+    console.log(message.outerHTML)
+    assert.equal(message.getAttribute("role"), "status")
+    assert.equal(message.getAttribute("aria-live"), "polite")
+    assert.equal(message.getAttribute("aria-atomic"), "true")
+
+    const button = toast.querySelector("button")
+    button.click()
+    assert.equal(toast.getAttribute("key"), null)
+  })
+})

data/brut-js/src/I18nTranslation.js

@@ -49,6 +49,9 @@ class I18nTranslation extends BaseCustomElement {
    * }
    */
   translation(interpolatedValues) {
+    if (!this.#value) {
+      this.logger.warn("No value attribute for key '%s', so translation will be blank", this.#key)
+    }
     return this.#value.replaceAll(/%\{([^}%]+)\}/g, (match,key) => {
       if (interpolatedValues[key]) {
         return interpolatedValues[key]

data/brut-js/src/Message.js

@@ -23,10 +23,16 @@ class Message extends BaseCustomElement {
     "key",
   ]
 
+  /*
+   * Creates a new `<brut-message>` element with the given attributes.
+   */
   static createElement(document,attributes) {
     const element = document.createElement(Message.tagName)
-    element.setAttribute("key",attributes.key)
-    element.setAttribute("show-warnings",attributes["show-warnings"])
+    Object.entries(attributes).forEach(([name,value]) => {
+      if (value !== null && value !== undefined) {
+        element.setAttribute(name,value)
+      }
+    })
     return element
   }
 
@@ -49,7 +55,7 @@ class Message extends BaseCustomElement {
       return
     }
 
-    this.textContent = RichString.fromString(translation.translation()).capitalize().toString()
+    this.textContent = RichString.fromString(translation.translation(), {allowBlank: true }).capitalize().toString()
   }
 }
 

data/brut-js/src/RichString.js

@@ -13,10 +13,13 @@ class RichString {
    *
    * @param {null|undefined|String|RichString} possiblyDefinedStringOrRichString - if `null`, `undefined`, or otherwise falsey, this method returns `null`. If a String, returns a new `RichString` wrapping it. If a `RichString`, returns the `RichString` unchanged.
    */
-  static fromString(possiblyDefinedStringOrRichString) {
+  static fromString(possiblyDefinedStringOrRichString, {allowBlank=false} = {}) {
     if (possiblyDefinedStringOrRichString instanceof RichString) {
       return possiblyDefinedStringOrRichString
     }
+    if (allowBlank && possiblyDefinedStringOrRichString === "") {
+      return new RichString("")
+    }
     if (!possiblyDefinedStringOrRichString) {
       return null
     }

data/brut-js/src/Toast.js

@@ -0,0 +1,102 @@
+import { BaseCustomElement, RichString, Message } from "brut-js"
+
+/**
+ * Support for a toast component, which is a momentary message shown to the user, for example
+ * if an aynchronous update has occured.
+ *
+ * To use this element, you should set up your CSS so that the element is hidden if there is no `key`
+ * attribute set.  When the `key` attribute *is* set, the element should be shown.  You can use CSS animations
+ * for this as needed, but the main thing to remember is that, without a `key` attribute, this element
+ * should not be visible.
+ *
+ * The `key` attribute is expected to be an i18n key that references a `<brut-i18n-message>` on
+ * the page, which contains the actual message to show the visitor.  When the `key` attribute is
+ * set, this component will find an `<output>` inside itself, and replace the entire contents
+ * with a `<brut-message>` component, using the same `key`.  This will cause the `<brut-message>`
+ * to look up the key and put that text into the element.
+ *
+ * In addition to this lookup, this element will set appropriate ARIA attributes on the
+ * created `<brut-message>` element.
+ *
+ * Further, if there is a `<button>` inside this element, it will be used to close the toast by removing the
+ * `key` attribute (which, assuming your CSS is correct, will hide the element).
+ *
+ * @property {string} key - an I18n key of the message to show in the toast.  When you generate
+ *                          the toast's HTML on the server, do not set key.  Then, when you need
+ *                          to display the toast, use JavaScript to set the key. This will
+ *                          trigger its behavior as described above.
+ *
+ * @example
+ * <style>
+ *   brut-toast {
+ *     display: none;
+ *   }
+ *   brut-toast[key] {
+ *     display: block;
+ *   }
+ * </style>
+ * <brut-i18n-translation key="toast.saved">Save successful</brut-i18n-translation>
+ * <brut-toast>
+ *   <div>
+ *   <output></output>
+ *   <button>Close</button>
+ *   </div>
+ * </brut-toast>
+ * <!-- now, if you set the key to "toast.saved", the HTML will be changed as follows: -->
+ * <brut-toast key="toast.saved">
+ *   <div>
+ *   <output>
+ *     <brut-message key="toast.saved" role="status" aria-live="polite" aria-atomic="true">
+ *       Save successful
+ *     </brut-message>
+ *   </output>
+ *   <button>Close</button>
+ *   </div>
+ * </brut-toast>
+ */
+class Toast extends BaseCustomElement {
+  static tagName = "brut-toast"
+
+  static observedAttributes = [
+    "show-warnings",
+    "key",
+  ]
+
+  #key = null
+  #closeListener = (event) => {
+    event.preventDefault()
+    this.removeAttribute("key")
+  }
+
+  keyChangedCallback({newValue}) {
+    this.#key = RichString.fromString(newValue)
+  }
+
+  update() {
+    const closeButton = this.querySelector("button")
+
+    if (closeButton) {
+      closeButton.addEventListener("click", this.#closeListener)
+    }
+
+    if (!this.#key) {
+      return
+    }
+    const output = this.querySelector("output")
+    if (!output) {
+      this.logger.warn("No <output> element found, so toast will not be displayed")
+      return
+    }
+    const messageNode = Message.createElement(document,{
+      "key": this.#key,
+      "role": "status",
+      "aria-live": "polite",
+      "aria-atomic": "true"
+    })
+    output.replaceChildren(messageNode)
+    this.style.animation = "none"
+    this.offsetWidth // Trigger reflow to restart the animation
+    this.style.animation = ""
+  }
+}
+export default Toast

data/brut-js/src/index.js

@@ -12,6 +12,7 @@ import LocaleDetection             from "./LocaleDetection"
 import Message                     from "./Message"
 import RichString                  from "./RichString"
 import Tabs                        from "./Tabs"
+import Toast                       from "./Toast"
 import Tracing                     from "./Tracing"
 
 /**
@@ -105,6 +106,7 @@ BrutCustomElements.addElementClasses(
   AjaxSubmit,
   ConstraintViolationMessage,
   Tabs,
+  Toast,
   LocaleDetection,
   Autosubmit,
   Tracing,
@@ -125,6 +127,7 @@ export {
   Message,
   RichString,
   Tabs,
+  Toast,
   Tracing
 }
 

data/brutrb.com/brut-js.md

@@ -52,6 +52,7 @@ of what each one does.
 | `<brut-locale-detection>`    | Sends an Ajax request to the server with the browser's reported locale and timezone.  See [space-time continuum](/space-time-continuum#getting-timezone-from-the-browser) for more details.        |
 | `<brut-message>`             | Shows a message using an [i18n](/i18n) key to dynamically pull a localized message for client-side constraint violations. |
 | `<brut-tabs>`                | Uses ARIA roles related to a tab control and implements it client-side. |
+| `<brut-toast>`               | Support for managing i18-capable [toast notifications](https://en.wikipedia.org/wiki/Pop-up_notification) |
 | `<brut-tracing>`             | Sends observability data back to the server to unify a server-side request with client-side tracing.|
 
 > [!NOTE]

data/docs/404.html

@@ -5,11 +5,11 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>404 | Brut RB</title>
     <meta name="description" content="Not Found">
-    <meta name="generator" content="VitePress v1.6.3">
+    <meta name="generator" content="VitePress v1.6.4">
     <link rel="preload stylesheet" href="/assets/style.B1z60PPQ.css" as="style">
     <link rel="preload stylesheet" href="/vp-icons.css" as="style">
     
-    <script type="module" src="/assets/app.BDtsVxyd.js"></script>
+    <script type="module" src="/assets/app.B0X8upRm.js"></script>
     <link rel="icon" href="/favicon.ico">
     <meta property="og:title" content="BrutRB Documentation">
     <meta property="og:type" content="website">
@@ -20,7 +20,7 @@
   </head>
   <body>
     <div id="app"></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"adrs.md\":\"BxjHi9-8\",\"ai.md\":\"Cy9GWnER\",\"assets.md\":\"7C3HWkga\",\"brut-js.md\":\"B4GYxQVw\",\"business-logic.md\":\"BY4hGy0m\",\"cli.md\":\"CjsktgFz\",\"components.md\":\"rMhQ0WdZ\",\"configuration.md\":\"BK42Yjp_\",\"css.md\":\"CltvJqAa\",\"custom-element-tests.md\":\"B_rbta32\",\"database-access.md\":\"gnluu54N\",\"database-schema.md\":\"LpmBPVEU\",\"deployment.md\":\"BLseERGV\",\"dev-environment.md\":\"DRH2D2-O\",\"dir-structure.md\":\"CWir1pic\",\"doc-conventions.md\":\"DOkAuXlt\",\"end-to-end-tests.md\":\"DzqRpZ43\",\"features.md\":\"DPFXsy0z\",\"flash-and-session.md\":\"nPvUpnUx\",\"form-constraints.md\":\"KTv5cdR4\",\"forms.md\":\"v9qIbmUM\",\"getting-started.md\":\"DTOl4c2g\",\"handlers.md\":\"h84MMB1R\",\"hooks.md\":\"Jmb5VOLA\",\"i18n.md\":\"BAm9t9JJ\",\"index.md\":\"Bn9e0sRJ\",\"instrumentation.md\":\"_lNSriEZ\",\"javascript.md\":\"DzrMxUmI\",\"jobs.md\":\"S-2amAYp\",\"keyword-injection.md\":\"95Zgh2eN\",\"layouts.md\":\"CVGl9xIO\",\"lsp.md\":\"Dn1rIiW0\",\"markdown-examples.md\":\"CCFEQO44\",\"middleware.md\":\"Czz_UlJN\",\"overview.md\":\"DlKiRRG_\",\"pages.md\":\"B7Hc-i6H\",\"recipes_alternate-layouts.md\":\"BwEytl59\",\"recipes_authentication.md\":\"nwO6F7Ou\",\"recipes_blank-layouts.md\":\"fyAUJyJR\",\"recipes_custom-flash.md\":\"CrQbI5eH\",\"recipes_form-errors.md\":\"Bv5RCKqH\",\"recipes_indexed-forms.md\":\"CstYyOSo\",\"recipes_migrations.md\":\"CTcnWDJF\",\"recipes_text-field-component.md\":\"H4wLAK0Z\",\"roadmap.md\":\"C6PRi0DX\",\"routes.md\":\"BD6y2i-f\",\"security.md\":\"C0G_AZR-\",\"seed-data.md\":\"BvFZlqIk\",\"space-time-continuum.md\":\"xl44xDos\",\"tutorial.md\":\"BM40jnoq\",\"tutorials_01-intro.md\":\"B4sUBY3X\",\"tutorials_02-dialog.md\":\"CPNK1SC_\",\"unit-tests.md\":\"DUGrnLj5\",\"why.md\":\"C-hk5xgJ\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Brut RB\",\"description\":\"Documentation for the Brut.RB web framework.\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"search\":{\"provider\":\"local\"},\"nav\":[{\"text\":\"Home\",\"link\":\"/\"},{\"text\":\"Getting Started\",\"link\":\"/getting-started\"},{\"text\":\"Overview\",\"link\":\"/overview\"},{\"text\":\"Brut API\",\"link\":\"/api/index.html\",\"target\":\"_self\"},{\"text\":\"BrutJS\",\"link\":\"/brut-js/api/index.html\",\"target\":\"_self\"},{\"text\":\"BrutCSS\",\"link\":\"/brut-css/index.html\",\"target\":\"_self\"}],\"outline\":[2,3],\"sidebar\":[{\"text\":\"Overview\",\"collapsed\":false,\"items\":[{\"text\":\"Getting Started\",\"link\":\"/getting-started\"},{\"text\":\"Concepts\",\"link\":\"/overview\"},{\"text\":\"Features\",\"link\":\"/features\"},{\"text\":\"Directory Structure\",\"link\":\"/dir-structure\"},{\"text\":\"Dev Environment\",\"link\":\"/dev-environment\"},{\"text\":\"Tutorial\",\"link\":\"/tutorial\"},{\"text\":\"Documentation Conventions\",\"link\":\"/doc-conventions\"}]},{\"text\":\"Front-End\",\"collapsed\":false,\"items\":[{\"text\":\"Routes\",\"link\":\"/routes\"},{\"text\":\"Pages\",\"link\":\"/pages\"},{\"text\":\"Layouts\",\"link\":\"/layouts\"},{\"text\":\"Forms\",\"link\":\"/forms\"},{\"text\":\"Form Constraints\",\"link\":\"/form-constraints\"},{\"text\":\"Handlers and Actions\",\"link\":\"/handlers\"},{\"text\":\"Components\",\"link\":\"/components\"},{\"text\":\"Flash and Session\",\"link\":\"/flash-and-session\"},{\"text\":\"Space/Time Continuum\",\"link\":\"/space-time-continuum\"},{\"text\":\"JavaScript\",\"link\":\"/javascript\"},{\"text\":\"CSS\",\"link\":\"/css\"},{\"text\":\"Assets\",\"link\":\"/assets\"},{\"text\":\"BrutJS\",\"link\":\"/brut-js\"}]},{\"text\":\"Back-End\",\"collapsed\":false,\"items\":[{\"text\":\"Database Schema\",\"link\":\"/database-schema\"},{\"text\":\"Database Access\",\"link\":\"/database-access\"},{\"text\":\"Seed Data\",\"link\":\"/seed-data\"},{\"text\":\"Jobs\",\"link\":\"/jobs\"},{\"text\":\"Business Logic\",\"link\":\"/business-logic\"}]},{\"text\":\"Framework\",\"collapsed\":false,\"items\":[{\"text\":\"Configuration\",\"link\":\"/configuration\"},{\"text\":\"Keyword Injection\",\"link\":\"/keyword-injection\"},{\"text\":\"I18n\",\"link\":\"/i18n\"},{\"text\":\"CLI / Tasks\",\"link\":\"/cli\"},{\"text\":\"Deployment\",\"link\":\"/deployment\"}]},{\"text\":\"Testing\",\"collapsed\":false,\"items\":[{\"text\":\"Unit Tests\",\"link\":\"/unit-tests\"},{\"text\":\"End-to-End Tests\",\"link\":\"/end-to-end-tests\"},{\"text\":\"Testing Custom Elements\",\"link\":\"/custom-element-tests\"}]},{\"text\":\"Advanced Topics\",\"collapsed\":true,\"items\":[{\"text\":\"Route Hooks\",\"link\":\"/hooks\"},{\"text\":\"Middleware\",\"link\":\"/middleware\"},{\"text\":\"Instrumentation\",\"link\":\"/instrumentation\"},{\"text\":\"Security\",\"link\":\"/security\"},{\"text\":\"LSP Support\",\"link\":\"/lsp\"}]},{\"text\":\"Recipes\",\"collapsed\":true,\"items\":[{\"text\":\"Migration Basics\",\"link\":\"/recipes/migrations\"},{\"text\":\"Styling Form Errors\",\"link\":\"/recipes/form-errors\"},{\"text\":\"Authentication\",\"link\":\"/recipes/authentication\"},{\"text\":\"Alternate Layouts\",\"link\":\"/recipes/alternate-layouts\"},{\"text\":\"Blank Layouts\",\"link\":\"/recipes/blank-layouts\"},{\"text\":\"Custom Flash Class\",\"link\":\"/recipes/custom-flash\"},{\"text\":\"Indexed Form Elements\",\"link\":\"/recipes/indexed-forms\"},{\"text\":\"Text Field Component\",\"link\":\"/recipes/text-field-component\"}]},{\"text\":\"Meta\",\"collapsed\":false,\"items\":[{\"text\":\"Why?!\",\"link\":\"/why\"},{\"text\":\"ADRs\",\"link\":\"/adrs\"},{\"text\":\"Roadmap to 1.0\",\"link\":\"/roadmap\"},{\"text\":\"AI Declaration\",\"link\":\"/ai\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/thirdtank/brut\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"adrs.md\":\"YglbWtQe\",\"ai.md\":\"ChLnvDAX\",\"assets.md\":\"BEF6Oz6K\",\"brut-js.md\":\"CbJAe2Ky\",\"business-logic.md\":\"DbuaOYGU\",\"cli.md\":\"DDMar_51\",\"components.md\":\"C6nWgDP0\",\"configuration.md\":\"CpbYHWPb\",\"css.md\":\"K5rOCOQY\",\"custom-element-tests.md\":\"DiLe-eFw\",\"database-access.md\":\"Dc8l2Plf\",\"database-schema.md\":\"BJ_JhXmO\",\"deployment.md\":\"C1u5ep0g\",\"dev-environment.md\":\"B1S9p5ZK\",\"dir-structure.md\":\"D1T2kGwj\",\"doc-conventions.md\":\"CDnWaEFg\",\"end-to-end-tests.md\":\"BJJdNDYL\",\"features.md\":\"BDWxnyNO\",\"flash-and-session.md\":\"CUsMxoNl\",\"form-constraints.md\":\"KlfXSKm2\",\"forms.md\":\"Bii91k3E\",\"getting-started.md\":\"ChAvueK7\",\"handlers.md\":\"C5tUwmmo\",\"hooks.md\":\"CoiYCKRc\",\"i18n.md\":\"DxkCKhUw\",\"index.md\":\"DnphWyQd\",\"instrumentation.md\":\"BcxjC4jd\",\"javascript.md\":\"D6fxhaQb\",\"jobs.md\":\"Bc7Y1YpK\",\"keyword-injection.md\":\"CqLnnzIz\",\"layouts.md\":\"HEbeK7Jr\",\"lsp.md\":\"bE9dW8n9\",\"markdown-examples.md\":\"BPmtHlc-\",\"middleware.md\":\"BhOIsg59\",\"overview.md\":\"BpWAgPFH\",\"pages.md\":\"B3sQXpEd\",\"recipes_alternate-layouts.md\":\"C1QzVkA7\",\"recipes_authentication.md\":\"CyvoIW82\",\"recipes_custom-flash.md\":\"6gFqf2uL\",\"recipes_form-errors.md\":\"B5ptSzMO\",\"recipes_indexed-forms.md\":\"BYYQGW2C\",\"recipes_migrations.md\":\"Cid7-3cu\",\"recipes_text-field-component.md\":\"VhOsCtKI\",\"roadmap.md\":\"CJsbUmK_\",\"routes.md\":\"C1dgIBtD\",\"security.md\":\"Jn4SY1uK\",\"seed-data.md\":\"UZW0WxYN\",\"space-time-continuum.md\":\"D9rYGDFH\",\"tutorial.md\":\"BX6f6l00\",\"tutorials_01-intro.md\":\"CzZ3kpF_\",\"tutorials_02-dialog.md\":\"De6iTsWX\",\"unit-tests.md\":\"vDsdBbO_\",\"why.md\":\"4WpxdrQ2\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Brut RB\",\"description\":\"Documentation for the Brut.RB web framework.\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"search\":{\"provider\":\"local\"},\"nav\":[{\"text\":\"Home\",\"link\":\"/\"},{\"text\":\"Getting Started\",\"link\":\"/getting-started\"},{\"text\":\"Overview\",\"link\":\"/overview\"},{\"text\":\"Brut API\",\"link\":\"/api/index.html\",\"target\":\"_self\"},{\"text\":\"BrutJS\",\"link\":\"/brut-js/api/index.html\",\"target\":\"_self\"},{\"text\":\"BrutCSS\",\"link\":\"/brut-css/index.html\",\"target\":\"_self\"}],\"outline\":[2,3],\"sidebar\":[{\"text\":\"Overview\",\"collapsed\":false,\"items\":[{\"text\":\"Getting Started\",\"link\":\"/getting-started\"},{\"text\":\"Concepts\",\"link\":\"/overview\"},{\"text\":\"Features\",\"link\":\"/features\"},{\"text\":\"Directory Structure\",\"link\":\"/dir-structure\"},{\"text\":\"Dev Environment\",\"link\":\"/dev-environment\"},{\"text\":\"Tutorial\",\"link\":\"/tutorial\"},{\"text\":\"Documentation Conventions\",\"link\":\"/doc-conventions\"}]},{\"text\":\"Front-End\",\"collapsed\":false,\"items\":[{\"text\":\"Routes\",\"link\":\"/routes\"},{\"text\":\"Pages\",\"link\":\"/pages\"},{\"text\":\"Layouts\",\"link\":\"/layouts\"},{\"text\":\"Forms\",\"link\":\"/forms\"},{\"text\":\"Form Constraints\",\"link\":\"/form-constraints\"},{\"text\":\"Handlers and Actions\",\"link\":\"/handlers\"},{\"text\":\"Components\",\"link\":\"/components\"},{\"text\":\"Flash and Session\",\"link\":\"/flash-and-session\"},{\"text\":\"Space/Time Continuum\",\"link\":\"/space-time-continuum\"},{\"text\":\"JavaScript\",\"link\":\"/javascript\"},{\"text\":\"CSS\",\"link\":\"/css\"},{\"text\":\"Assets\",\"link\":\"/assets\"},{\"text\":\"BrutJS\",\"link\":\"/brut-js\"}]},{\"text\":\"Back-End\",\"collapsed\":false,\"items\":[{\"text\":\"Database Schema\",\"link\":\"/database-schema\"},{\"text\":\"Database Access\",\"link\":\"/database-access\"},{\"text\":\"Seed Data\",\"link\":\"/seed-data\"},{\"text\":\"Jobs\",\"link\":\"/jobs\"},{\"text\":\"Business Logic\",\"link\":\"/business-logic\"}]},{\"text\":\"Framework\",\"collapsed\":false,\"items\":[{\"text\":\"Configuration\",\"link\":\"/configuration\"},{\"text\":\"Keyword Injection\",\"link\":\"/keyword-injection\"},{\"text\":\"I18n\",\"link\":\"/i18n\"},{\"text\":\"CLI / Tasks\",\"link\":\"/cli\"},{\"text\":\"Deployment\",\"link\":\"/deployment\"}]},{\"text\":\"Testing\",\"collapsed\":false,\"items\":[{\"text\":\"Unit Tests\",\"link\":\"/unit-tests\"},{\"text\":\"End-to-End Tests\",\"link\":\"/end-to-end-tests\"},{\"text\":\"Testing Custom Elements\",\"link\":\"/custom-element-tests\"}]},{\"text\":\"Advanced Topics\",\"collapsed\":true,\"items\":[{\"text\":\"Route Hooks\",\"link\":\"/hooks\"},{\"text\":\"Middleware\",\"link\":\"/middleware\"},{\"text\":\"Instrumentation\",\"link\":\"/instrumentation\"},{\"text\":\"Security\",\"link\":\"/security\"},{\"text\":\"LSP Support\",\"link\":\"/lsp\"}]},{\"text\":\"Recipes\",\"collapsed\":true,\"items\":[{\"text\":\"Migration Basics\",\"link\":\"/recipes/migrations\"},{\"text\":\"Styling Form Errors\",\"link\":\"/recipes/form-errors\"},{\"text\":\"Authentication\",\"link\":\"/recipes/authentication\"},{\"text\":\"Alternate Layouts\",\"link\":\"/recipes/alternate-layouts\"},{\"text\":\"Custom Flash Class\",\"link\":\"/recipes/custom-flash\"},{\"text\":\"Indexed Form Elements\",\"link\":\"/recipes/indexed-forms\"},{\"text\":\"Text Field Component\",\"link\":\"/recipes/text-field-component\"}]},{\"text\":\"Meta\",\"collapsed\":false,\"items\":[{\"text\":\"Why?!\",\"link\":\"/why\"},{\"text\":\"ADRs\",\"link\":\"/adrs\"},{\"text\":\"Roadmap to 1.0\",\"link\":\"/roadmap\"},{\"text\":\"AI Declaration\",\"link\":\"/ai\"}]}],\"socialLinks\":[{\"icon\":\"github\",\"link\":\"https://github.com/thirdtank/brut\"}]},\"locales\":{},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
     
   </body>
 </html>