Fixed typescript typing for aria-labelledby and aria-label

api-generator/components/checkbox.js

@@ -70,6 +70,18 @@ const CheckboxProps = [
         type: "any",
         default: "null",
         description: "Inline style of the input field."
+    },
+    {
+        name: "aria-labelledby",
+        type: "string",
+        default: "null",
+        description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
+    },
+    {
+        name: "aria-label",
+        type: "string",
+        default: "null",
+        description: "Used to define a string that labels the element."
     }
 ];
 

api-generator/components/colorpicker.js

@@ -47,12 +47,6 @@ const ColorPickerProps = [
         default: "true",
         description: "Whether to automatically manage layering."
     },
-    {
-        name: "ariaLabelledBy",
-        type: "string",
-        default: "null",
-        description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
-    },
     {
         name: "panelClass",
         type: "string",
@@ -64,6 +58,18 @@ const ColorPickerProps = [
         type: "string",
         default: "body",
         description: 'A valid query selector or an HTMLElement to specify where the overlay gets attached. Special keywords are "body" for document body and "self" for the element itself.'
+    },
+    {
+        name: "aria-labelledby",
+        type: "string",
+        default: "null",
+        description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
+    },
+    {
+        name: "aria-label",
+        type: "string",
+        default: "null",
+        description: "Used to define a string that labels the element."
     }
 ];
 

api-generator/components/treeselect.js

@@ -88,6 +88,18 @@ const TreeSelectProps = [
         type: "boolean",
         default: "true",
         description: "Defines how multiple items can be selected, when true metaKey needs to be pressed to select or unselect an item and when set to false selection of each item can be toggled individually. On touch enabled devices, metaKeySelection is turned off automatically."
+    },
+    {
+        name: "aria-labelledby",
+        type: "string",
+        default: "null",
+        description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
+    },
+    {
+        name: "aria-label",
+        type: "string",
+        default: "null",
+        description: "Used to define a string that labels the element."
     }
 ];
 

api-generator/components/tristatecheckbox.js

@@ -16,6 +16,18 @@ const TriStateCheckboxProps = [
         type: "any",
         default: "null",
         description: "Inline of the component."
+    },
+    {
+        name: "aria-labelledby",
+        type: "string",
+        default: "null",
+        description: "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
+    },
+    {
+        name: "aria-label",
+        type: "string",
+        default: "null",
+        description: "Used to define a string that labels the element."
     }
 ];
 

src/components/checkbox/Checkbox.d.ts

@@ -57,6 +57,14 @@ export interface CheckboxProps {
      * 
      */
     inputProps?: object | undefined;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    'aria-labelledby'?: string | undefined;
+    /**
+     * Establishes a string value that labels the component.
+     */
+    'aria-label'?: string | undefined;
 }
 
 export interface CheckboxSlots {

src/components/colorpicker/ColorPicker.d.ts

@@ -53,10 +53,6 @@ export interface ColorPickerProps {
      * Default value is 0.
      */
     baseZIndex?: number | undefined;
-    /**
-     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
-     */
-    ariaLabelledBy?: string | undefined;
     /**
      * Style class of the overlay panel.
      */

src/components/colorpicker/ColorPicker.vue

@@ -1,7 +1,7 @@
 <template>
     <div ref="container" :class="containerClass">
         <input ref="input" type="text" :class="inputClass" readonly="readonly" :tabindex="tabindex" :disabled="disabled"
-            @click="onInputClick" @keydown="onInputKeydown" v-if="!inline" :aria-labelledby="ariaLabelledBy"/>
+            @click="onInputClick" @keydown="onInputKeydown" v-if="!inline"/>
         <Portal :appendTo="appendTo" :disabled="inline">
             <transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
                 <div :ref="pickerRef" :class="pickerClass" v-if="inline ? true : overlayVisible" @click="onOverlayClick">
@@ -64,10 +64,6 @@ export default {
             type: Number,
             default: 0
         },
-        ariaLabelledBy: {
-            type: String,
-            default: null
-        },
         appendTo: {
             type: String,
             default: 'body'

src/components/knob/Knob.d.ts

@@ -66,11 +66,11 @@ export interface KnobProps {
     /**
        * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
        */
-    ariaLabelledby?: string | undefined;
+    'aria-labelledby'?: string | undefined;
     /**
        * Used to define a string that labels the element.
        */
-    ariaLabel?: string | undefined;
+    'aria-label'?: string | undefined;
 }
 
 export interface KnobSlots {

src/components/slider/Slider.d.ts

@@ -55,11 +55,11 @@ export interface SliderProps {
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */
-    ariaLabelledby?: string | undefined;
+    'aria-labelledby'?: string | undefined;
     /**
      * Used to define a string that labels the element.
      */
-    ariaLabel?: string | undefined;
+    'aria-label'?: string | undefined;
 }
 
 export interface SliderSlots {

src/components/treeselect/TreeSelect.d.ts

@@ -82,6 +82,14 @@ export interface TreeSelectProps {
      * 
      */
     inputProps?: object | undefined;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    'aria-labelledby'?: string | undefined;
+    /**
+      * Establishes a string value that labels the component.
+      */
+    'aria-label'?: string | undefined;
 }
 
 export interface TreeSelectSlots {

src/components/tristatecheckbox/TriStateCheckbox.d.ts

@@ -13,6 +13,14 @@ export interface TriStateCheckboxProps {
      * Style class of the component.
      */
     class?: any;
+    /**
+     * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
+     */
+    'aria-labelledby'?: string | undefined;
+    /**
+      * Establishes a string value that labels the component.
+      */
+    'aria-label'?: string | undefined;
 }
 
 export interface TriStateCheckboxSlots {

src/views/colorpicker/ColorPickerDoc.vue

@@ -99,12 +99,6 @@ export default {
                         <td>true</td>
                         <td>Whether to automatically manage layering.</td>
                     </tr>
-                    <tr>
-                        <td>ariaLabelledBy</td>
-                        <td>string</td>
-                        <td>null</td>
-                        <td>Establishes relationships between the component and label(s) where its value should be one or more element IDs.</td>
-                    </tr>
                     <tr>
                         <td>panelClass</td>
                         <td>string</td>