@forter/form-section

fc-form-section

An element by Forter

Usage

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

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

Properties

Property	Attribute	Type	Default	Description
align	align	string		Alignment of the form section (row/column)
collapsable	collapsable	boolean	false	If the section is collapsable
collapse	collapse	boolean	false	If the section is currently collapsed
dirty	dirty	boolean	false	If the section is dirty
disabled	disabled	boolean	false	Internal Observables
invalidFields		never[]
isCollapsed		"right" | "down"
isSlottedLabel		"" | TemplateResult
label	label	"" | TemplateResult
missingRequiredFields		never[]
model		{}	{}
touched	touched	boolean	false	If the section was touched
valid	valid	boolean	false	If the section is valid

Events

Event
field-added

CSS Custom Properties

Property	Description
--fc-form-section-arrow-color	section label arrow color (when section is collapsable) . default: "var(--fc-gray-700)"
--fc-form-section-color	section font color. default: "balck"
--fc-form-section-label-font-size	section label font size. default: "12px"
--fc-form-section-label-font-weight	section label font weight. default: "normal"
--fc-form-section-label-invalid-color	section label color when the section is invalid. default: "var(--fc-red-900)"
--fc-form-section-label-margin-bottom	section label margin bottom. default: "0px"
--fc-form-section-margin-right-item	section margin right of each field (row alignment only). default: "20px"
--fc-form-section-padding-left	section padding left. default: "5px"