Function renderSurface

example/src/Examples/SurfaceExample.tsx:20–36

(index: number, mode: 'flat' | 'elevated')

  const elevationValues = isV3 ? Array.from({ length: 6 }) : v2Elevation;

  const renderSurface = (index: number, mode: 'flat' | 'elevated') => (
    <Surface
      key={index}
      style={[
        styles.surface,
        isV3 ? styles.v3Surface : { elevation: v2Elevation[index] },
      ]}
      mode={mode}
      {...(isV3 && { elevation: index as MD3Elevation })}
    >
      <Text variant="bodyLarge">
        {isV3
          ? `Elevation ${index === 1 ? '(default)' : ''} ${index}`
          : `${elevationValues[index]}`}
      </Text>
    </Surface>
  );

  return (
    <ScreenWrapper>