Calendar & CascadeSelect pt name fixes
parent
6746570c97
commit
a760468c95
|
@ -200,13 +200,13 @@ const classes = {
|
||||||
weekLabelContainer: 'p-disabled',
|
weekLabelContainer: 'p-disabled',
|
||||||
day: ({ date }) => [{ 'p-datepicker-other-month': date.otherMonth, 'p-datepicker-today': date.today }],
|
day: ({ date }) => [{ 'p-datepicker-other-month': date.otherMonth, 'p-datepicker-today': date.today }],
|
||||||
dayLabel: ({ instance, date }) => [{ 'p-highlight': instance.isSelected(date), 'p-disabled': !date.selectable }],
|
dayLabel: ({ instance, date }) => [{ 'p-highlight': instance.isSelected(date), 'p-disabled': !date.selectable }],
|
||||||
ariaSelectedDay: 'p-hidden-accessible',
|
hiddenSelectedDay: 'p-hidden-accessible',
|
||||||
monthPicker: 'p-monthpicker',
|
monthPicker: 'p-monthpicker',
|
||||||
month: ({ instance, month, index }) => ['p-monthpicker-month', { 'p-highlight': instance.isMonthSelected(index), 'p-disabled': !month.selectable }],
|
month: ({ instance, month, index }) => ['p-monthpicker-month', { 'p-highlight': instance.isMonthSelected(index), 'p-disabled': !month.selectable }],
|
||||||
ariaMonth: 'p-hidden-accessible',
|
hiddenMonth: 'p-hidden-accessible',
|
||||||
yearPicker: 'p-yearpicker',
|
yearPicker: 'p-yearpicker',
|
||||||
year: ({ instance, year }) => ['p-yearpicker-year', { 'p-highlight': instance.isYearSelected(year.value), 'p-disabled': !year.selectable }],
|
year: ({ instance, year }) => ['p-yearpicker-year', { 'p-highlight': instance.isYearSelected(year.value), 'p-disabled': !year.selectable }],
|
||||||
ariaYear: 'p-hidden-accessible',
|
hiddenYear: 'p-hidden-accessible',
|
||||||
timePicker: 'p-timepicker',
|
timePicker: 'p-timepicker',
|
||||||
hourPicker: 'p-hour-picker',
|
hourPicker: 'p-hour-picker',
|
||||||
incrementButton: 'p-link',
|
incrementButton: 'p-link',
|
||||||
|
|
|
@ -199,7 +199,7 @@ export interface CalendarPassThroughOptions {
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the aria selected day's DOM element.
|
* Uses to pass attributes to the aria selected day's DOM element.
|
||||||
*/
|
*/
|
||||||
ariaSelectedDay?: CalendarPassThroughOptionType;
|
hiddenSelectedDay?: CalendarPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the month picker's DOM element.
|
* Uses to pass attributes to the month picker's DOM element.
|
||||||
*/
|
*/
|
||||||
|
@ -211,7 +211,7 @@ export interface CalendarPassThroughOptions {
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the aria month's DOM element.
|
* Uses to pass attributes to the aria month's DOM element.
|
||||||
*/
|
*/
|
||||||
ariaMonth?: CalendarPassThroughOptionType;
|
hiddenMonth?: CalendarPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the year picker's DOM element.
|
* Uses to pass attributes to the year picker's DOM element.
|
||||||
*/
|
*/
|
||||||
|
@ -223,7 +223,7 @@ export interface CalendarPassThroughOptions {
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the aria year's DOM element.
|
* Uses to pass attributes to the aria year's DOM element.
|
||||||
*/
|
*/
|
||||||
ariaYear?: CalendarPassThroughOptionType;
|
hiddenYear?: CalendarPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the time picker's DOM element.
|
* Uses to pass attributes to the time picker's DOM element.
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -165,7 +165,7 @@
|
||||||
>
|
>
|
||||||
<slot name="date" :date="date">{{ date.day }}</slot>
|
<slot name="date" :date="date">{{ date.day }}</slot>
|
||||||
</span>
|
</span>
|
||||||
<div v-if="isSelected(date)" :class="cx('ariaSelectedDay')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('ariaSelectedDay')" :data-p-hidden-accessible="true">
|
<div v-if="isSelected(date)" :class="cx('hiddenSelectedDay')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('hiddenSelectedDay')" :data-p-hidden-accessible="true">
|
||||||
{{ date.day }}
|
{{ date.day }}
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
@ -188,7 +188,7 @@
|
||||||
:data-p-highlight="isMonthSelected(i)"
|
:data-p-highlight="isMonthSelected(i)"
|
||||||
>
|
>
|
||||||
{{ m.value }}
|
{{ m.value }}
|
||||||
<div v-if="isMonthSelected(i)" :class="cx('ariaMonth')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('ariaMonth')" :data-p-hidden-accessible="true">
|
<div v-if="isMonthSelected(i)" :class="cx('hiddenMonth')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('hiddenMonth')" :data-p-hidden-accessible="true">
|
||||||
{{ m.value }}
|
{{ m.value }}
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
|
@ -206,7 +206,7 @@
|
||||||
:data-p-highlight="isYearSelected(y.value)"
|
:data-p-highlight="isYearSelected(y.value)"
|
||||||
>
|
>
|
||||||
{{ y.value }}
|
{{ y.value }}
|
||||||
<div v-if="isYearSelected(y.value)" :class="cx('ariaYear')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('ariaYear')" :data-p-hidden-accessible="true">
|
<div v-if="isYearSelected(y.value)" :class="cx('hiddenYear')" :style="sx('hiddenAccessible', isUnstyled)" aria-live="polite" v-bind="ptm('hiddenYear')" :data-p-hidden-accessible="true">
|
||||||
{{ y.value }}
|
{{ y.value }}
|
||||||
</div>
|
</div>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
@ -111,7 +111,7 @@ const classes = {
|
||||||
dropdownButton: 'p-cascadeselect-trigger',
|
dropdownButton: 'p-cascadeselect-trigger',
|
||||||
loadingIcon: 'p-cascadeselect-trigger-icon',
|
loadingIcon: 'p-cascadeselect-trigger-icon',
|
||||||
dropdownIcon: 'p-cascadeselect-trigger-icon',
|
dropdownIcon: 'p-cascadeselect-trigger-icon',
|
||||||
searchResultAria: 'p-hidden-accessible',
|
hiddenSearchResult: 'p-hidden-accessible',
|
||||||
panel: ({ instance }) => [
|
panel: ({ instance }) => [
|
||||||
'p-cascadeselect-panel p-component',
|
'p-cascadeselect-panel p-component',
|
||||||
{
|
{
|
||||||
|
|
|
@ -101,7 +101,7 @@ export interface CascadeSelectPassThroughOptions {
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the search result message text aria's DOM element.
|
* Uses to pass attributes to the search result message text aria's DOM element.
|
||||||
*/
|
*/
|
||||||
searchResultAria?: CascadeSelectPassThroughOptionType;
|
hiddenSearchResult?: CascadeSelectPassThroughOptionType;
|
||||||
/**
|
/**
|
||||||
* Uses to pass attributes to the selected message text aria's DOM element.
|
* Uses to pass attributes to the selected message text aria's DOM element.
|
||||||
*/
|
*/
|
||||||
|
|
|
@ -38,7 +38,7 @@
|
||||||
<component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="ptm('dropdownIcon')" />
|
<component :is="dropdownIcon ? 'span' : 'ChevronDownIcon'" :class="[cx('dropdownIcon'), dropdownIcon]" aria-hidden="true" v-bind="ptm('dropdownIcon')" />
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
<span role="status" aria-live="polite" :class="cx('searchResultAria')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="ptm('searchResultAria')" :data-p-hidden-accessible="true">
|
<span role="status" aria-live="polite" :class="cx('hiddenSearchResult')" :style="sx('hiddenAccessible', isUnstyled)" v-bind="ptm('hiddenSearchResult')" :data-p-hidden-accessible="true">
|
||||||
{{ searchResultMessageText }}
|
{{ searchResultMessageText }}
|
||||||
</span>
|
</span>
|
||||||
<Portal :appendTo="appendTo">
|
<Portal :appendTo="appendTo">
|
||||||
|
|
Loading…
Reference in New Issue