Refactor #5176 - invalid property added

primefaces · Jan 30, 2024 · a9a2549 · a9a2549
1 parent b42c9eb
commit a9a2549
Show file tree

Hide file tree

Showing 54 changed files with 198 additions and 12 deletions.
diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts
@@ -350,6 +350,11 @@ export interface AutoCompleteProps {
      * @defaultValue false
      */
     loading?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/autocomplete/BaseAutoComplete.vue b/components/lib/autocomplete/BaseAutoComplete.vue
@@ -45,6 +45,10 @@ export default {
             type: Boolean,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/autocomplete/style/AutoCompleteStyle.js b/components/lib/autocomplete/style/AutoCompleteStyle.js
@@ -110,6 +110,7 @@ const classes = {
         'p-autocomplete p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-autocomplete-dd': props.dropdown,
             'p-autocomplete-multiple': props.multiple,

diff --git a/components/lib/calendar/BaseCalendar.vue b/components/lib/calendar/BaseCalendar.vue
@@ -176,6 +176,10 @@ export default {
             type: [String, Object],
             default: 'body'
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/calendar/Calendar.d.ts b/components/lib/calendar/Calendar.d.ts
@@ -711,6 +711,11 @@ export interface CalendarProps {
      * @defaultValue true
      */
     manualInput?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/calendar/style/CalendarStyle.js b/components/lib/calendar/style/CalendarStyle.js
@@ -166,6 +166,7 @@ const classes = {
             'p-input-icon-right': props.showIcon && props.iconDisplay === 'input',
             'p-calendar-timeonly': props.timeOnly,
             'p-calendar-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': state.focused,
             'p-focus': state.focused || state.overlayVisible

diff --git a/components/lib/cascadeselect/BaseCascadeSelect.vue b/components/lib/cascadeselect/BaseCascadeSelect.vue
@@ -14,6 +14,10 @@ export default {
         optionGroupLabel: null,
         optionGroupChildren: null,
         placeholder: String,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: Boolean,
         dataKey: null,
         inputId: {

diff --git a/components/lib/cascadeselect/CascadeSelect.d.ts b/components/lib/cascadeselect/CascadeSelect.d.ts
@@ -271,6 +271,11 @@ export interface CascadeSelectProps {
      * Default text to display when no option is selected.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/cascadeselect/style/CascadeSelectStyle.js b/components/lib/cascadeselect/style/CascadeSelectStyle.js
@@ -103,6 +103,7 @@ const classes = {
         'p-cascadeselect p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,

diff --git a/components/lib/checkbox/BaseCheckbox.vue b/components/lib/checkbox/BaseCheckbox.vue
@@ -21,6 +21,10 @@ export default {
             type: null,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/checkbox/Checkbox.d.ts b/components/lib/checkbox/Checkbox.d.ts
@@ -111,6 +111,11 @@ export interface CheckboxProps {
      * @default false
      */
     binary?: boolean;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
      * @default false

diff --git a/components/lib/checkbox/style/CheckboxStyle.js b/components/lib/checkbox/style/CheckboxStyle.js
@@ -26,7 +26,8 @@ const classes = {
         'p-checkbox p-component',
         {
             'p-highlight': instance.checked,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     box: 'p-checkbox-box',

diff --git a/components/lib/chips/BaseChips.vue b/components/lib/chips/BaseChips.vue
@@ -30,6 +30,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/chips/Chips.d.ts b/components/lib/chips/Chips.d.ts
@@ -184,8 +184,14 @@ export interface ChipsProps {
      * @deprecated since v3.27.0. Use 'removetokenicon' slot.
      */
     removeTokenIcon?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the element should be disabled.
+     * @defaultValue false
      */
     disabled?: boolean | undefined;
     /**

diff --git a/components/lib/chips/style/ChipsStyle.js b/components/lib/chips/style/ChipsStyle.js
@@ -55,6 +55,7 @@ const classes = {
         'p-chips p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': (props.modelValue && props.modelValue.length) || (instance.inputValue && instance.inputValue.length),
             'p-inputwrapper-focus': instance.focused

diff --git a/components/lib/dropdown/BaseDropdown.vue b/components/lib/dropdown/BaseDropdown.vue
@@ -33,6 +33,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/dropdown/Dropdown.d.ts b/components/lib/dropdown/Dropdown.d.ts
@@ -319,6 +319,11 @@ export interface DropdownProps {
      * Default text to display when no option is selected.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/dropdown/style/DropdownStyle.js b/components/lib/dropdown/style/DropdownStyle.js
@@ -104,6 +104,7 @@ const classes = {
         'p-dropdown p-component p-inputwrapper',
         {
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-dropdown-clearable': props.showClear,
             'p-focus': state.focused,
             'p-inputwrapper-filled': instance.hasSelectedOption,

diff --git a/components/lib/inputnumber/BaseInputNumber.vue b/components/lib/inputnumber/BaseInputNumber.vue
@@ -109,6 +109,10 @@ export default {
             type: Boolean,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/inputnumber/InputNumber.d.ts b/components/lib/inputnumber/InputNumber.d.ts
@@ -262,6 +262,11 @@ export interface InputNumberProps {
      * @defaultValue false
      */
     highlightOnFocus?: boolean | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/inputnumber/style/InputNumberStyle.js b/components/lib/inputnumber/style/InputNumberStyle.js
@@ -113,7 +113,8 @@ const classes = {
             'p-inputwrapper-focus': instance.focused,
             'p-inputnumber-buttons-stacked': props.showButtons && props.buttonLayout === 'stacked',
             'p-inputnumber-buttons-horizontal': props.showButtons && props.buttonLayout === 'horizontal',
-            'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical'
+            'p-inputnumber-buttons-vertical': props.showButtons && props.buttonLayout === 'vertical',
+            'p-invalid': props.invalid
         }
     ],
     input: 'p-inputnumber-input',

diff --git a/components/lib/inputswitch/BaseInputSwitch.vue b/components/lib/inputswitch/BaseInputSwitch.vue
@@ -18,6 +18,10 @@ export default {
             type: null,
             default: false
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/inputswitch/InputSwitch.d.ts b/components/lib/inputswitch/InputSwitch.d.ts
@@ -105,6 +105,11 @@ export interface InputSwitchProps {
      * @defaultValue false
      */
     falseValue?: any;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/inputswitch/style/InputSwitchStyle.js b/components/lib/inputswitch/style/InputSwitchStyle.js
@@ -37,7 +37,8 @@ const classes = {
         'p-inputswitch p-component',
         {
             'p-highlight': instance.checked,
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     input: 'p-inputswitch-input',

diff --git a/components/lib/inputtext/BaseInputText.vue b/components/lib/inputtext/BaseInputText.vue
@@ -10,6 +10,10 @@ export default {
         size: {
             type: String,
             default: null
+        },
+        invalid: {
+            type: Boolean,
+            default: false
         }
     },
     style: InputTextStyle,

diff --git a/components/lib/inputtext/InputText.d.ts b/components/lib/inputtext/InputText.d.ts
@@ -91,6 +91,11 @@ export interface InputTextProps extends InputHTMLAttributes {
      * Defines the size of the component.
      */
     size?: 'small' | 'large' | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * Used to pass attributes to DOM elements inside the component.
      * @type {InputTextPassThroughOptions}

diff --git a/components/lib/inputtext/style/InputTextStyle.js b/components/lib/inputtext/style/InputTextStyle.js
@@ -6,7 +6,8 @@ const classes = {
         {
             'p-filled': instance.filled,
             'p-inputtext-sm': props.size === 'small',
-            'p-inputtext-lg': props.size === 'large'
+            'p-inputtext-lg': props.size === 'large',
+            'p-invalid': props.invalid
         }
     ]
 };

diff --git a/components/lib/listbox/BaseListbox.vue b/components/lib/listbox/BaseListbox.vue
@@ -14,6 +14,10 @@ export default {
         optionGroupLabel: null,
         optionGroupChildren: null,
         listStyle: null,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/listbox/Listbox.d.ts b/components/lib/listbox/Listbox.d.ts
@@ -240,6 +240,11 @@ export interface ListboxProps {
      * Inline style of inner list element.
      */
     listStyle?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When specified, disables the component.
      * @defaultValue false

diff --git a/components/lib/listbox/style/ListboxStyle.js b/components/lib/listbox/style/ListboxStyle.js
@@ -42,7 +42,8 @@ const classes = {
     root: ({ instance, props }) => [
         'p-listbox p-component',
         {
-            'p-disabled': props.disabled
+            'p-disabled': props.disabled,
+            'p-invalid': props.invalid
         }
     ],
     header: 'p-listbox-header',

diff --git a/components/lib/multiselect/BaseMultiSelect.vue b/components/lib/multiselect/BaseMultiSelect.vue
@@ -18,6 +18,10 @@ export default {
             default: '200px'
         },
         placeholder: String,
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: Boolean,
         inputId: {
             type: String,

diff --git a/components/lib/multiselect/MultiSelect.d.ts b/components/lib/multiselect/MultiSelect.d.ts
@@ -331,6 +331,11 @@ export interface MultiSelectProps {
      * Label to display when there are no selections.
      */
     placeholder?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/multiselect/style/MultiSelectStyle.js b/components/lib/multiselect/style/MultiSelectStyle.js
@@ -120,6 +120,7 @@ const classes = {
         {
             'p-multiselect-chip': props.display === 'chip',
             'p-disabled': props.disabled,
+            'p-invalid': props.invalid,
             'p-focus': instance.focused,
             'p-inputwrapper-filled': props.modelValue && props.modelValue.length,
             'p-inputwrapper-focus': instance.focused || instance.overlayVisible,

diff --git a/components/lib/password/BasePassword.vue b/components/lib/password/BasePassword.vue
@@ -51,6 +51,10 @@ export default {
             type: String,
             default: undefined
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false

diff --git a/components/lib/password/Password.d.ts b/components/lib/password/Password.d.ts
@@ -221,6 +221,11 @@ export interface PasswordProps extends InputHTMLAttributes {
      * @deprecated since v3.27.0. Use 'showicon' slot.
      */
     showIcon?: string | undefined;
+    /**
+     * When present, it specifies that the component should have invalid state style.
+     * @defaultValue false
+     */
+    invalid?: boolean | undefined;
     /**
      * When present, it specifies that the component should be disabled.
      * @defaultValue false

diff --git a/components/lib/password/style/PasswordStyle.js b/components/lib/password/style/PasswordStyle.js
@@ -41,7 +41,8 @@ const classes = {
         {
             'p-inputwrapper-filled': instance.filled,
             'p-inputwrapper-focus': instance.focused,
-            'p-input-icon-right': props.toggleMask
+            'p-input-icon-right': props.toggleMask,
+            'p-invalid': props.invalid
         }
     ],
     input: ({ props }) => [

diff --git a/components/lib/radiobutton/BaseRadioButton.vue b/components/lib/radiobutton/BaseRadioButton.vue
@@ -13,6 +13,10 @@ export default {
             type: String,
             default: null
         },
+        invalid: {
+            type: Boolean,
+            default: false
+        },
         disabled: {
             type: Boolean,
             default: false