@saasquatch/mint-components 1.10.0-0 → 1.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/cjs/{email-registration-view-5170d9f1.js → email-registration-view-248652bb.js} +1 -1
  2. package/dist/cjs/sqm-instant-access-registration.cjs.entry.js +1 -1
  3. package/dist/cjs/sqm-referred-registration.cjs.entry.js +1 -1
  4. package/dist/cjs/sqm-stencilbook.cjs.entry.js +7 -6
  5. package/dist/collection/components/sqm-card-feed/sqm-card-feed.js +1 -1
  6. package/dist/collection/components/sqm-share-button/ShareButton.stories.js +2 -1
  7. package/dist/collection/components/sqm-share-button/sqm-share-button.js +2 -2
  8. package/dist/collection/components/sqm-task-card/UseTaskCard.stories.js +1 -1
  9. package/dist/collection/components/sqm-task-card/sqm-task-card.js +1 -1
  10. package/dist/collection/components/views/email-registration-view.js +1 -1
  11. package/dist/esm/{email-registration-view-07d80492.js → email-registration-view-a89a88bf.js} +1 -1
  12. package/dist/esm/sqm-instant-access-registration.entry.js +1 -1
  13. package/dist/esm/sqm-referred-registration.entry.js +1 -1
  14. package/dist/esm/sqm-stencilbook.entry.js +7 -6
  15. package/dist/esm-es5/email-registration-view-a89a88bf.js +1 -0
  16. package/dist/esm-es5/sqm-instant-access-registration.entry.js +1 -1
  17. package/dist/esm-es5/sqm-referred-registration.entry.js +1 -1
  18. package/dist/esm-es5/sqm-stencilbook.entry.js +1 -1
  19. package/dist/mint-components/mint-components.esm.js +1 -1
  20. package/dist/mint-components/p-509e29e6.js +1 -0
  21. package/dist/mint-components/{p-57e4ef5f.entry.js → p-56f14840.entry.js} +1 -1
  22. package/dist/mint-components/{p-ebcec043.entry.js → p-7f088154.entry.js} +1 -1
  23. package/dist/mint-components/p-a51533cb.system.js +1 -0
  24. package/dist/mint-components/{p-4864ed8a.system.entry.js → p-b6fc1227.system.entry.js} +1 -1
  25. package/dist/mint-components/{p-8fe21979.system.entry.js → p-be4b748a.system.entry.js} +1 -1
  26. package/dist/mint-components/p-bf723ae9.entry.js +9 -0
  27. package/dist/mint-components/p-ed17e637.system.js +1 -1
  28. package/dist/mint-components/p-f1a1e7f3.system.entry.js +1 -0
  29. package/dist/types/components/sqm-card-feed/sqm-card-feed.d.ts +1 -1
  30. package/dist/types/components/sqm-share-button/sqm-share-button.d.ts +2 -2
  31. package/dist/types/components/sqm-task-card/sqm-task-card.d.ts +1 -1
  32. package/dist/types/components.d.ts +2 -2
  33. package/docs/docs.docx +0 -0
  34. package/docs/raisins.json +1 -1
  35. package/grapesjs/grapesjs.js +1 -1
  36. package/package.json +1 -1
  37. package/dist/esm-es5/email-registration-view-07d80492.js +0 -1
  38. package/dist/mint-components/p-0821ae98.entry.js +0 -9
  39. package/dist/mint-components/p-10036f16.js +0 -1
  40. package/dist/mint-components/p-6bf41e0d.system.js +0 -1
  41. package/dist/mint-components/p-a3add1c1.system.entry.js +0 -1
package/dist/cjs/{email-registration-view-5170d9f1.js → email-registration-view-248652bb.js} RENAMED
@@ -45,7 +45,7 @@ function EmailRegistrationView(props) {
45
45
  index.h("div", { part: "erroralert-text" }, error)));
46
46
  };
47
47
  const emailValidationRegex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
