Inline array improvements

[stuartromanek]

Summary

• Accessibility issues outlined in PRO-4430
• New UI/UX outlined in PRO-6267

Related PRs

• Testbed mods https://github.com/apostrophecms/testbed/pull/284
• Cypress tools mods https://github.com/apostrophecms/cypress-tools/pull/54
• Advanced Permissions mods https://github.com/apostrophecms/advanced-permission/pull/135

Tests

• Passing except for two failures unrelated to the work and seem to be everywhere https://github.com/apostrophecms/testbed/actions/runs/10635727714

What are the specific steps to test this change?

Sample fields

Simple inline array

contactInfoInline: {
  label: 'Contact information Inline',
  type: 'array',
  inline: true,
  titleField: 'city',
  fields: {
    add: {
      city: {
        type: 'string',
        label: 'String One'
      },
      email: {
        type: 'string',
        label: 'String Two'
      }
    }
  }
},

Inline array with no title field and an inner inline array

contactInfoInlineNoTitleField: {
  label: 'Contact information Inline',
  type: 'array',
  inline: true,
  fields: {
    add: {
      city: {
        type: 'string',
        label: 'City'
      },
      email: {
        type: 'email',
        label: 'Email address'
      },
      array: {
        type: 'array',
        label: 'Another Array',
        inline: true,
        titleField: 'city',
        whenEmpty: {
          label: 'Wowee!',
          icon: 'file-document-icon'
        },
        fields: {
          add: {
            city: {
              type: 'string',
              label: 'City'
            },
            email: {
              type: 'email',
              label: 'Email address'
            }
          }
        }
      }
    }
  }
},

Inline table

  contactInfoTable: {
    label: 'Contact information Table',
    type: 'array',
    inline: true,
    style: 'table',
    draggable: true,
    titleField: 'city',
    fields: {
      add: {
        city: {
          type: 'string',
          label: 'City'
        },
        email: {
          type: 'email',
          label: 'Email address'
        }
      }
    }
  },

1. Test the functionality and interactivity of the field configurations above

What kind of change does this PR introduce?

(Check at least one)

• Bug fix
• New feature
• Refactor
• Documentation
• Build-related changes
• Other

[ValJed]

Conflicts to resolve.
Some questions / feedback about style / perf

[stuartromanek]

was able to implement most feedback @ValJed

[stuartromanek]

tagging @haroun in on finishing this up as Val is out

[myovchev]

💯

addressed