score:1

Accepted answer
fontsize?: 'xs' | 'sm' | 'md' | 'lg';

one of the possible values here is undefined, due to the ? which makes it optional. but undefined can't be the key of an object, so when you try to make a record with these as the keys, typescript complains.

you can exclude undefined by using nonnullable:

export const fontsize: record<nonnullable<iconprops['fontsize']>, string> = {
  xs: '14px',
  sm: '16px',
  md: '18px',
  lg: '24px',
};

or if you prefer, exclude is another option:

export const fontsize: record<exclude<iconprops['fontsize'], undefined>, string> = {
  xs: '14px',
  sm: '16px',
  md: '18px',
  lg: '24px',
};

playground link

score:1

iconprops['fontsize'] is optional. it means the value could be undefined. however, undefined could not be a key of the object. you can use required to exclude the undefined situation of iconprops.

export const fontsize: record<required<iconprops>['fontsize'], string> = {
  xs: '14px',
  sm: '16px',
  md: '18px',
  lg: '24px',
};

Related Query

More Query from same tag