Chip item pt fixes

This commit is contained in:
tugcekucukoglu 2024-05-15 10:35:36 +03:00
parent 13107cc7c0
commit 66bd931082
17 changed files with 72 additions and 72 deletions

View file

@ -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.
*/

View file

@ -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>

View file

@ -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',

View file

@ -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',