update docs

api-generator/components/calendar.js

@@ -250,6 +250,30 @@ const CalendarProps = [
         type: "any",
         default: "null",
         description: "Inline style of the input field."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
+    },
+    {
+        name: "panelClass",
+        type: "string",
+        default: "null",
+        description: "Style class of the overlay panel."
+    },
+    {
+        name: "panelStyle",
+        type: "string",
+        default: "null",
+        description: "Inline style of the overlay panel."
+    },
+    {
+        name: "panelProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component."
     }
 ];
 

api-generator/components/checkbox.js

@@ -71,6 +71,12 @@ const CheckboxProps = [
         default: "null",
         description: "Inline style of the input field."
     },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
+    },
     {
         name: "aria-labelledby",
         type: "string",

api-generator/components/chips.js

@@ -52,6 +52,12 @@ const ChipsProps = [
         type: "any",
         default: "null",
         description: "Inline style of the input field."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
     }
 ];
 

api-generator/components/colorpicker.js

@@ -30,7 +30,7 @@ const ColorPickerProps = [
         description: "When present, it specifies that the component should be disabled."
     },
     {
-        name: "tabIndex",
+        name: "tabindex",
         type: "string",
         default: "null",
         description: "Index of the element in tabbing order."

api-generator/components/inputnumber.js

@@ -137,6 +137,12 @@ const InputNumberProps = [
         default: "false",
         description: "When present, it specifies that an input field is read-only."
     },
+    {
+        name: "inputId",
+        type: "string",
+        default: "null",
+        description: "Identifier of the underlying input element."
+    },
     {
         name: "inputStyle",
         type: "any",
@@ -150,16 +156,22 @@ const InputNumberProps = [
         description: "Style class of the input field."
     },
     {
-        name: "class",
+        name: "inputProps",
-        type: "string",
+        type: "object",
         default: "null",
-        description: "Style class of the component."
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
     },
     {
-        name: "style",
+        name: "incrementButtonProps",
-        type: "any",
+        type: "object",
         default: "null",
-        description: "Inline of the component."
+        description: "Uses to pass all properties of the HTMLButtonElement to increment button inside the component."
+    },
+    {
+        name: "decrementButtonProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLButtonElement to decrement button inside the component."
     }
 ];
 

api-generator/components/inputswitch.js

@@ -34,6 +34,12 @@ const InputSwitchProps = [
         type: "string",
         default: "null",
         description: "Style class of the input field."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
     }
 ];
 

api-generator/components/password.js

@@ -95,6 +95,12 @@ const PasswordProps = [
         default: "null",
         description: "Style class of the input field."
     },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
+    },
     {
         name: "panelId",
         type: "string",
@@ -112,6 +118,12 @@ const PasswordProps = [
         type: "string",
         default: "null",
         description: "Inline style of the overlay panel."
+    },
+    {
+        name: "panelProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component."
     }
 ];
 

api-generator/components/radiobutton.js

@@ -12,16 +12,52 @@ const RadioButtonProps = [
         description: "Value binding of the checkbox."
     },
     {
-        name: "class",
+        name: "name",
         type: "string",
         default: "null",
-        description: "Style class of the component."
+        description: "Name of the input element."
     },
     {
-        name: "style",
+        name: "disabled",
+        type: "boolean",
+        default: "false",
+        description: "When present, it specifies that the element should be disabled."
+    },
+    {
+        name: "inputId",
+        type: "string",
+        default: "null",
+        description: "Identifier of the underlying input element."
+    },
+    {
+        name: "inputClass",
+        type: "string",
+        default: "null",
+        description: "Style class of the input field."
+    },
+    {
+        name: "inputStyle",
         type: "any",
         default: "null",
-        description: "Inline of the component."
+        description: "Inline style of the input field."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside 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."
     }
 ];
 

api-generator/components/togglebutton.js

@@ -64,6 +64,12 @@ const ToggleButtonProps = [
         type: "any",
         default: "null",
         description: "Inline style of the input field."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
     }
 ];
 

api-generator/components/tristatecheckbox.js

@@ -6,16 +6,28 @@ const TriStateCheckboxProps = [
         description: "Value of the component."
     },
     {
-        name: "class",
+        name: "disabled",
-        type: "string",
+        type: "boolean",
-        default: "null",
+        default: "false",
-        description: "Style class of the component."
+        description: "When present, it specifies that the component should be disabled."
     },
     {
-        name: "style",
+        name: "tabindex",
-        type: "any",
+        type: "string",
         default: "null",
-        description: "Inline of the component."
+        description: "Index of the element in tabbing order."
+    },
+    {
+        name: "inputId",
+        type: "string",
+        default: "null",
+        description: "Identifier of the underlying input element."
+    },
+    {
+        name: "inputProps",
+        type: "object",
+        default: "null",
+        description: "Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component."
     },
     {
         name: "aria-labelledby",

src/components/calendar/Calendar.d.ts

@@ -254,19 +254,27 @@ export interface CalendarProps {
     /**
      * Inline style of the input field.
      */
-    inputStyle?: any;
+    inputStyle?: any | undefined;
     /**
      * Style class of the input field.
      */
-    inputClass?: any;
+    inputClass?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
-     * 
+     * Inline style of the overlay panel.
      */
-    panelProps?: object | undefined;
+    panelStyle?: any | undefined;
+    /**
+     * Style class of the overlay panel.
+     */
+    panelClass?: any | undefined;
+    /**
+     * Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component.
+     */
+    panelProps?: HTMLDivElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/checkbox/Checkbox.d.ts

@@ -54,9 +54,9 @@ export interface CheckboxProps {
       */
     inputStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/chips/Chips.d.ts

@@ -52,9 +52,9 @@ export interface ChipsProps {
      */
     inputStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * When present, it specifies that the element should be disabled.
      */
@@ -88,15 +88,15 @@ export declare type ChipsEmits = {
      * @param {*} value - New value.
      */
     'update:modelValue': (value: any[]) => void;
-     /**
+    /**
-      * Callback to invoke when a chip is added.
+     * Callback to invoke when a chip is added.
-      * @param {ChipsAddEvent} event - Custom add event.
+     * @param {ChipsAddEvent} event - Custom add event.
-      */
+     */
     'add': (event: ChipsAddEvent) => void;
-     /**
+    /**
-      * Callback to invoke when a chip is removed.
+     * Callback to invoke when a chip is removed.
-      * @param {ChipsRemoveEvent} event - Custom remove event.
+     * @param {ChipsRemoveEvent} event - Custom remove event.
-      */
+     */
     'remove': (event: ChipsRemoveEvent) => void;
 }
 

src/components/inputnumber/InputNumber.d.ts

@@ -150,9 +150,17 @@ export interface InputNumberProps {
      */
     inputStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
+    /**
+     * Uses to pass all properties of the HTMLButtonElement to increment button inside the component.
+     */
+    incrementButtonProps?: HTMLButtonElement | undefined;
+    /**
+     * Uses to pass all properties of the HTMLButtonElement to decrement button inside the component.
+     */
+    decrementButtonProps?: HTMLButtonElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/inputswitch/InputSwitch.d.ts

@@ -26,9 +26,9 @@ export interface InputSwitchProps {
      */
     inputStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/password/Password.d.ts

@@ -71,6 +71,10 @@ export interface PasswordProps extends InputHTMLAttributes {
      * Style class of the input field.
      */
     inputClass?: any | undefined;
+    /**
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
+     */
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Identifier of the underlying overlay panel element.
      */
@@ -84,9 +88,9 @@ export interface PasswordProps extends InputHTMLAttributes {
      */
     panelStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component.
      */
-    panelProps?: object | undefined;
+    panelProps?: HTMLDivElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/radiobutton/RadioButton.d.ts

@@ -30,9 +30,9 @@ export interface RadioButtonProps {
      */
     inputClass?: any;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/togglebutton/ToggleButton.d.ts

@@ -52,9 +52,9 @@ export interface ToggleButtonProps {
      */
     inputStyle?: any | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/components/togglebutton/ToggleButton.vue

@@ -101,120 +101,3 @@ export default {
     }
 }
 </script>
-
-
-<!-- <template>
-    <div :class="buttonClass" @click="onClick($event)" v-ripple>
-        <span class="p-hidden-accessible">
-            <input type="checkbox" :id="inputId" :name="ariaLabelledby ? ariaLabelledby : ariaLabel ? ariaLabel : null" :checked="modelValue" :value="modelValue" :tabindex="tabindex"
-                @focus="onFocus($event)" @blur="onBlur($event)">
-        </span>
-        <span v-if="hasIcon" :class="iconClass"></span>
-        <span :for="label" class="p-button-label">{{label}}</span>
-    </div>
-</template>
-
-<script>
-import Ripple from 'primevue/ripple';
-
-export default {
-    name: 'ToggleButton',
-    emits: ['update:modelValue', 'change', 'click', 'focus', 'blur'],
-    props: {
-        modelValue: Boolean,
-		onIcon: String,
-		offIcon: String,
-        onLabel: {
-            type: String,
-            default: 'Yes'
-        },
-        offLabel: {
-            type: String,
-            default: 'No'
-        },
-        iconPos: {
-            type: String,
-            default: 'left'
-        },
-        disabled: {
-            type: Boolean,
-            default: false
-        },
-        tabindex: {
-            type: Number,
-            default: null
-        },
-        'aria-labelledby': {
-            type: String,
-			default: null
-        },
-        'aria-label': {
-            type: String,
-            default: null
-        },
-        inputId: null
-    },
-    data() {
-        return {
-            focused: null
-        }
-    },
-    methods: {
-        onClick(event) {
-            if (!this.disabled) {
-                this.$emit('update:modelValue', !this.modelValue);
-                this.$emit('change', event);
-                this.$emit('click', event);
-            }
-        },
-        onFocus(event) {
-            this.focused = true;
-            this.$emit('focus', event);
-        },
-        onBlur(event) {
-            this.focused = false;
-            this.$emit('blur', event);
-        }
-    },
-    computed: {
-        buttonClass() {
-            return ['p-button p-togglebutton p-component', {
-                'p-focus': this.focused ,
-                'p-button-icon-only': this.hasIcon && !this.hasLabel,
-                'p-disabled': this.disabled,
-                'p-highlight': this.modelValue === true
-            }]
-        },
-        iconClass() {
-            return [
-                this.modelValue ? this.onIcon: this.offIcon,
-                'p-button-icon',
-                {
-                    'p-button-icon-left': this.iconPos === 'left' && this.label,
-                    'p-button-icon-right': this.iconPos === 'right' && this.label
-                }
-            ]
-        },
-        hasLabel() {
-            return this.onLabel && this.onLabel.length > 0 && this.offLabel && this.offLabel.length > 0;
-        },
-        hasIcon() {
-            return this.onIcon && this.onIcon.length > 0 && this.offIcon && this.offIcon.length > 0;
-        },
-        label() {
-            return this.hasLabel ? (this.modelValue ? this.onLabel : this.offLabel): '&nbsp;';
-        }
-    },
-    directives: {
-        'ripple': Ripple
-    }
-}
-</script>
-
-<style>
-.p-togglebutton.p-button.p-focus {
-    outline: 0 none;
-    outline-offset: 0;
-    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #9dc1fb, 0 1px 2px 0 black;
-}
-</style> -->

src/components/tristatecheckbox/TriStateCheckbox.d.ts

@@ -18,9 +18,9 @@ export interface TriStateCheckboxProps {
      */
     inputId?: string | undefined;
     /**
-     * 
+     * Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.
      */
-    inputProps?: object | undefined;
+    inputProps?: HTMLInputElement | undefined;
     /**
      * Establishes relationships between the component and label(s) where its value should be one or more element IDs.
      */

src/views/calendar/CalendarDoc.vue

@@ -453,11 +453,17 @@ export default {
                         <td>null</td>
                         <td>Style class of the input field.</td>
                     </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
+                    </tr>
                     <tr>
                         <td>panelClass</td>
                         <td>string</td>
                         <td>null</td>
-                        <td>Style class of the datetimepicker panel.</td>
+                        <td>Style class of the overlay panel.</td>
                     </tr>
                     <tr>
                         <td>panelStyle</td>
@@ -465,6 +471,12 @@ export default {
                         <td>null</td>
                         <td>Inline style of the overlay panel.</td>
                     </tr>
+                    <tr>
+                        <td>panelProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component.</td>
+                    </tr>
                 </tbody>
             </table>
         </div>

src/views/checkbox/CheckboxDoc.vue

@@ -139,7 +139,7 @@ export default {
                         <td>inputProps</td>
                         <td>object</td>
                         <td>null</td>
-                        <td></td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>

src/views/chips/ChipsDoc.vue

@@ -100,6 +100,12 @@ import Chips from 'primevue/chips';
                         <td>any</td>
                         <td>null</td>
                         <td>Inline style of the input field.</td>
+                    </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>

src/views/inputnumber/InputNumberDoc.vue

@@ -296,6 +296,24 @@ Vertical
                         <td>null</td>
                         <td>Style class of the input field.</td>
                     </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
+                    </tr>
+                    <tr>
+                        <td>incrementButtonProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLButtonElement to increment button inside the component.</td>
+                    </tr>
+                    <tr>
+                        <td>decrementButtonProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLButtonElement to decrement button inside the component.</td>
+                    </tr>
                 </tbody>
             </table>
         </div>

src/views/inputswitch/InputSwitchDoc.vue

@@ -92,6 +92,12 @@ export default {
                         <td>any</td>
                         <td>null</td>
                         <td>Inline style of the input field.</td>
+                    </tr>
+					<tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>
@@ -161,7 +167,7 @@ export default {
 
 <pre v-code><code>
 &lt;label for="switch1"&gt;Remember Me&lt;/label&gt;
-&lt;InputSwitch id="switch1" /&gt;
+&lt;InputSwitch inputId="switch1" /&gt;
 
 &lt;span id="switch2"&gt;Remember Me&lt;/span&gt;
 &lt;InputSwitch aria-labelledby="switch2" /&gt;

src/views/password/PasswordDoc.vue

@@ -173,6 +173,12 @@ import Password from 'primevue/password';
                         <td>null</td>
                         <td>Inline style of the input field.</td>
                     </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
+                    </tr>
                     <tr>
                         <td>panelId</td>
                         <td>string</td>
@@ -190,6 +196,12 @@ import Password from 'primevue/password';
                         <td>string</td>
                         <td>null</td>
                         <td>Inline style of the overlay panel.</td>
+                    </tr>
+                    <tr>
+                        <td>panelProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLDivElement to the overlay panel inside the component.</td>
                     </tr>
 				</tbody>
 			</table>

src/views/radiobutton/RadioButtonDoc.vue

@@ -96,6 +96,12 @@ export default {
                         <td>any</td>
                         <td>null</td>
                         <td>Inline style of the input field.</td>
+                    </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>

src/views/togglebutton/ToggleButtonDoc.vue

@@ -117,6 +117,12 @@ export default {
                         <td>any</td>
                         <td>null</td>
                         <td>Inline style of the input field.</td>
+                    </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>

src/views/tristatecheckbox/TriStateCheckboxDoc.vue

@@ -40,16 +40,28 @@ import TriStateCheckbox from 'primevue/tristatecheckbox';
                         <td>Value of the component.</td>
                     </tr>
                     <tr>
-                        <td>style</td>
+                        <td>disabled</td>
-                        <td>any</td>
+                        <td>boolean</td>
-                        <td>null</td>
+                        <td>false</td>
-                        <td>Style class of the component.</td>
+                        <td>When specified, disables the component.</td>
                     </tr>
                     <tr>
-                        <td>class</td>
+                        <td>tabindex</td>
+                        <td>number</td>
+                        <td>0</td>
+                        <td>Index of the element in tabbing order.</td>
+                    </tr>
+                    <tr>
+                        <td>inputId</td>
                         <td>string</td>
                         <td>null</td>
-                        <td>Inline style of the component.</td>
+                        <td>Style class of the component input field.</td>
+                    </tr>
+                    <tr>
+                        <td>inputProps</td>
+                        <td>object</td>
+                        <td>null</td>
+                        <td>Uses to pass all properties of the HTMLInputElement to the focusable input element inside the component.</td>
                     </tr>
 				</tbody>
 			</table>