Wave logo
/
Introduction
Developing
Contributing to Wave
Designing in Figma
Design process
Design approachComing soon
Why work with a Designer?
How to make a Design Request?
Type of Designers in Volue
How to work with Figma?
Composition
Site contribution 101
Private page
Accessibility
Colors
Typography
Icons
Elevation
Spacing and size
Breakpoints
Box
Flex
Grid
Auto Grid
Switcher
Sidebar
Anchor
Content Block
Aspect Ratio
Separator
App Frame
Form Field
Text Input
Textarea
Checkbox
Radio
Select
Select Menu
Single Select Menu
Multi Select Menu
Combobox
Date Picker
Time Picker
Text
Heading
Avatar
Action Bar
Button
Button Group
App Bar
Calendar
Card
Collapsible Card
Collapsible
Data Item
Data List
Dialog
Drawer
Header Nav List
Hint Dot
Keyboard Key
Label
Link
Logo
Menu
Nav Bar
Notification
Pagination
Popover
Sidebar Navigation
Skeleton
Spinner
SVG Icon
Switch
Table
Tabs
Toaster
Tooltip
Tree View
Portal
Dismissable Layer
Hidden
Motion box
Positioner
Roving Focus Group
Slot
Visually Hidden
Layouts
Forms
Input
Selection Control
Volue Assets
Private page
Windows Applications
Private page
Releases
v1.1.0-next.6
Github
Storybook
Contents
  • Import
  • Examples
    • Basic
Edit this page

Motion box

Lower level component that wraps an actual Box component turning it into a motion component.

Import#

import { MotionBox } from '@volue/wave-react';

Examples#

Basic#

Internally, the Box component is wrapped with the motion() function, giving you access to all motion props (like animate) from Motion​.

Previous
Hidden
Next
Positioner