quasar
Version:
Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
1 lines • 5.63 kB
JSON
{"type":"component","meta":{"docsUrl":"https://v2.quasar.dev/vue-components/time"},"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","null"],"desc":"Mask (formatting string) used for parsing and formatting value","category":"model","default":"'HH:mm'","examples":["'HH:mm:ss'","'YYYY-MM-DD HH:mm:ss'","'HH:mm MMMM Do, YYYY'"],"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":"Time of the component; Either use this property (along with a listener for 'update:modelValue' event) OR use v-model directive","required":true,"syncable":true,"category":"model","type":["String","null","undefined"],"examples":["# v-model=\"currentTime\""]},"format24h":{"type":["Boolean","null"],"default":"null","desc":"Forces 24 hour time display instead of AM/PM system; If prop is not set, then the default is based on Quasar lang language being used","category":"behavior","required":false},"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","required":false},"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":{"type":["Boolean","null","undefined"],"desc":"Is the user allowed to set the specified time?"},"examples":["(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":["[ 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":["[ 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":["[ 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":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":["String","null"],"desc":"New model value","required":true},"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","params":null,"returns":null}}}