@vuesax-alpha/nightly
Version:
A Component Library for Vue 3
1,540 lines • 102 kB
JSON
{
"framework": "vue",
"version": "0.0.20250405",
"name": "@vuesax-alpha/nightly",
"contributions": {
"html": {
"tags": [
{
"name": "vs-button",
"attributes": [
{
"name": "color",
"description": "Change the color of the component and some of its sub components.",
"default": "primary",
"value": {
"type": "primary, success, danger, warning, dark, RGB, HEX",
"kind": "expression"
}
},
{
"name": "style button",
"description": "Change the style of the component and its states.",
"default": "null",
"value": {
"type": "flat, border, gradient, transparent, dashed, shadow, relief, floating",
"kind": "expression"
}
},
{
"name": "active",
"description": "Determine if the component is active and change its style to that state.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "upload",
"description": "Determine if the component has the upload status active by changing the style and adding the animation.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "to",
"description": "Add the functionality of vue-router to the button, clicking it will redirect to the last route.",
"default": "false",
"value": {
"type": "url - vue-router",
"kind": "expression"
}
},
{
"name": "href",
"description": "Add an href of an external link to add the functionality by clicking on the component.",
"default": "false",
"value": {
"type": "href - link",
"kind": "expression"
}
},
{
"name": "blank",
"description": "as in an html element `a` determines whether a new window is opened or the current one is replaced.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "icon",
"description": "Determine if the component contains only one icon, by adding this property the component has an equal width and height.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "circle",
"description": "Change the border radius to give a circle style.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "square",
"description": "Change the border radius to give a rectangle style.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
}
],
"events": [],
"slots": []
},
{
"name": "vs-alert",
"attributes": [
{
"name": "v-model",
"description": "Determine if the component is visible.",
"default": "true",
"value": {
"type": "boolean",
"kind": "expression"
}
},
{
"name": "v-model:hidden-content",
"description": "With this property you can hide the content of the alert. You can bind this with v-model",
"default": "false",
"value": {
"type": "boolean",
"kind": "expression"
}
},
{
"name": "color",
"description": "Change the color of the component and some of its sub components.",
"default": "primary",
"value": {
"type": "primary, success, danger, warning, dark, RGB, HEX",
"kind": "expression"
}
},
{
"name": "type",
"description": "Change the style of all the alert.",
"default": "default",
"value": {
"type": "solid, border, shadow, gradient, relief",
"kind": "expression"
}
},
{
"name": "page",
"description": "Determine the page that is active (this property is linked to the slots=\"page-{n}\").",
"default": "null",
"value": {
"type": "Number",
"kind": "expression"
}
},
{
"name": "progress",
"description": "Add a progress bar to the alert and the value is the percentage of width.",
"default": "null",
"value": {
"type": "0 - 100",
"kind": "expression"
}
},
{
"name": "closable",
"description": "Add a button to close the alert (it is necessary to use v-model).",
"default": "false",
"value": {
"type": "boolean",
"kind": "expression"
}
},
{
"name": "icon",
"description": "Add an icon to the alert.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "title",
"description": "Add a title to the alert.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "page-{n}",
"description": "Add the pages to the alert component if it is page one would be (slot=\"page-1\").",
"default": "null",
"value": {
"type": "(page-1 - page-{n})",
"kind": "expression"
}
},
{
"name": "footer",
"description": "Add a footer to the alert component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "icon",
"description": "Add an icon to the alert."
},
{
"name": "title",
"description": "Add a title to the alert."
},
{
"name": "page-{n}",
"description": "Add the pages to the alert component if it is page one would be (slot=\"page-1\")."
},
{
"name": "footer",
"description": "Add a footer to the alert component."
}
]
},
{
"name": "vs-avatar",
"attributes": [
{
"name": "color",
"description": "color of the component.",
"default": "--vs-gray-2",
"value": {
"type": "Vuesax Colors, RGB, HEX",
"kind": "expression"
}
},
{
"name": "size",
"description": "size of the avatar component.",
"default": "44",
"value": {
"type": "Number",
"kind": "expression"
}
},
{
"name": "badge",
"description": "Determine if the badge is active.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "badge-color",
"description": "Change the color of the badge inside the avatar.",
"default": "primary",
"value": {
"type": "Vuesax colors,RGB,HEX",
"kind": "expression"
}
},
{
"name": "shape",
"description": "Change the style of the avatar by circulating it.",
"default": "false",
"value": {
"type": "square, circle",
"kind": "expression"
}
},
{
"name": "writing",
"description": "Add an animation to the writing badge.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "history",
"description": "Add a border to the avatar.",
"default": "gray-2",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "history-gradient",
"description": "Change the color of the border to a gradient.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "loading",
"description": "Add a loading animation to the avatar.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "max",
"description": "(vs-avatar-group) determine how many avatars are visible.",
"default": "null",
"value": {
"type": "number",
"kind": "expression"
}
},
{
"name": "float",
"description": "(vs-avatar-group) change the way the avatar is composed by placing one next to the other.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "pointer",
"description": "Determine if the avatar has a pointer cursor.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "text",
"description": "Add text within the avatar component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "badge",
"description": "Add to the badge everything that is inside the slot, commonly used for numbers and an icon.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "icons",
"description": "Add a space to put icons next to the avatar.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "text",
"description": "Add text within the avatar component."
},
{
"name": "badge",
"description": "Add to the badge everything that is inside the slot, commonly used for numbers and an icon."
},
{
"name": "icons",
"description": "Add a space to put icons next to the avatar."
}
]
},
{
"name": "vs-badge",
"attributes": [
{
"name": "value",
"description": "display value.",
"default": "\"' '\"",
"value": {
"type": "Number,String",
"kind": "expression"
}
},
{
"name": "max",
"description": "maximum value, shows <code>{max}+</code> when exceeded. Only works if value is a number.",
"default": "null",
"value": {
"type": "Number",
"kind": "expression"
}
},
{
"name": "is-dot",
"description": "Show with little dots level.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "hidden",
"description": "hidden badge.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "type",
"description": "badge type.",
"default": "danger",
"value": {
"type": "'primary, success, warn, info, danger'",
"kind": "expression"
}
},
{
"name": "show-zero",
"description": "Whether to show badge when value is zero.",
"default": "true",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "color",
"description": "background color of the dot.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "offset",
"description": "Adjusting the position of the badge",
"default": "null",
"value": {
"type": "'Record< number, number>'",
"kind": "expression"
}
},
{
"name": "processing",
"description": "Set processing prop to indicate it is processing.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "badge-style",
"description": "custom style of badge.",
"default": "''",
"value": {
"type": "'CSSProperties'",
"kind": "expression"
}
},
{
"name": "badge-class",
"description": "custom class of badge.",
"default": "''",
"value": {
"type": "'String'",
"kind": "expression"
}
},
{
"name": "default",
"description": "customize default content",
"default": "null",
"value": {
"type": "",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "customize default content"
}
]
},
{
"name": "vs-card",
"attributes": [
{
"name": "type",
"description": "Change the style of the letter and the position of the internals.",
"default": "null",
"value": {
"type": "1,2,3,4,5",
"kind": "expression"
}
},
{
"name": "text",
"description": "Add text to the card in the section determined by the card type.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "title",
"description": "Add the title to the card in the section determined by the type of card.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "buttons",
"description": "Add the buttons to the card in the section determined by the type of card.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "interactions",
"description": "Add the interactions to the card in the section determined by the card type.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "img",
"description": "Add the image or video to the card in the section determined by the type of card.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "text",
"description": "Add text to the card in the section determined by the card type."
},
{
"name": "title",
"description": "Add the title to the card in the section determined by the type of card."
},
{
"name": "buttons",
"description": "Add the buttons to the card in the section determined by the type of card."
},
{
"name": "interactions",
"description": "Add the interactions to the card in the section determined by the card type."
},
{
"name": "img",
"description": "Add the image or video to the card in the section determined by the type of card."
}
]
},
{
"name": "vs-checkbox",
"attributes": [
{
"name": "v-model",
"description": "determine the value of the checkbox and data anchor.",
"default": "false",
"value": {
"type": "boolean, string, array",
"kind": "expression"
}
},
{
"name": "color",
"description": "Change the color of the component.",
"default": "false",
"value": {
"type": "vuesax colors, RGB, HEX",
"kind": "expression"
}
},
{
"name": "value",
"description": "Determine the value of the input when being checked.",
"default": "true",
"value": {
"type": "String, Object",
"kind": "expression"
}
},
{
"name": "loading",
"description": "Add a loading animation and disable the input.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "line-through",
"description": "Add a line in the center of the label when checked.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "indeterminate",
"description": "Change the default checkbox icon to a line that represents undetermined data.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "label-before",
"description": "Change the position of the label.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "checked",
"description": "Determine if the component is initially in check (this changes the property computed in v-model to true).",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "checked-force",
"description": "Force checkbox state is checked",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "Checkbox Group",
"description": "It is used for multiple checkboxes which are bound in one group.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "id",
"description": "Checkbox id",
"default": "undefined",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "name",
"description": "Checkbox name",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "icon",
"description": "Change the component icon.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "default",
"description": "Add a label to the component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "icon",
"description": "Change the component icon."
},
{
"name": "default",
"description": "Add a label to the component."
}
]
},
{
"name": "vs-dialog",
"attributes": [
{
"name": "v-model",
"description": "Determine if the dialogue is visible or hidden.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "not-center",
"description": "By default the header centers the elements, with this property the centering is eliminated.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "width",
"description": "Determine the width of the dialog.",
"default": "null",
"value": {
"type": "px",
"kind": "expression"
}
},
{
"name": "loading",
"description": "Add a loading animation to the dialog.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "not-close",
"description": "Remove the close button from the dialog.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "scroll",
"description": "Makes the content a maximum high and gives the possibility to overflow the content add scroll.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "lock-scroll",
"description": "When the dialog is opened, the page scroll is deleted.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "auto-width",
"description": "It makes the dialog have an automatic width to its content.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "not-padding",
"description": "Eliminates the padding of the base elements of the dialog.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "full-screen",
"description": "Makes the dialog the size of the window.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "overlay-blur",
"description": "Makes all elements blur when the dialog opens.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "shape",
"description": "Remove the border radius from the dialog.",
"default": "false",
"value": {
"type": "square",
"kind": "expression"
}
},
{
"name": "prevent-close",
"description": "It makes the dialog cannot be closed by clicking outside or by pressing the esc key.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "close",
"description": "triggers when the Dialog closes",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "default",
"description": "slot default of Dialog",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "header",
"description": "slot header of Dialog",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "footer",
"description": "slot footer of Dialog",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [
{
"name": "close",
"description": "triggers when the Dialog closes"
},
{
"name": "default",
"description": "slot default of Dialog"
},
{
"name": "header",
"description": "slot header of Dialog"
},
{
"name": "footer",
"description": "slot footer of Dialog"
}
],
"slots": [
{
"name": "default",
"description": "slot default of Dialog"
},
{
"name": "header",
"description": "slot header of Dialog"
},
{
"name": "footer",
"description": "slot footer of Dialog"
}
]
},
{
"name": "vs-input",
"attributes": [
{
"name": "v-model",
"description": "binding value",
"default": "null",
"value": {
"type": "String, Number",
"kind": "expression"
}
},
{
"name": "placeholder",
"description": "placeholder of Input",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "label",
"description": "a label above the component.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "label-float",
"description": "Add a placeholder converts to focus on a label.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "color",
"description": "Change component color.",
"default": "null",
"value": {
"type": "vuesax colors, RGB, HEX",
"kind": "expression"
}
},
{
"name": "state",
"description": "Change the background color of the component by changing its status.",
"default": "null",
"value": {
"type": "vuesax colors,RGB,HEX",
"kind": "expression"
}
},
{
"name": "progress",
"description": "progress bar starting in red and ending in green.",
"default": "null",
"value": {
"type": "0 - 100",
"kind": "expression"
}
},
{
"name": "loading",
"description": "Add a loading animation to the input.",
"default": "null",
"value": {
"type": "Boolean",
"kind": "expression"
}
},
{
"name": "type",
"description": "Change the type of input (html values).",
"default": "null",
"value": {
"type": "html type",
"kind": "expression"
}
},
{
"name": "border",
"description": "Change the style of the component.",
"default": "false",
"value": {
"type": "Boolean",
"kind": "expression"
}
},
{
"name": "shadow",
"description": "Change the style of the component.",
"default": "false",
"value": {
"type": "Boolean",
"kind": "expression"
}
},
{
"name": "icon-after",
"description": "suffix icon component",
"default": "false",
"value": {
"type": "Boolean",
"kind": "expression"
}
},
{
"name": "show-password",
"description": "If the input is of the password type, it is modified to show the password.",
"default": "false",
"value": {
"type": "boolean",
"kind": "expression"
}
},
{
"name": "icon",
"description": "Add an icon to the input.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "message",
"description": "Add an informative text below the input.",
"default": "null",
"value": {
"type": "message-success, message-danger, message-warn",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "icon",
"description": "Add an icon to the input."
},
{
"name": "message",
"description": "Add an informative text below the input."
}
]
},
{
"name": "vs-loading",
"attributes": [
{
"name": "type",
"description": "Change the animation of the loading.",
"default": "default",
"value": {
"type": "atom,ball,scale,waves,border,points,square,circles,corners,default,gradient,rectangle,square-rotate",
"kind": "expression"
}
},
{
"name": "color",
"description": "Change the color of the loading animation.",
"default": "primary",
"value": {
"type": "All colors of vuesax (RGB y HEX)",
"kind": "expression"
}
},
{
"name": "background",
"description": "Change the background color of the loading.",
"default": "'#fff'",
"value": {
"type": "All colors of vuesax (RGB y HEX)",
"kind": "expression"
}
},
{
"name": "text",
"description": "Add a text below the loading animation.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "percent",
"description": "Add a percentage text inside the loading.",
"default": "null",
"value": {
"type": "0 - 100 (%)",
"kind": "expression"
}
},
{
"name": "progress",
"description": "Add a progress bar to the loading and the progress would be the value.",
"default": "null",
"value": {
"type": "0 - 100",
"kind": "expression"
}
},
{
"name": "target",
"description": "Determine the parent of the loading where it will be instantiated.",
"default": "null",
"value": {
"type": "'String: Element Selector, HTMLElement: Selector element, Ref HTMLElement'",
"kind": "expression"
}
},
{
"name": "opacity",
"description": "Change the opacity of the background.",
"default": "'0.6'",
"value": {
"type": "0 - 1",
"kind": "expression"
}
},
{
"name": "scale",
"description": "Change the size of the loading animation.",
"default": "'1'",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "setPercent",
"description": "Change the value of the percent after instantiating the loading.",
"default": "null",
"value": {
"type": "'(percent: Number) => void'",
"kind": "expression"
}
},
{
"name": "setProgress",
"description": "Change the value of the progress after instantiating the loading.",
"default": "null",
"value": {
"type": "'(progress: Number) => void'",
"kind": "expression"
}
},
{
"name": "setText",
"description": "Change the value of the text property after instantiating the loading.",
"default": "null",
"value": {
"type": "'(text: String) => void'",
"kind": "expression"
}
}
],
"events": [],
"slots": []
},
{
"name": "vs-navbar",
"attributes": [
{
"name": "fixed",
"description": "Defines if the component is fixed on the screen.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "shadow",
"description": "Add a shadow to the component.",
"default": "primary",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "shadow-scroll",
"description": "Add functionality to add shadow to component when scrollTop is more than 0.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "hide-scroll",
"description": "Add the functionality to hide and show the component based on whether the scroll is lowered or raised.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "textWhite",
"description": "Change the text color of items to white.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "square",
"description": "Change the border radius to 0 by making the component square.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "padding-scroll",
"description": "Determines if the component has padding and the user scrolling is removed making an effect.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "not-line",
"description": "Delete the active line in the component.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "left-collapsed",
"description": "Add the functionality that when the elements of this slot cannot be correctly they are visually removed.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "center-collapsed",
"description": "Add the functionality that when the elements of this slot cannot be correctly they are visually removed.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "right-collapsed",
"description": "Add the functionality that when the elements of this slot cannot be correctly they are visually removed.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "target-scroll",
"description": "Determines the element to which the scroll event will be requested.",
"default": "document",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "item:active",
"description": "Determines if the component is in active status.",
"default": "false",
"value": {
"type": "true, false",
"kind": "expression"
}
},
{
"name": "item:to",
"description": "Use vue-router to generate a new view based on the supplied string.",
"default": "false",
"value": {
"type": "vue-router RouteLocationRaw",
"kind": "expression"
}
},
{
"name": "item:to",
"description": "Use vue-router to generate a new view based on the supplied string.",
"default": "false",
"value": {
"type": "vue-router RouteLocationRaw",
"kind": "expression"
}
},
{
"name": "item:link",
"description": "Use to navigate the site",
"default": "false",
"value": {
"type": "NavLink",
"kind": "expression"
}
},
{
"name": "default",
"description": "Add the elements in the center of the component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "left",
"description": "Add the elements on the left side of the component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
},
{
"name": "right",
"description": "Add the elements on the right side of the component.",
"default": "null",
"value": {
"type": "null",
"kind": "expression"
}
}
],
"events": [],
"slots": [
{
"name": "default",
"description": "Add the elements in the center of the component."
},
{
"name": "left",
"description": "Add the elements on the left side of the component."
},
{
"name": "right",
"description": "Add the elements on the right side of the component."
}
]
},
{
"name": "vs-notification",
"attributes": [
{
"name": "title",
"description": "Add a title to the notification.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "content",
"description": "Add the content to the notification.",
"default": "null",
"value": {
"type": "String, VNode",
"kind": "expression"
}
},
{
"name": "position",
"description": "Change the position of the component.",
"default": "bottom-right",
"value": {
"type": "bottom-right,top-right,top-center,top-left,bottom-left,bottom-center",
"kind": "expression"
}
},
{
"name": "color",
"description": "Change the base color of the entire component.",
"default": "null",
"value": {
"type": "vuesax colors, rgb, hex",
"kind": "expression"
}
},
{
"name": "border",
"description": "Add a color border to the notification.",
"default": "null",
"value": {
"type": "vuesax colors, rgb, hex",
"kind": "expression"
}
},
{
"name": "icon",
"description": "Add an icon to the notification.",
"default": "null",
"value": {
"type": "String",
"kind": "expression"
}
},
{
"name": "duration",
"description": "Determine the time until the notification is hidden (none determines not to hide).",
"default": "4500 (4.5s)",
"value": {
"type": "Number, none",
"kind": "expression"
}
},
{
"name": "onClick",
"description": "function that is executed by clicking on the notification.",
"default": "null",
"value": {
"type": "function",
"kind": "expression"
}
},
{
"name": "buttonClose",
"description": "Determine if the notification has the close button.",
"default": "true",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "flat",
"description": "Change the notification style to flat.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "onDestroy",
"description": "Function that is executed when the notification is destroyed.",
"default": "null",
"value": {
"type": "Function",
"kind": "expression"
}
},
{
"name": "sticky",
"description": "Change the position of the notification attached to the nearest corner.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "square",
"description": "Determine if the notification is square and remove the border-radius.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "width",
"description": "Determine the width of the notification.",
"default": "340px",
"value": {
"type": "100%, auto",
"kind": "expression"
}
},
{
"name": "loading",
"description": "Determine if the notification has a loading animation.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "progressAuto",
"description": "Add a progress bar to the notification.",
"default": "null",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "notPadding",
"description": "Remove padding from notification.",
"default": "20px",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name": "clickClose",
"description": "Determine if clicking on the notification closes.",
"default": "false",
"value": {
"type": "true,false",
"kind": "expression"
}
},
{
"name"