From cfc654160e51e03202be82ebdd0360bb61cfc9c7 Mon Sep 17 00:00:00 2001 From: tugcekucukoglu Date: Tue, 4 Jun 2024 09:44:09 +0300 Subject: [PATCH] DatePicker class renaming --- components/lib/datepicker/DatePicker.d.ts | 4 +- components/lib/datepicker/DatePicker.vue | 16 ++-- .../lib/datepicker/style/DatePickerStyle.d.ts | 8 +- .../lib/datepicker/style/DatePickerStyle.js | 18 ++-- .../lib/themes/aura/datepicker/index.js | 4 +- .../lib/themes/lara/datepicker/index.js | 4 +- .../lib/themes/nora/datepicker/index.js | 4 +- .../lib/themes/types/datepicker/index.d.ts | 48 +++++----- doc/common/apidoc/index.json | 88 +++++++++---------- 9 files changed, 97 insertions(+), 97 deletions(-) diff --git a/components/lib/datepicker/DatePicker.d.ts b/components/lib/datepicker/DatePicker.d.ts index dd6118825..38e363fcb 100755 --- a/components/lib/datepicker/DatePicker.d.ts +++ b/components/lib/datepicker/DatePicker.d.ts @@ -183,11 +183,11 @@ export interface DatePickerPassThroughOptions { /** * Used to pass attributes to the view month's DOM element. */ - viewMonth?: DatePickerPassThroughOptionType; + selectMonth?: DatePickerPassThroughOptionType; /** * Used to pass attributes to the view year's DOM element. */ - viewYear?: DatePickerPassThroughOptionType; + selectYear?: DatePickerPassThroughOptionType; /** * Used to pass attributes to the decade's DOM element. */ diff --git a/components/lib/datepicker/DatePicker.vue b/components/lib/datepicker/DatePicker.vue index 76fe3fcc6..67bfdf1a7 100755 --- a/components/lib/datepicker/DatePicker.vue +++ b/components/lib/datepicker/DatePicker.vue @@ -101,10 +101,10 @@ type="button" @click="switchToYearView" @keydown="onContainerButtonKeydown" - :class="cx('viewYear')" + :class="cx('selectYear')" :disabled="switchViewButtonDisabled" :aria-label="$primevue.config.locale.chooseYear" - v-bind="ptm('viewYear')" + v-bind="ptm('selectYear')" data-pc-group-section="view" > {{ getYear(month) }} @@ -114,10 +114,10 @@ type="button" @click="switchToMonthView" @keydown="onContainerButtonKeydown" - :class="cx('viewMonth')" + :class="cx('selectMonth')" :disabled="switchViewButtonDisabled" :aria-label="$primevue.config.locale.chooseMonth" - v-bind="ptm('viewMonth')" + v-bind="ptm('selectMonth')" data-pc-group-section="view" > {{ getMonthName(month.month) }} @@ -129,10 +129,10 @@ type="button" @click="switchToMonthView" @keydown="onContainerButtonKeydown" - :class="cx('viewMonth')" + :class="cx('selectMonth')" :disabled="switchViewButtonDisabled" :aria-label="$primevue.config.locale.chooseMonth" - v-bind="ptm('viewMonth')" + v-bind="ptm('selectMonth')" data-pc-group-section="view" > {{ getMonthName(month.month) }} @@ -142,10 +142,10 @@ type="button" @click="switchToYearView" @keydown="onContainerButtonKeydown" - :class="cx('viewYear')" + :class="cx('selectYear')" :disabled="switchViewButtonDisabled" :aria-label="$primevue.config.locale.chooseYear" - v-bind="ptm('viewYear')" + v-bind="ptm('selectYear')" data-pc-group-section="view" > {{ getYear(month) }} diff --git a/components/lib/datepicker/style/DatePickerStyle.d.ts b/components/lib/datepicker/style/DatePickerStyle.d.ts index 180efe1b2..375b32403 100644 --- a/components/lib/datepicker/style/DatePickerStyle.d.ts +++ b/components/lib/datepicker/style/DatePickerStyle.d.ts @@ -55,13 +55,13 @@ export enum DatePickerClasses { */ title = 'p-datepicker-title', /** - * Class name of the view month element + * Class name of the select month element */ - viewMonth = 'p-datepicker-view-month', + selectMonth = 'p-datepicker-select-month', /** - * Class name of the view year element + * Class name of the select year element */ - viewYear = 'p-datepicker-view-year', + selectYear = 'p-datepicker-select-year', /** * Class name of the decade element */ diff --git a/components/lib/datepicker/style/DatePickerStyle.js b/components/lib/datepicker/style/DatePickerStyle.js index 3c3c91c6f..ea0e5250e 100644 --- a/components/lib/datepicker/style/DatePickerStyle.js +++ b/components/lib/datepicker/style/DatePickerStyle.js @@ -118,8 +118,8 @@ const theme = ({ dt }) => ` font-weight: ${dt('datepicker.title.font.weight')}; } -.p-datepicker-view-year, -.p-datepicker-view-month { +.p-datepicker-select-year, +.p-datepicker-select-month { border: none; background: transparent; margin: 0; @@ -130,24 +130,24 @@ const theme = ({ dt }) => ` )}; } -.p-datepicker-view-month { +.p-datepicker-select-month { padding: ${dt('datepicker.view.month.padding')}; color: ${dt('datepicker.view.month.color')}; border-radius: ${dt('datepicker.view.month.border.radius')}; } -.p-datepicker-view-year { +.p-datepicker-select-year { padding: ${dt('datepicker.view.year.padding')}; color: ${dt('datepicker.view.year.color')}; border-radius: ${dt('datepicker.view.year.border.radius')}; } -.p-datepicker-view-month:enabled:hover { +.p-datepicker-select-month:enabled:hover { background: ${dt('datepicker.view.month.hover.background')}; color: ${dt('datepicker.view.month.hover.color')}; } -.p-datepicker-view-year:enabled:hover { +.p-datepicker-select-year:enabled:hover { background: ${dt('datepicker.view.year.hover.background')}; color: ${dt('datepicker.view.year.hover.color')}; } @@ -203,7 +203,7 @@ const theme = ({ dt }) => ` width: ${dt('datepicker.date.width')}; height: ${dt('datepicker.date.height')}; border-radius: ${dt('datepicker.date.border.radius')}; - transition: background ${dt('datepicker.transition.duration')}, color ${dt('datepicker.transition.duration')}, border-color ${dt('datepicker.transition.duration')}, + transition: background ${dt('datepicker.transition.duration')}, color ${dt('datepicker.transition.duration')}, border-color ${dt('datepicker.transition.duration')}, box-shadow ${dt('datepicker.transition.duration')}, outline-color ${dt('datepicker.transition.duration')}; border: 1px solid transparent; outline-color: transparent; @@ -386,8 +386,8 @@ const classes = { header: 'p-datepicker-header', pcPrevButton: 'p-datepicker-prev-button', title: 'p-datepicker-title', - viewMonth: 'p-datepicker-view-month', - viewYear: 'p-datepicker-view-year', + selectMonth: 'p-datepicker-select-month', + selectYear: 'p-datepicker-select-year', decade: 'p-datepicker-decade', pcNextButton: 'p-datepicker-next-button', dayView: 'p-datepicker-day-view', diff --git a/components/lib/themes/aura/datepicker/index.js b/components/lib/themes/aura/datepicker/index.js index 0e29b442b..ada80cb3f 100644 --- a/components/lib/themes/aura/datepicker/index.js +++ b/components/lib/themes/aura/datepicker/index.js @@ -39,14 +39,14 @@ export default { inputIcon: { color: '{form.field.icon.color}' }, - viewMonth: { + selectMonth: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', padding: '0.25rem 0.5rem', borderRadius: '{content.border.radius}' }, - viewYear: { + selectYear: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', diff --git a/components/lib/themes/lara/datepicker/index.js b/components/lib/themes/lara/datepicker/index.js index 78ef38f23..6bf29d95d 100644 --- a/components/lib/themes/lara/datepicker/index.js +++ b/components/lib/themes/lara/datepicker/index.js @@ -37,14 +37,14 @@ export default { inputIcon: { color: '{form.field.icon.color}' }, - viewMonth: { + selectMonth: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', padding: '0.375rem 0.625rem', borderRadius: '{content.border.radius}' }, - viewYear: { + selectYear: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', diff --git a/components/lib/themes/nora/datepicker/index.js b/components/lib/themes/nora/datepicker/index.js index df134c9af..b4aa6c90a 100644 --- a/components/lib/themes/nora/datepicker/index.js +++ b/components/lib/themes/nora/datepicker/index.js @@ -43,13 +43,13 @@ export default { inputIcon: { color: '{form.field.icon.color}' }, - viewMonth: { + selectMonth: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', padding: '0.25rem 0.5rem' }, - viewYear: { + selectYear: { hoverBackground: '{content.hover.background}', color: '{content.color}', hoverColor: '{content.hover.color}', diff --git a/components/lib/themes/types/datepicker/index.d.ts b/components/lib/themes/types/datepicker/index.d.ts index 36b0444f2..a190a6ccc 100644 --- a/components/lib/themes/types/datepicker/index.d.ts +++ b/components/lib/themes/types/datepicker/index.d.ts @@ -239,72 +239,72 @@ export interface DatePickerDesignTokens extends ColorSchemeDesignToken