vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

DatePicker class renaming

pull/5838/head
tugcekucukoglu 2024-06-04 09:44:09 +03:00
parent e3046efb9e
commit cfc654160e
9 changed files with 97 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/lib/datepicker/DatePicker.d.ts vendored
View File

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

16
components/lib/datepicker/DatePicker.vue
View File

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

8
components/lib/datepicker/style/DatePickerStyle.d.ts vendored
View File

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

18
components/lib/datepicker/style/DatePickerStyle.js
View File

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

4
components/lib/themes/aura/datepicker/index.js
View File

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

4
components/lib/themes/lara/datepicker/index.js
View File

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

4
components/lib/themes/nora/datepicker/index.js
View File

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

48
components/lib/themes/types/datepicker/index.d.ts vendored
View File

@ -239,72 +239,72 @@ export interface DatePickerDesignTokens extends ColorSchemeDesignToken<DatePicke
color?: string;
};
/**
* Used to pass tokens of the view month section
* Used to pass tokens of the select month section
*/
viewMonth?: {
selectMonth?: {
/**
* Hover background of view month
* Hover background of select month
*
* @designToken datepicker.view.month.hover.background
* @designToken datepicker.select.month.hover.background
*/
hoverBackground?: string;
/**
* Color of view month
* Color of select month
*
* @designToken datepicker.view.month.color
* @designToken datepicker.select.month.color
*/
color?: string;
/**
* Hover color of view month
* Hover color of select month
*
* @designToken datepicker.view.month.hover.color
* @designToken datepicker.select.month.hover.color
*/
hoverColor?: string;
/**
* Padding of view month
* Padding of select month
*
* @designToken datepicker.view.month.padding
* @designToken datepicker.select.month.padding
*/
padding?: string;
/**
* Border radius of view month
* Border radius of select month
*
* @designToken datepicker.view.month.border.radius
* @designToken datepicker.select.month.border.radius
*/
borderRadius?: string;
};
/**
* Used to pass tokens of the view year section
* Used to pass tokens of the select year section
*/
viewYear?: {
selectYear?: {
/**
* Hover background of view year
* Hover background of select year
*
* @designToken datepicker.view.year.hover.background
* @designToken datepicker.select.year.hover.background
*/
hoverBackground?: string;
/**
* Color of view year
* Color of select year
*
* @designToken datepicker.view.year.color
* @designToken datepicker.select.year.color
*/
color?: string;
/**
* Hover color of view year
* Hover color of select year
*
* @designToken datepicker.view.year.hover.color
* @designToken datepicker.select.year.hover.color
*/
hoverColor?: string;
/**
* Padding of view year
* Padding of select year
*
* @designToken datepicker.view.year.padding
* @designToken datepicker.select.year.padding
*/
padding?: string;
/**
* Border radius of view year
* Border radius of select year
*
* @designToken datepicker.view.year.border.radius
* @designToken datepicker.select.year.border.radius
*/
borderRadius?: string;
};

88
doc/common/apidoc/index.json
View File

@ -9687,7 +9687,7 @@
"description": "Used to pass attributes to the title's DOM element."
},
{
"name": "viewMonth",
"name": "selectMonth",
"optional": true,
"readonly": false,
"type": "DatePickerPassThroughOptionType",
@ -9695,7 +9695,7 @@
"description": "Used to pass attributes to the view month's DOM element."
},
{
"name": "viewYear",
"name": "selectYear",
"optional": true,
"readonly": false,
"type": "DatePickerPassThroughOptionType",
@ -26823,7 +26823,7 @@
"description": "Used to pass attributes to the title's DOM element."
},
{
"name": "viewMonth",
"name": "selectMonth",
"optional": true,
"readonly": false,
"type": "DatePickerPassThroughOptionType",
@ -26831,7 +26831,7 @@
"description": "Used to pass attributes to the view month's DOM element."
},
{
"name": "viewYear",
"name": "selectYear",
"optional": true,
"readonly": false,
"type": "DatePickerPassThroughOptionType",
@ -28573,18 +28573,18 @@
"description": "Class name of the title element"
},
{
"name": "viewMonth",
"name": "selectMonth",
"optional": false,
"readonly": false,
"value": "\"p-datepicker-view-month\"",
"description": "Class name of the view month element"
"value": "\"p-datepicker-select-month\"",
"description": "Class name of the select month element"
},
{
"name": "viewYear",
"name": "selectYear",
"optional": false,
"readonly": false,
"value": "\"p-datepicker-view-year\"",
"description": "Class name of the view year element"
"value": "\"p-datepicker-select-year\"",
"description": "Class name of the select year element"
},
{
"name": "decade",
@ -81950,20 +81950,20 @@
"description": "Used to pass tokens of the input icon section"
},
{
"name": "viewMonth",
"name": "selectMonth",
"optional": true,
"readonly": false,
"type": "Object",
"default": "",
"description": "Used to pass tokens of the view month section"
"description": "Used to pass tokens of the select month section"
},
{
"name": "viewYear",
"name": "selectYear",
"optional": true,
"readonly": false,
"type": "Object",
"default": "",
"description": "Used to pass tokens of the view year section"
"description": "Used to pass tokens of the select year section"
},
{
"name": "group",
@ -82360,94 +82360,94 @@
"description": "Color of input icon"
},
{
"name": "viewMonth.hoverBackground",
"token": "datepicker.view.month.hover.background",
"name": "selectMonth.hoverBackground",
"token": "datepicker.select.month.hover.background",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Hover background of view month"
"description": "Hover background of select month"
},
{
"name": "viewMonth.color",
"token": "datepicker.view.month.color",
"name": "selectMonth.color",
"token": "datepicker.select.month.color",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Color of view month"
"description": "Color of select month"
},
{
"name": "viewMonth.hoverColor",
"token": "datepicker.view.month.hover.color",
"name": "selectMonth.hoverColor",
"token": "datepicker.select.month.hover.color",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Hover color of view month"
"description": "Hover color of select month"
},
{
"name": "viewMonth.padding",
"token": "datepicker.view.month.padding",
"name": "selectMonth.padding",
"token": "datepicker.select.month.padding",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Padding of view month"
"description": "Padding of select month"
},
{
"name": "viewMonth.borderRadius",
"token": "datepicker.view.month.border.radius",
"name": "selectMonth.borderRadius",
"token": "datepicker.select.month.border.radius",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Border radius of view month"
"description": "Border radius of select month"
},
{
"name": "viewYear.hoverBackground",
"token": "datepicker.view.year.hover.background",
"name": "selectYear.hoverBackground",
"token": "datepicker.select.year.hover.background",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Hover background of view year"
"description": "Hover background of select year"
},
{
"name": "viewYear.color",
"token": "datepicker.view.year.color",
"name": "selectYear.color",
"token": "datepicker.select.year.color",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Color of view year"
"description": "Color of select year"
},
{
"name": "viewYear.hoverColor",
"token": "datepicker.view.year.hover.color",
"name": "selectYear.hoverColor",
"token": "datepicker.select.year.hover.color",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Hover color of view year"
"description": "Hover color of select year"
},
{
"name": "viewYear.padding",
"token": "datepicker.view.year.padding",
"name": "selectYear.padding",
"token": "datepicker.select.year.padding",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Padding of view year"
"description": "Padding of select year"
},
{
"name": "viewYear.borderRadius",
"token": "datepicker.view.year.border.radius",
"name": "selectYear.borderRadius",
"token": "datepicker.select.year.border.radius",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Border radius of view year"
"description": "Border radius of select year"
},
{
"name": "group.borderColor",