quasar/dist/api/QCheckbox.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/checkbox"},"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"},"size":{"type":"String","desc":"Size in CSS units, including unit name or standard size name (xs|sm|md|lg|xl)","examples":["'16px'","'2rem'","'xs'","'md'"],"category":"style"},"model-value":{"desc":"Model of the component; 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":["Any","Array"],"default":"null","examples":["false","[ 'car', 'building' ]"]},"val":{"type":"Any","desc":"Works when model ('value') is Array. It tells the component which value should add/remove when ticked/unticked","examples":["'car'"],"category":"model"},"true-value":{"type":"Any","desc":"What model value should be considered as checked/ticked/on?","default":"true","examples":["'Agreed'"],"category":"model","required":false},"false-value":{"type":"Any","desc":"What model value should be considered as unchecked/unticked/off?","default":"false","examples":["'Disagree'"],"category":"model","required":false},"indeterminate-value":{"type":"Any","desc":"What model value should be considered as 'indeterminate'?","default":"null","examples":["0","'not_answered'"],"category":"model","required":false},"toggle-order":{"type":"String","desc":"Determines toggle order of the two states ('t' stands for state of true, 'f' for state of false); If 'toggle-indeterminate' is true, then the order is: indet -> first state -> second state -> indet (and repeat), otherwise: indet -> first state -> second state -> first state -> second state -> ...","values":["'tf'","'ft'"],"category":"behavior"},"toggle-indeterminate":{"type":"Boolean","desc":"When user clicks/taps on the component, should we toggle through the indeterminate state too?","category":"behavior"},"label":{"type":"String","desc":"Label to display along the component (or use the default slot instead of this prop)","examples":["'I agree with the Terms and Conditions'"],"category":"label"},"left-label":{"type":"Boolean","desc":"Label (if any specified) should be displayed on the left side of the component","category":"label"},"checked-icon":{"type":"String","examples":["'visibility'"],"category":"icons","desc":"The icon to be used when the model is truthy (instead of the default design)","addedIn":"v2.5"},"unchecked-icon":{"type":"String","examples":["'visibility_off'"],"category":"icons","desc":"The icon to be used when the toggle is falsy (instead of the default design)","addedIn":"v2.5"},"indeterminate-icon":{"type":"String","examples":["'help'"],"category":"icons","desc":"The icon to be used when the model is indeterminate (instead of the default design)","addedIn":"v2.5"},"color":{"type":"String","tsType":"NamedColor","desc":"Color name for component from the Quasar Color Palette","examples":["'primary'","'teal'","'teal-10'"],"category":"style"},"keep-color":{"type":"Boolean","desc":"Should the color (if specified any) be kept when the component is unticked/ off?","category":"behavior"},"dark":{"type":["Boolean","null"],"default":"null","desc":"Notify the component that the background is a dark color","category":"style","required":false},"dense":{"type":"Boolean","desc":"Dense mode; occupies less space","category":"style"},"disable":{"type":"Boolean","desc":"Put component in disabled mode","category":"state"},"tabindex":{"type":["Number","String"],"desc":"Tabindex HTML attribute value","examples":["100","'0'"],"category":"general"}},"slots":{"default":{"desc":"Default slot can be used as label, unless 'label' prop is specified; Suggestion: string"}},"events":{"update:model-value":{"desc":"Emitted when the component needs to change the model; Is also used by v-model","params":{"value":{"type":"Any","desc":"New model value","required":true},"evt":{"type":"Event","desc":"JS event object","required":true}}}},"methods":{"toggle":{"desc":"Toggle the state (of the model)","params":null,"returns":null}}}