Add a global config object

Problem:

The end user might want to change various things like where resources are loaded from, which api endpoint to use etc. Passing this to every web component is hard and we would need to forward it all the way down.

Instead we could allow a global object to override our default values.

Potential config values:

• Theme
• CSS override that is loaded inside web components
• Icon theme overrides
• Maybe allow to override this per web component in addition to globally

let CONFIG = {
   elements: {
     'element-name': {...config},
   },
   'some-key': 'some-value',
}

@BDF32E9143B2CD5B suggested (I think) that we could provide a javascript template file which the user can copy to his/her server and fill out.

index.html:

<script type="module" src="my-override.js"></script>

my-override.js:

// some documentation
window.DbpConfig = {
   // some description on what is possible here...
   elements: {
     'element-name': {...config},
   },
   // some more
   'some-key': 'some-value',
   // did you know you can do this?
   'icons': {
      'close': 'my-custom-close-icon.svg'
    }
}

We decided to go with a config provider component instead -> #31 (closed)

closed