@saasquatch/mint-components 1.10.2-13 → 1.10.2-15

package/dist/types/components/sqm-leaderboard/Leaderboard.stories.d.ts

@@ -16,6 +16,7 @@ export declare const PointsLeaderboard: () => any;
 export declare const TenWithRank: () => any;
 export declare const ViewerOutside: () => any;
 export declare const ViewerAnonymous: () => any;
+export declare const HideNamesWithViewerOutside: () => any;
 export declare const HideViewer: () => any;
 export declare const HideNames: () => any;
 export declare const LeaderboardWithNoNamesAndGraphic: () => any;

package/dist/types/components/sqm-leaderboard/sqm-leaderboard-view.d.ts

@@ -10,6 +10,7 @@ export interface LeaderboardViewProps {
       rankheading?: string;
       showRank?: boolean;
       hideViewer?: boolean;
+      viewingUserText?: string;
       hideNames?: boolean;
       anonymousUser?: string;
       rankSuffix?: string;
@@ -28,15 +29,14 @@ export interface LeaderboardViewProps {
     viewerRank?: {
       textValue: string;
       rank: number;
-      firstName: string;
-      lastInitial: string;
+      firstName?: string;
+      lastInitial?: string;
       rowNumber: number;
     };
   };
   elements: {
     empty: VNode;
     essentials: VNode;
-    loadingstate: VNode;
   };
 }
 export declare function LeaderboardView(props: LeaderboardViewProps): any;

package/dist/types/components/sqm-leaderboard/sqm-leaderboard.d.ts

@@ -5,10 +5,10 @@ import { LeaderboardViewProps } from "./sqm-leaderboard-view";
  * @slots [{"name":"empty", "title":"Empty State"}]
  * @requiredFeatures ["LEADERBOARDS"]
  * @exampleGroup Leaderboard
- * @example Referral Started Leaderboard - <sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
- * @example Referral Converted Leaderboard - <sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topConvertedReferrers" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
- * @example Points Earned Leaderboard - <sqm-leaderboard usersheading="Name" statsheading="Points" rank-type="rank" leaderboard-type="topPointEarners" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
- * @example Anonymous Leaderboard - <div style="display: flex; align-items: flex-start; justify-content: center; width: 100%; gap: 50px;"><div style="display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; max-width: 30%;"><sqm-image width="70%" alignment="center" image-url="https://res.cloudinary.com/saasquatch-staging/image/upload/v1729728469/Leaderboard_image_z87lsm.png"></sqm-image><h2 style="margin: auto;">Top Performers</h2><p style="margin: 0; text-align: center;">The leaderboard highlights the top performers in real-time. Stay motivated, stay competitive!</p></div><sqm-leaderboard width="300px" usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true" hide-names="true" hide-viewer="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard"></sqm-empty></sqm-leaderboard></div>
+ * @example Referral Started Leaderboard - <sqm-leaderboard usersheading="Referrer" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
+ * @example Referral Converted Leaderboard - <sqm-leaderboard usersheading="Referrer" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Referrals" rank-type="rank" leaderboard-type="topConvertedReferrers" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
+ * @example Points Earned Leaderboard - <sqm-leaderboard usersheading="Name" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Points" rank-type="rank" leaderboard-type="topPointEarners" rankheading="Rank" show-rank="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard" ></sqm-empty></sqm-leaderboard>
+ * @example Anonymous Leaderboard - <div style="display: flex; align-items: flex-start; justify-content: center; width: 100%; gap: 50px;"><div style="display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; max-width: 30%;"><sqm-image width="70%" alignment="center" image-url="https://res.cloudinary.com/saasquatch-staging/image/upload/v1729728469/Leaderboard_image_z87lsm.png"></sqm-image><h2 style="margin: auto;">Top Performers</h2><p style="margin: 0; text-align: center;">The leaderboard highlights the top performers in real-time. Stay motivated, stay competitive!</p></div><sqm-leaderboard width="300px" usersheading="Referrer" rank-suffix="{rank, selectordinal, one {#st} two {#nd} few {#rd} other {#th}}" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true" hide-names="true" hide-viewer="true"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_leaderboard2.png" empty-state-header="View your rank in the leaderboard" empty-state-text="Be the first to refer a friend and reach the top of the leaderboard"></sqm-empty></sqm-leaderboard></div>
  * @featureTooltip <div>Motivate your participants by gamifying your program. Contact <a href="mailto:saasquatch-support%40impact.com?subject=Next steps for Leaderboards feature&body=Hi Support Team, %0D%0A%0D%0A I am interested in learning more about how Leaderboards can support the growth of our referral program. Please connect me with a program strategy manager to discuss this feature further, and determine the next steps.%0D%0A%0D%0A%0D%0AThank you,%0D%0A[Add your name here]">Support</a> to upgrade your plan and add a leaderboard.</div>
  */
 export declare class Leaderboard {
@@ -43,6 +43,8 @@ export declare class Leaderboard {
    */
   width: string;
   /**
+   * A JSONata string that formats the rank with the appropriate ordinal suffix (e.g., "st" for 1st, "nd" for 2nd, "rd" for 3rd, and "th" for all others).
+   *
    * @uiName Rank Suffix
    */
   rankSuffix: string;
@@ -53,6 +55,10 @@ export declare class Leaderboard {
    * @default
    */
   hideViewer: boolean;
+  /**
+   * @uiName Viewing user text
+   */
+  viewingUserText: string;
   /**
    * Hide the Names of users to protect personal identifiable information
    *

package/dist/types/components/sqm-leaderboard/useLeaderboard.d.ts

@@ -7,6 +7,7 @@ export interface LeaderboardProps {
   anonymousUser?: string;
   showRank?: boolean;
   hideViewer?: boolean;
+  viewingUserText?: string;
   hideNames?: boolean;
   width?: string;
   rankSuffix?: string;
@@ -17,7 +18,6 @@ export interface LeaderboardProps {
   interval: string;
   empty: VNode;
   essentials: VNode;
-  loadingstate: VNode;
   demoProps?: LeaderboardViewProps;
 }
 export declare type Rank = {

package/dist/types/components.d.ts

@@ -1368,6 +1368,7 @@ export namespace Components {
          */
         "programId"?: string;
         /**
+          * A JSONata string that formats the rank with the appropriate ordinal suffix (e.g., "st" for 1st, "nd" for 2nd, "rd" for 3rd, and "th" for all others).
           * @uiName Rank Suffix
          */
         "rankSuffix": string;
@@ -1394,6 +1395,10 @@ export namespace Components {
           * @uiName User column heading
          */
         "usersheading": string;
+        /**
+          * @uiName Viewing user text
+         */
+        "viewingUserText": string;
         /**
           * Restrict the width of the leaderboard (Can be a pixel value or a percentage i.e. "500px", "33%", etc.)
           * @uiName Width
@@ -7199,6 +7204,7 @@ declare namespace LocalJSX {
          */
         "programId"?: string;
         /**
+          * A JSONata string that formats the rank with the appropriate ordinal suffix (e.g., "st" for 1st, "nd" for 2nd, "rd" for 3rd, and "th" for all others).
           * @uiName Rank Suffix
          */
         "rankSuffix"?: string;
@@ -7225,6 +7231,10 @@ declare namespace LocalJSX {
           * @uiName User column heading
          */
         "usersheading"?: string;
+        /**
+          * @uiName Viewing user text
+         */
+        "viewingUserText"?: string;
         /**
           * Restrict the width of the leaderboard (Can be a pixel value or a percentage i.e. "500px", "33%", etc.)
           * @uiName Width