Basket View Component

A prebuilt basket that uses an HTML table is included.

The table is unstyled and either requires styling within the partial cshtml file or using CSS.

The cshtml partial can be found at the following path:

Views -> Partials -> UmbCheckout -> _StripeBasket.cshtml

To be able to use the Basket View Component you will need to add the following to your _ViewImports.cshtml file

@addTagHelper *, UmbCheckout.Stripe

This will allow you to use the following tag helper:

<vc:stripe-basket></vc:stripe-basket>

Alternatively, you can load the View Component without using the tag helper:

@await Component.InvokeAsync(typeof(StripeBasketViewComponent))

Configurable Properties

You can set the following properties

Property	Property Alias	Use	Default Value
tableCssClass	table-css-class	The CSS class to be added to the <table> tag	null
productNameColumnText	product-name-column-text	The text shown in the product name column header	Name
productPriceColumnText	product-price-column-text	The text shown in the product price column header	Price
quantityColumnText	quantity-column-text	The text shown in the product quantity column header	Quantity
reduceColumnText	reduce-column-text	The text shown in the product remove column header	Reduce
increaseColumnText	increase-column-text	The text shown in the product increase column header	Increase
removeColumnText	remove-column-text	The text shown in the product remove column header	Remove
reduceButtonCssClass	reduce-button-css-class	The CSS class to be added to the reduce button	null
reduceButtonText	reduce-button-text	The text shown on the reduce button	-
increaseButtonCssClass	increase-button-css-class	The CSS class to be added to the increase button	null
increaseButtonText	increase-button-text	The text shown on the increase button	+
removeButtonCssClass	remove-button-css-class	The CSS class to be added to the remove ase button	null
removeButtonText	remove-button-text	The text shown on the remove button	Remove
emptyBasketText	empty-basket-text	The text shown when the Basket is empty	Your basket is empty!
subTotalText	sub-total-text	The text shown before the SubTotal	Sub Total:
formatCurrency	format-currency	The culture to format the SubTotal in	GBP
subTotalInformationText	sub-total-information-text	The text shown below the SubTotal	Coupons, Shipping and Tax are calculated on the next checkout step
checkoutButtonCssClass	checkout-button-css-class	The CSS class to be added to the checkout button	null
checkoutButtonText	checkout-button-text	The text shown on the checkout button	Checkout
productNameAlias	product-name-alias	The alias which should be used for the product name	null