Add labelDir to KCheckbox and KRadioButton

learningequality · Sep 16, 2024 · 5be2f9e · 5be2f9e
1 parent c7432ff
commit 5be2f9e
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 2 deletions.
diff --git a/lib/KCheckbox.vue b/lib/KCheckbox.vue
@@ -45,7 +45,7 @@
       </div>
 
       <label
-        dir="auto"
+        :dir="labelDir"
         class="k-checkbox-label"
         :for="id"
         :class="{ 'visuallyhidden': !showLabel }"
@@ -84,6 +84,14 @@
         type: String,
         default: null,
       },
+      /**
+       * RTL dir of the text label
+       * Options: 'auto', 'ltr', 'rtl', null.
+       */
+      labelDir: {
+        type: String,
+        default: 'auto',
+      },
       /**
        * Whether or not to show the label
        */

diff --git a/lib/KRadioButton.vue b/lib/KRadioButton.vue
@@ -36,7 +36,7 @@
       </div>
 
       <label
-        dir="auto"
+        :dir="labelDir"
         class="k-radio-button-label"
         :for="id"
         :class="{ 'visuallyhidden': !showLabel }"
@@ -96,6 +96,14 @@
         type: Boolean,
         default: true,
       },
+      /**
+       * RTL dir of the text label
+       * Options: 'auto', 'ltr', 'rtl', null.
+       */
+      labelDir: {
+        type: String,
+        default: 'auto',
+      },
       /**
        * Component `data` with which to associate this radio button and its siblings
        */