Refactor #3889 - button updates

This commit is contained in:
Tuğçe Küçükoğlu 2023-05-02 11:00:39 +03:00
parent 4fe92f03ef
commit 21ab0ad7d0
4 changed files with 12 additions and 15 deletions

View file

@ -8,6 +8,7 @@
* *
*/ */
import { VNode } from 'vue'; import { VNode } from 'vue';
import { ButtonPassThroughOptions } from '../button';
import { MenuItem } from '../menuitem'; import { MenuItem } from '../menuitem';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@ -33,12 +34,9 @@ export interface SpeedDialPassThroughOptions {
root?: SpeedDialPassThroughOptionType; root?: SpeedDialPassThroughOptionType;
/** /**
* Uses to pass attributes to the button's DOM element. * Uses to pass attributes to the button's DOM element.
* @see {@link ButtonPassThroughOptions}
*/ */
button?: SpeedDialPassThroughOptionType; button?: ButtonPassThroughOptions;
/**
* Uses to pass attributes to the icon's DOM element.
*/
icon?: SpeedDialPassThroughOptionType;
/** /**
* Uses to pass attributes to the menu's DOM element. * Uses to pass attributes to the menu's DOM element.
*/ */

View file

@ -12,12 +12,12 @@
:aria-controls="id + '_list'" :aria-controls="id + '_list'"
:aria-label="ariaLabel" :aria-label="ariaLabel"
:aria-labelledby="ariaLabelledby" :aria-labelledby="ariaLabelledby"
v-bind="ptm('button')" :pt="ptm('button')"
> >
<template #icon> <template #icon>
<slot name="icon" :visible="d_visible"> <slot name="icon" :visible="d_visible">
<component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" v-bind="ptm('icon')" /> <component v-if="d_visible && !!hideIcon" :is="hideIcon ? 'span' : 'PlusIcon'" :class="hideIcon" v-bind="ptm('button')['icon']" />
<component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" v-bind="ptm('icon')" /> <component v-else :is="showIcon ? 'span' : 'PlusIcon'" :class="showIcon" v-bind="ptm('button')['icon']" />
</slot> </slot>
</template> </template>
</SDButton> </SDButton>

View file

@ -8,6 +8,7 @@
* *
*/ */
import { ButtonHTMLAttributes, VNode } from 'vue'; import { ButtonHTMLAttributes, VNode } from 'vue';
import { ButtonPassThroughOptions } from '../button';
import { MenuItem } from '../menuitem'; import { MenuItem } from '../menuitem';
import { TieredMenuPassThroughOptions } from '../tieredmenu'; import { TieredMenuPassThroughOptions } from '../tieredmenu';
import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers'; import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
@ -41,12 +42,9 @@ export interface SplitButtonPassThroughOptions {
icon?: SplitButtonPassThroughOptionType; icon?: SplitButtonPassThroughOptionType;
/** /**
* Uses to pass attributes to the menu button's DOM element. * Uses to pass attributes to the menu button's DOM element.
* @see {@link ButtonPassThroughOptions}
*/ */
menuButton?: SplitButtonPassThroughOptionType; menuButton?: ButtonPassThroughOptions;
/**
* Uses to pass attributes to the menu button icon's DOM element.
*/
menuButtonIcon?: SplitButtonPassThroughOptionType;
/** /**
* Uses to pass attributes to the menu's DOM element. * Uses to pass attributes to the menu's DOM element.
* @see {@link TieredMenuPassThroughOptions} * @see {@link TieredMenuPassThroughOptions}

View file

@ -19,11 +19,12 @@
:aria-controls="ariaId + '_overlay'" :aria-controls="ariaId + '_overlay'"
@click="onDropdownButtonClick" @click="onDropdownButtonClick"
@keydown="onDropdownKeydown" @keydown="onDropdownKeydown"
v-bind="{ ...menuButtonProps, ...ptm('menuButton') }" :pt="ptm('menuButton')"
v-bind="menuButtonProps"
> >
<template #icon="slotProps"> <template #icon="slotProps">
<slot name="menubuttonicon"> <slot name="menubuttonicon">
<component :is="menuButtonIcon ? 'span' : 'ChevronDownIcon'" :class="[menuButtonIcon, slotProps.class]" v-bind="ptm('menuButtonIcon')" /> <component :is="menuButtonIcon ? 'span' : 'ChevronDownIcon'" :class="[menuButtonIcon, slotProps.class]" v-bind="ptm('menuButton')['icon']" />
</slot> </slot>
</template> </template>
</PVSButton> </PVSButton>