Fixed #5198 - Contrast variant for SplitButton
parent
30c20d4e8a
commit
d5ebbe6529
|
@ -63,7 +63,7 @@ const SplitButtonProps = [
|
|||
name: 'severity',
|
||||
type: 'string',
|
||||
default: 'null',
|
||||
description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warning", "help", "danger".'
|
||||
description: 'Defines the style of the button, valid values are "secondary", "success", "info", "warning", "help", "danger", "contrast".'
|
||||
},
|
||||
{
|
||||
name: 'raised',
|
||||
|
|
|
@ -171,7 +171,7 @@ export interface SplitButtonProps {
|
|||
/**
|
||||
* Defines the style of the button.
|
||||
*/
|
||||
severity?: 'secondary' | 'success' | 'info' | 'warning' | 'help' | 'danger' | string | undefined;
|
||||
severity?: 'secondary' | 'success' | 'info' | 'warning' | 'help' | 'danger' | 'contrast' | string | undefined;
|
||||
/**
|
||||
* Add a shadow to indicate elevation.
|
||||
* @defaultValue false
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<DocSectionText v-bind="$attrs">
|
||||
<p>Severity defines the type of button.</p>
|
||||
<p>The <i>severity</i> property defines the variant of a button.</p>
|
||||
</DocSectionText>
|
||||
<div class="card flex justify-content-center flex-wrap gap-3">
|
||||
<Button label="Primary" />
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="contrast"></SplitButton>
|
||||
</div>
|
||||
<DocSectionCode :code="code" />
|
||||
</template>
|
||||
|
@ -51,6 +52,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="contrast"></SplitButton>
|
||||
`,
|
||||
options: `
|
||||
<template>
|
||||
|
@ -63,6 +65,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -115,6 +118,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" outlined severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="contrast"></SplitButton>
|
||||
</div>
|
||||
<DocSectionCode :code="code" />
|
||||
</template>
|
||||
|
@ -51,6 +52,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="contrast"></SplitButton>
|
||||
`,
|
||||
options: `
|
||||
<template>
|
||||
|
@ -63,6 +65,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -115,6 +118,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" raised severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="contrast"></SplitButton>
|
||||
</div>
|
||||
<DocSectionCode :code="code" />
|
||||
</template>
|
||||
|
@ -51,6 +52,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="contrast"></SplitButton>
|
||||
`,
|
||||
options: `
|
||||
<template>
|
||||
|
@ -63,6 +65,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -115,6 +118,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" rounded severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<DocSectionText v-bind="$attrs">
|
||||
<p>The <i>severity</i> option specifies the type of the message.</p>
|
||||
<p>The <i>severity</i> property defines the variant of a button.</p>
|
||||
</DocSectionText>
|
||||
<div class="card flex justify-content-center flex-wrap gap-3">
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save"></SplitButton>
|
||||
|
@ -10,6 +10,7 @@
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="contrast"></SplitButton>
|
||||
</div>
|
||||
<DocSectionCode :code="code" />
|
||||
</template>
|
||||
|
@ -51,6 +52,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="contrast"></SplitButton>
|
||||
`,
|
||||
options: `
|
||||
<template>
|
||||
|
@ -63,6 +65,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -115,6 +118,7 @@ export default {
|
|||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="warning"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="help"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="danger"></SplitButton>
|
||||
<SplitButton label="Save" :model="items" icon="pi pi-plus" @click="save" severity="contrast"></SplitButton>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
Loading…
Reference in New Issue