{
    "Neptune button information": {
        "scope": "html",
        "prefix": "neptune-input",
        "body": [
            "<div class=\"input-box\">",
            "   <label class=\"text-m\" for=\"default-input\">Input:</label>",
            "   <div class=\"input-field\">",
            "       <span class=\"input-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <input type=\"text\" name=\"default-input\" id=\"default-input\" placeholder=\"Default input\">",
            "   </div>",
            "   <span class=\"text-s input-validation\">",
            "       ${2:Validation text}",
            "   </span>",
            "</div>"
        ],
        "description": "Information button"
    },
    "Neptune password input": {
        "scope": "html",
        "prefix": "neptune-pw-input",
        "body": [
            "<div class=\"input-box password-input-box\">",
            "   <label class=\"text-m\" for=\"password-input\">Password:</label>",
            "   <div class=\"input-field password-input-field\">",
            "       <span class=\"input-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <input type=\"password\" name=\"password-input\" id=\"password-input\" placeholder=\"Password\">",
            "       <button class=\"show-password-button\" id=\"show-password-button\" onclick=\"showPassword()\">",
            "       <span class=\"button-icon\" id=\"show-password-button-icon\">",
            "           ${2:Your Icon}",
            "       </span>",
            "       </button",
            "   </div>",
            "   <span class=\"text-s input-validation\">",
            "       ${3:Validation Message}",
            "   </span>",
            "</div>",
        ],
        "description": "Password input"
    },
    "Neptune search bar": {
        "scope": "html",
        "prefix": "neptune-search-bar",
        "body": [
            "<div class=\"searchbar-box\">",
            "   <input type=\"text\" class=\"searchbar\" name=\"searchbar\" id=\"mySearchbar\" placeholder=\"Search\">",
            "   <button class=\"search-button\">",
            "       <span class=\"button-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "   </button>",
            "</div>",
        ],
        "description": "Search Bar"
    },
    "Neptune select input": {
        "scope": "html",
        "prefix": "neptune-select",
        "body": [
            "<div class=\"select-box\" id=\"mySelect\">",
            "   <span class=\"text-l\">Select</span>",
            "   <select class=\"hidden-select\">",
            "       <option value=\"null\">Select</option>",
            "       <option value=\"1\">Value 1</option>",
            "       <option value=\"2\">Value 2</option>",
            "       <option value=\"3\">Value 3</option>",
            "   </select>",
            "</div>",
        ],
        "description": "Select Input"
    },
    "Neptune pin input": {
        "scope": "html",
        "prefix": "neptune-pin-input",
        "body": [
            "<div class=\"digit-box\">",
            "   <div class=\"digit-field-group\">",
            "       <input type=\"number\" class=\"digit-field\" name=\"digit1\" id=\"digit1\">",
            "       <input type=\"number\" class=\"digit-field\" name=\"digit2\" id=\"digit2\">",
            "       <input type=\"number\" class=\"digit-field\" name=\"digit3\" id=\"digit3\">",
            "       <input type=\"number\" class=\"digit-field\" name=\"digit4\" id=\"digit4\">",
            "   </div>",
            "   <button type=\"submit\" class=\"button-m submit-button button-primary\" id=\"submit-digits-button\" name=\"auth-button\">",
            "       <span class=\"button-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <span class\"button-text\">",
            "           Authenticate",
            "       </span>",
            "   </button",
            "</div>",
        ],
        "description": "PIN Input"
    },
    "Neptune email input": {
        "scope": "html",
        "prefix": "neptune-email-input",
        "body": [
            "<div class=\"input-box email-box\">",
            "   <label class=\"text-m\" for=\"email-input\">Email:</label>",
            "   <div class=\"input-field\">",
            "       <span class=\"input-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <input type=\"email\" inputmode=\"email\" name=\"email-input\" id=\"email-input\" placeholder=\"mail@example.com\">",
            "   </div",
            "   <span class=\"text-s input-validation\">",
            "       ${2:Validation Message}",
            "   </span>",
            "</div>",
        ],
        "description": "Email input"
    },
    "Neptune phone input": {
        "scope": "html",
        "prefix": "neptune-phone-input",
        "body": [
            "<div class=\"input-box phone-box\">",
            "   <label class=\"text-m\" for=\"phone-input\">Email:</label>",
            "   <div class=\"input-field\">",
            "       <span class=\"input-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <input type=\"tel\" inputmode=\"tel\" name=\"phone-input\" id=\"phone-input\" placeholder=\"+01 234 56789\">",
            "   </div",
            "   <span class=\"text-s input-validation\">",
            "       ${2:Validation Message}",
            "   </span>",
            "</div>",
        ],
        "description": "Phone input"
    },
    "Neptune url input": {
        "scope": "html",
        "prefix": "neptune-url-input",
        "body": [
            "<div class=\"input-box url-box\">",
            "   <label class=\"text-m\" for=\"url-input\">URL:</label>",
            "   <div class=\"input-field\">",
            "       <span class=\"input-icon\">",
            "           ${1:Your Icon}",
            "       </span>",
            "       <input type=\"url\" inputmode=\"url\" name=\"url-input\" id=\"url-input\" placeholder=\"https://yourdomain.com\">",
            "   </div",
            "   <span class=\"text-s input-validation\">",
            "       ${2:Validation Message}",
            "   </span>",
            "</div>",
        ],
        "description": "URL input"
    },
    "Neptune checkbox": {
        "scope": "html",
        "prefix": "neptune-checkbox",
        "body": [
            "<div class=\"input-box checkbox-box\">",
            "   <input type=\"checkbox\" class=\"checkbox checkbox-${2:Style}\" name=\"default-checkbox\" id=\"default-checkbox\">",
            "   <label class=\"checkbox-label\" for=\"default-checkbox\" id=\"default-checkbox-label\">",
            "       ${2:Checkbox Text}",
            "   </label>",
            "</div",
        ],
        "description": "Checkbox"
    },
    "Neptune radio button": {
        "scope": "html",
        "prefix": "neptune-radio-button",
        "body": [
            "<div class=\"input-box radio-box\">",
            "   <input type=\"radio\" class=\"radio-button radio-button-${1:Style}\" name=\"radio-button-primary\" id=\"radio-button-primary\">",
            "   <label for=\"radio-button-${1:Style}\" class=\"radio-button-label\">",
            "       ${2:Label Text}",
            "   </label>",
            "</div>",
        ],
        "description": "Radio Button"
    }
}