When extending Locator, how to look for direct children?

I am using Page Object Model, and I have some Pages and Components. Each Component has it's rootLocator, which someone who wants to create a component will define a selector for.

And I have a ItemsComponent, which also has what I call itemsLocator, which pinpoints to certain items. And I have it defined like this: var itemsLocator = rootLocator.Locator("//div[contains(concat((@class), ' '), 'dg-contents ')]/div[contains(concat((@class), ' '), 'dg-item ')]")

But because in our case, there can be another whole inner ItemsComponent inside one item of outer ItemsComponent, this selector is messing those items from outer and inner ItemsComponent... Because it look everywhere in a subtree, so instead of just selecting the outer items, it also selects the inner ones as well..

Now what would solve it, is if I have ./ at the beggining instead of //, it would mean that I want to look for direct child with class "dg-contents", and then direct children divs with class 'dg-item' is exactly what I am looking for. It wouldn't then mess up with the inner items..

But it is sadly not working, I have tested it in Playwright Inspector, // works and looks everywhere, but ./ doesn't work at all actually 😄

So my question is, can someone confirm please, that ./ would not look for direct children when extending locator?

If I am correct, and this is not working, is there some workaround that I can use to solve this problem somehow?

Or maybe would it be possible for this to work, when you change something in your code?