Unable to detect my components when in folders

[cristinallamas]

If I place my components in folders inside a custom module the module is unable to find them. Is there a way to help it discover them? I don't want to place them in modules/custom/my_components/templates/pattern-[component-name].html.twig but on subfolders, I'm pointing to them in a component-library in my info.yml file. but I can't find documentation of how to do this. I can write some documentation once someone helps me understand this.

The website encountered an unexpected error. Please try again later.
</br></br><em class="placeholder">Twig_Error_Loader</em>: 
Template &quot;modules/custom/my_components/templates/pattern-CTA.html.twig&quot; 
is not defined (Drupal\Core\Template\Loader\ThemeRegistryLoader: 
Unable to find template &quot;modules/custom/my_components/templates/pattern-CTA.html.twig

[cristinallamas]

I'll provide a bit of extra info

my_module.info.yml

component-libraries:
  my_components_library:
    paths:
      - templates/patterns

cta.ui_patterns.yml

CTA:
  label: CTA
  description: A simple CTA.
  fields:
    title:
      type: text
      label: Label
      description: The button label
      preview: Submit
      url:
        type: text
        label: URL
        description: The button URL
        preview: http://example.com
    libraries:
      cta:
        version: 1.x
        use: "@my_components_library/cta/cta.html.twig"
        css:
          component:
            cta.css: {}
        js:
          cta.js: {}

File structure

modules/custom/my_components
├── my_components.info.yml
├── my_components.libraries.yml
├── my_components.ui_patterns.yml
└── templates
    └── patterns
        └── cta
            ├── cta.css
            ├── cta.html.json
            ├── cta.html.twig
            ├── cta.js
            ├── cta.scss
            └── cta.ui_patterns.yml

[cristinallamas]

Moving use: "@my_components_library/cta/cta.html.twig" outside Libraries

use: "@my_components_library/cta/cta.html.twig"
libraries:
      cta:
        version: 1.x

Made the error dissapear, but now my Pattern library (/patterns) is empty :(

[idflood]

I'm not sure if this is exactly the same issue but my components where not discovered until I enabled the UI Patterns Library submodule.

edit: Well, it is probably not the solution. This worked for one site but I have another drupal with the same base and this is not enough to have my pattern listed in the available field "layouts". They are visible in the /patterns page but not as a select option.

[idflood]

So on the second site it appears that uninstalling and re-enabling the ui patterns modules and submodules finally fixed the issue. There might have an issue when I first enabled the modules (maybe a required module not available) but it was still enabled.

[DuaelFr]

I had some issues too then I found out that the naming of the patterns was important. As you can see on the above screenshot, I was able to organize my folder with subfolders. The key seem to be that the pattern directory must be named with alphanum chars and underscores only. The pattern definition file should be named as the folder then the template file should use dashes instead of underscores.