How to show specific shipping method only for certain shipping class?

In our WooCommerce shop we use wp-blocks scheme for the cart and checkout page.

What I would like to achieve is:

• Show specific shipping method only for certain shipping class (or group of products) and hide other methods.

I tried to achieve it using JQuery, but since blocks are React block, the scripts were not applied.

I used this php method to get info if the products from the cart are only from 'my-custom-shipping-class' shipping class. If the answer is true, then I would like to show only one specific shipping (let's say 'shipping-method-1') method and hide others. If the answer is false, I would like to show all the mothods, except the 'shipping-method-1'.

function show_shipping_method() {
    $slug = 'my-custom-shipping-class';
    global $woocommerce;
    $product_in_cart = false;
    $other_product_in_cart = false;
    foreach ($woocommerce->cart->get_cart() as $cart_item_key => $values) {
        $_product = $values['data'];
        $terms    = get_the_terms($_product->id, 'product_shipping_class');
        if ($terms) {
            foreach ($terms as $term) {
                $_shippingclass = $term->slug;
                if ($slug === $_shippingclass) {
                    $product_in_cart = true;
                } else {
                    $other_product_in_cart = true;
                }
            }
        } else {
            $other_product_in_cart = true;
        }
    }
    return ($product_in_cart && !$other_product_in_cart);
    
}

Then in theme html I'd add custom class:

<section id="service-page" class="<?php echo apply_filters( 'shipping_class_to_add') ? 'hide-all-shipping-except-my-custom-shipping-class' : 'hide-my-custom-shipping-class';
                                  ?>">

Then in CSS:

.hide-all-shipping-except-my-custom-shipping-class label[for="radio-control-0-flat_rate:5"],
.hide-all-shipping-except-my-custom-shipping-class label[for="radio-control-0-flat_rate:4"],
.hide-all-shipping-except-my-custom-shipping-class label[for="radio-control-0-flat_rate:1"]{
    display:none;
} 

.hide-my-custom-shipping-class label[for="radio-control-0-flat_rate:11"] {
    display: none;
}

Thank you in advance for help.

UPDATE Thank you @LoicTheAztec for the comment, I'd try to adjust the post to your guidelines.

So when the function show_shipping_method() returns true:

1. flat_rate:11 rate should be shown,
2. flat_rate:5, flat_rate:4, flat_rate:1 rate shippings should be hidden.
3. flat_rate:11's radio button should be checked.

When show_shipping_method() returns false:

1. flat_rate:11 should be hidden,
2. flat_rate:5, flat_rate:4, flat_rate:1 should be shown and
3. flat_rate:5's radio button should be checked.

With the steps above I could achieve all requirements, except checking the correct radio button.

So, knowing that the wp-blocks are React blocks, how can I check these radio buttons?

Or if you have any better way of achieving that, please share it away. It doesn't necessarly need to be done the way I tried to do it.

First, note that JQuery code doesn't work on cart or checkout blocks, as blocks are React powered.

You don't need any CSS to hide shipping methods and either any jQuery code.

Below, the first function is a conditional function that checks if all cart items belong to specific shipping class and is used in the 2 other functions.

The second function will set the default shipping method in checkout, conditionally based on the first function.

The 3rd function, will remove (hide) shipping methods conditionally based on the first function.

If all cart items belong to the specific shipping class, we remove all shipping methods except flat_rate:11, otherwise we remove only flat_rate:11 selecting by default flat_rate:5.

Try the following:

// Conditional function: Check cart items for specific shipping class
function has_items_from_shipping_class( $cart_items, $shipping_class = 'my-custom-shipping-class' ) {
    $item_has_class = $item_without_class = false; // Initializing variables

    // Loop through cart items for the current shipping package
    foreach( $cart_items as $item ) {
        $shipping_classes = array( $item['data']->get_shipping_class() );
        // Check the parent product for variations
        if( $item['variation_id'] > 0 ) {
            $product = wc_get_product( $item['product_id'] );
            $shipping_classes[] = $product->get_shipping_class();
        }
        if ( in_array($shipping_class, $shipping_classes) ) {
            $item_has_class = true;
        } else {
            $item_without_class = true;
        }
    }
    return  $item_has_class && !$item_without_class;
}

// Set default shipping method conditionally in checkout page
add_action( 'template_redirect', function() {
    // only in checkout page
    if ( is_checkout() && !is_wc_endpoint_url() ) {
        if ( has_items_from_shipping_class( WC()->cart->get_cart() ) ) {
            WC()->session->set('chosen_shipping_methods', array('flat_rate:11'));
        } else {
            WC()->session->set('chosen_shipping_methods', array('flat_rate:5'));
        }
    }
});

// Filter shipping methods package rates
add_filter( 'woocommerce_package_rates', 'custom_shipping_costs', 20, 2 );
function custom_shipping_costs( $rates, $package ) {
    // Remove all rates except "flat_rate:11"
    if ( has_items_from_shipping_class( $package['contents']) && isset($rates['flat_rate:11'])) {
        foreach ( array(5, 4, 1) as $id ) {
            if ( isset($rates["flat_rate:{$id}"]) ) {
                unset($rates["flat_rate:{$id}"]);
            }
        }
    // Remove "flat_rate:11" rate only
    } else {
        if ( isset($rates['flat_rate:11']) ) {
            unset($rates['flat_rate:11']);
        }
    }
    return $rates;
}

Code goes in functions.php file of your child theme (or in a plugin). It should work.

Important: Empty your cart to refresh the shipping methods cached data.