@quasar/quasar-ui-qcalendar

{ "props": { "view": { "type": "String", "category": "model", "desc": "The type of calendar view to be displayed. Use the ones for your selected calendar type", "applicable": [ "All" ], "values": [ "'month'", "'month-interval'", "'week'", "'day'", "'month-scheduler'", "'week-scheduler'", "'day-scheduler'", "'month-agenda'", "'week-agenda'", "'day-agenda'", "'month-resource'", "'week-resource'", "'day-resource'" ], "examples": [ "'week'", "'month'", "'week-agenda'" ], "default": "# 'day'", "__runtimeDefault": true }, "short-interval-label": { "type": "Boolean", "category": "style", "desc": "Makes interval labels short", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ] }, "day-height": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The maximum height in pixels for the day height. Using 0 will make the rows variable height based on content.", "default": "0", "examples": [ "'80'", "100" ] }, "day-min-height": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The minimum height to be used", "default": "40", "examples": [ "'80'", "100" ] }, "interval-height": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The maximum height in pixels for the interval height", "default": "40", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "scheduler", "week-scheduler", "month-scheduler", "custom-scheduler" ], "examples": [ "60", "'100'" ] }, "interval-minutes": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The number of minutes in an interval", "default": "60", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ], "examples": [ "15", "'30'" ] }, "interval-count": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The number intervals to use. If interval-minutes is set to 30 then you would set interval count to 48 – double that of regular", "default": "24", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ], "examples": [ "48", "'96'" ] }, "interval-start": { "type": [ "Number", "String" ], "category": "behavior", "desc": "The starting interval", "default": "0", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ], "examples": [ "6", "'8'" ] }, "interval-style": { "type": "Function", "category": "style", "desc": "Gets called to provide custom styling of an interval", "params": { "timestamp": { "type": "Timestamp", "tsType": "Timestamp", "desc": "A timestamp object associated with the interval", "__exemption": [ "examples" ] } }, "returns": { "type": [ "Array", "Object", "String" ], "desc": "A Vue style object", "examples": [ "{ color: '#ccc' }" ] }, "default": "(timestamp) => { return {} }", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ], "examples": [ "(timestamp) => { return { 'background-color': '#c0c0c0' } }", "(timestamp) => myIntervalStyle(timestamp)" ] }, "interval-class": { "type": "Function", "category": "style", "desc": "Gets called to provide custom styling of an interval", "params": { "timestamp": { "type": "Timestamp", "tsType": "Timestamp", "desc": "A timestamp object associated with the interval", "__exemption": [ "examples" ] } }, "returns": { "type": [ "Array", "Object", "String" ], "desc": "A Vue style object", "examples": [ "{ color: '#ccc' }" ] }, "default": "(timestamp) => { return '' }", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ], "examples": [ "(timestamp) => 'myIntervalClass(timestamp)'" ] }, "day-style": { "type": "Function", "category": "style", "desc": "Gets called to provide custom styling of a day", "__runtimeDefault": true, "default": "# null", "params": { "timestamp": { "type": "Timestamp", "tsType": "Timestamp", "desc": "A timestamp object associated with the day", "__exemption": [ "examples" ] } }, "returns": { "type": [ "Array", "Object", "String" ], "desc": "A Vue style object", "examples": [ "{ color: '#ccc' }" ] }, "applicable": [ "month" ], "examples": [ "(timestamp) => { return { 'background-color': '#c0c0c0' } }", "(timestamp) => dayStyle(timestamp)" ] }, "day-class": { "type": "Function", "category": "style", "desc": "Gets called to provide custom styling (via classes) of a day", "__runtimeDefault": true, "params": { "timestamp": { "type": "Timestamp", "tsType": "Timestamp", "desc": "A timestamp object associated with the day", "__exemption": [ "examples" ] } }, "returns": { "type": [ "Array", "Object", "String" ], "desc": "A Vue style object of classes", "examples": [ "{ 'q-range': true }" ] }, "default": "# null", "applicable": [ "month" ], "examples": [ "(timestamp) => { return { 'q-range': true } }", "(timestamp) => getDayClass(timestamp)" ] }, "weekday-style": { "type": [ "Function" ], "category": "style", "desc": "Gets called to provide custom styling of a weekday", "params": { "data": { "type": "Object", "desc": "The data passed to the function", "__exemption": [ "examples" ], "definition": { "scope": { "type": "Object", "desc": "The scope data passed to the function", "__exemption": [ "examples" ], "definition": { "timestamp": { "type": "Object", "tsType": "Timestamp", "desc": "A timestamp object associated with the weekday", "__exemption": [ "examples" ] }, "columnIndex": { "type": "Number", "desc": "The index of the column", "__exemption": [ "examples" ] }, "activeDate": { "type": "Boolean", "desc": "True if the active date" }, "droppable": { "type": "Boolean", "desc": "Value is set by return value of a drag and drop function" } } } } } }, "returns": { "type": "Object", "desc": "A Vue style object", "examples": [ "{ color: '#ccc' }" ] }, "default": "# null", "__runtimeDefault": true, "examples": [ "(data) => { return { 'background-color': '#c0c0c0' } }", "(data) => getWeekdayStyle(data)" ] }, "weekday-class": { "type": "Function", "category": "style", "desc": "Gets called to provide custom styling (via classes) of a weekday", "__runtimeDefault": true, "default": "# null", "params": { "data": { "type": "Object", "desc": "The data passed to the function", "__exemption": [ "examples" ], "definition": { "scope": { "type": "Object", "desc": "The scope data passed to the function", "__exemption": [ "examples" ], "definition": { "timestamp": { "type": "Object", "tsType": "Timestamp", "desc": "A timestamp object associated with the weekday", "__exemption": [ "examples" ] }, "columnIndex": { "type": "Number", "desc": "The index of the column", "__exemption": [ "examples" ] }, "activeDate": { "type": "Boolean", "desc": "True if the active date" }, "droppable": { "type": "Boolean", "desc": "Value is set by return value of a drag and drop function" } } } } } }, "returns": { "type": "Object", "desc": "A Vue style object of classes", "examples": [ "{ 'my-class': true }" ] }, "examples": [ "(data) => { return { 'my-class': true } }", "(data) => getWeekdayClass(data)" ] }, "show-interval-label": { "type": "Function", "category": "content", "desc": "Gets called to provide custom display of an interval label", "__runtimeDefault": true, "default": "# null", "params": { "timestamp": { "type": "Timestamp", "tsType": "Timestamp", "desc": "A timestamp object associated with the interval", "__exemption": [ "examples" ] } }, "returns": { "type": "String", "desc": "The label to display", "examples": [ "'My Label'" ] } }, "hour24format": { "type": "Boolean", "category": "style", "desc": "Show intervals in 24 hour format", "applicable": [ "day", "2day", "3day", "4day", "5day", "6day", "week", "resource", "day-resource", "month-interval", "custom-interval", "all scheduler" ] }, "time-clicks-clamped": { "type": "Boolean", "category": "behavior", "desc": "Causes the returning timestamp time to be clamped to the interval it is in", "applicable": [ "All interval-based" ] }, "date-header": { "type": "String", "category": "style", "desc": "Determines how the date header will be displayed", "values": [ "'stacked'", "'inline'", "'inverted'" ], "default": "'stacked'", "examples": [ "'inline'" ] }, "no-sticky": { "type": "Boolean", "category": "behavior", "desc": "Disables sticky headers", "applicable": [ "resource" ] }, "interval-header-height": { "type": [ "Number", "String" ], "category": "style", "desc": "The height of the interval header", "applicable": [ "resource" ], "default": "20" } }, "slots": {} }