Refactor #3965 - Update for unstyled prop
parent
350d5c21a7
commit
10f83fbe88
|
@ -23,14 +23,14 @@
|
|||
</template>
|
||||
<component v-else :is="$slots.message" :message="confirmation"></component>
|
||||
<template #footer>
|
||||
<CDButton :label="rejectLabel" :class="cx('rejectButton')" @click="reject()" :autofocus="autoFocusReject" :pt="ptm('rejectButton')">
|
||||
<CDButton :label="rejectLabel" :class="cx('rejectButton')" @click="reject()" :autofocus="autoFocusReject" :unstyled="unstyled" :pt="ptm('rejectButton')">
|
||||
<template v-if="rejectIcon || $slots.rejecticon" #icon="iconProps">
|
||||
<slot name="rejecticon">
|
||||
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</CDButton>
|
||||
<CDButton :label="acceptLabel" :class="cx('acceptButton')" @click="accept()" :autofocus="autoFocusAccept" :pt="ptm('acceptButton')">
|
||||
<CDButton :label="acceptLabel" :class="cx('acceptButton')" @click="accept()" :autofocus="autoFocusAccept" :unstyled="unstyled" :pt="ptm('acceptButton')">
|
||||
<template v-if="acceptIcon || $slots.accepticon" #icon="iconProps">
|
||||
<slot name="accepticon">
|
||||
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||
|
|
|
@ -13,14 +13,14 @@
|
|||
</template>
|
||||
<component v-else :is="$slots.message" :message="confirmation"></component>
|
||||
<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')" :unstyled="unstyled" :pt="ptm('rejectButton')">
|
||||
<template v-if="rejectIcon || $slots.rejecticon" #icon="iconProps">
|
||||
<slot name="rejecticon">
|
||||
<span :class="[rejectIcon, iconProps.class]" v-bind="ptm('rejectButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</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')" :unstyled="unstyled" :pt="ptm('acceptButton')">
|
||||
<template v-if="acceptIcon || $slots.accepticon" #icon="iconProps">
|
||||
<slot name="accepticon">
|
||||
<span :class="[acceptIcon, iconProps.class]" v-bind="ptm('acceptButton')['icon']" />
|
||||
|
|
|
@ -23,6 +23,7 @@
|
|||
@focus="onInputFocus"
|
||||
@blur="onInputBlur"
|
||||
v-bind="{ ...inputProps, ...ptm('input') }"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="input"
|
||||
/>
|
||||
<span v-if="showButtons && buttonLayout === 'stacked'" :class="cx('buttonGroup')" v-bind="ptm('buttonGroup')">
|
||||
|
@ -33,6 +34,7 @@
|
|||
:tabindex="-1"
|
||||
aria-hidden="true"
|
||||
v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="incrementbutton"
|
||||
>
|
||||
<template #icon>
|
||||
|
@ -48,6 +50,7 @@
|
|||
:tabindex="-1"
|
||||
aria-hidden="true"
|
||||
v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="decrementbutton"
|
||||
>
|
||||
<template #icon>
|
||||
|
@ -65,6 +68,7 @@
|
|||
:tabindex="-1"
|
||||
aria-hidden="true"
|
||||
v-bind="{ ...incrementButtonProps, ...ptm('incrementButton') }"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="incrementbutton"
|
||||
>
|
||||
<template #icon>
|
||||
|
@ -81,6 +85,7 @@
|
|||
:tabindex="-1"
|
||||
aria-hidden="true"
|
||||
v-bind="{ ...decrementButtonProps, ...ptm('decrementButton') }"
|
||||
:unstyled="unstyled"
|
||||
data-pc-section="decrementbutton"
|
||||
>
|
||||
<template #icon>
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
<div :class="cx('root')" v-bind="ptm('root')">
|
||||
<div :class="cx('controls')" v-bind="ptm('controls')">
|
||||
<slot name="controlsstart"></slot>
|
||||
<OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" :unstyled="unstyled" v-bind="{ ...moveUpButtonProps, ...ptm('moveUpButton') }">
|
||||
<OLButton type="button" @click="moveUp" :aria-label="moveUpAriaLabel" :disabled="moveDisabled()" v-bind="{ ...moveUpButtonProps, ...ptm('moveUpButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="moveupicon">
|
||||
<AngleUpIcon v-bind="ptm('moveUpButton')['icon']" />
|
||||
|
|
|
@ -20,6 +20,7 @@
|
|||
@keyup="onKeyUp"
|
||||
@invalid="onInvalid"
|
||||
v-bind="{ ...inputProps, ...ptm('input') }"
|
||||
:unstyled="unstyled"
|
||||
/>
|
||||
<slot v-if="toggleMask && unmasked" name="hideicon" :onClick="onMaskToggle">
|
||||
<component :is="hideIcon ? 'i' : 'EyeSlashIcon'" :class="hideIcon" @click="onMaskToggle" v-bind="ptm('hideIcon')" />
|
||||
|
|
|
@ -2,28 +2,28 @@
|
|||
<div :class="cx('root')" v-bind="ptm('root')">
|
||||
<div v-if="showSourceControls" :class="cx('sourceControls')" v-bind="ptm('sourceControls')">
|
||||
<slot name="sourcecontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="{ ...moveUpButtonProps, ...ptm('sourceMoveUpButton') }">
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveUp($event, 0)" v-bind="{ ...moveUpButtonProps, ...ptm('sourceMoveUpButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="moveupicon">
|
||||
<AngleUpIcon v-bind="ptm('sourceMoveUpButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" v-bind="{ ...moveTopButtonProps, ...ptm('sourceMoveTopButton') }">
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveTop($event, 0)" v-bind="{ ...moveTopButtonProps, ...ptm('sourceMoveTopButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetopicon">
|
||||
<AngleDoubleUpIcon v-bind="ptm('sourceMoveTopButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" v-bind="{ ...moveDownButtonProps, ...ptm('sourceMoveDownButton') }">
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveDown($event, 0)" v-bind="{ ...moveDownButtonProps, ...ptm('sourceMoveDownButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movedownicon">
|
||||
<AngleDownIcon v-bind="ptm('sourceMoveDownButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveBottom($event, 0)" v-bind="{ ...moveBottomButtonProps, ...ptm('sourceMoveBottomButton') }">
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(0)" type="button" @click="moveBottom($event, 0)" v-bind="{ ...moveBottomButtonProps, ...ptm('sourceMoveBottomButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movebottomicon">
|
||||
<AngleDoubleDownIcon v-bind="ptm('sourceMoveBottomButton')['icon']" />
|
||||
|
@ -74,28 +74,28 @@
|
|||
</div>
|
||||
<div :class="cx('buttons')" v-bind="ptm('buttons')">
|
||||
<slot name="movecontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" v-bind="{ ...moveToTargetProps, ...ptm('moveToTargetButton') }">
|
||||
<PLButton :aria-label="moveToTargetAriaLabel" type="button" @click="moveToTarget" :disabled="moveDisabled(0)" v-bind="{ ...moveToTargetProps, ...ptm('moveToTargetButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetotargeticon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDownIcon' : 'AngleRightIcon'" v-bind="ptm('moveToTargetButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveAllToTargetAriaLabel" type="button" @click="moveAllToTarget" :disabled="moveAllDisabled('sourceList')" v-bind="{ ...moveAllToTargetProps, ...ptm('moveAllToTargetButton') }">
|
||||
<PLButton :aria-label="moveAllToTargetAriaLabel" type="button" @click="moveAllToTarget" :disabled="moveAllDisabled('sourceList')" v-bind="{ ...moveAllToTargetProps, ...ptm('moveAllToTargetButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movealltotargeticon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDoubleDownIcon' : 'AngleDoubleRightIcon'" v-bind="ptm('moveAllToTargetButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" v-bind="{ ...moveToSourceProps, ...ptm('moveToSourceButton') }">
|
||||
<PLButton :aria-label="moveToSourceAriaLabel" type="button" @click="moveToSource" :disabled="moveDisabled(1)" v-bind="{ ...moveToSourceProps, ...ptm('moveToSourceButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetosourceicon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleUpIcon' : 'AngleLeftIcon'" v-bind="ptm('moveToSourceButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveAllToSourceAriaLabel" type="button" @click="moveAllToSource" :disabled="moveSourceDisabled('targetList')" v-bind="{ ...moveAllToSourceProps, ...ptm('moveAllToSourceButton') }">
|
||||
<PLButton :aria-label="moveAllToSourceAriaLabel" type="button" @click="moveAllToSource" :disabled="moveSourceDisabled('targetList')" v-bind="{ ...moveAllToSourceProps, ...ptm('moveAllToSourceButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movealltosourceicon" :viewChanged="viewChanged">
|
||||
<component :is="viewChanged ? 'AngleDoubleUpIcon' : 'AngleDoubleLeftIcon'" v-bind="ptm('moveAllToSourceButton')['icon']" />
|
||||
|
@ -147,28 +147,28 @@
|
|||
</div>
|
||||
<div v-if="showTargetControls" :class="cx('targetControls')" v-bind="ptm('targetControls')">
|
||||
<slot name="targetcontrolsstart"></slot>
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" v-bind="{ ...moveUpButtonProps, ...ptm('targetMoveUpButton') }">
|
||||
<PLButton :aria-label="moveUpAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveUp($event, 1)" v-bind="{ ...moveUpButtonProps, ...ptm('targetMoveUpButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="moveupicon">
|
||||
<AngleUpIcon v-bind="ptm('targetMoveUpButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" v-bind="{ ...moveTopButtonProps, ...ptm('targetMoveTopButton') }">
|
||||
<PLButton :aria-label="moveTopAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveTop($event, 1)" v-bind="{ ...moveTopButtonProps, ...ptm('targetMoveTopButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movetopicon">
|
||||
<AngleDoubleUpIcon v-bind="ptm('targetMoveTopButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" v-bind="{ ...moveDownButtonProps, ...ptm('targetMoveDownButton') }">
|
||||
<PLButton :aria-label="moveDownAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveDown($event, 1)" v-bind="{ ...moveDownButtonProps, ...ptm('targetMoveDownButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movedownicon">
|
||||
<AngleDownIcon v-bind="ptm('targetMoveDownButton')['icon']" />
|
||||
</slot>
|
||||
</template>
|
||||
</PLButton>
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveBottom($event, 1)" v-bind="{ ...moveBottomButtonProps, ...ptm('targetMoveBottomButton') }">
|
||||
<PLButton :aria-label="moveBottomAriaLabel" :disabled="moveDisabled(1)" type="button" @click="moveBottom($event, 1)" v-bind="{ ...moveBottomButtonProps, ...ptm('targetMoveBottomButton') }" :unstyled="unstyled">
|
||||
<template #icon>
|
||||
<slot name="movebottomicon">
|
||||
<AngleDoubleDownIcon v-bind="ptm('targetMoveBottomButton')['icon']" />
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
:aria-label="ariaLabel"
|
||||
:aria-labelledby="ariaLabelledby"
|
||||
:pt="ptm('button')"
|
||||
:unstyled="unstyled"
|
||||
>
|
||||
<template #icon>
|
||||
<slot name="icon" :visible="d_visible">
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="splitbutton" :data-pc-severity="severity">
|
||||
<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" :pt="ptm('button')" v-bind="buttonProps" :unstyled="unstyled">
|
||||
<template v-if="icon" #icon="slotProps">
|
||||
<slot name="icon" :class="slotProps.class">
|
||||
<span :class="[icon, slotProps.class]" v-bind="ptm('button')['icon']" />
|
||||
|
@ -19,9 +19,9 @@
|
|||
:aria-controls="ariaId + '_overlay'"
|
||||
@click="onDropdownButtonClick"
|
||||
@keydown="onDropdownKeydown"
|
||||
:unstyled="unstyled"
|
||||
:pt="ptm('menuButton')"
|
||||
v-bind="menuButtonProps"
|
||||
:unstyled="unstyled"
|
||||
>
|
||||
<template #icon="slotProps">
|
||||
<slot name="menubuttonicon" :class="slotProps.class">
|
||||
|
|
Loading…
Reference in New Issue