@sezzle/sezzle-react-widget 3.1.6 → 3.2.0

package/README.md

@@ -26,93 +26,139 @@ The following props can be specified in the element to customize the widget's co
 
 ---
 
-- **{price} (Required)**
+`price` (required)
 
-  - Type: String
+**Purpose**: The price value from which to calculate the installment amount, including currency.
+**Type**: string
 
-- **{merchantId} (Required)**
+`merchantId` (required)
 
-  - Purpose: Site's 36-character Merchant ID, found in the Business Settings of Sezzle Merchant Dashboard.
-  - Type: String
+**Purpose**: Site's 36-character Merchant ID, found in the Business Settings of Sezzle Merchant Dashboard.
+**Type**: string
 
-- **{theme}** (Optional)
+`theme` (optional)
 
-  - Purpose: To control the Sezzle image variant. Use light or black-flat for light backgrounds, dark or white-flat for dark backgrounds.
-  - Type: String
-  - Options: light, dark, white-flat, black-flat
-  - Default: light
+**Purpose**: To control the Sezzle image variant. Use light or black-flat for light backgrounds, dark or white-flat for dark backgrounds.
+**Type**: string
+**Options**: light, dark, white-flat, black-flat
+**Default**: light
 
-- **{alignment}** (Optional)
+`alignment` (optional)
 
-  - Type: String
-  - Options: auto, left, center, right
-  - Default: auto
+**Type**: string
+**Options**: auto, left, center, right
+**Default**: auto
 
-- **{fontWeight}** (Optional)
+`fontWeight` (optional)
 
-  - Type: Number
-  - Default: 500
+**Type**: number
+**Default**: 500
 
-- **{fontFamily}** (Optional)
+`fontFamily` (optional)
 
-  - Type: String
-  - Default: inherit
+**Type**: string
+**Default**: inherit
 
-- **{fontSize}** (Optional)
+`fontSize` (optional)
 
-  - Type: Number
-  - Default: 14
+**Type**: number
+**Default**: 14
 
-- **{textColor}** (Optional)
+`textColor` (optional)
 
-  - Type: String
-  - Default: inherit
+**Type**: string
+**Default**: inherit
 
-- **{logoSize}** (Optional)
+`logoSize` (optional)
 
-  - Purpose: To scale the logo (1 = 100%)
-  - Type: Number
-  - Default: 1
+**Purpose**: To scale the logo (1 = 100%)
+**Type**: number
+**Default**: 1
 
-- **{includeAPModal}** (Optional)
+`includeAPModal` (optional)
 
-  - Purpose: To enable Afterpay's logo within the Sezzle widget
-  - Type: Boolean
-  - Default: false
+**Purpose**: To enable Afterpay's logo within the Sezzle widget
+**Type**: boolean
+**Default**: false
 
-- **{numberOfPayments}** (Optional)
+`numberOfPayments` (optional)
 
-  - Purpose: Number of installments by which the shopper will pay the total, calculates installment amount.
-  - Type: Number
-  - Options: 4, 5
-  - Default: 5
+**Purpose**: Number of installments by which the shopper will pay the total, calculates installment amount.
+**Type**: number
+**Options**: 4, 5
+**Default**: 5
+**Additional Details**: Default 5 installments will appear above $50, and 4 installments will show below that amount. If override reflects `4`, 5 installments will never show in the widget or modal.
 
-- **{minPrice}** (Optional)
+`minPrice` (optional)
 
-  - Purpose to display a checkout minimum within the Sezzle widget
-  - Type: Number
-  - Default: 20
+**Purpose**: to display a checkout minimum within the Sezzle widget
+**Type**: number
+**Default**: 0
 
-- **{maxPrice}** (Optional)
+`maxPrice` (optional)
 
-  - Purpose to display a checkout maximum within the Sezzle widget
-  - Type: Number
-  - Default: 2500
+**Purpose**: the threshold at which to not show biweekly installments within the Sezzle widget
+**Type**: number
+**Default**: 2500
 
 ## <b>The following are reserved for merchants enrolled in our long-term payment program. Please discuss with Sezzle point of contact before using the below config options:</b>
 
