`<c-message>`

Examples

Basic

Vue

React

Angular

TypeScript

<template>
  <div class="example-row">
    <c-message hint="Use your organization email address" />

    <c-message :valid.prop="false" error-message="Email is required" />
  </div>
</template>

API reference

`<c-message>`

Properties

Property	Attribute	Type	Default	Description
`errorMessage`	`error-message`	`string`	`''`	Error message shown in place of the hint while the parent is invalid
`hint`	`hint`	`string`	`''`	Hint text for the input
`inputId`	`input-id`	`string`	`''`	Id of the related input element
`valid`	`valid`	`boolean`	`true`	Parent validíty

CSS parts

Style from outside with c-message::part(name) — parts are the library's only styling customization API.

Part	Description
`root`	The message row showing the hint or error message text