UNPKG

@wordpress/components

Version:
53 lines (34 loc) 1.09 kB
# ZStack <div class="callout callout-alert"> This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes. </div> ## Usage `ZStack` allows you to stack things along the Z-axis. ```jsx import { __experimentalZStack as ZStack } from '@wordpress/components'; function Example() { return ( <ZStack offset={ 20 } isLayered> <ExampleImage /> <ExampleImage /> <ExampleImage /> </ZStack> ); } ``` ## Props ### `isLayered`: `boolean` Layers children elements on top of each other (first: highest z-index, last: lowest z-index). - Required: No - Default: `true` ### `isReversed`: `boolean` Reverse the layer ordering (first: lowest z-index, last: highest z-index). - Required: No - Default: `false` ### `offset`: `number` The amount of space between each child element. Its value is automatically inverted (i.e. from positive to negative, and viceversa) when switching from LTR to RTL. - Required: No - Default: `0` ### `children`: `ReactNode` The children to stack. - Required: Yes