diff --git a/api-generator/components/splitbutton.js b/api-generator/components/splitbutton.js index ab16eccd3..e83b7f907 100644 --- a/api-generator/components/splitbutton.js +++ b/api-generator/components/splitbutton.js @@ -58,6 +58,42 @@ const SplitButtonProps = [ type: 'string', default: 'null', description: 'Name of the menu button icon.' + }, + { + name: 'severity', + type: 'string', + default: 'null', + description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warning", "help", "danger".' + }, + { + name: 'raised', + type: 'boolean', + default: 'false', + description: 'Add a shadow to indicate elevation.' + }, + { + name: 'rounded', + type: 'boolean', + default: 'false', + description: 'Add a circular border radius to the button.' + }, + { + name: 'text', + type: 'boolean', + default: 'false', + description: 'Add a textual class to the button without a background initially.' + }, + { + name: 'outlined', + type: 'boolean', + default: 'false', + description: 'Add a border class without a background initially.' + }, + { + name: 'size', + type: 'string', + default: 'null', + description: 'Defines the size of the button, valid values are "small" and "large".' } ]; diff --git a/components/splitbutton/SplitButton.d.ts b/components/splitbutton/SplitButton.d.ts index be687ba42..866d4860a 100755 --- a/components/splitbutton/SplitButton.d.ts +++ b/components/splitbutton/SplitButton.d.ts @@ -68,6 +68,34 @@ export interface SplitButtonProps { * Name of the menu button icon. */ menuButtonIcon?: string | undefined; + /** + * Defines the style of the button. + */ + severity?: 'secondary' | 'success' | 'info' | 'warning' | 'help' | 'danger' | undefined; + /** + * Add a shadow to indicate elevation. + * @defaultValue false + */ + raised?: boolean | undefined; + /** + * Add a circular border radius to the button. + * @defaultValue false + */ + rounded?: boolean | undefined; + /** + * Add a textual class to the button without a background initially. + * @defaultValue false + */ + text?: boolean | undefined; + /** + * Add a border class without a background initially. + * @defaultValue false + */ + outlined?: boolean | undefined; + /** + * Defines the size of the button. + */ + size?: 'small' | 'large' | undefined; } /** diff --git a/components/splitbutton/SplitButton.vue b/components/splitbutton/SplitButton.vue index 0ff9a2052..023a7f55a 100755 --- a/components/splitbutton/SplitButton.vue +++ b/components/splitbutton/SplitButton.vue @@ -76,6 +76,30 @@ export default { menuButtonIcon: { type: String, default: 'pi pi-chevron-down' + }, + severity: { + type: String, + default: null + }, + raised: { + type: Boolean, + default: false + }, + rounded: { + type: Boolean, + default: false + }, + text: { + type: Boolean, + default: false + }, + outlined: { + type: Boolean, + default: false + }, + size: { + type: String, + default: null } }, data() { @@ -105,7 +129,19 @@ export default { return UniqueComponentId(); }, containerClass() { - return ['p-splitbutton p-component', this.class]; + return [ + 'p-splitbutton p-component', + this.class, + { + [`p-button-${this.severity}`]: this.severity, + 'p-button-raised': this.raised, + 'p-button-rounded': this.rounded, + 'p-button-text': this.text, + 'p-button-outlined': this.outlined, + 'p-button-sm': this.size === 'small', + 'p-button-lg': this.size === 'large' + } + ]; } }, components: {