Home > @uniformdev/canvas-vue

canvas-vue package

Functions

<table><thead><tr><th>

Function

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

convertComponentToProps(component)

</td><td>

Converts a raw Canvas component instance to Vue component props format. This merges each parameter moved to the root object and removes the 'value' node, hugely simplifying rendering code. For example if the raw object has parameters.foo.value, then the final props have props.foo === raw.parameters.foo.value.

</td></tr> <tr><td>

useCompositionEventEffect({ enabled, projectId, compositionIdRef, effect, })

</td><td>

A composable to manage a subscription to a realtime event on a composition

</td></tr> <tr><td>

useUniformContextualEditing({ initialCompositionValue, enhance, })

</td><td>

Adds contextual editing capability to a Uniform app. This hook is already integrated in <UniformComposition />, you won't need to use it directly, unless you have a custom setup.

</td></tr> <tr><td>

useUniformCurrentComponent()

</td><td>

Gets the data of the closest <UniformComponent /> ancestor.

</td></tr> <tr><td>

useUniformCurrentComposition()

</td><td>

Gets the data of the closest <UniformComposition /> ancestor.

</td></tr> </tbody></table>

Interfaces

<table><thead><tr><th>

Interface

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

PersonalizeComponent

</td><td>

</td></tr> <tr><td>

TestComponent

</td><td>

</td></tr> </tbody></table>

Variables

<table><thead><tr><th>

Variable

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

DefaultNotImplementedComponent

</td><td>

</td></tr> <tr><td>

globalCompositionEnhancerInjectionKey

</td><td>

</td></tr> <tr><td>

HeadingRichTextNode

</td><td>

</td></tr> <tr><td>

LinkRichTextNode

</td><td>

</td></tr> <tr><td>

ListItemRichTextNode

</td><td>

</td></tr> <tr><td>

ListRichTextNode

</td><td>

</td></tr> <tr><td>

ParagraphRichTextNode

</td><td>

</td></tr> <tr><td>

QuoteRichTextNode

</td><td>

</td></tr> <tr><td>

RootRichTextNode

</td><td>

</td></tr> <tr><td>

TextRichTextNode

</td><td>

</td></tr> <tr><td>

UniformComponent

</td><td>

Allows the rendering of a Canvas component instance (root or not), and its children if it has any. Note that the actual rendering happens inside <UniformSlot />, which you should use in most cases.

</td></tr> <tr><td>

UniformComposition

</td><td>

The main component to render a Canvas composition. It renders the full tree of components, and provides some services to the children, such as useUniformCurrentComposition. It also takes care of enabling [Contextual Editing](https://docs.uniform.app/capabilities/composition/contextual-editing).

</td></tr> <tr><td>

UniformPlayground

</td><td>

Playground where you can freely live preview your components and pattern.

</td></tr> <tr><td>

UniformRichText

</td><td>

</td></tr> <tr><td>

UniformRichTextNode

</td><td>

</td></tr> <tr><td>

UniformSlot

</td><td>

Renders the content of a Canvas composition's slot

</td></tr> <tr><td>

UniformText

</td><td>

Renders text parameters. Offers inline editing capability out of the box.

</td></tr> </tbody></table>

Type Aliases

<table><thead><tr><th>

Type Alias

</th><th>

Description

</th></tr></thead> <tbody><tr><td>

ComponentProps

</td><td>

Props passed to a Canvas component implementation. TProps is the Canvas component's parameters object after all enhancers have been applied.

</td></tr> <tr><td>

DefaultNotImplementedComponentProps

</td><td>

</td></tr> <tr><td>

RenderRichTextComponentResolver

</td><td>

Function that maps a Rich Text node instance to its React component to render it. The resolver would commonly inspect the type of the component to decide.

</td></tr> <tr><td>

ResolveRenderer

</td><td>

</td></tr> <tr><td>

RichTextComponentProps

</td><td>

</td></tr> <tr><td>

RichTextRendererComponent

</td><td>

</td></tr> <tr><td>

UniformComponentProps

</td><td>

</td></tr> <tr><td>

UniformCompositionProps

</td><td>

</td></tr> <tr><td>

UniformPlaygroundProps

</td><td>

</td></tr> <tr><td>

UniformRichTextNodeProps

</td><td>

</td></tr> <tr><td>

UniformRichTextProps

</td><td>

</td></tr> <tr><td>

UniformSlotProps

</td><td>

</td></tr> <tr><td>

UniformTextProps

</td><td>

</td></tr> <tr><td>

UseCompositionEventEffectOptions

</td><td>

</td></tr> <tr><td>

UseUniformContextualEditingProps

</td><td>

</td></tr> </tbody></table>