Css : Handle two flexbox that can overflow - html

Question

I must handle a case where I want to display on one line a value, a category and the number of concerned item in the following format.
[ Item name ] ([ Path start ], [ Item count ])
Example : My item value (My category, 5)
My issue is that the item name and the path start can be too long. I listed the different case in the following drawing
And I can't find a way to handle all the case using CSS only. My biggest issue is to fix the size of the two flex-box when they are both overflowing.
The closest version I have now is the following (you can un-comment the max-width to see an other result I have):
Code:
.search_list {
padding: 5px;
display: flex;
/* only for exemple */
width: 400px;
border: solid 1px black;
}
.search_info {
display: flex;
flex: 1 1 30%;
/*max-width:30%; Get rid of this */
}
.search_info .flex {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.search_info .no_flex {
flex-grow: 0;
flex-shrink: 0;
}
.search_value {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
flex: 1 1 70%;
max-width: fit-content;
}
<div class="search_list" >
<div class="search_value">Short values</div>
<div class="search_info">
<div class="flex">(Category</div>
<div class="no_flex">, 1)</div>
</div>
</div>
<div class="search_list" >
<div class="search_value">Item value with a long long text that overlow</div>
<div class="search_info">
<div class="flex">(Category</div>
<div class="no_flex">, 1)</div>
</div>
</div>
<div class="search_list" >
<div class="search_value">Long category</div>
<div class="search_info">
<div class="flex">(The category will overflow for sure in this case</div>
<div class="no_flex">, 1)</div>
</div>
</div>
<div class="search_list" >
<div class="search_value">Long category and text that will both overflow</div>
<div class="search_info">
<div class="flex">(The category is very</div>
<div class="no_flex">, 1)</div>
</div>
</div>
But, as you can see, this is not the intended results
I tried many things but I can't find a correct solution and I don't want to do thinks like counting the number of character to do a manual overflow and I also would like to avoid JavaScript since this is for a project in Web-assembly and it's a bit annoying to use JavaScript