@saasquatch/mint-components 1.10.2-7 → 1.10.2-8

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

@@ -4,11 +4,13 @@ import { LeaderboardViewProps } from "./sqm-leaderboard-view";
  * @uiName Leaderboard
  * @slots [{"name":"empty", "title":"Empty State"}]
  * @requiredFeatures ["LEADERBOARDS"]
+ * @validParents ["div"]
  * @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 - <sqm-portal-container direction="row" display="flex" gap="large"><sqm-empty empty-state-image="https://res.cloudinary.com/saasquatch-staging/image/upload/v1729728469/Leaderboard_image_z87lsm.png" empty-state-header="Top Performers" empty-state-text="The leaderboard highlights the top performers in real-time. Stay motivated, stay competitive!"></sqm-empty><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true" hide-names="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></sqm-portal-container>
+ * @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" imageUrl="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;">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 Test - <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>
  * @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 {
@@ -39,7 +41,7 @@ export declare class Leaderboard {
   /**
    * @uiName Place text
    */
-  maxWidth: string;
+  width: string;
   /**
    * @uiName Rank Suffix
    */

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

@@ -8,7 +8,8 @@ export interface LeaderboardProps {
   showRank?: boolean;
   hideViewer?: boolean;
   hideNames?: boolean;
-  maxWidth?: string;
+  width?: string;
+  rankSuffix?: string;
   rankType: "rowNumber" | "rank" | "denseRank";
   leaderboardType: "topStartedReferrers" | "topConvertedReferrers" | "topPointEarners";
   maxRows: number;

package/dist/types/components.d.ts

@@ -932,6 +932,11 @@ export namespace Components {
           * @uiName Minimum height
          */
         "minHeight"?: string;
+        /**
+          * (Optional) Constrains the width of the image. Can be a pixel value or a percentage i.e. "500px", "33%", etc.
+          * @uiName Width
+         */
+        "width"?: string;
     }
     interface SqmIndirectTaxForm {
         /**
@@ -1356,10 +1361,6 @@ export namespace Components {
           * @uiName Maximum rows number
          */
         "maxRows": number;
-        /**
-          * @uiName Place text
-         */
-        "maxWidth": string;
         /**
           * Filters leaderboard to show only data from this program. Defaults to the program context where this leaderboard is. If no program ID is set or provided by context, then a global leaderboard is shown.
           * @uiName Program
@@ -1393,6 +1394,10 @@ export namespace Components {
           * @uiName User column heading
          */
         "usersheading": string;
+        /**
+          * @uiName Place text
+         */
+        "width": string;
     }
     interface SqmLeaderboardRank {
         /**
@@ -6756,6 +6761,11 @@ declare namespace LocalJSX {
           * @uiName Minimum height
          */
         "minHeight"?: string;
+        /**
+          * (Optional) Constrains the width of the image. Can be a pixel value or a percentage i.e. "500px", "33%", etc.
+          * @uiName Width
+         */
+        "width"?: string;
     }
     interface SqmIndirectTaxForm {
         /**
@@ -7174,10 +7184,6 @@ declare namespace LocalJSX {
           * @uiName Maximum rows number
          */
         "maxRows"?: number;
-        /**
-          * @uiName Place text
-         */
-        "maxWidth"?: string;
         /**
           * Filters leaderboard to show only data from this program. Defaults to the program context where this leaderboard is. If no program ID is set or provided by context, then a global leaderboard is shown.
           * @uiName Program
@@ -7211,6 +7217,10 @@ declare namespace LocalJSX {
           * @uiName User column heading
          */
         "usersheading"?: string;
+        /**
+          * @uiName Place text
+         */
+        "width"?: string;
     }
     interface SqmLeaderboardRank {
         /**