data()

in src/components/base/form/form_fields/form_fields.stories.js [18:59]


  data() {
    return {
      // why: We declare fields here so that we can test what binding the
      //      "confirmPassword" validator to "this.formValues" would act
      //      like. In most cases, these can be constant and injected through
      //      `$options`.
      fields: {
        USERNAME: {
          label: 'NAME (ALL CAPS)',
          mapValue: (x) => x?.toUpperCase(),
          validators: [required('NAME IS REQUIRED!!!')],
        },
        password: {
          label: 'Password with group styling',
          inputAttrs: { type: 'password' },
          groupAttrs: { class: 'gl-bg-purple-50 gl-w-20' },
          validators: [required('Password is required')],
        },
        confirmPassword: {
          label: 'Confirm Password',
          inputAttrs: { type: 'password' },
          validators: [
            required('Confirmed password is required'),
            (confirmValue) =>
              confirmValue !== this.formValues.password ? 'Must match password' : '',
          ],
        },
        custom: {
          label: 'Custom input',
          mapValue: mapToNumber,
          validators: [(val) => (val < 1 ? 'Please click this at least once :)' : '')],
        },
        favoriteItem: {
          label: 'Favorite Item (Optional)',
        },
      },
      formValues: {},
      testFormId: uniqueId('form_fields_story_'),
      serverValidations: {},
      loading: false,
    };
  },