InlineStack is used to lay out a horizontal row of elements --- ### Example ![inlinestack](/assets/api/checkout-extensions/post-purchase/components/inlinestack.png) ```ts?title: "JS" import {extend, InlineStack, View} from '@shopify/post-purchase-ui-extensions'; extend('Checkout::PostPurchase::Render', (root) => { const inlineStack = root.createComponent( InlineStack, { spacing: 'base', }, [ root.createComponent(View, {border: 'base', padding: 'base'}, 'View'), root.createComponent(View, {border: 'base', padding: 'base'}, 'View'), root.createComponent(View, {border: 'base', padding: 'base'}, 'View'), ], ); root.appendChild(inlineStack); }); ``` ```tsx?title: "React" import {render, InlineStack, View} from '@shopify/post-purchase-ui-extensions-react'; render('Checkout::PostPurchase::Render', () => ); function App() { return ( View View View ); } ``` ## Props optional = ? | Name | Type | Description | | --- | --- | --- | | alignment? | "leading" | "center" | "trailing" | Position children along the cross axis | | spacing? | "xtight" | "tight" | "loose" | "xloose" | Adjust spacing between children |