[PM-8803] Edit Custom Fields (#10054)

* initial add of custom fields

* add fields for custom field

* integrate custom field into cipher form service for text fields

* add hidden field type

* add boolean custom field

* add linked option type

* add testids for automated testing

* add edit option for each custom field

* update dialog component name to match add/edit nature

* add delete button for fields

* initial add of drag and drop

* collect tailwind styles from vault components

* add drag and drop functionality with announcement

* add reorder via keyboard

* update tests to match functionality

* account for partial edit of custom fields

* fix change detection for new fields

* add label's to the edit/reorder translations

* update dynamic heading to be inline

* add validation/required for field label

* disable toggle button on hidden fields when the user cannot view passwords

* remove the need for passing `updatedCipherView` by only using a single instance of `CustomFieldsComponent`

* lint fix

* use bitLink styles rather than manually defining tailwind classes

* use submit action, no duplicated button and allows for form submission via enter

* add documentation for `newField`

libs/vault/src/cipher-form/components/additional-options/additional-options-section.component.html

@@ -13,8 +13,17 @@
       <bit-label>{{ "passwordPrompt" | i18n }}</bit-label>
     </bit-form-control>
 
-    <!-- TODO: Add "+ Add Field" button for Custom Fields - PM-8803 -->
+    <button
+      bitLink
+      type="button"
+      linkType="primary"
+      *ngIf="!hasCustomFields && !isPartialEdit"
+      (click)="addCustomField()"
+    >
+      <i class="bwi bwi-plus tw-font-bold" aria-hidden="true"></i>
+      {{ "addField" | i18n }}
+    </button>
   </bit-card>
 </bit-section>
 
-<!-- TODO: Add Custom Fields section component - PM-8803 -->
+<vault-custom-fields (numberOfFieldsChange)="handleCustomFieldChange($event)"></vault-custom-fields>