I have created the following types “hierarchy” in a ReactJS app (using latest TypeScript 5.5):

export enum RolePermissionEnum {
    View = "role.view",
    ViewAll = "role.view.all",
    Create = "role.create",
    Edit = "role.edit",
    EditAll = "role.edit.all",
    Delete = "role.delete",
    DeleteAll = "role.delete.all",
}

export type EnumTypes = {
    ...other keys...

    RolePermission: RolePermissionEnum;

    ...other keys...
}

export type Enums = {
    types: EnumTypes;
    ...other keys...
}

Then, in my application, I have an object

const enums: Enums = ...

The problem is, the IDE (PHPStorm, if that is relevant), gives me an error on this line

const canWrite = canCreateOrEdit(
    readonly,
    role,
    useAuth().permissions,
    enums.types.RolePermission.Create // <-- error is here
);

And the error says

TS2339: Property Create does not exist on type RolePermissionEnum

However, it seems to me that the Create property does indeed exist on RolePermissionEnum as it was on my first declaration.

I also have checked that the code works, and if I console.log(enums.types.RolePermission.Create) I get "role.create" as I would have expected.

Finally, the error seems to “go away” if instead of enums.types.RolePermission.Create I write it as enums.types.RolePermission["Create"]; however, I have noticed that in this case I lose the autocomplete function of the IDE, so it seems “wrong”.

Why is enums.types.RolePermission.Create reported as an error, and how would I fix? Is the fix I found the correct one?