hb-input-area — input-area

Category: inputs
Tags: inputs

What it does

Multi-line <textarea> with Bulma textarea + optional is-success / is-danger and help is-danger. Same schemaentry validation as text (validationRegex, params min/max, required). Theme via --bulma-* on :host. Dispatches setVal and clickEnter when Enter is pressed without Shift (Shift+Enter inserts a newline).

Styling (Bulma)

Bundles Bulma 1.x form/shared, form/input-textarea, and form/tools in the shadow root.

Custom element

hb-input-area

Attributes (snake_case; use string values in HTML)

• id — optional string
• style — optional string
• schemaentry — required string (JSON: id, label?, placeholder?, required?, value?, validationTip?, validationRegex?, params?)
• show_validation — optional "yes" | "no"

Events

• setVal — { value: string; valid: boolean; id: string }
• clickEnter — { value: string; valid: boolean; id?: string }

Usage notes

CSS parts: invalid-feedback, input. Nested schemaentry fields follow the shared form-schema shape used by hb-form.

Minimal HTML example

<hb-input-area
  schemaentry="{&quot;id&quot;:&quot;notes&quot;,&quot;label&quot;:&quot;Notes&quot;,&quot;placeholder&quot;:&quot;Type here…&quot;}"
  show_validation="no"
></hb-input-area>