diff --git a/web-ui/src/components/ufe-context/ufe-context.tsx b/web-ui/src/components/ufe-context/ufe-context.tsx index 76d562d..ad34622 100644 --- a/web-ui/src/components/ufe-context/ufe-context.tsx +++ b/web-ui/src/components/ufe-context/ufe-context.tsx @@ -8,19 +8,25 @@ import { getUfeRegistryAsync, UfeRegistry } from 'ufe-registry'; }) export class UfeContext { + // name of the context to render web components from contex configurations @Prop() context: string + // selector to match the elements to render @Prop() selector: string ; + // attributes will be propagated to rendered web components + @Prop() attributes: { [key: string]: string} + + // if set, then the "data" property will be assigned to the rendered components + @Prop() data: any; + private ufeRegistry: UfeRegistry; public async componentWillLoad() { this.ufeRegistry = await getUfeRegistryAsync(); } - - - + render() { const contextElements = this.ufeRegistry.contextElements( this.context, this.selector ); this.ufeRegistry.preloadDependenciesAsync(contextElements); @@ -30,6 +36,7 @@ export class UfeContext { {contextElements.map( el => { + el.attributes = Object.assign({}, el.attributes, this.attributes); return ( diff --git a/web-ui/src/manifest.template.json b/web-ui/src/manifest.template.json index a2d0874..8676885 100644 --- a/web-ui/src/manifest.template.json +++ b/web-ui/src/manifest.template.json @@ -3,6 +3,7 @@ "short_name": "{{app-title-short}}", "start_url": "{{base-href}}", "display": "fullscreen", + "display_override": ["window-controls-overlay"], "icons": [{ "src": "{{app_icon_large}}", "sizes": "512x512",