UNPKG

@rxap/forms

Version:

This package provides a set of tools and directives to simplify working with Angular forms, including reactive forms, custom validators, and form directives for handling loading, submitting, and error states. It offers decorators for defining forms and co

342 lines (338 loc) 24.6 kB
'use strict'; customElements.define('compodoc-menu', class extends HTMLElement { constructor() { super(); this.isNormalMode = this.getAttribute('mode') === 'normal'; } connectedCallback() { this.render(this.isNormalMode); } render(isNormalMode) { let tp = lithtml.html(` <nav> <ul class="list"> <li class="title"> <a href="index.html" data-type="index-link">angular-forms</a> </li> <li class="divider"></li> ${ isNormalMode ? `<div id="book-search-input" role="search"><input type="text" placeholder="Type to search"></div>` : '' } <li class="chapter"> <a data-type="chapter-link" href="index.html"><span class="icon ion-ios-home"></span>Getting started</a> <ul class="links"> <li class="link"> <a href="overview.html" data-type="chapter-link"> <span class="icon ion-ios-keypad"></span>Overview </a> </li> <li class="link"> <a href="index.html" data-type="chapter-link"> <span class="icon ion-ios-paper"></span>README </a> </li> <li class="link"> <a href="changelog.html" data-type="chapter-link"> <span class="icon ion-ios-paper"></span>CHANGELOG </a> </li> <li class="link"> <a href="license.html" data-type="chapter-link"> <span class="icon ion-ios-paper"></span>LICENSE </a> </li> <li class="link"> <a href="dependencies.html" data-type="chapter-link"> <span class="icon ion-ios-list"></span>Dependencies </a> </li> <li class="link"> <a href="properties.html" data-type="chapter-link"> <span class="icon ion-ios-apps"></span>Properties </a> </li> </ul> </li> <li class="chapter modules"> <a data-type="chapter-link" href="modules.html"> <div class="menu-toggler linked" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#modules-links"' : 'data-bs-target="#xs-modules-links"' }> <span class="icon ion-ios-archive"></span> <span class="link-name">Modules</span> <span class="icon ion-ios-arrow-down"></span> </div> </a> <ul class="links collapse " ${ isNormalMode ? 'id="modules-links"' : 'id="xs-modules-links"' }> <li class="link"> <a href="modules/RxapFormsModule.html" data-type="entity-link" >RxapFormsModule</a> <li class="chapter inner"> <div class="simple menu-toggler" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#directives-links-module-RxapFormsModule-4e5ef4976b66d229877aa0a11f44952598fc15297b22a4b13c418bfdbe0a355740914f1ce57fb0aa96cda187cec0c9a298d2cb048faa0fd72504aeac01712ed2"' : 'data-bs-target="#xs-directives-links-module-RxapFormsModule-4e5ef4976b66d229877aa0a11f44952598fc15297b22a4b13c418bfdbe0a355740914f1ce57fb0aa96cda187cec0c9a298d2cb048faa0fd72504aeac01712ed2"' }> <span class="icon ion-md-code-working"></span> <span>Directives</span> <span class="icon ion-ios-arrow-down"></span> </div> <ul class="links collapse" ${ isNormalMode ? 'id="directives-links-module-RxapFormsModule-4e5ef4976b66d229877aa0a11f44952598fc15297b22a4b13c418bfdbe0a355740914f1ce57fb0aa96cda187cec0c9a298d2cb048faa0fd72504aeac01712ed2"' : 'id="xs-directives-links-module-RxapFormsModule-4e5ef4976b66d229877aa0a11f44952598fc15297b22a4b13c418bfdbe0a355740914f1ce57fb0aa96cda187cec0c9a298d2cb048faa0fd72504aeac01712ed2"' }> <li class="link"> <a href="directives/FormControlErrorDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" class="deprecated-name">FormControlErrorDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkDirtyDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormControlMarkDirtyDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkPristineDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormControlMarkPristineDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkTouchedDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormControlMarkTouchedDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkUntouchedDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormControlMarkUntouchedDirective</a> </li> <li class="link"> <a href="directives/FormControlNameDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" class="deprecated-name">FormControlNameDirective</a> </li> <li class="link"> <a href="directives/FormDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormDirective</a> </li> <li class="link"> <a href="directives/FormGroupNameDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" class="deprecated-name">FormGroupNameDirective</a> </li> <li class="link"> <a href="directives/FormLoadedDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormLoadedDirective</a> </li> <li class="link"> <a href="directives/FormLoadingDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormLoadingDirective</a> </li> <li class="link"> <a href="directives/FormLoadingErrorDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormLoadingErrorDirective</a> </li> <li class="link"> <a href="directives/FormSubmitDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormSubmitDirective</a> </li> <li class="link"> <a href="directives/FormSubmitFailedDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormSubmitFailedDirective</a> </li> <li class="link"> <a href="directives/FormSubmitInvalidDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormSubmitInvalidDirective</a> </li> <li class="link"> <a href="directives/FormSubmitSuccessfulDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormSubmitSuccessfulDirective</a> </li> <li class="link"> <a href="directives/FormSubmittingDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >FormSubmittingDirective</a> </li> <li class="link"> <a href="directives/ParentControlContainerDirective.html" data-type="entity-link" data-context="sub-entity" data-context-id="modules" >ParentControlContainerDirective</a> </li> </ul> </li> </li> </ul> </li> <li class="chapter"> <div class="simple menu-toggler" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#directives-links"' : 'data-bs-target="#xs-directives-links"' }> <span class="icon ion-md-code-working"></span> <span>Directives</span> <span class="icon ion-ios-arrow-down"></span> </div> <ul class="links collapse " ${ isNormalMode ? 'id="directives-links"' : 'id="xs-directives-links"' }> <li class="link"> <a href="directives/FormControlErrorDirective.html" data-type="entity-link" class="deprecated-name">FormControlErrorDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkDirtyDirective.html" data-type="entity-link" >FormControlMarkDirtyDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkPristineDirective.html" data-type="entity-link" >FormControlMarkPristineDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkTouchedDirective.html" data-type="entity-link" >FormControlMarkTouchedDirective</a> </li> <li class="link"> <a href="directives/FormControlMarkUntouchedDirective.html" data-type="entity-link" >FormControlMarkUntouchedDirective</a> </li> <li class="link"> <a href="directives/FormControlNameDirective.html" data-type="entity-link" class="deprecated-name">FormControlNameDirective</a> </li> <li class="link"> <a href="directives/FormDirective.html" data-type="entity-link" >FormDirective</a> </li> <li class="link"> <a href="directives/FormGroupNameDirective.html" data-type="entity-link" class="deprecated-name">FormGroupNameDirective</a> </li> <li class="link"> <a href="directives/FormLoadedDirective.html" data-type="entity-link" >FormLoadedDirective</a> </li> <li class="link"> <a href="directives/FormLoadingDirective.html" data-type="entity-link" >FormLoadingDirective</a> </li> <li class="link"> <a href="directives/FormLoadingErrorDirective.html" data-type="entity-link" >FormLoadingErrorDirective</a> </li> <li class="link"> <a href="directives/FormResetDirective.html" data-type="entity-link" >FormResetDirective</a> </li> <li class="link"> <a href="directives/FormSubmitDirective.html" data-type="entity-link" >FormSubmitDirective</a> </li> <li class="link"> <a href="directives/FormSubmitFailedDirective.html" data-type="entity-link" >FormSubmitFailedDirective</a> </li> <li class="link"> <a href="directives/FormSubmitInvalidDirective.html" data-type="entity-link" >FormSubmitInvalidDirective</a> </li> <li class="link"> <a href="directives/FormSubmitSuccessfulDirective.html" data-type="entity-link" >FormSubmitSuccessfulDirective</a> </li> <li class="link"> <a href="directives/FormSubmittingDirective.html" data-type="entity-link" >FormSubmittingDirective</a> </li> <li class="link"> <a href="directives/ParentControlContainerDirective.html" data-type="entity-link" >ParentControlContainerDirective</a> </li> </ul> </li> <li class="chapter"> <div class="simple menu-toggler" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#classes-links"' : 'data-bs-target="#xs-classes-links"' }> <span class="icon ion-ios-paper"></span> <span>Classes</span> <span class="icon ion-ios-arrow-down"></span> </div> <ul class="links collapse " ${ isNormalMode ? 'id="classes-links"' : 'id="xs-classes-links"' }> <li class="link"> <a href="classes/ControlValueAccessor.html" data-type="entity-link" >ControlValueAccessor</a> </li> <li class="link"> <a href="classes/FormArrayControlManager.html" data-type="entity-link" >FormArrayControlManager</a> </li> <li class="link"> <a href="classes/RxapFormArray.html" data-type="entity-link" >RxapFormArray</a> </li> <li class="link"> <a href="classes/RxapFormBuilder.html" data-type="entity-link" >RxapFormBuilder</a> </li> <li class="link"> <a href="classes/RxapFormControl.html" data-type="entity-link" >RxapFormControl</a> </li> <li class="link"> <a href="classes/RxapFormGroup.html" data-type="entity-link" >RxapFormGroup</a> </li> </ul> </li> <li class="chapter"> <div class="simple menu-toggler" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#interfaces-links"' : 'data-bs-target="#xs-interfaces-links"' }> <span class="icon ion-md-information-circle-outline"></span> <span>Interfaces</span> <span class="icon ion-ios-arrow-down"></span> </div> <ul class="links collapse " ${ isNormalMode ? ' id="interfaces-links"' : 'id="xs-interfaces-links"' }> <li class="link"> <a href="interfaces/AbstractControl.html" data-type="entity-link" >AbstractControl</a> </li> <li class="link"> <a href="interfaces/AbstractControlOptions.html" data-type="entity-link" >AbstractControlOptions</a> </li> <li class="link"> <a href="interfaces/BoxedValue.html" data-type="entity-link" >BoxedValue</a> </li> <li class="link"> <a href="interfaces/ComplexityOptions.html" data-type="entity-link" >ComplexityOptions</a> </li> <li class="link"> <a href="interfaces/ControlOptions.html" data-type="entity-link" >ControlOptions</a> </li> <li class="link"> <a href="interfaces/ControlSetValueOptions.html" data-type="entity-link" >ControlSetValueOptions</a> </li> <li class="link"> <a href="interfaces/FormArrayOptions.html" data-type="entity-link" >FormArrayOptions</a> </li> <li class="link"> <a href="interfaces/FormDefinition.html" data-type="entity-link" >FormDefinition</a> </li> <li class="link"> <a href="interfaces/FormDefinitionArray.html" data-type="entity-link" >FormDefinitionArray</a> </li> <li class="link"> <a href="interfaces/FormDefinitionMetadata.html" data-type="entity-link" >FormDefinitionMetadata</a> </li> <li class="link"> <a href="interfaces/FormGroupOptions.html" data-type="entity-link" >FormGroupOptions</a> </li> <li class="link"> <a href="interfaces/FormLoadFailedMethod.html" data-type="entity-link" >FormLoadFailedMethod</a> </li> <li class="link"> <a href="interfaces/FormLoadMethod.html" data-type="entity-link" >FormLoadMethod</a> </li> <li class="link"> <a href="interfaces/FormLoadSuccessfulMethod.html" data-type="entity-link" >FormLoadSuccessfulMethod</a> </li> <li class="link"> <a href="interfaces/FormOptions.html" data-type="entity-link" >FormOptions</a> </li> <li class="link"> <a href="interfaces/FormSubmitFailedMethod.html" data-type="entity-link" >FormSubmitFailedMethod</a> </li> <li class="link"> <a href="interfaces/FormSubmitMethod.html" data-type="entity-link" >FormSubmitMethod</a> </li> <li class="link"> <a href="interfaces/FormSubmitSuccessfulMethod.html" data-type="entity-link" >FormSubmitSuccessfulMethod</a> </li> <li class="link"> <a href="interfaces/InjectableValidator.html" data-type="entity-link" >InjectableValidator</a> </li> <li class="link"> <a href="interfaces/IsNumberOptions.html" data-type="entity-link" >IsNumberOptions</a> </li> <li class="link"> <a href="interfaces/LengthOptions.html" data-type="entity-link" >LengthOptions</a> </li> <li class="link"> <a href="interfaces/NgValidatorsErrors.html" data-type="entity-link" >NgValidatorsErrors</a> </li> <li class="link"> <a href="interfaces/RegexOptions.html" data-type="entity-link" >RegexOptions</a> </li> <li class="link"> <a href="interfaces/RxapAbstractControlOptionsWithDefinition.html" data-type="entity-link" >RxapAbstractControlOptionsWithDefinition</a> </li> </ul> </li> <li class="chapter"> <div class="simple menu-toggler" data-bs-toggle="collapse" ${ isNormalMode ? 'data-bs-target="#miscellaneous-links"' : 'data-bs-target="#xs-miscellaneous-links"' }> <span class="icon ion-ios-cube"></span> <span>Miscellaneous</span> <span class="icon ion-ios-arrow-down"></span> </div> <ul class="links collapse " ${ isNormalMode ? 'id="miscellaneous-links"' : 'id="xs-miscellaneous-links"' }> <li class="link"> <a href="miscellaneous/enumerations.html" data-type="entity-link">Enums</a> </li> <li class="link"> <a href="miscellaneous/functions.html" data-type="entity-link">Functions</a> </li> <li class="link"> <a href="miscellaneous/typealiases.html" data-type="entity-link">Type aliases</a> </li> <li class="link"> <a href="miscellaneous/variables.html" data-type="entity-link">Variables</a> </li> </ul> </li> <li class="divider"></li> <li class="copyright"> Documentation generated using <a href="https://compodoc.app/" target="_blank" rel="noopener noreferrer"> <img data-src="images/compodoc-vectorise.png" class="img-responsive" data-type="compodoc-logo"> </a> </li> </ul> </nav> `); this.innerHTML = tp.strings; } });