Allow terse subscription and add more provider documention

packages/person-select/src/dbp-person-select-demo.js

@@ -75,13 +75,13 @@ export class PersonSelectDemo extends ScopedElementsMixin(DBPLitElement) {
                         <div class="field">
                             <label class="label">Person 1</label>
                             <div class="control">
-                                <dbp-person-select subscribe="auth:auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-person-select>
+                                <dbp-person-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-person-select>
                             </div>
                         </div>
                         <div class="field">
                             <label class="label">Person 2</label>
                             <div class="control">
-                                <dbp-person-select subscribe="auth:auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}" show-reload-button reload-button-title="Click me"></dbp-person-select>
+                                <dbp-person-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}" show-reload-button reload-button-title="Click me"></dbp-person-select>
                             </div>
                         </div>
                     </form>

packages/provider/README.md

-# Provider Web Component
+# Provider Web Components
 
 [GitLab Repository](https://gitlab.tugraz.at/dbp/web-components/toolkit)
 
@@ -8,20 +8,6 @@ You can install this component via npm:
 npm i @dbp-toolkit/provider
 ```
 
-## Usage
-
-```html
-<provider></provider>
-<script type="module" src="node_modules/@dbp-toolkit/provider/dist/dbp-provider.js"></script>
-```
-
-## Attributes
-
-- `init` (optional): set your vars to values
-    - example `<provider init="foo=bar"></provider>`
-- `id` (optional): set an id, useful for debugging
-    - example `<provider id="p-1"></provider>`
-
 ## Local development
 
 ```bash
@@ -40,3 +26,61 @@ yarn test
 ```
 
 Jump to <http://localhost:8002> and you should get a demo page.
+
+## Provider
+
+### Usage
+
+You can provide attributes (e.g. `global-name`) for components inside the provider:
+
+```html
+<provider global-name="value" global-name2="value2">
+  <dbp-person-select subscribe="local-name:global-name"></dbp-person-select>
+  <dbp-person-profile subscribe="local-name:global-name,local-name2:global-name2"></dbp-person-profile>
+</provider>
+<script type="module" src="node_modules/@dbp-toolkit/provider/dist/dbp-provider.js"></script>
+```
+
+### Attributes
+
+- `init` (optional): set your vars to values
+  - example `<provider init="foo=bar"></provider>`
+- `id` (optional): set an id, useful for debugging
+  - example `<provider id="p-1"></provider>`
+
+## AdapterLitElement
+
+This is a class you can derive your component class from instead of `LitElement`.
+
+You can locally "subscribe" to attributes (e.g. `local-name`) that can be provided by a `dbp-provider` (e.g. `global-name`).
+You need to make this available attributes as LitElement properties.
+
+### Example
+
+Multiple attributes can be subscribed when separated by a comma (`,`).
+
+```html
+<dbp-person-select subscribe="local-name:global-name,local-name2:global-name2"></dbp-person-select>
+```
+
+If `local-name` and `global-name` are the same you could also instead of `local-name:local-name` just write `local-name`:
+
+```html
+<dbp-person-select subscribe="local-name"></dbp-person-select>
+```
+
+### Inherent provider
+
+AdapterLitElement are themselves provider that will provide all their own attributes to all the elements in their shadow dom.
+
+In this example `dbp-auth-keycloak` would use the `set-property` event to propagate an `auth` property.
+`dbp-person-select-demo` would act as provider for `auth`. `dbp-person-select` would subscribe to `auth` to receive
+the bearer token via `this.auth.token`.
+
+```html
+<dbp-person-select-demo auth lang="de" entry-point-url="http://127.0.0.1:8000">
+  <!-- #shadow-root -->
+  <dbp-auth-keycloak></dbp-auth-keycloak>
+  <dbp-person-select subscribe="auth" lang="${this.lang}" entry-point-url="${this.entryPointUrl}"></dbp-person-select>
+</dbp-person-select-demo>
+```

packages/provider/src/adapter-lit-element.js

@@ -176,7 +176,7 @@ export class AdapterLitElement extends LitElement {
         console.log('AdapterLitElement(' + this.tagName + ') subscribeProviderFor( ' + element + ' )');
         const pair = element.trim().split(':');
         const local = pair[0];
-        const global = pair[1];
+        const global = pair[1] || local;
         const that = this;
         const event = new CustomEvent('subscribe',
             {
@@ -216,7 +216,7 @@ export class AdapterLitElement extends LitElement {
     unSubscribeProviderFor(element) {
         console.log('AdapterLitElement(' + this.tagName + ') unSubscribeProviderFor( ' + element + ' )');
         const pair = element.trim().split(':');
-        const global = pair[1];
+        const global = pair[1] || pair[0];
         const event = new CustomEvent('unsubscribe',
             {
                 bubbles: true,