48
- return (index.h("div", { class: sheet.classes.Wrapper, style: {
48
+ return (index.h("div", { part: "sqm-base", class: sheet.classes.Wrapper, style: {
49
49
  border: `${content.hideBorder ? "none" : "1px solid #eaeaea"}`,
50
50
  backgroundColor: content.backgroundColor,
51
51
  "padding-top": `var(--sl-spacing-${content.paddingTop})`,
package/dist/cjs/sqm-instant-access-registration.cjs.entry.js CHANGED
@@ -9,7 +9,7 @@ require('./jsonpointer-11327262.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
10
10
  require('./mixins-fe9d4112.js');
11
11
  require('./JSS-8503a151.js');
12
- const emailRegistrationView = require('./email-registration-view-5170d9f1.js');
12
+ const emailRegistrationView = require('./email-registration-view-248652bb.js');
13
13
  require('./useRegistrationFormState-876ed65d.js');
14
14
  const useInstantAccessRegistration = require('./useInstantAccessRegistration-bbe746d1.js');
15
15
 
package/dist/cjs/sqm-referred-registration.cjs.entry.js CHANGED
@@ -9,7 +9,7 @@ require('./jsonpointer-11327262.js');
9
9
  const cjs = require('./cjs-1066ec21.js');
10
10
  require('./mixins-fe9d4112.js');
11
11
  require('./JSS-8503a151.js');
12
- const emailRegistrationView = require('./email-registration-view-5170d9f1.js');
12
+ const emailRegistrationView = require('./email-registration-view-248652bb.js');
13
13
  require('./useRegistrationFormState-876ed65d.js');
14
14
  const useInstantAccessRegistration = require('./useInstantAccessRegistration-bbe746d1.js');
15
15
 
package/dist/cjs/sqm-stencilbook.cjs.entry.js CHANGED
@@ -17,7 +17,7 @@ require('./sqm-text-span-view-e1cd9bd3.js');
17
17
  const sqmAssetCardView = require('./sqm-asset-card-view-a0e33f21.js');
18
18
  const sqmCloseButtonView = require('./sqm-close-button-view-fd6e8f60.js');
19
19
  require('./index-8c6255f5.js');
20
- const emailRegistrationView = require('./email-registration-view-5170d9f1.js');
20
+ const emailRegistrationView = require('./email-registration-view-248652bb.js');
21
21
  const sqmLeaderboardRankView = require('./sqm-leaderboard-rank-view-5a3d4a88.js');
22
22
  const sqmLogoutCurrentUserView = require('./sqm-logout-current-user-view-c9f18d96.js');
23
23
  const sqmNavigationSidebarView = require('./sqm-navigation-sidebar-view-dd53f947.js');
@@ -1531,7 +1531,8 @@ const AllMediums = () => {
1531
1531
  index.h("sqm-share-button", { medium: "linkedin" },
1532
1532
  index.h("span", null, "Linkedin")),
1533
1533
  index.h("br", null),
1534
- index.h("sqm-share-button", { medium: "twitter" }),
1534
+ index.h("sqm-share-button", { medium: "twitter" },
1535
+ index.h("span", null, "Post on X")),
1535
1536
  index.h("br", null),
1536
1537
  index.h("sqm-share-button", { medium: "pinterest" },
1537
1538
  index.h("span", null, "Pinterest")),
@@ -3645,7 +3646,7 @@ const TaskCardFeed = createHookStory(() => {
3645
3646
  return (index.h("sqm-card-feed", null,
3646
3647
  index.h("sqm-task-card", { "reward-amount": "75", "card-title": "Refer a Friend", description: "Invite a friend to Klip and get 75 points when they signup for a free trial or contact our us about an enterprise license.", "button-text": "Start referring", "button-link": "https://klip-staging.vercel.app/app/klip-rewards", goal: 1, repeatable: true, "completed-text": "", demoData: "", "ended-message": "", "event-key": "", "expiry-message": "", "progress-bar-unit": "", "reward-duration": "2022-01-04T08:00:00.000Z/2022-01-20T08:00:00.000Z", "reward-unit": "", "starts-on-message": "", "stat-type": "", "display-duration": "2022-01-04T08:00:00.000Z/2022-01-05T08:00:00.000Z" }),
3647
3648
  index.h("sqb-program-section", { "program-id": "klip-loyalty" },
3648
- index.h("sqm-task-card", { "reward-amount": "50", "card-title": "Follow Us on Twitter", description: "Earn 50 points when you follow us on Twitter!", "button-text": "Follow", "button-link": "https://twitter.com/", goal: 1, "stat-type": "/programGoals/count/Follow-on-Social-Media", "open-new-tab": "true", "event-key": "socialFollow" })),
3649
+ index.h("sqm-task-card", { "reward-amount": "50", "card-title": "Follow Us on X", description: "Earn 50 points when you Follow Us on X!", "button-text": "Follow", "button-link": "https://twitter.com/", goal: 1, "stat-type": "/programGoals/count/Follow-on-Social-Media", "open-new-tab": "true", "event-key": "socialFollow" })),
3649
3650
  index.h("sqm-task-card", { "reward-amount": "250", goal: 500, "show-progress-bar": "true", "card-title": "Spend $500 on Klip Products", description: "Earn 250 points when you spend $500 or more on Klip products.", "button-text": "See plans", "button-link": "https://klip-staging.vercel.app/app/plans", "stat-type": "/customFields/purchaseTotal", "open-new-tab": "false" }),
3650
3651
  index.h("sqb-program-section", { "program-id": "klip-loyalty" },
3651
3652
  index.h("sqm-task-card", { "reward-amount": "25", goal: 1, "card-title": "Upload Your First Video", description: "Earn 25 points for exploring the Klip platform when you upload your first video.", "button-text": "Upload", "button-link": "https://klip-staging.vercel.app/app", "stat-type": "/programGoals/count/Record-First-Video", "open-new-tab": "false" })),
@@ -3957,9 +3958,9 @@ const NewPortal = /*#__PURE__*/Object.freeze({
3957
3958
 
3958
3959
  const referralWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer a friend and earn up to $1200 in rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Get rewarded when your friend uses our product</h3>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>>Choose how you want to share</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n padding=\"none\"\n text-align=\"center\"\n label-margin=\"xx-small\"\n >\n <h3 slot=\"label\">Referral History</h3>\n </sqm-titled-section>\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqm-referral-table-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-received-text=\"Reward received on\"\n status-long-text=\"{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-referral-table-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n ></sqm-empty>\n </sqm-referral-table>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3959
3960
 
3960
- const monoWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer friends and complete tasks to earn rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n image-mobile-pos=\"top\"\n image-percentage=\"50\"\n padding-image=\"none\"\n padding-text=\"xxxx-large\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards Earned</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Share $50 with friends</h3>\n <p slot=\"content\">\n They’ll get a $50 credit towards a new account and you’ll get up to\n $1200\n </p>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>Choose how you want to share:</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n min-width=\"\"\n padding=\"none\"\n >\n <sqm-titled-section text-align=\"center\" label-margin=\"xxx-small\">\n <h3 slot=\"label\">Earn more rewards</h3>\n <p slot=\"content\">\n Get points while using our product. Use those points to redeem\n rewards like one free month of Enterprise or two plane tickets to\n anywhere in North America\n </p>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on Twitter\"\n description=\"Earn 50 points when you follow us on Twitter!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n </sqm-portal-container>\n <sqm-tabs>\n <sqm-tab header=\"Referral history\">\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqm-referral-table-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-received-text=\"Reward received on\"\n status-long-text=\"{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-referral-table-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n >\n </sqm-empty>\n </sqm-referral-table>\n </sqm-tab>\n <sqm-tab header=\"Reward history\">\n <sqm-rewards-table\n per-page=\"4\"\n program-id=\"\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqm-rewards-table-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-rewards-table-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-tab>\n </sqm-tabs>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3961
+ const monoWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer friends and complete tasks to earn rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n image-mobile-pos=\"top\"\n image-percentage=\"50\"\n padding-image=\"none\"\n padding-text=\"xxxx-large\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards Earned</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Share $50 with friends</h3>\n <p slot=\"content\">\n They’ll get a $50 credit towards a new account and you’ll get up to\n $1200\n </p>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>Choose how you want to share:</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n min-width=\"\"\n padding=\"none\"\n >\n <sqm-titled-section text-align=\"center\" label-margin=\"xxx-small\">\n <h3 slot=\"label\">Earn more rewards</h3>\n <p slot=\"content\">\n Get points while using our product. Use those points to redeem\n rewards like one free month of Enterprise or two plane tickets to\n anywhere in North America\n </p>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on X\"\n description=\"Earn 50 points when you Follow Us on X!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n </sqm-portal-container>\n <sqm-tabs>\n <sqm-tab header=\"Referral history\">\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqm-referral-table-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-received-text=\"Reward received on\"\n status-long-text=\"{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-referral-table-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n >\n </sqm-empty>\n </sqm-referral-table>\n </sqm-tab>\n <sqm-tab header=\"Reward history\">\n <sqm-rewards-table\n per-page=\"4\"\n program-id=\"\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqm-rewards-table-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-rewards-table-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-tab>\n </sqm-tabs>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3961
3962
 
3962
- const loyaltyWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Complete tasks to earn rewards\"\n layout=\"overlay\"\n padding-image=\"xxxx-large\"\n padding-text=\"xxx-large\"\n image-pos=\"center\"\n overlay-color=\"#5e5669\"\n overlay-opacity=\"0.9\"\n >\n </sqm-hero-image>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-program-explainer header=\"How it works\">\n <sqm-program-explainer-step\n description=\"Complete tasks like uploading your first video or sharing videos with friends\"\n header=\"Earn points for using our product\"\n icon=\"cash-stack\"\n text-color=\"#000000\"\n >\n </sqm-program-explainer-step>\n <sqm-program-explainer-step\n description=\"Redeem rewards like one free month of Enterprise or two plane tickets to anywhere in North America\"\n header=\"Redeem rewards with your points\"\n icon=\"people\"\n text-color=\"#000000\"\n >\n </sqm-program-explainer-step>\n </sqm-program-explainer>\n <sqm-portal-container\n center\n direction=\"row\"\n display=\"flex\"\n justify-content=\"space-between\"\n gap=\"xxx-large\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardsRedeemed/CREDIT/POINTS\"\n >\n <p>Points Redeemed</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-titled-section\n label-margin=\"small\"\n padding=\"none\"\n text-align=\"center\"\n >\n <h3 slot=\"label\">Earn points</h3>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on Twitter\"\n description=\"Earn 50 points when you follow us on Twitter!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n padding=\"none\"\n text-align=\"center\"\n label-margin=\"xx-small\"\n >\n <h3 slot=\"label\">Reward History</h3>\n </sqm-titled-section>\n <sqm-rewards-table\n per-page=\"4\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqm-rewards-table-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-rewards-table-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-portal-container>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3963
+ const loyaltyWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Complete tasks to earn rewards\"\n layout=\"overlay\"\n padding-image=\"xxxx-large\"\n padding-text=\"xxx-large\"\n image-pos=\"center\"\n overlay-color=\"#5e5669\"\n overlay-opacity=\"0.9\"\n >\n </sqm-hero-image>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-program-explainer header=\"How it works\">\n <sqm-program-explainer-step\n description=\"Complete tasks like uploading your first video or sharing videos with friends\"\n header=\"Earn points for using our product\"\n icon=\"cash-stack\"\n text-color=\"#000000\"\n >\n </sqm-program-explainer-step>\n <sqm-program-explainer-step\n description=\"Redeem rewards like one free month of Enterprise or two plane tickets to anywhere in North America\"\n header=\"Redeem rewards with your points\"\n icon=\"people\"\n text-color=\"#000000\"\n >\n </sqm-program-explainer-step>\n </sqm-program-explainer>\n <sqm-portal-container\n center\n direction=\"row\"\n display=\"flex\"\n justify-content=\"space-between\"\n gap=\"xxx-large\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardsRedeemed/CREDIT/POINTS\"\n >\n <p>Points Redeemed</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-titled-section\n label-margin=\"small\"\n padding=\"none\"\n text-align=\"center\"\n >\n <h3 slot=\"label\">Earn points</h3>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on X\"\n description=\"Earn 50 points when you Follow Us on X!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n padding=\"none\"\n text-align=\"center\"\n label-margin=\"xx-small\"\n >\n <h3 slot=\"label\">Reward History</h3>\n </sqm-titled-section>\n <sqm-rewards-table\n per-page=\"4\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqm-rewards-table-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }\"\n >\n </sqm-rewards-table-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-portal-container>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3963
3964
 
3964
3965
  const instantAccessReferrerShareWidget = "<sqm-hero\n background=\"https://res.cloudinary.com/saasquatch/image/upload/v1683589933/Portal%20Assets/Screen-Shot-2022-01-06-at-3.23.58-AM.png\"\n columns=\"2\"\n padding-size=\"medium\"\n wrap-direction=\"wrap\"\n secondary-background=\"#FFFFFF\"\n min-height=\"200\"\n ><sqm-referral-card\n vertical-alignment=\"start\"\n slot=\"secondary-column\"\n padding-bottom=\"small\"\n padding-left=\"x-large\"\n padding-right=\"x-large\"\n padding-top=\"small\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"none\"\n padding=\"none\"\n slot=\"header\"\n ><h1 slot=\"label\">Invite your friends to unlock rewards!</h1>\n <p slot=\"content\">\n They&#x2019;ll get a &#x24;50 credit towards a new account and\n you&#x2019;ll get a &#x24;50 in credit for each friend you refer.\n </p></sqm-titled-section\n >\n <sqm-portal-container\n gap=\"small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n slot=\"left\"\n >\n <p style=\"margin: 0\">Choose how you want to share:</p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button> </sqm-portal-container\n ><sqm-portal-container\n display=\"flex\"\n slot=\"footer\"\n gap=\"small\"\n justify-content=\"center\"\n >\n <sqm-logout-current-user\n user-identification-text=\"{email}\"\n switch-user-link=\"#\"\n switch-user-text=\"not you?\"\n ></sqm-logout-current-user>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n show-powered-by=\"true\"\n padding-bottom=\"x-small\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n hide-support-text\n terms-text=\"Terms And Conditions\"\n terms-link=\"https://example.com\"\n ></sqm-portal-footer></sqm-portal-container\n ></sqm-referral-card>\n</sqm-hero>\n";
3965
3966
 
@@ -3971,7 +3972,7 @@ const instantAccessFriendRegistrationWidget = "<sqm-hero\n background=\"https:/
3971
3972
 
3972
3973
  const paypalReferralWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer a friend and earn up to $1200 in rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqp-account-details\n schedule-header-text=\"Schedule\"\n integration-alert-text=\"Looks like this feature is turned off at the moment. Come back later to see if it’s enabled. \"\n integration-alert-header=\"PayPal payouts are currently disabled\"\n details-header-text=\"Payout details\"\n pay-pal-account-header-text=\"PayPal account\"\n connect-pay-pal-description-text=\"Connect your PayPal account to automatically receive payments/cash rewards.\"\n connect-pay-pal-account-button-text=\"Connect account\"\n w-9-tax-label=\"Awaiting W-9 tax form\"\n upcoming-payment-label=\"Upcoming\"\n recent-payment-label=\"Recent payment\"\n other-currencies-label=\"other currencies\"\n next-payout-label=\"Next payout\"\n next-payment-label=\"Next payment\"\n header-text=\"PayPal account\"\n edit-text=\"Edit\"\n account-label=\"Account\"\n success-message=\"Success!\"\n submit-pay-pal-account-button-text=\"Connect account\"\n pay-pal-email-label-help-text=\"Enter the email used for your PayPal account.\"\n pay-pal-email-label=\"PayPal email\"\n modal-connect-pay-pal-account-header=\"Connect PayPal account\"\n disconnect-account-header-text=\"Disconnect account\"\n disconnect-account-description-text=\"You will not be able to receive payments if you disconnect your PayPal account.\"\n ></sqp-account-details>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Get rewarded when your friend uses our product</h3>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>>Choose how you want to share</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n padding=\"none\"\n text-align=\"center\"\n label-margin=\"xx-small\"\n >\n <h3 slot=\"label\">Referral History</h3>\n </sqm-titled-section>\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqp-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-blocked-text=\"Payout blocked on {date}.\"\n reward-on-hold-text=\"Payout on hold and in review since {date}.\"\n reward-paid-out-text=\"Paid out on {date}.\"\n reward-payout-failed-text=\"This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on {date}.\"\n reward-payout-in-progress-text=\"Payout processing started on {date}.\"\n reward-received-text=\"Reward received on\"\n reward-refunded-text=\"Payout refunded on {date}.\"\n reward-returned-text=\"The email you provided does not link to an existing PayPal account. Payout expired on {date}.\"\n reward-reversed-text=\"Payout reversed on {date}.\"\n reward-unclaimed-text=\"The email you provided does not link to an existing PayPal account. Payout expires on {date}.\"\n status-long-text=\"{status, select, INPROGRESS {In Progress} TRANSFERRED {Transferred} AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} REDEEMED {Redeemed on} PENDING {Available on} EXPIRED {Reward expired on} SUCCESS {Paid out on} FAILED {This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on} PAYPAL_PENDING {Payout process started on} UNCLAIMED {The email you provided does not link to an existing PayPal account. Payout expires on} ONHOLD {Payout on hold and in review since} REFUNDED {Payout refunded on} RETURNED {Payout returned on} REVERSED {Payout reversed on} BLOCKED {Payout blocked on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} EXPIRED {Expired} REDEEMED {Redeemed} PENDING {Pending} SUCCESS {Paid Out} FAILED {Failed} PAYPAL_PENDING {In progress} UNCLAIMED {Unclaimed} ONHOLD {In progress} REFUNDED {Refunded} RETURNED {Returned} REVERSED {Reversed} BLOCKED {Blocked} other {Not available} }\"\n ></sqp-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n ></sqm-empty>\n </sqm-referral-table>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https:\\/\\/example.com\"\n faq-link=\"https:\\/\\/example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3973
3974
 
3974
- const paypalMonoWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer friends and complete tasks to earn rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n image-mobile-pos=\"top\"\n image-percentage=\"50\"\n padding-image=\"none\"\n padding-text=\"xxxx-large\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards Earned</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqp-account-details\n schedule-header-text=\"Schedule\"\n integration-alert-text=\"Looks like this feature is turned off at the moment. Come back later to see if it’s enabled. \"\n integration-alert-header=\"PayPal payouts are currently disabled\"\n details-header-text=\"Payout details\"\n pay-pal-account-header-text=\"PayPal account\"\n connect-pay-pal-description-text=\"Connect your PayPal account to automatically receive payments/cash rewards.\"\n connect-pay-pal-account-button-text=\"Connect account\"\n w-9-tax-label=\"Awaiting W-9 tax form\"\n upcoming-payment-label=\"Upcoming\"\n recent-payment-label=\"Recent payment\"\n other-currencies-label=\"other currencies\"\n next-payout-label=\"Next payout\"\n next-payment-label=\"Next payment\"\n header-text=\"PayPal account\"\n edit-text=\"Edit\"\n account-label=\"Account\"\n success-message=\"Success!\"\n submit-pay-pal-account-button-text=\"Connect account\"\n pay-pal-email-label-help-text=\"Enter the email used for your PayPal account.\"\n pay-pal-email-label=\"PayPal email\"\n modal-connect-pay-pal-account-header=\"Connect PayPal account\"\n disconnect-account-header-text=\"Disconnect account\"\n disconnect-account-description-text=\"You will not be able to receive payments if you disconnect your PayPal account.\"\n ></sqp-account-details>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Share $50 with friends</h3>\n <p slot=\"content\">\n They’ll get a $50 credit towards a new account and you’ll get up to\n $1200\n </p>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>Choose how you want to share:</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n min-width=\"\"\n padding=\"none\"\n >\n <sqm-titled-section text-align=\"center\" label-margin=\"xxx-small\">\n <h3 slot=\"label\">Earn more rewards</h3>\n <p slot=\"content\">\n Get points while using our product. Use those points to redeem\n rewards like one free month of Enterprise or two plane tickets to\n anywhere in North America\n </p>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on Twitter\"\n description=\"Earn 50 points when you follow us on Twitter!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n </sqm-portal-container>\n <sqm-tabs>\n <sqm-tab header=\"Referral history\">\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqp-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-blocked-text=\"Payout blocked on {date}.\"\n reward-on-hold-text=\"Payout on hold and in review since {date}.\"\n reward-paid-out-text=\"Paid out on {date}.\"\n reward-payout-failed-text=\"This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on {date}.\"\n reward-payout-in-progress-text=\"Payout processing started on {date}.\"\n reward-received-text=\"Reward received on\"\n reward-refunded-text=\"Payout refunded on {date}.\"\n reward-returned-text=\"The email you provided does not link to an existing PayPal account. Payout expired on {date}.\"\n reward-reversed-text=\"Payout reversed on {date}.\"\n reward-unclaimed-text=\"The email you provided does not link to an existing PayPal account. Payout expires on {date}.\"\n status-long-text=\"{status, select, INPROGRESS {In Progress} TRANSFERRED {Transferred} AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} REDEEMED {Redeemed on} PENDING {Available on} EXPIRED {Reward expired on} SUCCESS {Paid out on} FAILED {This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on} PAYPAL_PENDING {Payout process started on} UNCLAIMED {The email you provided does not link to an existing PayPal account. Payout expires on} ONHOLD {Payout on hold and in review since} REFUNDED {Payout refunded on} RETURNED {Payout returned on} REVERSED {Payout reversed on} BLOCKED {Payout blocked on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} EXPIRED {Expired} REDEEMED {Redeemed} PENDING {Pending} SUCCESS {Paid Out} FAILED {Failed} PAYPAL_PENDING {In progress} UNCLAIMED {Unclaimed} ONHOLD {In progress} REFUNDED {Refunded} RETURNED {Returned} REVERSED {Reversed} BLOCKED {Blocked} other {Not available} }\"\n ></sqp-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n >\n </sqm-empty>\n </sqm-referral-table>\n </sqm-tab>\n <sqm-tab header=\"Reward history\">\n <sqm-rewards-table\n per-page=\"4\"\n program-id=\"\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqp-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n pending-scheduled=\"Until\"\n pending-unhandled=\"Fulfillment error\"\n pending-us-tax=\"W-9 required\"\n reward-blocked-text=\"Payout blocked on\"\n reward-on-hold-text=\"Payout on hold and in review since\"\n reward-paid-out-text=\"Paid out on\"\n reward-payout-failed-text=\"This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on\"\n reward-payout-in-progress-text=\"Payout processing started on\"\n reward-refunded-text=\"Payout refunded on\"\n reward-returned-text=\"The email you provided does not link to an existing PayPal account. Payout expired on\"\n reward-reversed-text=\"Payout reversed on\"\n reward-unclaimed-text=\"The email you provided does not link to an existing PayPal account. Payout expires on\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} EXPIRED {Expired} REDEEMED {Redeemed} PENDING {Pending} SUCCESS {Paid Out} FAILED {Failed} PAYPAL_PENDING {In progress} UNCLAIMED {Unclaimed} ONHOLD {In progress} REFUNDED {Refunded} RETURNED {Returned} REVERSED {Reversed} BLOCKED {Blocked} other {Not available} }\"\n ></sqp-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-tab>\n </sqm-tabs>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https://example.com\"\n faq-link=\"https://example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3975
+ const paypalMonoWidget = "<sqm-brand brand-color=\"#4225c4\" brand-font=\"Nunito Sans\">\n <sqm-portal-container\n direction=\"column\"\n padding=\"small\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n background-color=\"#ffffff\"\n >\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n display=\"grid\"\n max-width=\"100%\"\n >\n <sqm-hero-image\n image-url=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000275/squatch-assets/yr6ER3R.png\"\n header=\"MyCompany Rewards\"\n description=\"Refer friends and complete tasks to earn rewards\"\n layout=\"columns\"\n image-pos=\"right\"\n background-color=\"#F9F9F9\"\n image-mobile-pos=\"top\"\n image-percentage=\"50\"\n padding-image=\"none\"\n padding-text=\"xxxx-large\"\n >\n </sqm-hero-image>\n </sqm-portal-container>\n <sqm-portal-container\n direction=\"column\"\n padding=\"none\"\n gap=\"xxx-large\"\n max-width=\"770px\"\n center\n display=\"grid\"\n >\n <sqm-stat-container space=\"xxx-large\" display=\"flex\">\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/referralsCount\"\n >\n <p>Referrals</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/integrationRewardsCountFiltered/AVAILABLE/global\"\n >\n <p>Giftcards Earned</p>\n </sqm-big-stat>\n <sqm-big-stat\n flex-reverse=\"true\"\n alignment=\"left\"\n stat-type=\"/rewardBalance/CREDIT/POINT/value/global\"\n >\n <p>Points Balance</p>\n </sqm-big-stat>\n </sqm-stat-container>\n <sqp-account-details\n schedule-header-text=\"Schedule\"\n integration-alert-text=\"Looks like this feature is turned off at the moment. Come back later to see if it’s enabled. \"\n integration-alert-header=\"PayPal payouts are currently disabled\"\n details-header-text=\"Payout details\"\n pay-pal-account-header-text=\"PayPal account\"\n connect-pay-pal-description-text=\"Connect your PayPal account to automatically receive payments/cash rewards.\"\n connect-pay-pal-account-button-text=\"Connect account\"\n w-9-tax-label=\"Awaiting W-9 tax form\"\n upcoming-payment-label=\"Upcoming\"\n recent-payment-label=\"Recent payment\"\n other-currencies-label=\"other currencies\"\n next-payout-label=\"Next payout\"\n next-payment-label=\"Next payment\"\n header-text=\"PayPal account\"\n edit-text=\"Edit\"\n account-label=\"Account\"\n success-message=\"Success!\"\n submit-pay-pal-account-button-text=\"Connect account\"\n pay-pal-email-label-help-text=\"Enter the email used for your PayPal account.\"\n pay-pal-email-label=\"PayPal email\"\n modal-connect-pay-pal-account-header=\"Connect PayPal account\"\n disconnect-account-header-text=\"Disconnect account\"\n disconnect-account-description-text=\"You will not be able to receive payments if you disconnect your PayPal account.\"\n ></sqp-account-details>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-titled-section\n text-align=\"center\"\n label-margin=\"xxx-small\"\n padding=\"none\"\n >\n <h3 slot=\"label\">Share $50 with friends</h3>\n <p slot=\"content\">\n They’ll get a $50 credit towards a new account and you’ll get up to\n $1200\n </p>\n </sqm-titled-section>\n <sqm-referral-card vertical-alignment=\"start\">\n <sqm-portal-container\n gap=\"large\"\n slot=\"left\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>\n They’ll get a $50 credit towards a new account and you’ll get:\n </p>\n <sqm-timeline icon=\"circle\">\n <sqm-timeline-entry\n reward=\"$50\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases a Business plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$200\"\n unit=\"visa giftcard\"\n desc=\"Our sales team qualifies your friend as a good fit for our Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n <sqm-timeline-entry\n reward=\"$1000\"\n unit=\"visa giftcard\"\n desc=\"Your friend purchases an Enterprise plan\"\n icon=\"circle\"\n >\n </sqm-timeline-entry>\n </sqm-timeline>\n </sqm-portal-container>\n <sqm-portal-container\n gap=\"large\"\n slot=\"right\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <p>Choose how you want to share:</p>\n <p><sub>Your unique referral link:</sub></p>\n <sqm-share-link\n tooltip-text=\"Copied to Clipboard\"\n tooltip-lifespan=\"1000\"\n >\n </sqm-share-link>\n <sqm-portal-container\n gap=\"x-small\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n padding=\"none\"\n >\n <sqm-share-button\n medium=\"email\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share via email\n </sqm-share-button>\n <sqm-share-button\n medium=\"linkedin\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Share on LinkedIn\n </sqm-share-button>\n <sqm-share-button\n medium=\"twitter\"\n icon-slot=\"prefix\"\n size=\"medium\"\n type=\"default\"\n >\n Post about us on X\n </sqm-share-button>\n </sqm-portal-container>\n </sqm-portal-container>\n </sqm-referral-card>\n <sqm-portal-container\n gap=\"xx-large\"\n direction=\"column\"\n display=\"grid\"\n max-width=\"100%\"\n min-width=\"\"\n padding=\"none\"\n >\n <sqm-titled-section text-align=\"center\" label-margin=\"xxx-small\">\n <h3 slot=\"label\">Earn more rewards</h3>\n <p slot=\"content\">\n Get points while using our product. Use those points to redeem\n rewards like one free month of Enterprise or two plane tickets to\n anywhere in North America\n </p>\n </sqm-titled-section>\n <sqm-card-feed gap=\"24\" width=\"347\">\n <sqm-task-card\n reward-amount=\"20\"\n goal=\"1\"\n card-title=\"Complete a Survey\"\n description=\"Fill out our NPS survey and get 20 points for giving us honest feedback.\"\n button-text=\"Take survey\"\n reward-unit=\"Points\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"250\"\n goal=\"500\"\n show-progress-bar\n card-title=\"Spend $500\"\n description=\"Earn 250 points when you spend $500 or more.\"\n button-text=\"See plans\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n progress-bar-unit=\"$\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n goal=\"1\"\n reward-amount=\"50\"\n card-title=\"Follow Us on X\"\n description=\"Earn 50 points when you Follow Us on X!\"\n button-text=\"Follow\"\n button-link=\"https://twitter.com/\"\n open-new-tab=\"true\"\n event-key=\"socialFollow\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n finite=\"0\"\n reward-unit=\"Points\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n <sqm-task-card\n reward-amount=\"1\"\n reward-unit=\"Free Month\"\n goal=\"1\"\n card-title=\"Upgrade Your Plan\"\n description=\"Receive one free month for being a committed customer when you upgrade your plan.\"\n button-text=\"Upgrade\"\n completed-text=\"Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}\"\n ended-message=\"Ended {endDate}\"\n expiry-message=\"Ends {endDate}\"\n open-new-tab=\"false\"\n finite=\"0\"\n starts-on-message=\"Starts {startDate}\"\n >\n </sqm-task-card>\n </sqm-card-feed>\n </sqm-portal-container>\n <sqm-tabs>\n <sqm-tab header=\"Referral history\">\n <sqm-referral-table\n per-page=\"4\"\n hidden-columns=\"2\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-referral-table-user-column\n column-title=\"User\"\n anonymous-user=\"Anonymous User\"\n deleted-user=\"Deleted User\"\n >\n </sqm-referral-table-user-column>\n <sqm-referral-table-status-column\n column-title=\"Referral status\"\n converted-status-text=\"Converted\"\n in-progress-status-text=\"In Progress\"\n >\n </sqm-referral-table-status-column>\n <sqp-rewards-column\n column-title=\"Rewards\"\n expiring-text=\"Expiring in\"\n fuel-tank-text=\"Your code is\"\n pending-for-text=\"{status} for {date}\"\n reward-blocked-text=\"Payout blocked on {date}.\"\n reward-on-hold-text=\"Payout on hold and in review since {date}.\"\n reward-paid-out-text=\"Paid out on {date}.\"\n reward-payout-failed-text=\"This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on {date}.\"\n reward-payout-in-progress-text=\"Payout processing started on {date}.\"\n reward-received-text=\"Reward received on\"\n reward-refunded-text=\"Payout refunded on {date}.\"\n reward-returned-text=\"The email you provided does not link to an existing PayPal account. Payout expired on {date}.\"\n reward-reversed-text=\"Payout reversed on {date}.\"\n reward-unclaimed-text=\"The email you provided does not link to an existing PayPal account. Payout expires on {date}.\"\n status-long-text=\"{status, select, INPROGRESS {In Progress} TRANSFERRED {Transferred} AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} REDEEMED {Redeemed on} PENDING {Available on} EXPIRED {Reward expired on} SUCCESS {Paid out on} FAILED {This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on} PAYPAL_PENDING {Payout process started on} UNCLAIMED {The email you provided does not link to an existing PayPal account. Payout expires on} ONHOLD {Payout on hold and in review since} REFUNDED {Payout refunded on} RETURNED {Payout returned on} REVERSED {Payout reversed on} BLOCKED {Payout blocked on} other {Not available} }\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} EXPIRED {Expired} REDEEMED {Redeemed} PENDING {Pending} SUCCESS {Paid Out} FAILED {Failed} PAYPAL_PENDING {In progress} UNCLAIMED {Unclaimed} ONHOLD {In progress} REFUNDED {Refunded} RETURNED {Returned} REVERSED {Reversed} BLOCKED {Blocked} other {Not available} }\"\n ></sqp-rewards-column>\n <sqm-referral-table-date-column\n column-title=\"Date referred\"\n date-shown=\"dateReferralStarted\"\n >\n </sqm-referral-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644000223/squatch-assets/empty_referral2.png\"\n empty-state-header=\"View your referral details\"\n empty-state-text=\"Refer a friend to view the status of your referrals and rewards earned\"\n >\n </sqm-empty>\n </sqm-referral-table>\n </sqm-tab>\n <sqm-tab header=\"Reward history\">\n <sqm-rewards-table\n per-page=\"4\"\n program-id=\"\"\n hidden-columns=\"0\"\n more-label=\"Next\"\n prev-label=\"Prev\"\n sm-breakpoint=\"599\"\n md-breakpoint=\"799\"\n >\n <sqm-rewards-table-reward-column\n available-text=\"{availableAmount} remaining\"\n column-title=\"Reward\"\n copy-text=\"Copied!\"\n redeemed-text=\"{redeemedAmount} redeemed\"\n >\n </sqm-rewards-table-reward-column>\n <sqm-rewards-table-source-column\n anonymous-user=\"Anonymous User\"\n column-title=\"Source\"\n deleted-user=\"Deleted User\"\n referral-text=\"{rewardSource, select, FRIEND_SIGNUP {Referral to} REFERRED {Referred by} other {}}\"\n reward-exchange-text=\"Reward Exchange\"\n reward-source-text=\"{rewardSource, select, MANUAL {Manual} AUTOMATED {{programName}} other {}}\"\n >\n </sqm-rewards-table-source-column>\n <sqp-status-column\n column-title=\"Status\"\n expiry-text=\"Expires on \"\n pending-scheduled=\"Until\"\n pending-unhandled=\"Fulfillment error\"\n pending-us-tax=\"W-9 required\"\n reward-blocked-text=\"Payout blocked on\"\n reward-on-hold-text=\"Payout on hold and in review since\"\n reward-paid-out-text=\"Paid out on\"\n reward-payout-failed-text=\"This payout will be retried up to 3 times. If it still fails it will be retried in the next payout cycle. Last attempted on\"\n reward-payout-in-progress-text=\"Payout processing started on\"\n reward-refunded-text=\"Payout refunded on\"\n reward-returned-text=\"The email you provided does not link to an existing PayPal account. Payout expired on\"\n reward-reversed-text=\"Payout reversed on\"\n reward-unclaimed-text=\"The email you provided does not link to an existing PayPal account. Payout expires on\"\n status-text=\"{status, select, AVAILABLE {Available} CANCELLED {Cancelled} EXPIRED {Expired} REDEEMED {Redeemed} PENDING {Pending} SUCCESS {Paid Out} FAILED {Failed} PAYPAL_PENDING {In progress} UNCLAIMED {Unclaimed} ONHOLD {In progress} REFUNDED {Refunded} RETURNED {Returned} REVERSED {Reversed} BLOCKED {Blocked} other {Not available} }\"\n ></sqp-status-column>\n <sqm-rewards-table-date-column\n column-title=\"Date received\"\n date-shown=\"dateGiven\"\n >\n </sqm-rewards-table-date-column>\n <sqm-empty\n slot=\"empty\"\n empty-state-image=\"https://res.cloudinary.com/saasquatch/image/upload/v1644360953/squatch-assets/empty_reward2.png\"\n empty-state-header=\"View your rewards\"\n empty-state-text=\"Refer friends and complete tasks to view the details of your rewards\"\n >\n </sqm-empty>\n </sqm-rewards-table>\n </sqm-tab>\n </sqm-tabs>\n </sqm-portal-container>\n <sqm-portal-footer\n support-email=\"support@example.com\"\n terms-link=\"https://example.com\"\n faq-link=\"https://example.com\"\n terms-text=\"Terms And Conditions\"\n faq-text=\"FAQ\"\n show-powered-by=\"true\"\n padding-bottom=\"none\"\n padding-left=\"none\"\n padding-right=\"none\"\n padding-top=\"none\"\n ></sqm-portal-footer>\n </sqm-portal-container>\n </sqm-portal-container>\n</sqm-brand>\n";
3975
3976
 
3976
3977
  function Buttons({ callbacks, states, template }) {
3977
3978
  return (index.h("div", null,
package/dist/collection/components/sqm-card-feed/sqm-card-feed.js CHANGED
@@ -6,7 +6,7 @@ import { CardFeedView } from "./sqm-card-feed-view";
6
6
  * @uiName Card Feed
7
7
  * @slots [{"name":"","title":"Cards"}]
8
8
  * @exampleGroup Rewards
9
- * @example Task Card Feed - <sqm-card-feed gap="24" width="347"> <sqm-task-card reward-amount="20" goal="1" card-title="Complete a Survey" description="Fill out our NPS survey and get 20 points for giving us honest feedback." button-text="Take survey" reward-unit="Points" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 250 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on Twitter" description="Earn 50 points when you follow us on Twitter!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Receive one free month for being a committed customer when you upgrade your plan." button-text="Upgrade" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" open-new-tab="false" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> </sqm-card-feed>
9
+ * @example Task Card Feed - <sqm-card-feed gap="24" width="347"> <sqm-task-card reward-amount="20" goal="1" card-title="Complete a Survey" description="Fill out our NPS survey and get 20 points for giving us honest feedback." button-text="Take survey" reward-unit="Points" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 250 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on X" description="Earn 50 points when you Follow Us on X!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}" > </sqm-task-card> <sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Receive one free month for being a committed customer when you upgrade your plan." button-text="Upgrade" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" open-new-tab="false" finite="0" starts-on-message="Starts {startDate}" > </sqm-task-card> </sqm-card-feed>
10
10
  */
11
11
  export class CardFeed {
12
12
  constructor() {
package/dist/collection/components/sqm-share-button/ShareButton.stories.js CHANGED
@@ -82,7 +82,8 @@ export const AllMediums = () => {
82
82
  h("sqm-share-button", { medium: "linkedin" },
83
83
  h("span", null, "Linkedin")),
84
84
  h("br", null),
85
- h("sqm-share-button", { medium: "twitter" }),
85
+ h("sqm-share-button", { medium: "twitter" },
86
+ h("span", null, "Post on X")),
86
87
  h("br", null),
87
88
  h("sqm-share-button", { medium: "pinterest" },
88
89
  h("span", null, "Pinterest")),
package/dist/collection/components/sqm-share-button/sqm-share-button.js CHANGED
@@ -12,7 +12,7 @@ import deepmerge from "deepmerge";
12
12
  * @uiOrder ["medium", "program-id", "*", "pill", "disabled", "hideicon"]
13
13
  * @exampleGroup Sharing
14
14
  * @example Facebook Share Button - <sqm-share-button medium="facebook">Share on Facebook</sqm-share-button>
15
- * @example Twitter Share Button - <sqm-share-button medium="twitter">Share via Tweet</sqm-share-button>
15
+ * @example X Share Button - <sqm-share-button medium="twitter">Share via X</sqm-share-button>
16
16
  * @example Email Share Button - <sqm-share-button medium="email">Share via Email</sqm-share-button>
17
17
  * @example Web Share Sheet Share Button - <sqm-share-button medium="direct">Share</sqm-share-button>
18
18
  * @example LinkedIn Share Button - <sqm-share-button medium="linkedin">Share on LinkedIn</sqm-share-button>
@@ -102,7 +102,7 @@ export class ShareButton {
102
102
  "text": "[\"facebook\", \"twitter\", \"email\", \"direct\", \"linkedin\", \"sms\", \"fbmessenger\", \"whatsapp\", \"linemessenger\", \"pinterest\" ]",
103
103
  "name": "uiEnum"
104
104
  }, {
105
- "text": "[\"Facebook\", \"Twitter\", \"Email\", \"Web Share Sheet\", \"Linkedin\", \"SMS\", \"Facebook Messenger\", \"Whatsapp\", \"Line Messenger\", \"Pinterest\"]",
105
+ "text": "[\"Facebook\", \"X\", \"Email\", \"Web Share Sheet\", \"Linkedin\", \"SMS\", \"Facebook Messenger\", \"Whatsapp\", \"Line Messenger\", \"Pinterest\"]",
106
106
  "name": "uiEnumNames"
107
107
  }],
108
108
  "text": "The social medium to share on. Share messages and links\nwill be pulled from your program config and tagged for analytics."
package/dist/collection/components/sqm-task-card/UseTaskCard.stories.js CHANGED
@@ -50,7 +50,7 @@ export const TaskCardFeed = createHookStory(() => {
50
50
  return (h("sqm-card-feed", null,
51
51
  h("sqm-task-card", { "reward-amount": "75", "card-title": "Refer a Friend", description: "Invite a friend to Klip and get 75 points when they signup for a free trial or contact our us about an enterprise license.", "button-text": "Start referring", "button-link": "https://klip-staging.vercel.app/app/klip-rewards", goal: 1, repeatable: true, "completed-text": "", demoData: "", "ended-message": "", "event-key": "", "expiry-message": "", "progress-bar-unit": "", "reward-duration": "2022-01-04T08:00:00.000Z/2022-01-20T08:00:00.000Z", "reward-unit": "", "starts-on-message": "", "stat-type": "", "display-duration": "2022-01-04T08:00:00.000Z/2022-01-05T08:00:00.000Z" }),
52
52
  h("sqb-program-section", { "program-id": "klip-loyalty" },
53
- h("sqm-task-card", { "reward-amount": "50", "card-title": "Follow Us on Twitter", description: "Earn 50 points when you follow us on Twitter!", "button-text": "Follow", "button-link": "https://twitter.com/", goal: 1, "stat-type": "/programGoals/count/Follow-on-Social-Media", "open-new-tab": "true", "event-key": "socialFollow" })),
53
+ h("sqm-task-card", { "reward-amount": "50", "card-title": "Follow Us on X", description: "Earn 50 points when you Follow Us on X!", "button-text": "Follow", "button-link": "https://twitter.com/", goal: 1, "stat-type": "/programGoals/count/Follow-on-Social-Media", "open-new-tab": "true", "event-key": "socialFollow" })),
54
54
  h("sqm-task-card", { "reward-amount": "250", goal: 500, "show-progress-bar": "true", "card-title": "Spend $500 on Klip Products", description: "Earn 250 points when you spend $500 or more on Klip products.", "button-text": "See plans", "button-link": "https://klip-staging.vercel.app/app/plans", "stat-type": "/customFields/purchaseTotal", "open-new-tab": "false" }),
55
55
  h("sqb-program-section", { "program-id": "klip-loyalty" },
56
56
  h("sqm-task-card", { "reward-amount": "25", goal: 1, "card-title": "Upload Your First Video", description: "Earn 25 points for exploring the Klip platform when you upload your first video.", "button-text": "Upload", "button-link": "https://klip-staging.vercel.app/app", "stat-type": "/programGoals/count/Record-First-Video", "open-new-tab": "false" })),
package/dist/collection/components/sqm-task-card/sqm-task-card.js CHANGED
@@ -13,7 +13,7 @@ import { useTaskCard } from "./useTaskCard";
13
13
  * @exampleGroup Rewards
14
14
  * @example One Time Task Card - <sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Receive one free month for being a committed customer when you upgrade your plan." button-text="Upgrade" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" open-new-tab="false" finite="0" starts-on-message="Starts {startDate}"></sqm-task-card>
15
15
  * @example Repeatable Task Card - <sqm-task-card reward-amount="250" goal="500" show-progress-bar card-title="Spend $500" description="Earn 250 points when you spend $500 or more." button-text="See plans" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" progress-bar-unit="$" finite="0" repeatable="" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
16
- * @example Event Sending Task Card - <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on Twitter" description="Earn 50 points when you follow us on Twitter!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
16
+ * @example Event Sending Task Card - <sqm-task-card goal="1" reward-amount="50" card-title="Follow Us on X" description="Earn 50 points when you Follow Us on X!" button-text="Follow" button-link="https://twitter.com/" open-new-tab="true" event-key="socialFollow" completed-text="Completed {finite, select, 0 {{count, plural, =1 {{count} time} other {{count} times}}} other {{count}/{finite} times}}" ended-message="Ended {endDate}" expiry-message="Ends {endDate}" finite="0" reward-unit="Points" starts-on-message="Starts {startDate}"></sqm-task-card>
17
17
  */
18
18
  export class TaskCard {
19
19
  constructor() {
package/dist/collection/components/views/email-registration-view.js CHANGED
@@ -42,7 +42,7 @@ export function EmailRegistrationView(props) {
42
42
  h("div", { part: "erroralert-text" }, error)));
43
43
  };
44
44
  const emailValidationRegex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
45
- return (h("div", { class: sheet.classes.Wrapper, style: {
45
+ return (h("div", { part: "sqm-base", class: sheet.classes.Wrapper, style: {
46
46
  border: `${content.hideBorder ? "none" : "1px solid #eaeaea"}`,
47
47
  backgroundColor: content.backgroundColor,
48
48
  "padding-top": `var(--sl-spacing-${content.paddingTop})`,
package/dist/esm/{email-registration-view-07d80492.js → email-registration-view-a89a88bf.js} RENAMED
@@ -43,7 +43,7 @@ function EmailRegistrationView(props) {
43
43
  h("div", { part: "erroralert-text" }, error)));
44
44
  };
45
45
  const emailValidationRegex = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
46
- return (h("div", { class: sheet.classes.Wrapper, style: {
46
+ return (h("div", { part: "sqm-base", class: sheet.classes.Wrapper, style: {
47
47
  border: `${content.hideBorder ? "none" : "1px solid #eaeaea"}`,
48
48
  backgroundColor: content.backgroundColor,
49
49
  "padding-top": `var(--sl-spacing-${content.paddingTop})`,
package/dist/esm/sqm-instant-access-registration.entry.js CHANGED
@@ -5,7 +5,7 @@ import './jsonpointer-388a7082.js';
5
5
  import { c as cjs } from './cjs-bdfb4486.js';
6
6
  import './mixins-f60a614c.js';
7
7
  import './JSS-67b5cff8.js';
8
- import { E as EmailRegistrationView } from './email-registration-view-07d80492.js';
8
+ import { E as EmailRegistrationView } from './email-registration-view-a89a88bf.js';
9
9
  import './useRegistrationFormState-9fc1ac80.js';
10
10
  import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-46b89952.js';
11
11
 
package/dist/esm/sqm-referred-registration.entry.js CHANGED
@@ -5,7 +5,7 @@ import './jsonpointer-388a7082.js';
5
5
  import { c as cjs } from './cjs-bdfb4486.js';
6
6
  import './mixins-f60a614c.js';
7
7
  import './JSS-67b5cff8.js';
8
- import { E as EmailRegistrationView } from './email-registration-view-07d80492.js';
8
+ import { E as EmailRegistrationView } from './email-registration-view-a89a88bf.js';
9
9
  import './useRegistrationFormState-9fc1ac80.js';
10
10
  import { u as useInstantAccessRegistration } from './useInstantAccessRegistration-46b89952.js';
11
11