@saasquatch/mint-components 1.6.0-1 → 1.6.1-2

package/dist/collection/components/sqm-referral-table/columns/sqm-referral-table-status-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Referral Table Status Column
+ * @validParents ["sqm-referral-table"]
+ * @exampleGroup Referrals
+ * @example Referral Table Status Column - <sqm-referral-table-status-column column-title="Status" converted-status-text="Converted" in-progress-status-text="In Progress"></sqm-referral-table-status-column>
  */
 export class ReferralTableStatusColumn {
   constructor() {

package/dist/collection/components/sqm-referral-table/columns/sqm-referral-table-user-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Referral Table User Column
+ * @validParents ["sqm-referral-table"]
+ * @exampleGroup Referrals
+ * @example Referral Table User Column - <sqm-referral-table-user-column column-title="Customer" anonymous-user="Anonymous User" deleted-user="Deleted User"></sqm-referral-table-user-column>
  */
 export class ReferralTableUserColumn {
   constructor() {
@@ -11,11 +14,15 @@ export class ReferralTableUserColumn {
      */
     this.columnTitle = "Customer";
     /**
-     * @uiName Name displayed for anonymous users
+     * Name displayed for unknown users
+     *
+     * @uiName Anonymous User Text
      */
     this.anonymousUser = "Anonymous User";
     /**
-     * @uiName Name displayed for deleted users
+     * Name displayed for deleted users
+     *
+     * @uiName Deleted User Text
      */
     this.deletedUser = "Deleted User";
     withHooks(this);
@@ -102,10 +109,10 @@ export class ReferralTableUserColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Name displayed for anonymous users",
+            "text": "Anonymous User Text",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Name displayed for unknown users"
       },
       "attribute": "anonymous-user",
       "reflect": false,
@@ -123,10 +130,10 @@ export class ReferralTableUserColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Name displayed for deleted users",
+            "text": "Deleted User Text",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Name displayed for deleted users"
       },
       "attribute": "deleted-user",
       "reflect": false,

package/dist/collection/components/sqm-referral-table/sqm-referral-table.js

@@ -10,23 +10,35 @@ import mockReferralData from "./mockReferralData";
 import { tryMethod, useReferralTable } from "./useReferralTable";
 /**
  * @uiName Referral Table
+ * @exampleGroup Referrals
+ * @slots [{"name":"", "title":"Table Row"},{"name":"empty", "title":"Empty"},{"name":"loading","title":"Loading"}]
+ * @example Referral Table - <sqm-referral-table><sqm-referral-table-user-column column-title="Customer" anonymous-user="Anonymous User" deleted-user="Deleted User"></sqm-referral-table-user-column><sqm-referral-table-rewards-column column-title="Rewards" status-text="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }" status-long-text="{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }" fuel-tank-text="Your code is" reward-received-text="Reward received on" expiring-text="Expiring in" pending-for-text="{status} for {date}"></sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date converted" date-shown="dateConverted"></sqm-referral-table-date-column><sqm-referral-table-status-column column-title="Status" converted-status-text="Converted" in-progress-status-text="In Progress"></sqm-referral-table-status-column><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png" empty-state-header="View your referral details" empty-state-text="Refer a friend to view the status of your referrals and rewards earned"></sqm-empty></sqm-referral-table>
  */
 export class ReferralTable {
   constructor() {
-    /** @uiName Number of referrals per page */
+    /**
+     * Number of referrals displayed per page
+     *
+     * @uiName Referrals Per Page
+     */
     this.perPage = 4;
-    /** @uiName Show column labels */
+    /** @uiName Show Column Labels */
     this.showLabels = true;
-    /** @uiName Previous button text  */
+    /** @uiName Previous Button Text  */
     this.prevLabel = "Prev";
-    /** @uiName View More button text  */
+    /** @uiName View More Button Text  */
     this.moreLabel = "Next";
-    /** @uiName Show Referred by user in table  */
+    /**
+     * Show referred by user in table
+     *
+     * @uiName Show Referrer
+     */
     this.showReferrer = false;
     /**
      * Provide the column numbers (0 indexed) that should not be displayed in mobile views. Ex. 0,2,3
      *
-     *  @uiName Mobile Hidden Columns  */
+     * @uiName Hidden Mobile Columns
+     */
     this.hiddenColumns = "0";
     /** @uiName Mobile Breakpoint  */
     this.smBreakpoint = 599;
@@ -61,6 +73,9 @@ export class ReferralTable {
         "tags": [{
             "text": "Program",
             "name": "uiName"
+          }, {
+            "text": "programSelector",
+            "name": "uiWidget"
           }],
         "text": "Filters to only show referrals in this program. Will default to filtering by the program context where\nthis table lives. If no program ID is set or provided by context, then shows all referrals from all programs.\nIf program ID is \"classic\", shows classic-only referrals"
       },
@@ -79,10 +94,10 @@ export class ReferralTable {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Number of referrals per page",
+            "text": "Referrals Per Page",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Number of referrals displayed per page"
       },
       "attribute": "per-page",
       "reflect": false,
@@ -100,7 +115,7 @@ export class ReferralTable {
       "optional": true,
       "docs": {
         "tags": [{
-            "text": "Show column labels",
+            "text": "Show Column Labels",
             "name": "uiName"
           }],
         "text": ""
@@ -121,7 +136,7 @@ export class ReferralTable {
       "optional": true,
       "docs": {
         "tags": [{
-            "text": "Previous button text",
+            "text": "Previous Button Text",
             "name": "uiName"
           }],
         "text": ""
@@ -142,7 +157,7 @@ export class ReferralTable {
       "optional": true,
       "docs": {
         "tags": [{
-            "text": "View More button text",
+            "text": "View More Button Text",
             "name": "uiName"
           }],
         "text": ""
@@ -163,10 +178,10 @@ export class ReferralTable {
       "optional": true,
       "docs": {
         "tags": [{
-            "text": "Show Referred by user in table",
+            "text": "Show Referrer",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Show referred by user in table"
       },
       "attribute": "show-referrer",
       "reflect": false,
@@ -184,7 +199,7 @@ export class ReferralTable {
       "optional": true,
       "docs": {
         "tags": [{
-            "text": "Mobile Hidden Columns",
+            "text": "Hidden Mobile Columns",
             "name": "uiName"
           }],
         "text": "Provide the column numbers (0 indexed) that should not be displayed in mobile views. Ex. 0,2,3"

package/dist/collection/components/sqm-reward-exchange-list/sqm-reward-exchange-list.js

@@ -8,12 +8,18 @@ import { getProps } from "../../utils/utils";
 import { demoRewardExchange } from "./RewardExchangeListData";
 /**
  * @uiName Reward Exchange
+ * @slots [{"name":"empty", "title":"Empty State"}]
+ * @exampleGroup Rewards
+ * @example Reward Exchange - <sqm-reward-exchange-list back-text="Back" button-text="Exchange Rewards" cancel-text="Cancel" choose-amount-title="Select" choose-reward-title="Rewards" confirmation-title="Confirm" continue-text="Continue" continue-to-confirmation-text="Continue to confirmation" done-text="Done" reward-title="Choose a reward" not-available-error="{unavailableReasonCode, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {{sourceValue} required} AVAILABILITY_PREDICATE {Not available} other {{unavailableReasonCode}} }" not-enough-error="Not enough {sourceUnit} to redeem for this reward" query-error="Unable to load reward exchange list. Please try again" redeem-text="Redeem" redeem-title="Confirm and redeem" redemption-error="An error occured trying to redeem this reward. Please try again" redemption-success-text="Redeemed {sourceValue} for {destinationValue}" select-text="Select amount to receive" source-amount-message="{ruleType, select, FIXED_GLOBAL_REWARD {{sourceValue}} other {{sourceMinValue} to {sourceMaxValue}}}" tooltiptext="Copied" reward-name-title="Reward" reward-amount-title="Reward Amount" cost-title="Cost to Redeem" reward-redeemed-text="Reward redeemed" skeleton-card-num="8" promo-code="Promo Code" tooltip-text="Copied!"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_exchange2.png" empty-state-header="Redeem rewards" empty-state-text="Use your points to redeem rewards once they become available" > </sqm-empty></sqm-reward-exchange-list>
  */
 export class SqmRewardExchangeList {
   constructor() {
     this.ignored = true;
     /**
-     * @uiName Exchange button text
+     * Error message shown when reward is not available
+     *
+     * @uiName Not Available Error
+     * @uiWidget textArea
      */
     this.notAvailableError = "{unavailableReasonCode, select, US_TAX {US Tax limit} INSUFFICIENT_REDEEMABLE_CREDIT {{sourceValue} required} AVAILABILITY_PREDICATE {Not available} other {{unavailableReasonCode}} }";
     /**
@@ -45,7 +51,7 @@ export class SqmRewardExchangeList {
      */
     this.continueText = "Continue";
     /**
-    * Displayed on the reward selection page.
+     * Displayed on the reward selection page.
      * @uiName Continue to Confirmation Button Text
      */
     this.continueToConfirmationText = "Continue to confirmation";
@@ -54,18 +60,23 @@ export class SqmRewardExchangeList {
      */
     this.redeemText = "Redeem";
     /**
-    * Displayed as the header for the confirmation page.
+     * Displayed as the header for the confirmation page.
+     *
      * @uiName Confirmation Title Text
      */
     this.redeemTitle = "Confirm and redeem";
     /**
-    * Displayed on the success screen when a user successfully exchanges for a reward.
+     * Displayed on the success screen when a user successfully exchanges for a reward.
+     *
      * @uiName Redemption Success Message
+     * @uiWidget textArea
      */
     this.redemptionSuccessText = "Redeemed {sourceValue} for {destinationValue}";
     /**
-    * Displayed on the reward exchange cards.
+     * Displayed on the reward exchange cards.
+     *
      * @uiName Reward Exchange Amount Text
+     * @uiWidget textArea
      */
     this.sourceAmountMessage = "{ruleType, select, FIXED_GLOBAL_REWARD {{sourceValue}} other {{sourceMinValue} to {sourceMaxValue}}}";
     /**
@@ -83,17 +94,22 @@ export class SqmRewardExchangeList {
      */
     this.selectText = "Select amount to receive";
     /**
-    * Shown if an error occurs when loading the reward exchange.
+     * Shown if an error occurs when loading the reward exchange.
+     *
      * @uiName Reward List Error Message
+     * @uiWidget textArea
      */
     this.queryError = "Unable to load reward exchange list. Please try again";
     /**
-    * Shown if an error occurs during the reward exchange.
+     * Shown if an error occurs during the reward exchange.
+     *
      * @uiName Redemption Error Message
+     * @uiWidget textArea
      */
     this.redemptionError = "An error occured trying to redeem this reward. Please try again";
     /**
-     * @uiName Not Enough Available Error Message
+     * @uiName Not Enough Error Message
+     * @uiWidget textArea
      */
     this.notEnoughError = "Not enough {sourceUnit} to redeem for this reward";
     /**
@@ -107,7 +123,7 @@ export class SqmRewardExchangeList {
     /**
      * Set the number of placeholder cards to be shown in loading state.
      *
-     * @undocumented Loading Cards
+     * @uiName Loading Cards
      */
     this.skeletonCardNum = 8;
     /**
@@ -158,10 +174,13 @@ export class SqmRewardExchangeList {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Exchange button text",
+            "text": "Not Available Error",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
-        "text": ""
+        "text": "Error message shown when reward is not available"
       },
       "attribute": "not-available-error",
       "reflect": false,
@@ -391,6 +410,9 @@ export class SqmRewardExchangeList {
         "tags": [{
             "text": "Redemption Success Message",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": "Displayed on the success screen when a user successfully exchanges for a reward."
       },
@@ -412,6 +434,9 @@ export class SqmRewardExchangeList {
         "tags": [{
             "text": "Reward Exchange Amount Text",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": "Displayed on the reward exchange cards."
       },
@@ -496,6 +521,9 @@ export class SqmRewardExchangeList {
         "tags": [{
             "text": "Reward List Error Message",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": "Shown if an error occurs when loading the reward exchange."
       },
@@ -517,6 +545,9 @@ export class SqmRewardExchangeList {
         "tags": [{
             "text": "Redemption Error Message",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": "Shown if an error occurs during the reward exchange."
       },
@@ -536,8 +567,11 @@ export class SqmRewardExchangeList {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Not Enough Available Error Message",
+            "text": "Not Enough Error Message",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": ""
       },
@@ -600,7 +634,7 @@ export class SqmRewardExchangeList {
       "docs": {
         "tags": [{
             "text": "Loading Cards",
-            "name": "undocumented"
+            "name": "uiName"
           }],
         "text": "Set the number of placeholder cards to be shown in loading state."
       },

package/dist/collection/components/sqm-rewards-table/columns/sqm-rewards-table-date-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Reward Table Date Column
+ * @validParents ["sqm-rewards-table"]
+ * @exampleGroup Rewards
+ * @example Reward Table Date Column - <sqm-rewards-table-date-column column-title="Date received" date-shown="dateGiven"></sqm-rewards-table-date-column>
  */
 export class RewardTableDateColumn {
   constructor() {

package/dist/collection/components/sqm-rewards-table/columns/sqm-rewards-table-note-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Reward Table Customer Note Column
+ * @validParents ["sqm-rewards-table"]
+ * @exampleGroup Rewards
+ * @example Reward Table Customer Note Column - <sqm-rewards-table-customer-note-column column-title="Note"></sqm-rewards-table-customer-note-column>
  */
 export class RewardTableCustomerNoteColumn {
   constructor() {

package/dist/collection/components/sqm-rewards-table/columns/sqm-rewards-table-reward-column.js

@@ -3,11 +3,14 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Rewards Table Reward Column
+ * @validParents ["sqm-rewards-table"]
+ * @exampleGroup Rewards
+ * @example Rewards Table Reward Column - <sqm-rewards-table-reward-column column-title="Reward" redeemed-text="{redeemedAmount} redeemed" available-text="{availableAmount} remaining" copy-text="Copied!"></sqm-rewards-table-reward-column>
  */
 export class RewardsTableColumn {
   constructor() {
     /**
-     * @uiName Reward column title
+     * @uiName Reward Column Title
      */
     this.columnTitle = "Reward";
     /**
@@ -55,7 +58,7 @@ export class RewardsTableColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Reward column title",
+            "text": "Reward Column Title",
             "name": "uiName"
           }],
         "text": ""

package/dist/collection/components/sqm-rewards-table/columns/sqm-rewards-table-source-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Reward Table Source Column
+ * @validParents ["sqm-rewards-table"]
+ * @exampleGroup Rewards
+ * @example Reward Table Source Column - <sqm-rewards-table-source-column column-title="Source" anonymous-user="Anonymous User" deleted-user="Deleted User" reward-exchange-text="Reward Exchange" referral-rext="{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}" reward-source-text="{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}"></sqm-rewards-table-source-column>
  */
 export class RewardTableUserColumn {
   constructor() {
@@ -11,25 +14,31 @@ export class RewardTableUserColumn {
      */
     this.columnTitle = "Source";
     /**
-     * @uiName Name displayed for anonymous users
+     * Name displayed for unknown users
+     *
+     * @uiName Anonymous User Text
      */
     this.anonymousUser = "Anonymous User";
     /**
-     * @uiName Name displayed for deleted users
+     * Name displayed for deleted users
+     *
+     * @uiName Deleted User Text
      */
     this.deletedUser = "Deleted User";
     /**
-     * @uiName Reward Exchange label
+     * @uiName Reward Exchange Label
      */
     this.rewardExchangeText = "Reward Exchange";
     /**
      * Shown when a reward has been created by a referral
      *
      * @uiName Referral Text
+     * @uiWidget textArea
      */
     this.referralText = "{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}";
     /**
      * @uiName Reward Source Text
+     * @uiWidget textArea
      */
     this.rewardSourceText = "{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}";
     withHooks(this);
@@ -88,10 +97,10 @@ export class RewardTableUserColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Name displayed for anonymous users",
+            "text": "Anonymous User Text",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Name displayed for unknown users"
       },
       "attribute": "anonymous-user",
       "reflect": false,
@@ -109,10 +118,10 @@ export class RewardTableUserColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Name displayed for deleted users",
+            "text": "Deleted User Text",
             "name": "uiName"
           }],
-        "text": ""
+        "text": "Name displayed for deleted users"
       },
       "attribute": "deleted-user",
       "reflect": false,
@@ -130,7 +139,7 @@ export class RewardTableUserColumn {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Reward Exchange label",
+            "text": "Reward Exchange Label",
             "name": "uiName"
           }],
         "text": ""
@@ -153,6 +162,9 @@ export class RewardTableUserColumn {
         "tags": [{
             "text": "Referral Text",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": "Shown when a reward has been created by a referral"
       },
@@ -174,6 +186,9 @@ export class RewardTableUserColumn {
         "tags": [{
             "text": "Reward Source Text",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": ""
       },

package/dist/collection/components/sqm-rewards-table/columns/sqm-rewards-table-status-column.js

@@ -3,6 +3,9 @@ import { Component, h, Host, Method, Prop } from "@stencil/core";
 import { useRequestRerender } from "../../../tables/re-render";
 /**
  * @uiName Reward Table Status Column
+ * @validParents ["sqm-rewards-table"]
+ * @exampleGroup Rewards
+ * @example Reward Table Status Column - <sqm-rewards-table-status-column column-title="Status" status-text="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }" expiry-text="Expires on " pending-us-tax="W-9 required" pending-scheduled="Until" pending-unhandled="Fulfillment error"></sqm-rewards-table-status-column>
  */
 export class RewardTableStatusColumn {
   constructor() {
@@ -12,6 +15,7 @@ export class RewardTableStatusColumn {
     this.columnTitle = "Status";
     /**
      * @uiName Reward Status Text
+     * @uiWidget textArea
      */
     this.statusText = "{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }";
     /**
@@ -92,6 +96,9 @@ export class RewardTableStatusColumn {
         "tags": [{
             "text": "Reward Status Text",
             "name": "uiName"
+          }, {
+            "text": "textArea",
+            "name": "uiWidget"
           }],
         "text": ""
       },

package/dist/collection/components/sqm-rewards-table/sqm-rewards-table.js

@@ -10,6 +10,9 @@ import mockRewardData from "./mockRewardData";
 import { tryMethod, useRewardsTable } from "./useRewardsTable";
 /**
  * @uiName Reward Table
+ * @exampleGroup Rewards
+ * @slots [{"name":"", "title":"Table Row"},{"name":"empty", "title":"Empty"},{"name":"loading","title":"Loading"}]
+ * @example Reward Table - <sqm-rewards-table per-page="4" show-labels= prev-label="Prev" more-label="Next" hidden-columns="0" sm-breakpoint="599" md-breakpoint="799"><sqm-rewards-table-status-column column-title="Status" status-text="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }" expiry-text="Expires on " pending-us-tax="W-9 required" pending-scheduled="Until" pending-unhandled="Fulfillment error"></sqm-rewards-table-status-column><sqm-rewards-table-source-column column-title="Source" anonymous-user="Anonymous User" deleted-user="Deleted User" reward-exchange-text="Reward Exchange" referral-rext="{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}" reward-source-text="{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}"></sqm-rewards-table-source-column><sqm-rewards-table-reward-column column-title="Reward" redeemed-text="{redeemedAmount} redeemed" available-text="{availableAmount} remaining" copy-text="Copied!"></sqm-rewards-table-reward-column><sqm-rewards-table-date-column column-title="Date received" date-shown="dateGiven"></sqm-rewards-table-date-column><sqm-rewards-table-customer-note-column column-title="Note"></sqm-rewards-table-customer-note-column><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png" empty-state-header="View your rewards" empty-state-text="Complete program tasks to view the details of your rewards"></sqm-empty></sqm-rewards-table>
  */
 export class RewardsTable {
   constructor() {
@@ -59,6 +62,9 @@ export class RewardsTable {
         "tags": [{
             "text": "Program",
             "name": "uiName"
+          }, {
+            "text": "programSelector",
+            "name": "uiWidget"
           }],
         "text": "Filters to only show rewards in this program. Will default to filtering by the program context where\nthis table lives. If no program ID is set or provided by context, then shows all rewards from all programs."
       },

package/dist/collection/components/sqm-route/sqm-route.js

@@ -25,7 +25,7 @@ export class SqmRoute {
       "optional": false,
       "docs": {
         "tags": [{
-            "text": "Navigation path name",
+            "text": "Navigation Path Name",
             "name": "uiName"
           }],
         "text": ""

package/dist/collection/components/sqm-scroll/sqm-scroll.js

@@ -3,7 +3,11 @@ import { Component, h, Prop, State } from "@stencil/core";
 import { useScroll } from "./useScroll";
 import { createStyleSheet } from "../../styling/JSS";
 /**
- * @uiName Scroll
+ * @uiName Scroll Button
+ * @exampleGroup Common Components
+ * @slots [{"name":"", "title":"Button Content"}]
+ * @slotEditor richText
+ * @example Scroll Button - <sqm-scroll button-type="primary" size="medium" outline mobile scroll-animation="smooth">Button Text</sqm-scroll>
  */
 export class Scroll {
   constructor() {