How to add Chosen JS library to theme? We are attempting to figure out how to properly add Chosen library to our custom theme. The main reason for doing this is to be able to add the Chosen JS files, but use a custom css file where we can control the output. 

After reviewing Chosen Module we found that it adds a lot of bloat that we don't necessarily need and have found it difficult to override the css that is used. 

Here is what we tried, but cannot get it to use the chosen.min.css and need help to see how it can be done. 

mytheme.libraries.yml file

chosenjs:
    version: 1.x
    css:
       theme:
          css/chosen.min.css: { minified:true }
    js:
      js/chosen.min.js: { minified:true }


The chosen.min.js has the necessary settings to get the functionality we needed.
If the code posted above is correct, the indentation is off. It should look something like this:

search:
  version: VERSION
  js:
    extras/js/drupal/search/sort.js: {}
    extras/js/drupal/search/filter.js: {}


See how js is not indented under version?

The second part of it is you have to tell Drupal to load it either sitewide, or on demand:

Sitewide, you need to declare this in your theme info yaml:

libraries:
  - mytheme/search


If you want to do it on demand, something like:

/**
 * Implements hook_page_attachments_alter().
 */
function mytheme_page_attachments_alter(array &amp;$attachments) {
  $current_path = \Drupal::service('path.current')-&gt;getPath();

  // We really want to minimize the loading of these two libraries
  // for anonymous users. so far, we only need it on any /search* path.
  if (preg_match('/\/search+/', $current_path)) {
    $attachments['#attached']['library'][] = 'core/drupal';
    $attachments['#attached']['library'][] = 'core/jquery';
    $attachments['#attached']['library'][] = 'mytheme/search';
  }
}


Or you can put it in a specific twig template i.e. node.html.twig like this 

{{ attach_library('mytheme/search') }}