Group list item not clickable when group list field is within a group field

#1

I am adding a group field to an inline block and then adding a group list field in the group field like this…

{
    name: 'backgroundGradient',
    label: 'Background Gradient',
    component: 'group',
    fields: [
      {
        name: 'showGradient',
        label: 'Show Gradient',
        component: 'toggle',
      },
      {
        name: 'angle',
        label: 'Angle (In Degrees)',
        component: 'number',
      },
      {
        name: 'type',
        label: 'Type',
        component: 'select',
        options: [
          { label: 'Linear', value: 'linear' },
          { label: 'Radial', value: 'radial' },
        ],
      },
      {
        name: 'stops',
        label: 'Stops',
        component: 'group-list',
        defaultItem: {
          color: 'transparent',
          opacity: 1,
          position: 0,
        },
        itemProps: (item) => ({
          key: item.id,
          label: `${item.opacity} ${item.color} ${item.position}%`,
        }),
        fields: [
          {
            name: 'color',
            label: 'Color',
            component: 'select',
            options: themeColors,
          },
          {
            name: 'opacity',
            label: 'Opacity',
            component: 'number',
            step: 0.01,
          },
          {
            name: 'stopPosition',
            label: 'Stop Position (0 - 100)',
            component: 'number',
          },
        ],
      },
    ],
  },

I click to go into the background gradient group field. I add a “stop” group list item. It shows up in my list. But when I click the item, nothing happens. Any idea why this might be happening?

Edit: I found out that when adding more than one item, all items but the first item are clickable. I drag the last item to the top and the new first item is not clickable but the rest are.