From a9a254915c3d08044745eac6e9d5075b4bb0727d Mon Sep 17 00:00:00 2001 From: tugcekucukoglu Date: Tue, 30 Jan 2024 14:27:56 +0300 Subject: [PATCH] Refactor #5176 - invalid property added --- components/lib/autocomplete/AutoComplete.d.ts | 5 +++++ components/lib/autocomplete/BaseAutoComplete.vue | 4 ++++ components/lib/autocomplete/style/AutoCompleteStyle.js | 1 + components/lib/calendar/BaseCalendar.vue | 4 ++++ components/lib/calendar/Calendar.d.ts | 5 +++++ components/lib/calendar/style/CalendarStyle.js | 1 + components/lib/cascadeselect/BaseCascadeSelect.vue | 4 ++++ components/lib/cascadeselect/CascadeSelect.d.ts | 5 +++++ components/lib/cascadeselect/style/CascadeSelectStyle.js | 1 + components/lib/checkbox/BaseCheckbox.vue | 4 ++++ components/lib/checkbox/Checkbox.d.ts | 5 +++++ components/lib/checkbox/style/CheckboxStyle.js | 3 ++- components/lib/chips/BaseChips.vue | 4 ++++ components/lib/chips/Chips.d.ts | 6 ++++++ components/lib/chips/style/ChipsStyle.js | 1 + components/lib/dropdown/BaseDropdown.vue | 4 ++++ components/lib/dropdown/Dropdown.d.ts | 5 +++++ components/lib/dropdown/style/DropdownStyle.js | 1 + components/lib/inputnumber/BaseInputNumber.vue | 4 ++++ components/lib/inputnumber/InputNumber.d.ts | 5 +++++ components/lib/inputnumber/style/InputNumberStyle.js | 3 ++- components/lib/inputswitch/BaseInputSwitch.vue | 4 ++++ components/lib/inputswitch/InputSwitch.d.ts | 5 +++++ components/lib/inputswitch/style/InputSwitchStyle.js | 3 ++- components/lib/inputtext/BaseInputText.vue | 4 ++++ components/lib/inputtext/InputText.d.ts | 5 +++++ components/lib/inputtext/style/InputTextStyle.js | 3 ++- components/lib/listbox/BaseListbox.vue | 4 ++++ components/lib/listbox/Listbox.d.ts | 5 +++++ components/lib/listbox/style/ListboxStyle.js | 3 ++- components/lib/multiselect/BaseMultiSelect.vue | 4 ++++ components/lib/multiselect/MultiSelect.d.ts | 5 +++++ components/lib/multiselect/style/MultiSelectStyle.js | 1 + components/lib/password/BasePassword.vue | 4 ++++ components/lib/password/Password.d.ts | 5 +++++ components/lib/password/style/PasswordStyle.js | 3 ++- components/lib/radiobutton/BaseRadioButton.vue | 4 ++++ components/lib/radiobutton/RadioButton.d.ts | 5 +++++ components/lib/radiobutton/style/RadioButtonStyle.js | 3 ++- components/lib/selectbutton/BaseSelectButton.vue | 4 ++++ components/lib/selectbutton/SelectButton.d.ts | 5 +++++ components/lib/selectbutton/style/SelectButtonStyle.js | 8 +++++++- components/lib/textarea/BaseTextarea.vue | 6 +++++- components/lib/textarea/Textarea.d.ts | 5 +++++ components/lib/textarea/style/TextareaStyle.js | 3 ++- components/lib/togglebutton/BaseToggleButton.vue | 4 ++++ components/lib/togglebutton/ToggleButton.d.ts | 5 +++++ components/lib/togglebutton/style/ToggleButtonStyle.js | 3 ++- components/lib/treeselect/BaseTreeSelect.vue | 4 ++++ components/lib/treeselect/TreeSelect.d.ts | 5 +++++ components/lib/treeselect/style/TreeSelectStyle.js | 1 + components/lib/tristatecheckbox/BaseTriStateCheckbox.vue | 4 ++++ components/lib/tristatecheckbox/TriStateCheckbox.d.ts | 5 +++++ .../lib/tristatecheckbox/style/TriStateCheckboxStyle.js | 3 ++- 54 files changed, 198 insertions(+), 12 deletions(-) diff --git a/components/lib/autocomplete/AutoComplete.d.ts b/components/lib/autocomplete/AutoComplete.d.ts index 5bf2ae40d..d8d691efd 100755 --- 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 index df9b9e647..c2ea6414a 100644 --- 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 index ba06e76c9..d92d31ef2 100644 --- 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 index 2d3a58fa8..ac1b8d90b 100644 --- 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 index c7eb93421..9b8540d98 100755 --- 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 index f3d64eb9c..c354ff993 100644 --- 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 index abd4f72e7..dbc69654c 100644 --- 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 index c7d1ee9e3..3e5a6e2bc 100644 --- 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 index a37c71f73..85f54f3b0 100644 --- 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 index 939f7a9af..fb434f62f 100644 --- 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 index 69cd7707d..d513b1e91 100755 --- 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 index 45cae0f8b..b720000b0 100644 --- 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 index 979732c0c..4a2fd9f6c 100644 --- 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 index 8b1388618..cd951fe26 100755 --- 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 index aed5a9554..1c7cfdab2 100644 --- 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 index 5e2a541b0..5499fef1d 100644 --- 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 index 1f1fba8cb..53ff93460 100755 --- 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 index ddcbb1504..7857cd7e5 100644 --- 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 index d0f49ea06..b78bf4fd1 100644 --- 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 index 360ca273c..c96e26685 100755 --- 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 index 59b03a32b..4a88f544a 100644 --- 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 index 86badafc5..e259fee89 100644 --- 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 index 468c4e379..8f0a2643c 100755 --- 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 index a14ec62ba..7206787cd 100644 --- 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 index d3cf25e52..2615f2860 100644 --- 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 index bbd729cbf..25eb76a32 100755 --- 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 index efb5fba3f..a86b3baa8 100644 --- 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 index 663133c91..f81b94bc6 100644 --- 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 index cfefd63f3..f58860b56 100755 --- 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 index 50d5ea4ac..ffd6bf8bf 100644 --- 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 index d7d2928d7..8dc2f30ae 100644 --- 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 index b9345c3ed..a30fa31d2 100755 --- 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 index dee9bab70..98ecb08fc 100644 --- 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 index 99d55066f..d5ecb6d97 100644 --- 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 index b0a806d4b..90531ab47 100755 --- 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 index b1df8398b..b2138697b 100644 --- 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 index 843ce98e7..378c172b5 100644 --- 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 diff --git a/components/lib/radiobutton/RadioButton.d.ts b/components/lib/radiobutton/RadioButton.d.ts index 6cd9d20f8..6bc2fa0d3 100755 --- a/components/lib/radiobutton/RadioButton.d.ts +++ b/components/lib/radiobutton/RadioButton.d.ts @@ -110,6 +110,11 @@ export interface RadioButtonProps { * @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 component should be disabled. * @defaultValue false diff --git a/components/lib/radiobutton/style/RadioButtonStyle.js b/components/lib/radiobutton/style/RadioButtonStyle.js index 26642b3f8..4b920ea05 100644 --- a/components/lib/radiobutton/style/RadioButtonStyle.js +++ b/components/lib/radiobutton/style/RadioButtonStyle.js @@ -39,7 +39,8 @@ const classes = { 'p-radiobutton p-component', { 'p-highlight': instance.checked, - 'p-disabled': props.disabled + 'p-disabled': props.disabled, + 'p-invalid': props.invalid } ], box: 'p-radiobutton-box', diff --git a/components/lib/selectbutton/BaseSelectButton.vue b/components/lib/selectbutton/BaseSelectButton.vue index b2b464867..8af63441c 100644 --- a/components/lib/selectbutton/BaseSelectButton.vue +++ b/components/lib/selectbutton/BaseSelectButton.vue @@ -20,6 +20,10 @@ export default { type: Boolean, default: true }, + invalid: { + type: Boolean, + default: false + }, disabled: Boolean, dataKey: null, ariaLabelledby: { diff --git a/components/lib/selectbutton/SelectButton.d.ts b/components/lib/selectbutton/SelectButton.d.ts index fdf67c010..dbb281c71 100755 --- a/components/lib/selectbutton/SelectButton.d.ts +++ b/components/lib/selectbutton/SelectButton.d.ts @@ -153,6 +153,11 @@ export interface SelectButtonProps { * @defaultValue false */ multiple?: 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 element should be disabled. * @defaultValue false diff --git a/components/lib/selectbutton/style/SelectButtonStyle.js b/components/lib/selectbutton/style/SelectButtonStyle.js index a02305a1c..454cabd1e 100644 --- a/components/lib/selectbutton/style/SelectButtonStyle.js +++ b/components/lib/selectbutton/style/SelectButtonStyle.js @@ -1,7 +1,13 @@ import BaseStyle from 'primevue/base/style'; const classes = { - root: ({ props }) => ['p-selectbutton p-buttonset p-component', { 'p-disabled': props.disabled }], + root: ({ props }) => [ + 'p-selectbutton p-buttonset p-component', + { + 'p-disabled': props.disabled, + 'p-invalid': props.invalid + } + ], button: ({ instance, option }) => [ 'p-button p-component', { diff --git a/components/lib/textarea/BaseTextarea.vue b/components/lib/textarea/BaseTextarea.vue index 79fb83d06..3f39b3a2a 100644 --- a/components/lib/textarea/BaseTextarea.vue +++ b/components/lib/textarea/BaseTextarea.vue @@ -7,7 +7,11 @@ export default { extends: BaseComponent, props: { modelValue: null, - autoResize: Boolean + autoResize: Boolean, + invalid: { + type: Boolean, + default: false + } }, style: TextareaStyle, provide() { diff --git a/components/lib/textarea/Textarea.d.ts b/components/lib/textarea/Textarea.d.ts index d68e6bcd3..492bdfd28 100755 --- a/components/lib/textarea/Textarea.d.ts +++ b/components/lib/textarea/Textarea.d.ts @@ -97,6 +97,11 @@ export interface TextareaProps extends TextareaHTMLAttributes { * @defaultValue false */ autoResize?: boolean | 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 {TextareaPassThroughOptions} diff --git a/components/lib/textarea/style/TextareaStyle.js b/components/lib/textarea/style/TextareaStyle.js index 046b672e2..aa6e19a59 100644 --- a/components/lib/textarea/style/TextareaStyle.js +++ b/components/lib/textarea/style/TextareaStyle.js @@ -18,7 +18,8 @@ const classes = { 'p-inputtextarea p-inputtext p-component', { 'p-filled': instance.filled, - 'p-inputtextarea-resizable ': props.autoResize + 'p-inputtextarea-resizable ': props.autoResize, + 'p-invalid': props.invalid } ] }; diff --git a/components/lib/togglebutton/BaseToggleButton.vue b/components/lib/togglebutton/BaseToggleButton.vue index 3c683b256..742ef22db 100644 --- a/components/lib/togglebutton/BaseToggleButton.vue +++ b/components/lib/togglebutton/BaseToggleButton.vue @@ -21,6 +21,10 @@ export default { type: String, default: 'left' }, + invalid: { + type: Boolean, + default: false + }, disabled: { type: Boolean, default: false diff --git a/components/lib/togglebutton/ToggleButton.d.ts b/components/lib/togglebutton/ToggleButton.d.ts index 62080a7da..3a0139f24 100755 --- a/components/lib/togglebutton/ToggleButton.d.ts +++ b/components/lib/togglebutton/ToggleButton.d.ts @@ -144,6 +144,11 @@ export interface ToggleButtonProps { * @defaultValue left */ iconPos?: 'left' | 'right' | 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 diff --git a/components/lib/togglebutton/style/ToggleButtonStyle.js b/components/lib/togglebutton/style/ToggleButtonStyle.js index 1c4ed4e22..8b525426d 100644 --- a/components/lib/togglebutton/style/ToggleButtonStyle.js +++ b/components/lib/togglebutton/style/ToggleButtonStyle.js @@ -24,7 +24,8 @@ const classes = { 'p-togglebutton p-component', { 'p-disabled': props.disabled, - 'p-highlight': instance.active + 'p-highlight': instance.active, + 'p-invalid': props.invalid } ], input: 'p-togglebutton-input', diff --git a/components/lib/treeselect/BaseTreeSelect.vue b/components/lib/treeselect/BaseTreeSelect.vue index 92b2e3eed..a9b125eb6 100644 --- a/components/lib/treeselect/BaseTreeSelect.vue +++ b/components/lib/treeselect/BaseTreeSelect.vue @@ -16,6 +16,10 @@ export default { type: String, default: null }, + invalid: { + type: Boolean, + default: false + }, disabled: { type: Boolean, default: false diff --git a/components/lib/treeselect/TreeSelect.d.ts b/components/lib/treeselect/TreeSelect.d.ts index 05d33ac5e..c7c590717 100644 --- a/components/lib/treeselect/TreeSelect.d.ts +++ b/components/lib/treeselect/TreeSelect.d.ts @@ -179,6 +179,11 @@ export interface TreeSelectProps { * 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/treeselect/style/TreeSelectStyle.js b/components/lib/treeselect/style/TreeSelectStyle.js index b568c98a6..4e6b5ba14 100644 --- a/components/lib/treeselect/style/TreeSelectStyle.js +++ b/components/lib/treeselect/style/TreeSelectStyle.js @@ -65,6 +65,7 @@ const classes = { { 'p-treeselect-chip': props.display === 'chip', 'p-disabled': props.disabled, + 'p-invalid': props.invalid, 'p-focus': instance.focused, 'p-inputwrapper-filled': !instance.emptyValue, 'p-inputwrapper-focus': instance.focused || instance.overlayVisible diff --git a/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue b/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue index d1f7071bc..d880843cd 100644 --- a/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue +++ b/components/lib/tristatecheckbox/BaseTriStateCheckbox.vue @@ -7,6 +7,10 @@ export default { extends: BaseComponent, props: { modelValue: null, + invalid: { + type: Boolean, + default: false + }, disabled: { type: Boolean, default: false diff --git a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts index a8768b36c..083acd51b 100755 --- a/components/lib/tristatecheckbox/TriStateCheckbox.d.ts +++ b/components/lib/tristatecheckbox/TriStateCheckbox.d.ts @@ -127,6 +127,11 @@ export interface TriStateCheckboxProps { * @defaultValue null */ modelValue?: Nullable; + /** + * 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/tristatecheckbox/style/TriStateCheckboxStyle.js b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js index 94fc8a8c6..597cb24e4 100644 --- a/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js +++ b/components/lib/tristatecheckbox/style/TriStateCheckboxStyle.js @@ -26,7 +26,8 @@ const classes = { 'p-tristatecheckbox p-checkbox p-component', { 'p-highlight': instance.active, - 'p-disabled': props.disabled + 'p-disabled': props.disabled, + 'p-invalid': props.invalid } ], box: 'p-checkbox-box',