mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-09 00:42:36 +00:00
Chip item pt fixes
This commit is contained in:
parent
13107cc7c0
commit
66bd931082
17 changed files with 72 additions and 72 deletions
|
@ -155,12 +155,12 @@ export interface AutoCompletePassThroughOptions {
|
|||
/**
|
||||
* Used to pass attributes to the chip's DOM element.
|
||||
*/
|
||||
chip?: AutoCompletePassThroughOptionType;
|
||||
chipItem?: AutoCompletePassThroughOptionType;
|
||||
/**
|
||||
* Used to pass attributes to the Chip.
|
||||
* @see {@link ChipPassThroughOptions}
|
||||
*/
|
||||
pcChipLabel?: ChipPassThroughOptions<AutoCompleteSharedPassThroughMethodOptions>;
|
||||
pcChip?: ChipPassThroughOptions<AutoCompleteSharedPassThroughMethodOptions>;
|
||||
/**
|
||||
* Used to pass attributes to the chip icon's DOM element.
|
||||
*/
|
||||
|
|
|
@ -47,17 +47,17 @@
|
|||
v-for="(option, i) of modelValue"
|
||||
:key="`${i}_${getOptionLabel(option)}`"
|
||||
:id="id + '_multiple_option_' + i"
|
||||
:class="cx('token', { i })"
|
||||
:class="cx('chipItem', { i })"
|
||||
role="option"
|
||||
:aria-label="getOptionLabel(option)"
|
||||
:aria-selected="true"
|
||||
:aria-setsize="modelValue.length"
|
||||
:aria-posinset="i + 1"
|
||||
v-bind="ptm('token')"
|
||||
v-bind="ptm('chipItem')"
|
||||
>
|
||||
<slot name="chip" :class="cx('pcChipLabel')" :value="option" :index="i" :removeCallback="(event) => removeOption(event, i)">
|
||||
<slot name="chip" :class="cx('pcChip')" :value="option" :index="i" :removeCallback="(event) => removeOption(event, i)">
|
||||
<!-- TODO: removetokenicon and removeTokenIcon deprecated since v4.0. Use chipicon slot and chipIcon prop-->
|
||||
<Chip :class="cx('pcChipLabel')" :label="getOptionLabel(option)" :removeIcon="chipIcon || removeTokenIcon" removable :unstyled="unstyled" @remove="removeOption($event, i)" :pt="ptm('pcChipLabel')">
|
||||
<Chip :class="cx('pcChip')" :label="getOptionLabel(option)" :removeIcon="chipIcon || removeTokenIcon" removable :unstyled="unstyled" @remove="removeOption($event, i)" :pt="ptm('pcChip')">
|
||||
<template #removeicon>
|
||||
<slot :name="$slots.chipicon ? 'chipicon' : 'removetokenicon'" :class="cx('chipIcon')" :index="i" :removeCallback="(event) => removeOption(event, i)" />
|
||||
</template>
|
||||
|
|
|
@ -13,8 +13,8 @@ export enum AutoCompleteClasses {
|
|||
root = 'p-autocomplete',
|
||||
pcInput = 'p-autocomplete-input',
|
||||
inputMultiple = 'p-autocomplete-input-multiple',
|
||||
chip = 'p-autocomplete-chip',
|
||||
pcChipLabel = 'p-autocomplete-chip-label',
|
||||
chipItem = 'p-autocomplete-chip-item',
|
||||
pcChip = 'p-autocomplete-chip',
|
||||
chipIcon = 'p-autocomplete-chip-icon',
|
||||
inputChip = 'p-autocomplete-input-chip',
|
||||
loader = 'p-autocomplete-loader',
|
||||
|
|
|
@ -251,13 +251,13 @@ const classes = {
|
|||
'p-variant-filled': props.variant ? props.variant === 'filled' : instance.$primevue.config.inputStyle === 'filled'
|
||||
}
|
||||
],
|
||||
chip: ({ instance, i }) => [
|
||||
'p-autocomplete-chip',
|
||||
chipItem: ({ instance, i }) => [
|
||||
'p-autocomplete-chip-item',
|
||||
{
|
||||
'p-focus': instance.focusedMultipleOptionIndex === i
|
||||
}
|
||||
],
|
||||
pcChipLabel: 'p-autocomplete-chip-label',
|
||||
pcChip: 'p-autocomplete-chip',
|
||||
chipIcon: 'p-autocomplete-chip-icon',
|
||||
inputChip: 'p-autocomplete-input-chip',
|
||||
loader: 'p-autocomplete-loader',
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue