UNPKG

quasar

Version:

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

173 lines (158 loc) 4.57 kB
{ "mixins": [ "components/date/use-datetime" ], "meta": { "docsUrl": "https://v2.quasar.dev/vue-components/time" }, "props": { "model-value": { "extends": "model-value", "type": [ "String", "null", "undefined" ], "desc": "Time of the component; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive", "examples": [ "v-model=\"currentTime\"" ] }, "format24h": { "type": "Boolean", "desc": "Forces 24 hour time display instead of AM/PM system", "default": "(based on Quasar lang language being used)", "category": "behavior" }, "default-date": { "type": "String", "desc": "The default date to use (in YYYY/MM/DD format) when model is unfilled (undefined or null)", "default": "current day", "examples": [ "1995/02/23" ], "category": "model" }, "mask": { "default": "HH:mm", "examples": [ "HH:mm:ss", "YYYY-MM-DD HH:mm:ss", "HH:mm MMMM Do, YYYY" ] }, "options": { "type": "Function", "desc": "Optionally configure what time is the user allowed to set; Overridden by 'hour-options', 'minute-options' and 'second-options' if those are set; For best performance, reference it from your scope and do not define it inline", "params": { "hr": { "type": "Number", "desc": "Hour" }, "min": { "type": [ "Number", "null" ], "desc": "Minutes" }, "sec": { "type": [ "Number", "null" ], "desc": "Seconds" } }, "returns": null, "examples": [ ":options=\"(hr, min, sec) => hr <= 6\"" ], "category": "behavior" }, "hour-options": { "type": "Array", "desc": "Optionally configure what hours is the user allowed to set; Overrides 'options' prop if that is also set", "examples": [ ":hour-options=\"[ 3, 6, 9 ]\"" ], "category": "behavior" }, "minute-options": { "type": "Array", "desc": "Optionally configure what minutes is the user allowed to set; Overrides 'options' prop if that is also set", "examples": [ ":minute-options=\"[0, 15, 30, 45]\"" ], "category": "behavior" }, "second-options": { "type": "Array", "desc": "Optionally configure what seconds is the user allowed to set; Overrides 'options' prop if that is also set", "examples": [ ":second-options=\"[0, 7, 10, 23]\"" ], "category": "behavior" }, "with-seconds": { "type": "Boolean", "desc": "Allow the time to be set with seconds", "category": "model|behavior" }, "now-btn": { "type": "Boolean", "desc": "Display a button that selects the current time", "category": "content" } }, "slots": { "default": { "desc": "This is where additional buttons can go" } }, "events": { "update:model-value": { "extends": "update:model-value", "params": { "value": { "type": [ "String", "null" ] }, "details": { "type": "Object", "desc": "Object of properties on the new model", "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 the month" }, "hour": { "type": "Number", "required": true, "desc": "The hour" }, "minute": { "type": "Number", "required": true, "desc": "The minute" }, "second": { "type": "Number", "required": true, "desc": "The second" }, "millisecond": { "type": "Number", "required": true, "desc": "The millisecond" }, "changed": { "type": "Boolean", "required": true, "desc": "Did the model change?" } } } } } }, "methods": { "setNow": { "desc": "Change model to current moment" } } }