+The default values listed below for each long-term option correspond to the `LTgroup: "a"` preset. Setting `LTgroup` to a different value shifts those defaults to that group's preset (see each option's **Additional Details**). Individual options always take precedence over both the LTgroup preset and the listed default. All long-term prices are in whole currency units (e.g. dollars), matching `minPrice` and `maxPrice`.
+
+`LTgroup` (optional)
+
+**Purpose**: Applies long-term settings based on your lending package. Please confirm the applicable value for your enrollment with your account manager.
+**Type**: string
+**Options**: `a` or `b`
+**Default**: null
+**Additional Details**: This is the crucial config option for enabling long-term widgets.
+
 `minPriceLT` (optional)
 
-**Purpose**: Minimum price for which purchase is eligible for long-term lending. Above this amount, the monthly installments with interest will be reflected in the widget and modal. Below this amount, the 4-pay widget and modal will render.
+**Purpose**: Minimum price override for which purchase is eligible for long-term lending. Above this amount, the monthly installments with interest will be reflected in the widget and modal. Below this amount, the bi-weekly widget and modal will render.
 **Type**: number
 **Default**: 0
-**Additional Details**: The `maxPrice` option should be overwritten to `15000` for long-term.
+**Additional Details**: When `LTgroup` is set, defaults to `150` for `a` or `400` for `b`.
+
+Deprecation notice: This was previously the crucial config option for enabling long-term widgets. For backwards compatibility, if this value is set but `LTgroup` is unset, `LTgroup` automatically resolves to `a`.
 
-`bestAPR` (optional)
+`maxPriceLT` (optional)
 
-**Purpose**: Standard APR rate by which interest should be calculated. (Note: the key is a misnomer - our lending partner now requires the APR to be calculated based on average awarded APR)
+**Purpose**: Maximum price override for which purchase is eligible for long-term lending. Below this amount, the monthly installments with interest will be reflected in the widget and modal. Above this amount, the widget and modal will not render.
+**Type**: number
+**Default**: 15000
+**Additional Details**: When `LTgroup` is set, defaults to `15000` for `a` or `8000` for `b`.
+
+The `maxPrice` option corresponds to the bi-weekly installments only. Between these two prices, the long-term widget will render, and the bi-weekly installments will not show in the modal.
+
+`minAPR` (optional)
+
+**Purpose**: Lowest APR offered by the lending partner. Displayed as the lower bound of the APR range in the modal disclaimer.
+**Type**: number
+**Default**: 9.99
+**Additional Details**: When `LTgroup` is set, defaults to `9.99` for `a` or `24.99` for `b`.
+
+`medianAPR` (optional)
+
+**Purpose**: Representative APR used to calculate the monthly installment amount shown in the widget and on each long-term installment card in the modal.
 **Type**: number
 **Default**: 21.99
+**Additional Details**: When `LTgroup` is set, defaults to `21.99` for `a` or `29.99` for `b`.
+
+`maxAPR` (optional)
+
+**Purpose**: Highest APR offered by the lending partner. Displayed as the upper bound of the APR range in the modal disclaimer.
+**Type**: number
+**Default**: 34.99
+**Additional Details**: When `LTgroup` is set, defaults to `34.99` for `a` or `35.99` for `b`.
+
+`termsToShow` (optional)
+
+**Purpose**: Defines which loan term lengths (in months) appear in the modal based on the order amount. Keys are price thresholds; the widget picks the term array whose threshold the price exceeds (highest match wins). The `default` key is used when no threshold matches. The min and max term lengths shown in the modal disclaimer are derived from the union of all term arrays.
+**Type**: object
+**Default**: LTgroup preset.
+  - `a`: `{ 1000: [24, 36, 48], 500: [12, 18, 24], 300: [6, 9, 12], default: [3, 6, 9] }`
+  - `b`: `{ 1000: [12, 24, 36], 800: [9, 12, 24], 600: [6, 9, 12], default: [3, 6, 9] }`
 
 # Example