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

Merge branch 'master' into v4

pull/5507/head
tugcekucukoglu 2024-04-01 16:51:26 +03:00
parent f2869c174d a6e725f2db
commit 5671752903
6 changed files with 534 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
components/lib/calendar/Calendar.d.ts vendored
View File

@ -127,7 +127,7 @@ export interface CalendarBlurEvent {
/**
* Custom passthrough(pt) options.
* @see {@link BaseCalendarProps.pt}
* @see {@link CalendarProps.pt}
*/
export interface CalendarPassThroughOptions {
/**
@ -493,9 +493,19 @@ export interface CalendarYearOptions {
}
/**
* Defines valid base properties in Calendar component.
* Defines valid properties in Calendar component.
*/
interface BaseCalendarProps {
export interface CalendarProps {
/**
* Value of the component.
* @defaultValue null
*/
modelValue?: Date | Array<Date> | Array<Date | null> | undefined | null;
/**
* Defines the quantity of the selection.
* @defaultValue single
*/
selectionMode?: 'single' | 'multiple' | 'range' | undefined;
/**
* Format of the date. Defaults to PrimeVue Locale configuration.
*/
@ -790,56 +800,6 @@ interface BaseCalendarProps {
unstyled?: boolean;
}
/**
* Defines valid single selection properties in Calendar component.
*/
interface CalendarPropsSingle extends BaseCalendarProps {
/**
* Value of the component.
* @defaultValue null
*/
modelValue?: Date | undefined | null;
/**
* Defines the quantity of the selection.
* @defaultValue single
*/
selectionMode?: 'single' | undefined;
}
/**
* Defines valid range selection properties in Calendar component.
*/
interface CalendarPropsRange extends BaseCalendarProps {
/**
* Value of the component.
* @defaultValue null
*/
modelValue?: Array<Date | null> | undefined | null;
/**
* Defines the quantity of the selection.
* @defaultValue single
*/
selectionMode?: 'range';
}
/**
* Defines valid multiple selection properties in Calendar component.
*/
interface CalendarPropsMultiple extends BaseCalendarProps {
/**
* Value of the component.
* @defaultValue null
*/
modelValue?: Array<Date> | undefined | null;
/**
* Defines the quantity of the selection.
* @defaultValue single
*/
selectionMode?: 'multiple';
}
export type CalendarProps = CalendarPropsSingle | CalendarPropsRange | CalendarPropsMultiple;
/**
* Defines valid options of the date slot in Calendar component.
*/
@ -992,9 +952,9 @@ export interface CalendarSlots {
export interface CalendarEmits {
/**
* Emitted when the value changes.
* @param {Date | Array<Date | null> | null} value - New value.
* @param {string | Date | string[] | Date[] | undefined} value - New value.
*/
'update:modelValue'(value: Date | Array<Date | null> | null): void;
'update:modelValue'(value: Date | Array<Date> | Array<Date | null> | undefined | null): void;
/**
* Callback to invoke when input field is being typed.
* @param {Event} event - Browser event

2
components/lib/fileupload/FileUpload.vue
View File

@ -30,9 +30,9 @@
<slot name="content" :files="files" :uploadedFiles="uploadedFiles" :removeUploadedFileCallback="removeUploadedFile" :removeFileCallback="remove" :progress="progress" :messages="messages">
<template v-if="hasFiles">
<ProgressBar :value="progress" :showValue="false" :unstyled="unstyled" :pt="ptm('progressbar')" />
<Message v-for="msg of messages" :key="msg" severity="error" @close="onMessageClose" :unstyled="unstyled" :pt="ptm('message')">{{ msg }}</Message>
<FileContent :files="files" @remove="remove" :badgeValue="pendingLabel" :previewWidth="previewWidth" :templates="$slots" :unstyled="unstyled" :pt="pt" />
</template>
<Message v-for="msg of messages" :key="msg" severity="error" @close="onMessageClose" :unstyled="unstyled" :pt="ptm('message')">{{ msg }}</Message>
<FileContent :files="uploadedFiles" @remove="removeUploadedFile" :badgeValue="completedLabel" badgeSeverity="success" :previewWidth="previewWidth" :templates="$slots" :unstyled="unstyled" :pt="pt" />
</slot>
<div v-if="$slots.empty && !hasFiles && !hasUploadedFiles" :class="cx('empty')" v-bind="ptm('empty')">

1
components/lib/slider/Slider.vue
View File

@ -154,6 +154,7 @@ export default {
this.handleIndex = index;
}
event.currentTarget.focus();
event.preventDefault();
},
onDrag(event) {

4
components/lib/stepper/Stepper.vue
View File

@ -35,7 +35,6 @@
</slot>
<slot v-if="index !== stepperpanels.length - 1" name="separator">
<StepperSeparator
v-if="index !== stepperpanels.length - 1"
:template="step.children?.separator"
:separatorClass="cx('stepper.separator')"
:stepperpanel="step"
@ -50,7 +49,7 @@
<div :class="cx('panelContainer')" v-bind="ptm('panelContainer')">
<template v-for="(step, index) of stepperpanels" :key="getStepKey(step, index)">
<StepperContent
v-if="isStepActive(index)"
v-show="isStepActive(index)"
:id="getStepContentId(index)"
:template="step?.children?.content"
:stepperpanel="step"
@ -103,7 +102,6 @@
<div v-show="isStepActive(index)" :class="cx('stepper.toggleableContent')" v-bind="getStepPT(step, 'toggleableContent', index)">
<slot v-if="index !== stepperpanels.length - 1" name="separator">
<StepperSeparator
v-if="index !== stepperpanels.length - 1"
:template="step.children?.separator"
:separatorClass="cx('stepper.separator')"
:stepperpanel="step"

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

@ -7359,7 +7359,7 @@
},
"CalendarPassThroughOptions": {
"description": "Custom passthrough(pt) options.",
"relatedProp": "undefined.BaseCalendarProps.pt",
"relatedProp": "CalendarProps.pt",
"props": [
{
"name": "root",
@ -8036,6 +8036,517 @@
],
"methods": []
},
"CalendarProps": {
"description": "Defines valid properties in Calendar component.",
"relatedProp": "",
"props": [
{
"name": "modelValue",
"optional": true,
"readonly": false,
"type": "null | Date | Date[] | (null | Date)[]",
"default": "null",
"description": "Value of the component."
},
{
"name": "selectionMode",
"optional": true,
"readonly": false,
"type": "\"multiple\" | \"range\" | \"single\"",
"default": "single",
"description": "Defines the quantity of the selection."
},
{
"name": "dateFormat",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Format of the date. Defaults to PrimeVue Locale configuration."
},
{
"name": "inline",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When enabled, displays the calendar as inline instead of an overlay."
},
{
"name": "showOtherMonths",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "true",
"description": "Whether to display dates in other months (non-selectable) at the start or end of the current month. To make these days selectable use the selectOtherMonths option."
},
{
"name": "selectOtherMonths",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether days in other months shown before or after the current month are selectable. This only applies if the showOtherMonths option is set to true."
},
{
"name": "showIcon",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When enabled, displays a button with icon next to input."
},
{
"name": "iconDisplay",
"optional": true,
"readonly": false,
"type": "\"input\" | \"button\"",
"default": "'button'",
"description": "Icon position of the component. This only applies if the showIcon option is set to true."
},
{
"name": "icon",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Icon of the calendar button.",
"deprecated": "since v3.27.0. Use 'dropdownicon' slot."
},
{
"name": "previousIcon",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Icon to show in the previous button.",
"deprecated": "since v3.27.0. Use 'previousicon' slot."
},
{
"name": "nextIcon",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Icon to show in the next button.",
"deprecated": "since v3.27.0. Use 'nexticon' slot."
},
{
"name": "incrementIcon",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Icon to show in each of the increment buttons.",
"deprecated": "since v3.27.0. Use 'incrementicon' slot."
},
{
"name": "decrementIcon",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Icon to show in each of the decrement buttons.",
"deprecated": "since v3.27.0. Use 'decrementicon' slot."
},
{
"name": "numberOfMonths",
"optional": true,
"readonly": false,
"type": "number",
"default": "1",
"description": "Number of months to display."
},
{
"name": "responsiveOptions",
"optional": true,
"readonly": false,
"type": "CalendarResponsiveOptions[]",
"default": "",
"description": "An array of options for responsive design."
},
{
"name": "breakpoint",
"optional": true,
"readonly": false,
"type": "string",
"default": "769px",
"description": "The breakpoint to define the maximum width boundary for datepicker panel."
},
{
"name": "view",
"optional": true,
"readonly": false,
"type": "\"month\" | \"year\" | \"date\"",
"default": "date",
"description": "Type of view to display."
},
{
"name": "touchUI",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When enabled, calendar overlay is displayed as optimized for touch devices."
},
{
"name": "monthNavigator",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether the month should be rendered as a dropdown instead of text.",
"deprecated": "since version 3.9.0, Navigator is always on."
},
{
"name": "yearNavigator",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether the year should be rendered as a dropdown instead of text.",
"deprecated": "since version 3.9.0, Navigator is always on."
},
{
"name": "yearRange",
"optional": true,
"readonly": false,
"type": "string",
"default": "false",
"description": "The range of years displayed in the year drop-down in (nnnn:nnnn) format such as (2000:2020).",
"deprecated": "since version 3.9.0, Years are based on decades by default."
},
{
"name": "minDate",
"optional": true,
"readonly": false,
"type": "Date",
"default": "",
"description": "The minimum selectable date."
},
{
"name": "maxDate",
"optional": true,
"readonly": false,
"type": "Date",
"default": "",
"description": "The maximum selectable date."
},
{
"name": "disabledDates",
"optional": true,
"readonly": false,
"type": "Date[]",
"default": "",
"description": "Array with dates to disable."
},
{
"name": "disabledDays",
"optional": true,
"readonly": false,
"type": "number[]",
"default": "",
"description": "Array with disabled weekday numbers."
},
{
"name": "maxDateCount",
"optional": true,
"readonly": false,
"type": "number",
"default": "",
"description": "Maximum number of selectable dates in multiple mode."
},
{
"name": "showOnFocus",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "true",
"description": "When disabled, datepicker will not be visible with input focus."
},
{
"name": "autoZIndex",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "true",
"description": "Whether to automatically manage layering."
},
{
"name": "baseZIndex",
"optional": true,
"readonly": false,
"type": "number",
"default": "0",
"description": "Base zIndex value to use in layering."
},
{
"name": "showButtonBar",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to display today and clear buttons at the footer."
},
{
"name": "shortYearCutoff",
"optional": true,
"readonly": false,
"type": "string",
"default": "+10",
"description": "The cutoff year for determining the century for a date."
},
{
"name": "showTime",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to display timepicker."
},
{
"name": "timeOnly",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to display timepicker only."
},
{
"name": "hourFormat",
"optional": true,
"readonly": false,
"type": "\"12\" | \"24\"",
"default": "24",
"description": "Specifies hour format."
},
{
"name": "stepHour",
"optional": true,
"readonly": false,
"type": "number",
"default": "1",
"description": "Hours to change per step."
},
{
"name": "stepMinute",
"optional": true,
"readonly": false,
"type": "number",
"default": "1",
"description": "Minutes to change per step."
},
{
"name": "stepSecond",
"optional": true,
"readonly": false,
"type": "number",
"default": "1",
"description": "Seconds to change per step."
},
{
"name": "showSeconds",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to show the seconds in time picker."
},
{
"name": "hideOnDateTimeSelect",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to hide the overlay on date selection when showTime is enabled."
},
{
"name": "hideOnRangeSelection",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "Whether to hide the overlay on date selection is completed when selectionMode is range."
},
{
"name": "timeSeparator",
"optional": true,
"readonly": false,
"type": "string",
"default": ":",
"description": "Separator of time selector."
},
{
"name": "showWeek",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When enabled, calendar will show week numbers."
},
{
"name": "manualInput",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "true",
"description": "Whether to allow entering the date manually via typing."
},
{
"name": "invalid",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When present, it specifies that the component should have invalid state style."
},
{
"name": "disabled",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When present, it specifies that the component should be disabled."
},
{
"name": "variant",
"optional": true,
"readonly": false,
"type": "\"filled\" | \"outlined\"",
"default": "outlined",
"description": "Specifies the input variant of the component."
},
{
"name": "readonly",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When present, it specifies that an input field is read-only."
},
{
"name": "placeholder",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Placeholder text for the input."
},
{
"name": "appendTo",
"optional": true,
"readonly": false,
"type": "HTMLElement | HintedString<\"body\" | \"self\">",
"default": "body",
"description": "A valid query selector or an HTMLElement to specify where the overlay gets attached."
},
{
"name": "id",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Identifier of the element."
},
{
"name": "inputId",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Identifier of the underlying input element."
},
{
"name": "inputStyle",
"optional": true,
"readonly": false,
"type": "object",
"default": "",
"description": "Inline style of the input field."
},
{
"name": "inputClass",
"optional": true,
"readonly": false,
"type": "string | object",
"default": "",
"description": "Style class of the input field."
},
{
"name": "inputProps",
"optional": true,
"readonly": false,
"type": "InputHTMLAttributes",
"default": "",
"description": "Used to pass all properties of the HTMLInputElement to the focusable input element inside the component."
},
{
"name": "panelStyle",
"optional": true,
"readonly": false,
"type": "object",
"default": "",
"description": "Inline style of the overlay panel."
},
{
"name": "panelClass",
"optional": true,
"readonly": false,
"type": "string | object",
"default": "",
"description": "Style class of the overlay panel."
},
{
"name": "panelProps",
"optional": true,
"readonly": false,
"type": "HTMLAttributes",
"default": "",
"description": "Used to pass all properties of the HTMLDivElement to the overlay panel inside the component."
},
{
"name": "ariaLabelledby",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Establishes relationships between the component and label(s) where its value should be one or more element IDs."
},
{
"name": "ariaLabel",
"optional": true,
"readonly": false,
"type": "string",
"default": "",
"description": "Establishes a string value that labels the component."
},
{
"name": "pt",
"optional": true,
"readonly": false,
"type": "PassThrough<CalendarPassThroughOptions>",
"default": "",
"description": "Used to pass attributes to DOM elements inside the component."
},
{
"name": "ptOptions",
"optional": true,
"readonly": false,
"type": "PassThroughOptions",
"default": "",
"description": "Used to configure passthrough(pt) options of the component."
},
{
"name": "unstyled",
"optional": true,
"readonly": false,
"type": "boolean",
"default": "false",
"description": "When enabled, it removes component related styles in the core."
}
],
"methods": []
},
"CalendarDateSlotOptions": {
"description": "Defines valid options of the date slot in Calendar component.",
"relatedProp": "",
@ -8234,7 +8745,7 @@
{
"name": "value",
"optional": false,
"type": "null | Date | (null | Date)[]",
"type": "undefined | null | Date | Date[] | (null | Date)[]",
"description": "New value."
}
],
@ -8381,9 +8892,6 @@
},
"CalendarPassThroughTransitionType": {
"values": "TransitionProps | (options: CalendarPassThroughMethodOptions) => TransitionProps | undefined"
},
"CalendarProps": {
"values": "CalendarPropsSingle | CalendarPropsRange | CalendarPropsMultiple"
}
}
}

6
doc/datatable/RowExpansionDoc.vue
View File

@ -79,7 +79,7 @@ export default {
data() {
return {
products: null,
expandedRows: [],
expandedRows: {},
code: {
basic: `
<DataTable v-model:expandedRows="expandedRows" :value="products" dataKey="id"
@ -211,7 +211,7 @@ export default {
data() {
return {
products: null,
expandedRows: []
expandedRows: {}
};
},
mounted() {
@ -340,7 +340,7 @@ import { useToast } from 'primevue/usetoast';
import { ProductService } from '@/service/ProductService';
const products = ref();
const expandedRows = ref([]);
const expandedRows = ref({});
const toast = useToast();
onMounted(() => {