diff --git a/src/components/nvq-loan-calculator/nvq-loan-calculator.tsx b/src/components/nvq-loan-calculator/nvq-loan-calculator.tsx index e5cf24e..3a1fb7c 100644 --- a/src/components/nvq-loan-calculator/nvq-loan-calculator.tsx +++ b/src/components/nvq-loan-calculator/nvq-loan-calculator.tsx @@ -4,6 +4,7 @@ import { Component, Host, Prop, h, State } from '@stencil/core'; * A loan calculator component. * @slot heading - Can be used to inject heading content on top of the calculator. * @slot examples - Can be used to inject examples content on the left side of the calculator. + * @slot monthly-payment-footer - Can be used to inject footer content below the monthly payment. * @slot footnote - Can be used to inject footnote content below the calculator. * */ @Component({ @@ -228,7 +229,8 @@ export class NvqLoanCalculator {

{this.monthlyPaymentLabel}

${this.calculatePayment()} -

{this.monthlyPaymentDisclaimer}

+

{this.monthlyPaymentDisclaimer}

+
diff --git a/src/components/nvq-loan-calculator/readme.md b/src/components/nvq-loan-calculator/readme.md index 1ec085c..556d633 100644 --- a/src/components/nvq-loan-calculator/readme.md +++ b/src/components/nvq-loan-calculator/readme.md @@ -25,11 +25,12 @@ A loan calculator component. ## Slots -| Slot | Description | -| ------------ | -------------------------------------------------------------------------- | -| `"examples"` | Can be used to inject examples content on the left side of the calculator. | -| `"footnote"` | Can be used to inject footnote content below the calculator. | -| `"heading"` | Can be used to inject heading content on top of the calculator. | +| Slot | Description | +| -------------------------- | -------------------------------------------------------------------------- | +| `"examples"` | Can be used to inject examples content on the left side of the calculator. | +| `"footnote"` | Can be used to inject footnote content below the calculator. | +| `"heading"` | Can be used to inject heading content on top of the calculator. | +| `"monthly-payment-footer"` | Can be used to inject footer content below the monthly payment. | ## CSS Custom Properties