Repository: strapi/strapi
File: packages/core/content-type-builder/admin/src/components/AttributeRow.tsx (TypeScript)

Code before:
                    style={{
                      transform: `rotate(${isOpen ? '0deg' : '-90deg'})`,
                      transition: 'transform 0.5s',
                    }}
                  />
                </IconButton>
              )}
              {isInDevelopmentMode && item.configurable !== false ? (
                <>
                  {!isMorph && (
                    <IconButton
                      onClick={handleClick}
                      onKeyDown={handleEditKeyDown}
                      label={`${formatMessage({
                        id: 'app.utils.edit',
                        defaultMessage: 'Edit',
                      })} ${item.name}`}
                      variant="ghost"
                      disabled={!canEdit}
                    >
                      <Pencil />
                    </IconButton>
                  )}
                  <IconButton
                    onClick={handleDelete}
                    onKeyDown={handleDeleteKeyDown}
                    label={`${formatMessage({
                      id: 'global.delete',
                      defaultMessage: 'Delete',
                    })} ${item.name}`}
                    variant="ghost"
                    disabled={!canDelete}
                  >
                    <Trash />
                  </IconButton>
                  <Dialog.Root open={showConfirmDialog} onOpenChange={setShowConfirmDialog}>
                    <ConfirmDialog onConfirm={handleConfirmDelete} onCancel={handleCancelDelete}>
                      <Box>
                        <Typography>
                          {formatMessage({
                            id: getTrad(
                              'popUpWarning.bodyMessage.delete-attribute-with-conditions'
                            ),
                            defaultMessage:
                              'The following fields have conditions that depend on this field: ',
                          })}
                          <Typography fontWeight="bold">
                            {checkDependentRows(contentTypes, item.name)
                              .map(({ attribute }) => attribute)
                              .join(', ')}
                          </Typography>

Review comment (suggestion):
Are you sure this is needed, like any other button of the admin, it is rendering a semantic `button` html element. It should be working already for both IconButton edit and delete.

Code after:
                        id: 'app.utils.edit',
                        defaultMessage: 'Edit',
                      })} ${item.name}`}
                      variant="ghost"
                      disabled={!canEdit}
                    >
                      <Pencil />
                    </IconButton>
                  )}
                  <IconButton
                    onClick={handleDelete}
                    label={`${formatMessage({
                      id: 'global.delete',
                      defaultMessage: 'Delete',
                    })} ${item.name}`}
                    variant="ghost"
                    disabled={!canDelete}
                  >
                    <Trash />
                  </IconButton>
                  <Dialog.Root open={showConfirmDialog} onOpenChange={setShowConfirmDialog}>
                    <ConfirmDialog onConfirm={handleConfirmDelete} onCancel={handleCancelDelete}>
                      <Box>
                        <Typography>
                          {formatMessage({
                            id: getTrad(
                              'popUpWarning.bodyMessage.delete-attribute-with-conditions'
                            ),
                            defaultMessage:
                              'The following fields have conditions that depend on this field: ',
                          })}
                          <Typography fontWeight="bold">
                            {checkDependentRows(contentTypes, item.name)
                              .map(({ attribute }) => attribute)
                              .join(', ')}
                          </Typography>
                          {formatMessage({
                            id: getTrad(
                              'popUpWarning.bodyMessage.delete-attribute-with-conditions-end'
                            ),
                            defaultMessage: '. Are you sure you want to delete it?',
                          })}
                        </Typography>
                      </Box>
                    </ConfirmDialog>
                  </Dialog.Root>
                </>
              ) : (
                <Flex padding={2}>
                  <Lock fill="neutral500" />
                </Flex>