Skip to content
esr360 edited this page Feb 13, 2020 · 7 revisions

See the Using <Container> section of the Creating a Module page page for more information

The <Container> Component should be used to contain your App, and serves as a traditional <Provider> Component (for things like themes). It's also used to attach Synergy related Objects to the Window Object so they can be accessed implicitly (globally).

Props

All Props are optional

Prop Type Description
globals Object An Object that will be merged into window
modules Object Your App's Modules
theme Object Your App's theme
utils Object Your App's utils
options Object Options that can be passed to props.render, and which should also be used to determine which Objects should get attached to Window
callback Function A callback Function to execute before rendering the Container
element React Element [Defaults to window.Provider] A custom Element to use for the returned Element of the Container Function Component
render (Function|React Element) [Defaults to props.children] What to render inside props.element
...props Object Will be passed/drilled down to the Element determined by props.element

props.options

The below options all have a type of Boolean

options.attachLucidComponentsToWindow

Attach the Lucid Components to the Window Object

Default true

options.attachModulesToWindow

Merge props.modules in to the Window Object (so each Module becomes available globally)

Default true

options.attachThemeToWindow

Attach props.theme to window.theme

Default false

options.attachUtilsToWindow

Attach props.utils window.utils

Default false

options.attachSynergyToWindow

Attach the Synergy Object to the window.Synergy (the Synergy Object has everything attached to it)

Default true

props.callback

Function({ modules, options, theme, utils })

props.render

Function({ modules, options, theme, utils })