@forter/form-field

1.15.2 • Public • Published

fc-form-field

An element that contained field by different types

Usage

<script>
   import '@forter/form-field';
</script>

<fc-form-field>
</fc-form-field>

Examples

<!-- field options -->
<fc-form-field type="
" .options="${['foo','bar']}"></fc-form-field>
<!-- input with warning -->
<fc-form-field type="number" label="foo" warning="Low Amount"></fc-form-field>
<!-- select with warning -->
<fc-form-field type="dropdown" label="foo" warning="Low Amount"></fc-form-field>

Properties

Property Attribute Type Default Description
allowOtherOption allow-other-option string The additional "other" value in case of fields with multiple options that allow adding custom value
boldable boldable boolean false If the field is boldable
chipsType chips-type boolean Type of the chips (example: "more")
clearable clearable boolean false If the field is clearable
currencysymbol currencysymbol string Currency symbol to show in currency type input field (example: "$", "₪")
dirty dirty boolean false If the field is dirty
disabled disabled boolean false If the field is disabled
extended extended boolean false If fc-input width should be extended
hideResize hideResize boolean false If hide resize in textarea
label label string Label of the field
max max number Validate minimum of number value
maxlength maxlength number Validate maxlength of string value
menu menu boolean Whether or not the chips menu is enabled
min min number Validate minimum of number value
minlength minlength number Validate minimum length of string value
options options any[]
otherOptionValue other-option-value string The additional "other" value in case of fields with multiple options that allow adding custom value
path path string Path of the the field what will be set on the fc-form model (example: "user.firstName", "user.email")
pattern pattern any[] Pattern validation
placeholder placeholder string Placeholder in case of input types when no value
readonly readonly boolean false If the field is readonly
renderErrorMessage "" | TemplateResult[]
required required string Setter for single value field
rows rows boolean "2" Rows in textarea
singleSelection single-selection boolean false If multi field allow choosing only single value
type type "number" | "text" | "tags" | "dropdown" | "date" | "button-group" | "currency" | "select" | "textarea" | "chips" | "segmented-control" | "radio-group" "text" Type of the field - can be existing types such as: text, number, tags, dropdown or name of the type in the 'custom-renderers' object passed to fc-form.
valid valid boolean true Internal Observables
validations validations any[] List of the validation name to run when value is changed
value value string Setter for single value field
values values any[] Setter for multi values field
warning warning "" | TemplateResult

Events

Event
field-removed

CSS Custom Properties

Property Description
--fc-form-field-disabled-color disabled color. example: gray

Package Sidebar

Install

npm i @forter/form-field

Weekly Downloads

3

Version

1.15.2

License

Apache-2.0

Unpacked Size

239 kB

Total Files

167

Last publish

Collaborators

  • forter-npm
  • lirown
  • oweingart