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

package/dist/types/components/sqm-portal-container/sqm-portal-container.d.ts

@@ -1,6 +1,10 @@
 import { Spacing } from "../../global/mixins";
 /**
  * @uiName Portal Container
+ * @slots [{"name":"", "title":"Widget Content"}]
+ * @exampleGroup Layout
+ * @example Row Layout Container - <sqm-portal-container direction="row" padding="none" gap="xxx-large" display="flex" max-width="100%"><p>Add your column content above or below!</p></sqm-portal-container>
+ * @example Column Layout Container - <sqm-portal-container direction="column" padding="none" gap="xxx-large" display="grid" max-width="100%"><p>Add your column content to the left or right!</p></sqm-portal-container>
  */
 export declare class PortalContainer {
   ignored: boolean;
@@ -25,7 +29,7 @@ export declare class PortalContainer {
    * @uiEnumNames ["None", "XXX-Small", "XX-Small", "X-Small", "Small", "Medium", "Large", "X-Large", "XX-Large", "XXX-Large", "XXXX-Large"]
    */
   gap: Spacing;
-  /** @uiName Minimum width */
+  /** @uiName Minimum Width */
   minWidth?: string;
   /**
    * @uiName Display
@@ -35,7 +39,9 @@ export declare class PortalContainer {
    */
   display: "grid" | "flex";
   /**
-   * @uiName Justify content
+   * Defines how the container distributes space between & around content items along the main-axis of a flex container
+   *
+   * @uiName Justify Content
    * @uiType string
    * @uiEnum ["start", "center", "end", "space-between", "space-around", "space-evenly"]
    * @uiEnumNames ["Start", "Center", "End", "Space Between", "Space Around", "Space Evenly"]
@@ -46,7 +52,7 @@ export declare class PortalContainer {
    */
   maxWidth?: string;
   /**
-   * @uiName Center content
+   * @uiName Center Content
    */
   center?: boolean;
   constructor();

package/dist/types/components/sqm-portal-email-verification/sqm-portal-email-verification.d.ts

@@ -8,19 +8,19 @@ export declare class PortalEmailVerification {
   /**
    * The page that users are redirected to from the verification email.
    *
-   * @uiName Email redirection base path
+   * @uiName Email Redirection Base Path
    */
   redirectPath: string;
   /**
-   * @uiName Email verification header text
+   * @uiName Email Verification Header Text
    */
   emailVerificationHeader: string;
   /**
-   * @uiName Re-send email button text
+   * @uiName Re-send Email Button Text
    */
   resendEmailButtonText: string;
   /**
-   * @uiName Email verification body text
+   * @uiName Email Verification Body Text
    */
   verifyMessage: string;
   /**

package/dist/types/components/sqm-portal-forgot-password/sqm-portal-forgot-password.d.ts

@@ -8,19 +8,19 @@ export declare class PortalForgotPassword {
   /**
    * The page that users are redirected to from the password reset email.
    *
-   * @uiName Email redirection base path
+   * @uiName Email Redirection Base Path
    */
   redirectPath: string;
   /**
-   * @uiName Email label
+   * @uiName Email Label
    */
   emailLabel: string;
   /**
-   * @uiName Password reset button text
+   * @uiName Password Reset Button Text
    */
   submitLabel: string;
   /**
-   * @uiName Routing path to login page
+   * @uiName Login Page Routing Path
    */
   loginPath: string;
   /**

package/dist/types/components/sqm-portal-login/sqm-portal-login.d.ts

@@ -6,39 +6,55 @@ import { PortalLoginViewProps } from "./sqm-portal-login-view";
 export declare class PortalLogin {
   ignored: boolean;
   /**
-   * @uiName Page navigated to after sign-in
+   * Page navigated to after sign-in
+   *
+   * @uiName Next Page Path
    */
   nextPage: string;
   /**
-   * @uiName Label for email field
+   * Label for email field
+   *
+   * @uiName Email Label
    */
   emailLabel: string;
   /**
-   * @uiName Label for password field
+   * Label for password field
+   *
+   * @uiName Password Label
    */
   passwordLabel: string;
   /**
-   * @uiName Label for submit button
+   * Label for submit button
+   *
+   * @uiName Submit Button Text
    */
   submitLabel: string;
   /**
-   * @uiName Label for forgotten password button
+   * Label for forgotten password button
+   *
+   * @uiName Forgot Password Text
    */
   forgotPasswordLabel: string;
   /**
-   * @uiName Label for register navigation button
+   * Label for register button
+   *
+   * @uiName Register Button Text
    */
   registerLabel: string;
   /**
-   * @uiName Heading label
+   * @uiName Heading Label
    */
   pageLabel: string;
   /**
-   * @uiName Register button redirection path
+   * Register redirect path
+   *
+   * @uiName Register Path
    */
   registerPath: string;
   /**
-   * @uiName Forgot password button redirect path
+   * Forgot password redirect path
+   *
+   * @uiName Forgot Password Path
    */
   forgotPasswordPath: string;
   /**

package/dist/types/components/sqm-portal-logout/sqm-portal-logout.d.ts

@@ -4,7 +4,7 @@
 export declare class PortalLogout {
   ignored: boolean;
   /**
-   * @uiName Next Page path
+   * @uiName Next Page Path
    */
   nextPage: string;
   constructor();

package/dist/types/components/sqm-portal-profile/sqm-portal-profile.d.ts

@@ -6,35 +6,45 @@ import { DemoData } from "../../global/demo";
 export declare class PortalProfile {
   ignored: boolean;
   /**
-   * @uiName First name input field label
+   * First name input field label
+   *
+   * @uiName First Name Label
    */
   firstnametext: string;
   /**
-   * @uiName Last name input field label
+   * Last name input field label
+   *
+   * @uiName Last Name Label
    */
   lastnametext: string;
   /**
-   * @uiName Email input field label
+   * Email input field label
+   *
+   * @uiName Email Label
    */
   emailtext: string;
   /**
-   * @uiName Country input field label
+   * Country input field label
+   *
+   * @uiName Country Label
    */
   countrytext: string;
   /**
-   * @uiName Edit profile header
+   * @uiName Edit Profile Header
    */
   editProfileHeader: string;
   /**
-   * @uiName Edit profile sub header
+   * @uiName Edit Profile Sub Header
    */
   editProfileSubHeader: string;
   /**
-   * @uiName Text for the submit changes button
+   * @uiName Submit Changes Button Text
    */
   submitChangeButtonText: string;
   /**
-   * @uiName Show or hide country field
+   * Show or hide the country field
+   *
+   * @uiName Show Country Field
    */
   showCountry: boolean;
   /**

package/dist/types/components/sqm-portal-protected-route/sqm-portal-protected-route.d.ts

@@ -12,7 +12,7 @@ export declare class PortalProtectedRoute {
    */
   requireEmailVerification: boolean;
   /**
-   * @uiName Redirect unverified users path
+   * @uiName Redirect Unverified Users Path
    */
   redirectToUnverified: string;
   constructor();

package/dist/types/components/sqm-portal-register/sqm-portal-register.d.ts

@@ -6,53 +6,61 @@ import { PortalRegisterViewProps } from "./sqm-portal-register-view";
 export declare class PortalRegister {
   ignored: boolean;
   /**
-   * @uiName Page navigated to after registration
+   * Page navigated to after registration
+   *
+   * @uiName Next Page
    */
   nextPage: string;
   /**
    * The page that users are redirected to from the verification email.
    *
-   * @uiName Email redirection base path
+   * @uiName Email Redirection Base Path
    */
   redirectPath: string;
   /**
-   * @uiName Label for email field
+   * @uiName Email Label
    */
   emailLabel: string;
   /**
-   * @uiName Label for password field
+   * @uiName Password Label
    */
   passwordLabel: string;
   /**
-   * @uiName Label for submit button
+   * @uiName Submit Button Text
    */
   submitLabel: string;
   /**
-   * @uiName Label for login navigation button
+   * @uiName Login Button Text
    */
   loginLabel: string;
   /**
-   * @uiName Label for confirm password field
+   * @uiName Confirm Password Label
    */
   confirmPasswordLabel: string;
   /**
-   * @uiName Show confirm password field
+   * Show or hide the confirm password input
+   *
+   * @uiName Show Confirm Password Field
    */
   confirmPassword: boolean;
   /**
-   * @uiName Use password field with live validation
+   * @uiName Enable Password Validation
    */
   enablePasswordValidation: boolean;
   /**
-   * @uiName Hide default input fields to use custom fields
+   * Hide default input fields to use custom fields
+   *
+   * @uiName Hide Default Inputs
    */
   hideInputs: boolean;
   /**
-   * @uiName Heading label
+   * @uiName Heading Label
    */
   pageLabel: string;
   /**
-   * @uiName Sign in button redirection path
+   * Login button redirection path
+   *
+   * @uiName Login Path
    */
   loginPath: string;
   /**

package/dist/types/components/sqm-portal-reset-password/sqm-portal-reset-password.d.ts

@@ -8,45 +8,47 @@ export declare class PortalResetPassword {
   /**
    * The page that users are redirected to when the password reset succeeds.
    *
-   * @uiName Next page path
+   * @uiName Next Page Path
    */
   nextPage: string;
   /**
    * The page that users are redirected to if the reset fails due to outdated password reset attempt.
    *
-   * @uiName Failed page redirection path
+   * @uiName Failed Page Path
    */
   failedPage: string;
   /**
-   * @uiName Show confirm password
+   * Show or hide confirm password field
+   *
+   * @uiName Show Confirm Password
    */
   confirmPassword: boolean;
   /**
-   * @uiName Password reset header text
+   * @uiName Reset Password Header Text
    */
   resetPasswordHeader: string;
   /**
    * Displayed after a successful password reset
    *
-   * @uiName Password reset header text
+   * @uiName Successful Password Reset Text
    */
   passwordResetHeader: string;
   /**
-   * @uiName Password reset button text
+   * @uiName Password Reset Button Text
    */
   resetPasswordButtonText: string;
   /**
-   * Displayed after a successful password reset
+   * Button text displayed after a successful password reset
    *
-   * @uiName Continue button text
+   * @uiName Continue Button Text
    */
   continueButtonText: string;
   /**
-   * @uiName Confirm password field label
+   * @uiName Confirm Password Label
    */
   confirmPasswordFieldLabel: string;
   /**
-   * @uiName Password field label
+   * @uiName Password Label
    */
   passwordFieldLabel: string;
   /**

package/dist/types/components/sqm-portal-verify-email/sqm-portal-verify-email.d.ts

@@ -8,13 +8,13 @@ export declare class PortalVerifyEmail {
   /**
    * The page that users are redirected to when the verification succeeds.
    *
-   * @uiName Next page path
+   * @uiName Next Page Path
    */
   nextPage: string;
   /**
    * The page that users are redirected to if verification fails due to outdated verification attempt.
    *
-   * @uiName Failed page redirection path
+   * @uiName Failed Page Path
    */
   failedPage: string;
   /**

package/dist/types/components/sqm-program-explainer/sqm-program-explainer.d.ts

@@ -1,5 +1,8 @@
 /**
  * @uiName Program Explainer
+ * @exampleGroup Common Components
+ * @slots [{"name":"", "title":"Explainer", "validChildren":["sqm-program-explainer-step"]}]
+ * @example Program Explainer - <sqm-program-explainer header="How it works"><sqm-program-explainer-step description="Complete tasks like uploading your first video or sharing videos with friends" header="Earn points" icon="cash-stack" text-color="#000000"></sqm-program-explainer-step><sqm-program-explainer-step description="Use your points and redeem rewards like one free month of Enterprise or a visa giftcard" header="Redeem rewards" icon="people" text-color="#000000"></sqm-program-explainer-step></sqm-program-explainer>
  */
 export declare class ProgramExplainer {
   ignored: boolean;
@@ -10,11 +13,13 @@ export declare class ProgramExplainer {
   /**
    * @uiName Header Text Color
    * @uiWidget color
+   * @format color
    */
   textColor: string;
   /**
    * @uiName Header Background Color
    * @uiWidget color
+   * @format color
    */
   backgroundColor: string;
   constructor();

package/dist/types/components/sqm-program-explainer-step/sqm-program-explainer-step.d.ts

@@ -1,5 +1,8 @@
 /**
  * @uiName Program Explainer Step
+ * @exampleGroup Common Components
+ * @example Program Explainer Step - <sqm-program-explainer-step description="Complete tasks like uploading your first video or sharing videos with friends" header="Earn points" icon="cash-stack" text-color="#000000"></sqm-program-explainer-step>
+ * @validParents ["sqm-program-explainer"]
  */
 export declare class ProgramExplainerStep {
   /**
@@ -8,22 +11,27 @@ export declare class ProgramExplainerStep {
   header: string;
   /**
    * @uiName Description
+   * @uiWidget textArea
    */
   description: string;
   /**
    * @uiName Text Color
    * @uiWidget color
+   * @format color
    */
   textColor: string;
   /**
    * @uiName Background Color
    * @uiWidget color
+   * @format color
    */
   backgroundColor: string;
   /**
    * Displayed in place of an icon
    *
    * @uiName Image Url
+   * @uiWidget imageUpload
+   * @format url
    */
   imageUrl?: string;
   /**

package/dist/types/components/sqm-referral-card/sqm-referral-card.d.ts

@@ -1,5 +1,8 @@
 /**
  * @uiName Referral Card
+ * @exampleGroup Referrals
+ * @slots [{"name":"left", "title":"Left Content"},{"name":"right", "title":"Right Content"}]
+ * @example Referral Card - <sqm-referral-card vertical-alignment="start"> <sqm-portal-container gap="large" slot="left" direction="column" display="grid" max-width="100%" padding="none" > <sqm-text >They’ll get a $50 credit towards a new account and you’ll get: </sqm-text> <sqm-timeline icon="circle"> <sqm-timeline-entry reward="$50" unit="visa giftcard" desc="Your friend purchases a Business plan" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$200" unit="visa giftcard" desc="Our sales team qualifies your friend as a good fit for our Enterprise plan" icon="circle" > </sqm-timeline-entry> <sqm-timeline-entry reward="$1000" unit="visa giftcard" desc="Your friend purchases an Enterprise plan" icon="circle" > </sqm-timeline-entry> </sqm-timeline> </sqm-portal-container> <sqm-portal-container gap="large" slot="right" direction="column" display="grid" max-width="100%" padding="none" > <sqm-text>Choose how you want to share: </sqm-text> <sqm-text> <sub>Your unique referral link:</sub> <sqm-share-link tooltip-text="Copied to Clipboard" tooltip-lifespan="1000" > </sqm-share-link> </sqm-text> <sqm-portal-container gap="x-small" direction="column" display="grid" max-width="100%" padding="none" > <sqm-share-button medium="email" icon-slot="prefix" size="medium" type="default" > Share via email </sqm-share-button> <sqm-share-button medium="linkedin" icon-slot="prefix" size="medium" type="default" > Share on LinkedIn </sqm-share-button> <sqm-share-button medium="twitter" icon-slot="prefix" size="medium" type="default" > Share on Twitter </sqm-share-button> </sqm-portal-container> </sqm-portal-container> </sqm-referral-card>
  */
 export declare class ReferralCard {
   ignored: boolean;

package/dist/types/components/sqm-referral-iframe/sqm-referral-iframe.d.ts

@@ -6,16 +6,19 @@ import { DemoData } from "../../global/demo";
 export declare class SqmReferralIframe {
   ignored: boolean;
   /**
-   * @uiName URL of iframe to display
-   * @uiRequired
+   * URL of iframe to display
+   * @uiName Iframe Source
+   * @required
    */
   iframeSrc: string;
   /**
-   * @uiName Height of the iframe container
+   * Height of the iframe container
+   * @uiName Iframe Height
    */
   iframeHeight: string;
   /**
-   * @uiName Width of the iframe container
+   * Width of the iframe container
+   * @uiName Iframe Width
    */
   iframeWidth: string;
   /**

package/dist/types/components/sqm-referral-table/columns/sqm-referral-table-column.d.ts

@@ -1,6 +1,7 @@
 import { ReferralTableColumn } from "./ReferralTableColumn";
 /**
  * @uiName Referral Table Generic Column
+ * @validParents ["sqm-referral-table"]
  */
 export declare class ReferralTableGenericColumn implements ReferralTableColumn {
   /**

package/dist/types/components/sqm-referral-table/columns/sqm-referral-table-date-column.d.ts

@@ -2,6 +2,9 @@ import { ReferralDates } from "../useReferralTable";
 import { ReferralTableColumn } from "./ReferralTableColumn";
 /**
  * @uiName Referral Table Date Column
+ * @validParents ["sqm-referral-table"]
+ * @exampleGroup Referrals
+ * @example Referral Table Date Column - <sqm-referral-table-date-column column-title="Date converted" date-shown="dateConverted"></sqm-referral-table-date-column>
  */
 export declare class ReferralTableDateColumn implements ReferralTableColumn {
   /**

package/dist/types/components/sqm-referral-table/columns/sqm-referral-table-rewards-column.d.ts

@@ -1,6 +1,9 @@
 import { ReferralTableColumn } from "./ReferralTableColumn";
 /**
  * @uiName Referral Table Rewards Column
+ * @validParents ["sqm-referral-table"]
+ * @exampleGroup Referrals
+ * @example Referral Table Rewards 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>
  */
 export declare class ReferralTableRewardsColumn implements ReferralTableColumn {
   /**
@@ -9,10 +12,12 @@ export declare class ReferralTableRewardsColumn implements ReferralTableColumn {
   columnTitle: string;
   /**
    * @uiName Reward Status Text
+   * @uiWidget textArea
    */
   statusText: string;
   /**
    * @uiName Reward Status Long Text
+   * @uiWidget textArea
    */
   statusLongText: string;
   /**

package/dist/types/components/sqm-referral-table/columns/sqm-referral-table-status-column.d.ts

@@ -1,6 +1,9 @@
 import { ReferralTableColumn } from "./ReferralTableColumn";
 /**
  * @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 declare class ReferralTableStatusColumn implements ReferralTableColumn {
   /**

package/dist/types/components/sqm-referral-table/columns/sqm-referral-table-user-column.d.ts

@@ -1,6 +1,9 @@
 import { ReferralTableColumn } from "./ReferralTableColumn";
 /**
  * @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 declare class ReferralTableUserColumn implements ReferralTableColumn {
   /**
@@ -8,11 +11,15 @@ export declare class ReferralTableUserColumn implements ReferralTableColumn {
    */
   columnTitle: string;
   /**
-   * @uiName Name displayed for anonymous users
+   * Name displayed for unknown users
+   *
+   * @uiName Anonymous User Text
    */
   anonymousUser: string;
   /**
-   * @uiName Name displayed for deleted users
+   * Name displayed for deleted users
+   *
+   * @uiName Deleted User Text
    */
   deletedUser: string;
   constructor();

package/dist/types/components/sqm-referral-table/sqm-referral-table.d.ts

@@ -2,6 +2,9 @@ import { DemoData } from "../../global/demo";
 import { GenericTableViewProps } from "../../tables/GenericTableView";
 /**
  * @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 declare class ReferralTable {
   /**
@@ -10,22 +13,32 @@ export declare class ReferralTable {
    * If program ID is "classic", shows classic-only referrals
    *
    * @uiName Program
+   * @uiWidget programSelector
    */
   programId: string;
-  /** @uiName Number of referrals per page */
+  /**
+   * Number of referrals displayed per page
+   *
+   * @uiName Referrals Per Page
+   */
   perPage: number;
-  /** @uiName Show column labels */
+  /** @uiName Show Column Labels */
   showLabels?: boolean;
-  /** @uiName Previous button text  */
+  /** @uiName Previous Button Text  */
   prevLabel?: string;
-  /** @uiName View More button text  */
+  /** @uiName View More Button Text  */
   moreLabel?: string;
-  /** @uiName Show Referred by user in table  */
+  /**
+   * Show referred by user in table
+   *
+   * @uiName Show Referrer
+   */
   showReferrer?: boolean;
   /**
    * 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
+   */
   hiddenColumns?: string;
   /** @uiName Mobile Breakpoint  */
   smBreakpoint?: number;