quasar/dist/api/QDate.json

Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time

{"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/date"},"props":{"name":{"type":"String","desc":"Used to specify the name of the control; Useful if dealing with forms submitted directly to a URL","examples":["'car_id'"],"category":"behavior"},"landscape":{"type":"Boolean","desc":"Display the component in landscape mode","category":"behavior"},"mask":{"type":"String","desc":"Mask (formatting string) used for parsing and formatting value","category":"model","default":"'YYYY/MM/DD'","examples":["'YYYY-MM-DD'","'MMMM Do, YYYY'","'YYYY-MM-DD HH:mm:ss'"],"required":false},"locale":{"type":"Object","desc":"Locale formatting options","examples":["{ monthsShort: [ 'Ian', 'Feb', 'Mar', '...' ] }"],"definition":{"days":{"type":"Array","desc":"List of full day names (DDDD), starting with Sunday","examples":["[ 'Duminica', 'Luni', 'Marti', '...' ]"]},"daysShort":{"type":"Array","desc":"List of short day names (DDD), starting with Sunday","examples":["[ 'Dum', 'Lun', 'Mar', '...' ]"]},"months":{"type":"Array","desc":"List of full month names (MMMM), starting with January","examples":["[ 'Ianuarie', 'Februarie', 'Martie', '...' ]"]},"monthsShort":{"type":"Array","desc":"List of short month names (MMM), starting with January","examples":["[ 'Ian', 'Feb', 'Mar', '...' ]"]}},"category":"model"},"calendar":{"type":"String","desc":"Specify calendar type","default":"'gregorian'","values":["'gregorian'","'persian'"],"category":"model","required":false},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"text-color":{"type":"String","tsType":"NamedColor","desc":"Overrides text color (if needed); Color name from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"square":{"type":"Boolean","desc":"Removes border-radius so borders are squared","category":"style"},"flat":{"type":"Boolean","desc":"Applies a 'flat' design (no default shadow)","category":"style"},"bordered":{"type":"Boolean","desc":"Applies a default border to the component","category":"style"},"readonly":{"type":"Boolean","desc":"Put component in readonly mode","category":"state"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"model-value":{"desc":"Date(s) of the component; Must be Array if using 'multiple' prop; Either use this property (along with a listener for 'update:model-value' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["String","Array","Object","null","undefined"],"examples":["# v-model=\"myDate\"","# v-model=\"[myDate1, myDate2]\"","# v-model=\"[{ from: myDateFrom, to: myDateTo }]\"","# v-model=\"[myDate1, { from: myDateFrom, to: myDateTo }, myDate2]\""]},"title":{"type":"String","desc":"When specified, it overrides the default header title; Makes sense when not in 'minimal' mode","examples":["'Birthday'"],"category":"content"},"subtitle":{"type":"String","desc":"When specified, it overrides the default header subtitle; Makes sense when not in 'minimal' mode","examples":["'John Doe'"],"category":"content"},"default-year-month":{"type":"String","desc":"The default year and month to display (in YYYY/MM format) when model is unfilled (undefined or null); Please ensure it is within the navigation min/max year-month (if using them)","examples":["'1986/02'"],"category":"model"},"default-view":{"type":"String","desc":"The view which will be displayed by default","default":"'Calendar'","values":["'Calendar'","'Months'","'Years'"],"category":"model","required":false},"years-in-month-view":{"type":"Boolean","desc":"Show the years selector in months view","category":"behavior"},"events":{"type":["Array","Function"],"desc":"A list of events to highlight on the calendar; If using a function, it receives the date as a String and must return a Boolean (matches or not); If using a function then for best performance, reference it from your scope and do not define it inline","params":{"date":{"type":"String","desc":"The current date being processed.","examples":["'2018/11/05'","'2021/10/25'"]}},"returns":{"type":"Boolean","desc":"If true, the current date will be highlighted"},"examples":["[ '2018/11/05', '2018/11/06', '2018/11/09', '2018/11/23' ]","date => (date[ 9 ] % 3 === 0)"],"category":"model"},"event-color":{"type":["String","Function"],"desc":"Color name (from the Quasar Color Palette); If using a function, it receives the date as a String and must return a String (color for the received date); If using a function then for best performance, reference it from your scope and do not define it inline","params":{"date":{"type":"String","desc":"The current date being processed.","examples":["'2018/11/05'","'2021/10/25'"]}},"returns":{"type":"String","desc":"Color for the current date.","examples":["'teal'","'orange'"]},"examples":["'teal-10'","date => (date[ 9 ] % 2 === 0 ? 'teal' : 'orange')"],"category":"style"},"options":{"type":["Array","Function"],"desc":"Optionally configure the days that are selectable; If using a function, it receives the date as a String and must return a Boolean (is date acceptable or not); If using a function then for best performance, reference it from your scope and do not define it inline; Incompatible with 'range' prop","params":{"date":{"type":"String","desc":"The current date being processed.","examples":["'2018/11/05'","'2021/10/25'"]}},"returns":{"type":"Boolean","desc":"If true, the current date will be made available for selection"},"examples":["[ '2018/11/05', '2018/11/12', '2018/11/19', '2018/11/26' ]","date => (date[ 9 ] % 3 === 0)","date => (date >= '2018/11/03' && date <= '2018/11/15')"],"category":"model"},"navigation-min-year-month":{"type":"String","desc":"Lock user from navigating below a specific year+month (in YYYY/MM format); This prop is not used to correct the model; You might want to also use 'default-year-month' prop","examples":["'2020/07'"],"category":"selection"},"navigation-max-year-month":{"type":"String","desc":"Lock user from navigating above a specific year+month (in YYYY/MM format); This prop is not used to correct the model; You might want to also use 'default-year-month' prop","examples":["'2020/10'"],"category":"selection"},"no-unset":{"type":"Boolean","desc":"Remove ability to unselect a date; It does not apply to selecting a range over already selected dates","category":"selection"},"first-day-of-week":{"type":["String","Number"],"desc":"Sets the day of the week that is considered the first day (0 - Sunday, 1 - Monday, ...); This day will show in the left-most column of the calendar","default":"# based on configured Quasar lang language","examples":["1","# first-day-of-week=\"1\"","# :first-day-of-week=\"selectedFirstDayOfTheWeek\""],"category":"model","required":false},"today-btn":{"type":"Boolean","desc":"Display a button that selects the current day","category":"content"},"minimal":{"type":"Boolean","desc":"Don’t display the header","category":"content"},"multiple":{"type":"Boolean","desc":"Allow multiple selection; Model must be Array","category":"model|selection"},"range":{"type":"Boolean","desc":"Allow range selection; Partial compatibility with 'options' prop: selected ranges might also include 'unselectable' days","category":"model|selection"},"emit-immediately":{"type":"Boolean","desc":"Emit model when user browses month and year too; ONLY for single selection (non-multiple, non-range)","category":"model"}},"slots":{"default":{"desc":"This is where additional buttons can go"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":["String","Array","Object","null"],"desc":"New model value","required":true},"reason":{"type":"String","desc":"Reason of the user interaction (what was picked)","values":["'add-day'","'remove-day'","'add-range'","'remove-range'","'mask'","'locale'","'year'","'month'"]},"details":{"type":"Object","desc":"Object of properties on the new model","definition":{"year":{"type":"Number","required":true,"desc":"The year of the date that the user has clicked/tapped on"},"month":{"type":"Number","required":true,"desc":"The month of the date that the user has clicked/tapped on"},"day":{"type":"Number","required":true,"desc":"The day of the month that the user has clicked/tapped on"},"from":{"type":"Object","required":false,"desc":"Object of properties of the range starting point (only if range)","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"},"day":{"type":"Number","required":true,"desc":"The day of month"}}},"to":{"type":"Object","required":false,"desc":"Object of properties of the range ending point (only if range)","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"},"day":{"type":"Number","required":true,"desc":"The day of month"}}}}}}},"navigation":{"desc":"Emitted when user navigates to a different month or year (and even when the model changes from an outside source)","params":{"view":{"type":"Object","desc":"Definition of the current view (year, month)","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"}}}}},"range-start":{"desc":"User has started a range selection","params":{"from":{"type":"Object","desc":"Definition of date from where the range begins","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"},"day":{"type":"Number","required":true,"desc":"The day of month"}}}}},"range-end":{"desc":"User has ended a range selection","params":{"range":{"type":"Object","desc":"Definition of the range","definition":{"from":{"type":"Object","required":true,"desc":"Definition of date from where the range begins","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"},"day":{"type":"Number","required":true,"desc":"The day of month"}}},"to":{"type":"Object","required":true,"desc":"Definition of date to where the range ends","definition":{"year":{"type":"Number","required":true,"desc":"The year"},"month":{"type":"Number","required":true,"desc":"The month"},"day":{"type":"Number","required":true,"desc":"The day of month"}}}}}}}},"methods":{"setToday":{"desc":"Change model to today","params":null,"returns":null},"setView":{"desc":"Change current view","params":{"view":{"type":"String","required":true,"desc":"QDate view name","values":["'Calendar'","'Months'","'Years'"]}},"returns":null},"offsetCalendar":{"desc":"Increment or decrement calendar view's month or year","params":{"type":{"type":"String","required":true,"desc":"What to increment/decrement","values":["'month'","'year'"]},"descending":{"type":"Boolean","desc":"Decrement?"}},"returns":null},"setCalendarTo":{"desc":"Change current year and month of the Calendar view; It gets corrected if using navigation-min/max-year-month and sets the current view to Calendar","params":{"year":{"type":"Number","desc":"The year"},"month":{"type":"Number","desc":"The month"}},"returns":null},"setEditingRange":{"desc":"Configure the current editing range","params":{"from":{"type":"Object","desc":"Definition of date from where the range begins","definition":{"year":{"type":"Number","desc":"The year"},"month":{"type":"Number","desc":"The month"},"day":{"type":"Number","desc":"The day of month"}}},"to":{"type":"Object","desc":"Definition of date to where the range ends","definition":{"year":{"type":"Number","desc":"The year"},"month":{"type":"Number","desc":"The month"},"day":{"type":"Number","desc":"The day of month"}}}},"returns":null}}}