import{_ as o,C as t,o as p,c as r,k as a,a as s,H as n,Q as e}from"./chunks/framework.4313453f.js";const B=JSON.parse('{"title":"Input","description":"","frontmatter":{},"headers":[],"relativePath":"references/input.md","filePath":"references/input.md","lastUpdated":null}'),c={name:"references/input.md"},d=e(`

Input ​

Input elements allow users to enter text or data. They are commonly used in forms and text entry fields to gather user input.

Input inherit from VisualElement and BasicElement

Properties ​

PropertyTypeDescription
valuestringThe current text inside the input field.
cursorIndexnumberPosition of the cursor within the text.
scrollIndexnumberThe index from which the visible text starts, useful for longer inputs.
inputLimitnumberMaximum number of characters the input field can accept.
inputTypestringDefines the nature of input, e.g., 'text', 'password', 'number'.
placeholderTextstringPlaceholder text, which is beeing displayed when there's no value.
placeholderColorcolorText color for placedholder text.
placeholderBackgroundcolorBackground color for placeholder text.

Events ​

MethodReturnsDescription
onChangeselfGets triggered as soon as the value changes.

Methods ​

MethodReturnsDescription
setPlaceholderselfChanges placeholder text, color and background.
getPlaceholdermultipleReturns placeholder text, color and background.

Example ​

Click to see example
lua
local main = basalt.getMainFrame()
local userInput = main:addInput()

userInput:setInputLimit(12)
userInput:setInputType("password")
local main = basalt.getMainFrame()
local userInput = main:addInput()

userInput:setInputLimit(12)
userInput:setInputType("password")
`,11),i={id:"onchange",tabindex:"-1"},h=a("a",{class:"header-anchor",href:"#onchange","aria-label":'Permalink to "onChange "'},"​",-1),y=e(`

Registers a new custom event listener which triggers on value change.

Parameters ​

  1. function - The function to call when the event triggers.

Returns ​

  1. self - The element itself.
Click to see example
lua
local main = basalt.getMainFrame()
local input = main:addInput()

local function valueChange(self, value)
    basalt.debug("Value has changed to "..value)
end

input:onChange(valueChange)
local main = basalt.getMainFrame()
local input = main:addInput()

local function valueChange(self, value)
    basalt.debug("Value has changed to "..value)
end

input:onChange(valueChange)
`,6),E={id:"setplaceholder",tabindex:"-1"},u=a("a",{class:"header-anchor",href:"#setplaceholder","aria-label":'Permalink to "setPlaceholder "'},"​",-1),m=e(`

Changes the placeholder text, color and background.

Parameters ​

  1. string - The placeholder text.
  2. color? - The text color of the placeholder text.
  3. color? - The background color.

Returns ​

  1. self - The element itself.
Click to see example
lua
local main = basalt.getMainFrame()
main:addInput():setPlaceholder("...", colors.gray)
local main = basalt.getMainFrame()
main:addInput():setPlaceholder("...", colors.gray)
`,6),g={id:"getplaceholder",tabindex:"-1"},F=a("a",{class:"header-anchor",href:"#getplaceholder","aria-label":'Permalink to "getPlaceholder "'},"​",-1),C=e(`

Returns the placeholder text, color and background.

Returns ​

  1. string - The placeholder text.
  2. color - The text color of the placeholder text.
  3. color - The background color.
Click to see example
lua
local main = basalt.getMainFrame()
local input = main:addInput():setPlaceholder("...", colors.gray)
basalt.debug(input:getPlaceholder())
local main = basalt.getMainFrame()
local input = main:addInput():setPlaceholder("...", colors.gray)
basalt.debug(input:getPlaceholder())
`,4);function b(_,f,x,k,P,v){const l=t("C");return p(),r("div",null,[d,a("h2",i,[s("onChange "),n(l,{content:"onChange"}),s(),h]),y,a("h2",E,[s("setPlaceholder "),n(l,{content:"setPlaceholder"}),s(),u]),m,a("h2",g,[s("getPlaceholder "),n(l,{content:"getPlaceholder"}),s(),F]),C])}const q=o(c,[["render",b]]);export{B as __pageData,q as default};