From 72af374ba2beb691f4b4951d5f8fbc96b65215dd Mon Sep 17 00:00:00 2001
From: Jacob Pierce <w.jacobpierce@gmail.com>
Date: Tue, 30 Apr 2024 11:34:51 -0700
Subject: [PATCH 1/3] add usage anchor to KTextbox DocsPageSection

---
 docs/pages/ktextbox.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/docs/pages/ktextbox.vue b/docs/pages/ktextbox.vue
index 5d4736cbd..a080040ef 100644
--- a/docs/pages/ktextbox.vue
+++ b/docs/pages/ktextbox.vue
@@ -8,6 +8,7 @@
     <DocsPageSection title="Usage">
       <h3>Input with Label</h3>
       <KTextbox label="Input with Label" />
+    <DocsPageSection title="Usage" anchor="#usage">
       <DocsShowCode language="html">
         <KTextbox label="Input with Label" />
       </DocsShowCode>

From 732d524c9259e588405120ba21401d10b68aea98 Mon Sep 17 00:00:00 2001
From: Jacob Pierce <w.jacobpierce@gmail.com>
Date: Tue, 30 Apr 2024 11:36:12 -0700
Subject: [PATCH 2/3] downcase headings on KTextbox docs

keeping with our own guidance
https://design-system.learningequality.org/writing/#punctuation
---
 docs/pages/ktextbox.vue | 45 ++++++++++++++++++++---------------------
 1 file changed, 22 insertions(+), 23 deletions(-)

diff --git a/docs/pages/ktextbox.vue b/docs/pages/ktextbox.vue
index a080040ef..c0aa96e6b 100644
--- a/docs/pages/ktextbox.vue
+++ b/docs/pages/ktextbox.vue
@@ -5,47 +5,46 @@
       For detailed design guidance, refer to the page on <DocsInternalLink href="/textfields" text="text fields" />.
     </DocsPageSection>
 
-    <DocsPageSection title="Usage">
-      <h3>Input with Label</h3>
-      <KTextbox label="Input with Label" />
     <DocsPageSection title="Usage" anchor="#usage">
+      <h3>Input with label</h3>
+      <KTextbox label="Input with label" />
       <DocsShowCode language="html">
-        <KTextbox label="Input with Label" />
+        <KTextbox label="Input with label" />
       </DocsShowCode>
       <p>This text box includes a visible label, providing clear guidance and context to the user about the expected input.</p>
 
 
-      <h3>Valid and Invalid Input</h3>
+      <h3>Valid and invalid input</h3>
 
-      <KTextbox 
-        v-model="numericInput" 
-        label="Numbers Only" 
-        :invalid="!isNumeric(numericInput)" 
-        invalidText="Please enter a valid number." 
+      <KTextbox
+        v-model="numericInput"
+        label="Numbers only"
+        :invalid="!isNumeric(numericInput)"
+        invalidText="Please enter a valid number."
       />
 
       <DocsShowCode language="html">
-        <KTextbox 
-          v-model="numericInput" 
-          label="Numbers Only" 
-          :invalid="!isNumeric(numericInput)" 
-          invalidText="Please enter a valid number." 
+        <KTextbox
+          v-model="numericInput"
+          label="Numbers only"
+          :invalid="!isNumeric(numericInput)"
+          invalidText="Please enter a valid number."
         />
       </DocsShowCode>
 
 
       <p>This text box only accepts numeric input. If any non-numeric character is entered, it will be considered invalid.</p>
 
-      <h3>Disabled Input</h3>
-      <KTextbox label="Disabled Input" disabled />
+      <h3>Disabled input</h3>
+      <KTextbox label="Disabled input" disabled />
       <DocsShowCode language="html">
-        <KTextbox label="Disabled Input" disabled />
+        <KTextbox label="Disabled input" disabled />
       </DocsShowCode>
       <p>This text box is disabled. It cannot be edited or focused, so it will be skipped during keyboard navigation.</p>
 
 
-      <h3>Number Input</h3>
-      <KTextbox label="Number Input" type="number" :min="0" :max="100" />
+      <h3>Number input</h3>
+      <KTextbox label="Number input" type="number" :min="0" :max="100" />
 
       <DocsShowCode language="html">
 
@@ -61,11 +60,11 @@
       </p>
 
 
-      <h3>Text Area</h3>
-      <KTextbox label="Text Area" :textArea="true" />
+      <h3>Text area</h3>
+      <KTextbox label="Text area" :textArea="true" />
       <DocsShowCode language="html">
 
-        <KTextbox label="Text Area" :textArea="true" />
+        <KTextbox label="Text area" :textArea="true" />
 
       </DocsShowCode>
       <p>This is a multi-line text input area, suitable for longer text entries.</p>

From 89621a1a406dc0f7b3c124246e0567b0e4562fce Mon Sep 17 00:00:00 2001
From: Jacob Pierce <w.jacobpierce@gmail.com>
Date: Tue, 30 Apr 2024 11:42:08 -0700
Subject: [PATCH 3/3] changelog update #627

---
 CHANGELOG.md | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 499946d17..7dd4fab3e 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,17 @@ Changelog is rather internal in nature. See release notes for the public overvie
 
 ## Version 4.x.x (`release-v4` branch)
 
+- [#627]
+  - **Description:** Fix missing anchor tag and heading case in `KTextbox` documentation
+  - **Products impact:** None
+  - **Addresses:** -
+  - **Components:** `KTextbox` documentation
+  - **Breaking:** -
+  - **Impacts a11y:** -
+  - **Guidance:** -
+
+[#627]: https://github.com/learningequality/kolibri-design-system/pull/627
+
 - [#604]
   - **Description:** Add more examples to `KTextbox` documentation
   - **Products impact:** None