Thoughts on better structure & componentization

[cr0ybot]

Going all-in on template parts and sass files linked via naming scheme has been a runaway success, but I can't help but think that it could be even better. A few particular sticking points for me are the siloed nature of styles and scripts markup, and that the current system is just a convention that is not enforced in any way.

Current structure challenges:

1. The purpose of styles/utilities is a bit blurry. Or perhaps I should say that I have been including a lot of sass placeholders here, which doesn't fit 1:1 with what a utility class is. I can see the potential for cascade weirdness if you need to @use a utility file to use a placeholder where class selectors are also included. However, it makes sense to me to group all things "buttons", both classes and placeholders, within a single file, so maybe this is a non-issue.
2. The styles/base folder is not good. The extra nesting in there feels awkward compared to how straightforward the rest of the styles folder is.
3. There is a separate folder for "components" with a clear purpose (no context, only arguments), but both component and template-part styles all live in the styles/modules folder. This makes sense from a style organization perspective, but there is some cognitive load required for finding styles for templates/components.
4. The styles/settings folder is basically unused aside from the theme.json stuff. Are there certain things we'd want to have as sass variables, or have CSS custom properties truly won? I think locally-scoped sass vars meant to help keep things DRY are probably all we need.
5. This is a small thing, but typing get_template_part( 'template-parts/...' ) just feels a bit too verbose, especially at the frequency we are using them. On the other hand, I don't want to obfuscate core functions too much, even if I think the function is misnamed...

(Posting unfinished thoughts, will come back to it)