Input Field

A component that displays a field to input a text.

Preview

Button Preview

Code Example

let model = InputFieldVM {
  $0.title = "Name"
  $0.placeholder = "Enter your name"
  $0.isRequired = true
  $0.submitType = .done
}

API

InputFieldVM Props

A model that defines the appearance properties for an input field component.

NameTypeDefaultDescription
autocapitalizationTextAutocapitalizationsentencesThe autocapitalization behavior for the input field.
colorComponentColor?nilThe color of the input field.
cornerRadiusComponentRadiusmediumThe corner radius of the input field.
fontUniversalFont?nilThe font used for the input field's text. If not provided, calculated automatically based on the input field's size.
isAutocorrectionEnabledBooltrueA Boolean value indicating whether autocorrection is enabled.
isEnabledBooltrueA Boolean value indicating whether the input field is enabled or disabled.
isRequiredBoolfalseA Boolean value indicating whether the input field is required.
isSecureInputBoolfalseA Boolean value indicating whether the input text should be hidden (e.g., passwords).
keyboardTypeUIKeyboardTypedefaultThe type of keyboard to display when the input field is active.
placeholderString?nilThe placeholder text displayed when there is no input.
sizeComponentSizemediumThe predefined size of the input field.
submitTypeSubmitTypereturnThe type of the submit button on the keyboard.
tintColorUniversalColoraccentThe tint color applied to the input field's cursor.
titleString?nilThe title displayed on the input field.

SUInputField

public init(
  text: Binding<String>,
  globalFocus: FocusState<FocusValue>.Binding,
  localFocus: FocusValue,
  model: InputFieldVM = .init()
)
public init(
  text: Binding<String>,
  isFocused: FocusState<Bool>.Binding,
  model: InputFieldVM = .init()
)

UKInputField

Initializers

public init(
  initialText: String = "",
  model: InputFieldVM = .init(),
  onValueChange: @escaping (String) -> Void = { _ in }
)

Public Properties

NameTypeDescription
onValueChange(String) -> VoidA closure that is triggered when the text changes.
modelInputFieldVMA model that defines the appearance properties.
textStringA text inputted in the field.

Public Subviews

NameTypeDescription
titleLabelUILabelA label that displays the title from the model.
textFieldUITextFieldAn underlying text field from the standard library.