How to create a type for any string value that is located in array of objects by property name?

interface Icon {
    id: number,
    className: string,
    tags: string[]
}

const iconArr = [
  {
      id: 1,
      className: 'banana-class',
      tags: ['']
  },
  {
      id: 2,
      className: 'apple-class',
      tags: ['']
  }
];

I would like to create a type that will cause an error if any other value other than banana-class or apple-class is written.

In array of strings i would use type iconStringType = typeof iconStringArr[number], but in my case i have an array of objects.

Thanks!

I tried using:

type iconType = typeof iconArr[number]['className'];

but it doesn't work - it allows any string value.

First of all, you don't type you iconArr array so the type iconArr[number]['className'] is inferred as string regardless of your Icon interface.

This can easily be fixed by explicitly setting the Icon[] type like:

const iconArr: Icon[] = [
    ...
];

Then if you want to be strict on the allowed strings in your className you could create a union type 'banana-class' | 'apple-class' and use it in your Icon interface:

interface Icon {
    id: number,
    className: 'banana-class' | 'apple-class',
    tags: string[]
}

Now your type iconType = typeof iconArr[number]['className'] will evaluate to the union type you created.

Edit after clarification in comments:

If you want the Icon type inferred at runtime you can:

const iconArr = [
  {
      id: 1,
      className: 'banana-class' as const,
      tags: ['']
  },
  {
      id: 2,
      className: 'apple-class' as const,
      tags: ['']
  }
];

type Icon = typeof iconArr[number];

type iconType = typeof iconArr[number]['className'];

Defining e.g. 'apple-class' as const tells Typescript to infer the "narrowest type" which in your case is 'banana-class' | 'apple-class' (see docs)