Fixed #4042 - Positioning defect PrimeVue Button with icon slot
parent
2b63693a68
commit
66b08abf06
|
@ -23,15 +23,15 @@
|
||||||
</template>
|
</template>
|
||||||
<component v-else :is="$slots.message" :message="confirmation"></component>
|
<component v-else :is="$slots.message" :message="confirmation"></component>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<CDButton :label="rejectLabel" :class="cx('rejectButton')" iconPos="left" @click="reject()" :autofocus="autoFocusReject" :pt="ptm('rejectButton')">
|
<CDButton :label="rejectLabel" :class="cx('rejectButton')" @click="reject()" :autofocus="autoFocusReject" :pt="ptm('rejectButton')">
|
||||||
<template #icon="iconProps">
|
<template v-if="rejectIcon || $slots.rejecticon" #icon="iconProps">
|
||||||
<slot name="rejecticon">
|
<slot name="rejecticon">
|
||||||
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CDButton>
|
</CDButton>
|
||||||
<CDButton :label="acceptLabel" :class="cx('acceptButton')" iconPos="left" @click="accept()" :autofocus="autoFocusAccept" :pt="ptm('acceptButton')">
|
<CDButton :label="acceptLabel" :class="cx('acceptButton')" @click="accept()" :autofocus="autoFocusAccept" :pt="ptm('acceptButton')">
|
||||||
<template #icon="iconProps">
|
<template v-if="acceptIcon || $slots.accepticon" #icon="iconProps">
|
||||||
<slot name="accepticon">
|
<slot name="accepticon">
|
||||||
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
|
@ -42,10 +42,10 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import BaseConfirmDialog from './BaseConfirmDialog.vue';
|
|
||||||
import Button from 'primevue/button';
|
import Button from 'primevue/button';
|
||||||
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
||||||
import Dialog from 'primevue/dialog';
|
import Dialog from 'primevue/dialog';
|
||||||
|
import BaseConfirmDialog from './BaseConfirmDialog.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ConfirmDialog',
|
name: 'ConfirmDialog',
|
||||||
|
|
|
@ -14,14 +14,14 @@
|
||||||
<component v-else :is="$slots.message" :message="confirmation"></component>
|
<component v-else :is="$slots.message" :message="confirmation"></component>
|
||||||
<div :class="cx('footer')" v-bind="ptm('footer')">
|
<div :class="cx('footer')" v-bind="ptm('footer')">
|
||||||
<CPButton :label="rejectLabel" @click="reject()" @keydown="onRejectKeydown" :autofocus="autoFocusReject" :class="cx('rejectButton')" :pt="ptm('rejectButton')">
|
<CPButton :label="rejectLabel" @click="reject()" @keydown="onRejectKeydown" :autofocus="autoFocusReject" :class="cx('rejectButton')" :pt="ptm('rejectButton')">
|
||||||
<template #icon="iconProps">
|
<template v-if="rejectIcon || $slots.rejecticon" #icon="iconProps">
|
||||||
<slot name="rejecticon">
|
<slot name="rejecticon">
|
||||||
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
</template>
|
</template>
|
||||||
</CPButton>
|
</CPButton>
|
||||||
<CPButton :label="acceptLabel" @click="accept()" @keydown="onAcceptKeydown" :autofocus="autoFocusAccept" :class="cx('acceptButton')" :pt="ptm('acceptButton')">
|
<CPButton :label="acceptLabel" @click="accept()" @keydown="onAcceptKeydown" :autofocus="autoFocusAccept" :class="cx('acceptButton')" :pt="ptm('acceptButton')">
|
||||||
<template #icon="iconProps">
|
<template v-if="acceptIcon || $slots.accepticon" #icon="iconProps">
|
||||||
<slot name="accepticon">
|
<slot name="accepticon">
|
||||||
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
|
@ -34,13 +34,13 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import BaseConfirmPopup from './BaseConfirmPopup.vue';
|
|
||||||
import Button from 'primevue/button';
|
import Button from 'primevue/button';
|
||||||
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
||||||
import FocusTrap from 'primevue/focustrap';
|
import FocusTrap from 'primevue/focustrap';
|
||||||
import OverlayEventBus from 'primevue/overlayeventbus';
|
import OverlayEventBus from 'primevue/overlayeventbus';
|
||||||
import Portal from 'primevue/portal';
|
import Portal from 'primevue/portal';
|
||||||
import { ConnectedOverlayScrollHandler, DomHandler, ZIndexUtils } from 'primevue/utils';
|
import { ConnectedOverlayScrollHandler, DomHandler, ZIndexUtils } from 'primevue/utils';
|
||||||
|
import BaseConfirmPopup from './BaseConfirmPopup.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ConfirmPopup',
|
name: 'ConfirmPopup',
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
<div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="splitbutton" :data-pc-severity="severity">
|
<div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="splitbutton" :data-pc-severity="severity">
|
||||||
<slot>
|
<slot>
|
||||||
<PVSButton type="button" :class="cx('button')" :label="label" :disabled="disabled" :aria-label="label" @click="onDefaultButtonClick" :unstyled="unstyled" :pt="ptm('button')" v-bind="buttonProps">
|
<PVSButton type="button" :class="cx('button')" :label="label" :disabled="disabled" :aria-label="label" @click="onDefaultButtonClick" :unstyled="unstyled" :pt="ptm('button')" v-bind="buttonProps">
|
||||||
<template #icon="slotProps">
|
<template v-if="icon" #icon="slotProps">
|
||||||
<slot name="icon" :class="slotProps.class">
|
<slot name="icon" :class="slotProps.class">
|
||||||
<span :class="[icon, slotProps.class]" v-bind="ptm('button')['icon']" />
|
<span :class="[icon, slotProps.class]" v-bind="ptm('button')['icon']" />
|
||||||
</slot>
|
</slot>
|
||||||
|
|
Loading…
Reference in New Issue