diff --git a/api-generator/components/badge.js b/api-generator/components/badge.js index c9d9c6024..b1450d0d7 100644 --- a/api-generator/components/badge.js +++ b/api-generator/components/badge.js @@ -9,7 +9,7 @@ const BadgeProps = [ name: 'severity', type: 'string', default: 'null', - description: 'Severity type of the badge.' + description: 'Severity type of the badge. Valid severities are "secondary", "success", "info", "warning", "danger" and "contrast".' }, { name: 'size', diff --git a/api-generator/components/tag.js b/api-generator/components/tag.js index 1713f6b12..e476acea2 100644 --- a/api-generator/components/tag.js +++ b/api-generator/components/tag.js @@ -9,7 +9,7 @@ const TagProps = [ name: 'severity', type: 'string', default: 'null', - description: 'Severity type of the tag. Valid severities are "success", "info", "warning" and "danger".' + description: 'Severity type of the tag. Valid severities are "secondary", "success", "info", "warning", "danger" and "contrast".' }, { name: 'rounded', diff --git a/components/lib/badge/Badge.d.ts b/components/lib/badge/Badge.d.ts index 6002e5770..83405a673 100644 --- a/components/lib/badge/Badge.d.ts +++ b/components/lib/badge/Badge.d.ts @@ -70,7 +70,7 @@ export interface BadgeProps { /** * Severity type of the badge. */ - severity?: 'info' | 'success' | 'warning' | 'danger' | string | null | undefined; + severity?: 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'contrast' | string | null | undefined; /** * Size of the badge, valid options are 'large' and 'xlarge'. */ diff --git a/components/lib/badge/style/BadgeStyle.js b/components/lib/badge/style/BadgeStyle.js index 25e700ca8..fa5402f8a 100644 --- a/components/lib/badge/style/BadgeStyle.js +++ b/components/lib/badge/style/BadgeStyle.js @@ -49,7 +49,9 @@ const classes = { 'p-badge-info': props.severity === 'info', 'p-badge-success': props.severity === 'success', 'p-badge-warning': props.severity === 'warning', - 'p-badge-danger': props.severity === 'danger' + 'p-badge-danger': props.severity === 'danger', + 'p-badge-secondary': props.severity === 'secondary', + 'p-badge-contrast': props.severity === 'contrast' } ] }; diff --git a/components/lib/button/Button.d.ts b/components/lib/button/Button.d.ts index e323b3706..260f6fbb3 100755 --- a/components/lib/button/Button.d.ts +++ b/components/lib/button/Button.d.ts @@ -119,7 +119,7 @@ export interface ButtonProps extends ButtonHTMLAttributes { /** * Severity type of the badge. */ - badgeSeverity?: 'info' | 'success' | 'warning' | 'danger' | string | null | undefined; + badgeSeverity?: 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'contrast' | string | null | undefined; /** * Whether the button is in loading state. * @defaultValue false diff --git a/components/lib/tag/Tag.d.ts b/components/lib/tag/Tag.d.ts index 6f51ea39c..78f448328 100644 --- a/components/lib/tag/Tag.d.ts +++ b/components/lib/tag/Tag.d.ts @@ -82,7 +82,7 @@ export interface TagProps { /** * Severity type of the tag. */ - severity?: 'success' | 'info' | 'warning' | 'danger' | string | undefined; + severity?: 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'contrast' | string | undefined; /** * Whether the corners of the tag are rounded. * @defaultValue false diff --git a/components/lib/tag/style/TagStyle.js b/components/lib/tag/style/TagStyle.js index 011563b16..54dff4d47 100644 --- a/components/lib/tag/style/TagStyle.js +++ b/components/lib/tag/style/TagStyle.js @@ -28,6 +28,8 @@ const classes = { 'p-tag-success': props.severity === 'success', 'p-tag-warning': props.severity === 'warning', 'p-tag-danger': props.severity === 'danger', + 'p-tag-secondary': props.severity === 'secondary', + 'p-tag-contrast': props.severity === 'contrast', 'p-tag-rounded': props.rounded } ], diff --git a/doc/badge/SeverityDoc.vue b/doc/badge/SeverityDoc.vue index 5aefac39c..c4a890054 100644 --- a/doc/badge/SeverityDoc.vue +++ b/doc/badge/SeverityDoc.vue @@ -1,13 +1,15 @@ - Severity defines the color of the badge, possible values are success, info, warning and danger in addition to the default theme color. + Severity defines the variant of a badge. + + @@ -19,39 +21,43 @@ export default { code: { basic: ` + + `, options: ` + +
Severity defines the color of the badge, possible values are success, info, warning and danger in addition to the default theme color.
Severity defines the variant of a badge.