@saasquatch/squatch-js 2.3.2-9 → 2.4.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.
package/CHANGELOG.md CHANGED
@@ -1,4 +1,5 @@
1
1
  # Changelog
2
+
2
3
  All notable changes to this project will be documented in this file.
3
4
 
4
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
@@ -6,26 +7,78 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
6
7
 
7
8
  ## [Unreleased]
8
9
 
10
+ ## [2.4.0] - 2022-03-15
11
+
12
+ ### Changed
13
+
14
+ - EmbedWidget now supports a `container` as either a selector or an HTMLElement as a parameter
15
+
16
+ - Widget contents will be loaded in a hidden widget and can be opened and closed with `widget.open()` and `widget.close()`
17
+
18
+ - Example:
19
+
20
+ ```js
21
+ var initObj = {
22
+ id: "testUser",
23
+ accountId: "testUser",
24
+ widgetType: "<MY_WIDGET>",
25
+ user: {
26
+ id: "testUser",
27
+ accountId: "testUser",
28
+ },
29
+ jwt: "<MY_JWT>",
30
+ engagementMedium: "EMBED",
31
+ container: ".myContainer",
32
+ };
33
+
34
+ squatch
35
+ .widgets()
36
+ .upsertUser(initObj)
37
+ .then(function (response) {
38
+ widget = response.widget;
39
+ widget.open();
40
+ })
41
+ .catch(function (error) {
42
+ console.log(error);
43
+ });
44
+ ```
45
+
46
+ - PopupWidget now supports a `trigger` as a selector
47
+
48
+ - provides the ability to use a class other than `.squatchpop` for opening the widget
49
+
50
+ - `sq:refresh` event is sent when `.open()` is called on EmbedWidget and PopupWidget
51
+
9
52
  ## [2.3.1] - 2022-01-11
53
+
10
54
  ### Changed
55
+
11
56
  - Reduced resize timeout to 500ms from 5000ms
12
57
 
13
58
  ## [2.3.0] - 2021-05-19
59
+
14
60
  ### Added
61
+
15
62
  - Typescript definitions
16
63
  - CommonJS/ES modules build for smaller bundle sizes when using squatch-js from NPM
17
64
 
18
65
  ### Changed
19
- - `main` is now a CommonJS build instead of a UMD build
66
+
67
+ - `main` is now a CommonJS build instead of a UMD build
20
68
 
21
69
  ## [2.2.1] - 2020-06-17
70
+
22
71
  ### Changed
72
+
23
73
  - Remove the need to have JS Options, so that older clients can upgrade to squatch.js v2 easily.
24
74
 
25
75
  ## [2.2.0] - 2020-06-12
76
+
26
77
  ### Added
78
+
27
79
  - Reads `_saasquatch` from the URL and stores a 1st-party cookie on the specified landing page's domain.
28
80
  - Sets `cookies` on users during an upsert **automatically**
81
+
29
82
  ```js
30
83
  {
31
84
  user: {
@@ -35,105 +88,145 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
35
88
  ...
36
89
  }
37
90
  ```
91
+
38
92
  - Reads the 1st-party cookie when using `autofill`
93
+
39
94
  ```js
40
- squatch.api().squatchReferralCookie().then(function(response) {
41
- element.value = response.codes["program-id"];
42
- });
95
+ squatch
96
+ .api()
97
+ .squatchReferralCookie()
98
+ .then(function (response) {
99
+ element.value = response.codes["program-id"];
100
+ });
43
101
  ```
44
102
 
45
103
  ## [2.1.8] - 2020-05-25
104
+
46
105
  No release notes.
47
106
 
48
107
  ## [2.1.7] - 2020-05-21
108
+
49
109
  No release notes.
50
110
 
51
111
  ## [2.1.6] - 2019-04-15
112
+
52
113
  No release notes.
53
114
 
54
115
  ## [2.1.5] - 2019-02-19
116
+
55
117
  No release notes.
56
118
 
57
119
  ## [2.1.4] - 2019-01-03
120
+
58
121
  No release notes.
59
122
 
60
123
  ## [2.1.3] - 2018-12-05
124
+
61
125
  No release notes.
62
126
 
63
127
  ## [2.1.2] - 2018-10-22
128
+
64
129
  No release notes.
65
130
 
66
131
  ## [2.1.1] - 2018-10-19
132
+
67
133
  ### Fixed
134
+
68
135
  - POPUP Widget in iOS Safari is not clickable when is hidden anymore
69
136
 
70
137
  ## [2.1.0] - 2018-09-26
138
+
71
139
  No release notes.
72
140
 
73
141
  ## [2.0.17] - 2017-12-21
142
+
74
143
  ### Fixed
144
+
75
145
  - Fixed content-type detection bug
76
146
 
77
147
  ## [2.0.16] - 2017-10-24
148
+
78
149
  ### Fixed
150
+
79
151
  - Fix scrolling issue to allow scrolling within popup modal
80
152
 
81
153
  ## [2.0.15] - 2017-10-12
154
+
82
155
  ### Added
156
+
83
157
  - Support for scrolling popup in mobile
84
158
 
85
159
  ## [2.0.14] - 2017-10-11
160
+
86
161
  ### Fixed
162
+
87
163
  - Fix registration form message in popup
88
164
 
89
165
  ## [2.0.13] - 2017-08-03
166
+
90
167
  No release notes.
91
168
 
92
169
  ## [2.0.12] - 2017-07-18
170
+
93
171
  No release notes.
94
172
 
95
173
  ## [2.0.11] - 2017-07-18
174
+
96
175
  No release notes.
97
176
 
98
177
  ## [2.0.10] - 2017-06-30
178
+
99
179
  No release notes.
100
180
 
101
181
  ## [2.0.9] - 2017-06-08
182
+
102
183
  No release notes.
103
184
 
104
185
  ## [2.0.8] - 2017-06-08
186
+
105
187
  No release notes.
106
188
 
107
189
  ## [2.0.7] - 2017-04-24
190
+
108
191
  No release notes.
109
192
 
110
193
  ## [2.0.6] - 2017-02-14
194
+
111
195
  ### Fixed
196
+
112
197
  - Fix share tracking
113
198
  - Ignore CONVERSION_WIDGET widget rules when there's no referrals
114
199
 
115
200
  ### Changed
201
+
116
202
  - Auto-fill content type check changed to non-case sensitive
117
203
 
118
204
  ## [2.0.5] - 2016-12-07
205
+
119
206
  No release notes.
120
207
 
121
208
  ## [2.0.4] - 2016-12-06
209
+
122
210
  No release notes.
123
211
 
124
212
  ## [2.0.3] - 2016-11-30
213
+
125
214
  No release notes.
126
215
 
127
216
  ## [2.0.2] - 2016-11-29
217
+
128
218
  No release notes.
129
219
 
130
220
  ## [2.0.1] - 2016-11-25
221
+
131
222
  No release notes.
132
223
 
133
224
  ## [2.0.0] - 2016-11-25
225
+
134
226
  No release notes.
135
227
 
136
- [Unreleased]: https://github.com/saasquatch/squatch-js/compare/v2.3.1...HEAD
228
+ [unreleased]: https://github.com/saasquatch/squatch-js/compare/v2.4.0...HEAD
229
+ [2.4.0]: https://github.com/saasquatch/squatch-js/compare/v2.3.1...v2.4.0
137
230
  [2.3.1]: https://github.com/saasquatch/squatch-js/compare/v2.3.0...v2.3.1
138
231
  [2.3.0]: https://github.com/saasquatch/squatch-js/compare/v2.2.1...v2.3.0
139
232
  [2.2.1]: https://github.com/saasquatch/squatch-js/compare/v2.2.0...v2.2.1
@@ -1,56 +1,66 @@
1
1
  export default {
2
- template: `<!DOCTYPE html>
3
- <html>
4
- <head>
5
- <script type="text/javascript">
6
- window.widgetIdent = {"programId":"klip-referral-program","userId":"sam+klip@saasquat.ch","accountId":"sam+klip@saasquat.ch","token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InNhbStrbGlwQHNhYXNxdWF0LmNoIiwiaWQiOiJzYW0ra2xpcEBzYWFzcXVhdC5jaCIsImVtYWlsIjoic2FtK2tsaXBAc2Fhc3F1YXQuY2giLCJsb2NhbGUiOiJlbiJ9fQ.a2nYYrSJ81FHXlCU-Sqp_-wquQizinHBhzwzULDzimg","tenantAlias":"test_a74miwdpofztj","engagementMedium":"EMBED","appDomain":"https://staging.referralsaasquatch.com"};
7
- </script>
8
-
9
- <link rel="stylesheet" type="text/css" href="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-30/dist/mint-components/mint-components.css">
10
-
11
- <script src="https://fast-staging.ssqt.io/npm/@saasquatch/bedrock-components@1.3.0/dist/bedrock-components/bedrock-components.js"></script>
12
-
13
- <script src="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-30/dist/mint-components/mint-components.js"></script>
14
-
15
-
16
- <script src="https://fast-staging.ssqt.io/npm/@elastic/apm-rum@4.0.1/dist/bundles/elastic-apm-rum.umd.min.js" crossorigin></script>
17
- <script>
18
- window.apm = elasticApm.init({
19
- serviceName: 'programwidget-staging',
20
- serverUrl: 'https://1c9081d2ac2d43548254f581dca2dbee.apm.us-central1.gcp.cloud.es.io:443',
21
- active: Math.random() < 0.1
22
- })
23
- </script>
24
-
25
- </head>
26
- <body>
27
- <sqm-brand brand-color="#4225c4" brand-font="Nunito Sans"><sqm-portal-container direction="column" padding="small" gap="xxxx-large"><sqm-portal-container direction="column" padding="none" gap="xxx-large"><sqm-program-explainer header-background="#f3f0ec" card-background="#f4f2fd" color="black" card-description="Earn points by completing tasks like uploading your first video or sharing videos with friends. Use your points to redeem rewards like one free month of Klip Enterprise or two plane tickets to anywhere in North America." header="Klip Rewards" card-title="Earn rewards with our loyalty program"><sqm-program-explainer-step background="#5B3EDA" color="white" description="Earn up to $1200 in rewards for each referral" card-title="Invite your friends to Klip" icon="person-plus">
28
- </sqm-program-explainer-step><sqm-program-explainer-step background="#F3CC66" color="black" description="Get a $50 VISA giftcard when they pay for their first month" card-title="If your friend signs up for a Klip Business plan" icon="cash-stack">
29
- </sqm-program-explainer-step><sqm-program-explainer-step background="#D3CCF5" color="black" description="Get up to $1200 in rewards - a $200 VISA giftcard when our sales team qualifies them as a good fit for Klip, and a $1000 VISA giftcard when they become a paying customer" card-title="If your friend signs up for a Klip Enterprise plan" icon="people">
30
- </sqm-program-explainer-step></sqm-program-explainer><sqm-portal-container max-width="600px"><sqm-titled-section label-margin="small" padding="none" class="share-link-container"><sqm-text slot="label"><h3>Share your referral link</h3></sqm-text><sqm-share-link slot="content" class="share-link"> </sqm-share-link></sqm-titled-section><sqm-titled-section label-margin="small" padding="none"><sqm-text slot="label"><h3>Share via social media</h3></sqm-text><sqm-portal-container slot="content" direction="row" padding="none" gap="x-large" min-width="160px"><sqm-share-button icon="envelope" medium="email" size="medium" pill="true" class="email-button">Email a friend
31
- </sqm-share-button><sqm-share-button medium="twitter" size="medium" pill="true" class="twitter-button">Tweet about us
32
- </sqm-share-button><sqm-share-button medium="whatsapp" size="medium" pill="true" class="facebook-button">Share on Facebook
33
- </sqm-share-button></sqm-portal-container></sqm-titled-section></sqm-portal-container></sqm-portal-container><sqm-portal-container direction="column" padding="none" gap="xx-large"><sqm-titled-section padding="none" label-margin="none"><sqm-text slot="label"><h2>Referrals and rewards</h2></sqm-text></sqm-titled-section><sqm-stat-container space="xxxx-large"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount"><sqm-text><p>Referrals</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE"><sqm-text><p>Giftcards Earned</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/global"><sqm-text><p>Points Balance</p></sqm-text></sqm-big-stat></sqm-stat-container><sqm-card-feed><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="" open-new-tab="false">
34
- </sqm-task-card><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">
35
- </sqm-task-card><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">
36
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><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">
37
- </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="100" goal="5" repeatable="true" show-progress-bar="true" steps="true" card-title="Share 5 Videos" description="Earn 100 points for collaborating each time you share 5 videos." button-text="Share" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videosShared" open-new-tab="false">
38
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Buy a Business or Enterprise plan and get 1 free month of Klip for being a committed customer." button-text="Upgrade" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/programGoals/count/Upgrade-Plan" open-new-tab="false">
39
- </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="200" goal="5" show-progress-bar="" steps="" card-title="Purchase 5 Seats" description="Earn 200 points when you expand your Klip Team by purchasing 5 or more seats." button-text="Purchase seats" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/customFields/seatCount" reward-duration="2021-11-02T07:00:00.000Z/2021-11-07T07:00:00.000Z" show-expiry="">
40
- </sqm-task-card><sqm-task-card reward-amount="250" goal="1" repeatable="" show-progress-bar="" card-title="Upload 1 Hour of Video" description="Record and upload an hour of video and get 250 points for being a super user." button-text="Upload" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videoHoursCount" reward-duration="2021-12-31T08:00:00.000Z/2022-01-02T08:00:00.000Z" show-expiry="" finite="3" progress-bar-unit="" reward-unit="Points">
41
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="100" goal="1" card-title="Complete an NPS Survey" description="Fill out our NPS survey and get 100 points for giving us honest feedback. Be sure to use your Klip account email when completing the survey." button-text="Complete survey" button-link="https://y5tqgj96plv.typeform.com/to/p6N7lHUk" stat-type="/programGoals/count/NPS-Survey" reward-unit="Points" open-new-tab="true">
42
- </sqm-task-card></sqb-program-section><sqb-conditional-section condition="'champion' in user.segments"><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="$100" goal="1" card-title="Complete a Case Study" description="Write a Klip case study and earn a $100 Visa Gift Card for letting us know how Klip has helped your team succeed." button-text="Complete case study" button-link="https://y5tqgj96plv.typeform.com/to/CPhkFBBW" stat-type="/programGoals/count/Case-Study" reward-unit="Visa Gift Card" open-new-tab="true">
43
- </sqm-task-card></sqb-program-section></sqb-conditional-section></sqm-card-feed><sl-tab-group><sl-tab slot="nav" panel="referralLeaderboard">Leaderboard</sl-tab><sl-tab slot="nav" panel="referralHistory">Referral history</sl-tab><sl-tab slot="nav" panel="rewardHistory">Reward history</sl-tab><sl-tab slot="nav" panel="rewardExchange">Redeem</sl-tab><sl-tab-panel name="referralHistory"><sqm-referral-table><sqm-referral-table-user-column column-title="User">
44
- </sqm-referral-table-user-column><sqm-referral-table-status-column column-title="Referral Status">
45
- </sqm-referral-table-status-column><sqm-referral-table-rewards-column>
46
- </sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date Referred" date-shown="dateReferralStarted">
47
- </sqm-referral-table-date-column></sqm-referral-table></sl-tab-panel><sl-tab-panel name="referralLeaderboard"><sqm-titled-section padding="medium" label-margin="small"><sqm-text slot="label"><h2>Leaderboard</h2></sqm-text><sqm-text slot="content"><p>
48
- Be one of the top 3 referrers at the end of the year and receive
49
- Klip free for 1 year!
50
- </p></sqm-text></sqm-titled-section><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" interval="2021-10-05T07:00:00.000Z/2022-03-13T08:00:00.000Z" rankheading="Rank">
51
- </sqm-leaderboard></sl-tab-panel><sl-tab-panel name="rewardHistory"><sqb-program-section program-id=""><sqm-rewards-table per-page="4"><sqm-rewards-table-reward-column></sqm-rewards-table-reward-column><sqm-rewards-table-source-column></sqm-rewards-table-source-column><sqm-rewards-table-status-column></sqm-rewards-table-status-column><sqm-rewards-table-date-column></sqm-rewards-table-date-column></sqm-rewards-table></sqb-program-section></sl-tab-panel><sl-tab-panel name="rewardExchange"><sqm-reward-exchange-list></sqm-reward-exchange-list></sl-tab-panel></sl-tab-group></sqm-portal-container></sqm-portal-container></sqm-brand><style>* { box-sizing: border-box; } body {margin: 0;}:root{--sqm-portal-background: white;--sl-color-primary-hue: var(--sl-color-primary-500);--sl-focus-ring-color-primary: var(--sl-color-primary-100);}.twitter-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(0, 172, 238);}.facebook-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(59, 89, 152);}.email-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(102, 102, 102);}.facebook-button::part(defaultsharebutton-base):active{outline-color:initial;outline-style:none;outline-width:initial;}</style>
52
- </body>
53
- </html>
2
+ template: `
3
+ <!DOCTYPE html>
4
+ <html>
5
+ <head>
6
+ <script type="text/javascript">
7
+ window.widgetIdent = {"programId":"klip-referral-program","userId":"sam+klip@saasquat.ch","accountId":"sam+klip@saasquat.ch","token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InNhbStrbGlwQHNhYXNxdWF0LmNoIiwiaWQiOiJzYW0ra2xpcEBzYWFzcXVhdC5jaCIsImVtYWlsIjoic2FtK2tsaXBAc2Fhc3F1YXQuY2giLCJsb2NhbGUiOiJlbiIsImN1c3RvbUZpZWxkcyI6e319fQ.4AneYO6_38IcAr6q_k7V-UDeU8aTtOzVu24zvUsnml4","tenantAlias":"test_a74miwdpofztj","engagementMedium":"EMBED","appDomain":"https://staging.referralsaasquatch.com"};
8
+ </script>
9
+
10
+ <link rel="stylesheet" type="text/css" href="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-62/dist/mint-components/mint-components.css">
11
+
12
+ <script src="https://fast-staging.ssqt.io/npm/@saasquatch/bedrock-components@1.3.1-7/dist/bedrock-components/bedrock-components.js"></script>
13
+
14
+ <script src="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-62/dist/mint-components/mint-components.js"></script>
15
+
16
+
17
+ <script src="https://fast-staging.ssqt.io/npm/@elastic/apm-rum@4.0.1/dist/bundles/elastic-apm-rum.umd.min.js" crossorigin></script>
18
+ <script>
19
+ window.apm = elasticApm.init({
20
+ serviceName: 'programwidget-staging',
21
+ serverUrl: 'https://1c9081d2ac2d43548254f581dca2dbee.apm.us-central1.gcp.cloud.es.io:443',
22
+ active: Math.random() < 0.1
23
+ })
24
+ </script>
25
+
26
+ </head>
27
+ <body>
28
+ <sqm-brand brand-color="#4225c4" brand-font="Nunito Sans"><sqm-portal-container direction="column" padding="small" gap="xxxx-large"><sqm-portal-container direction="column" padding="none" gap="xxx-large"><sqm-hero-image image-url="https://i.imgur.com/yr6ER3R.png" header="Klip Rewards" description="Refer friends and complete tasks while using Klip to earn rewards" layout="columns" image-pos="right" background-color="#F9F9F9">
29
+ </sqm-hero-image><sqm-stat-container space="xxxx-large"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount"><sqm-text><p>Referrals</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE"><sqm-text><p>Giftcards Earned</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/value/global"><sqm-text><p>Points Balance</p></sqm-text></sqm-big-stat></sqm-stat-container><sqm-titled-section align="center"><sqm-text slot="label"><h3>Share $50 with friends</h3></sqm-text><sqm-text slot="content"><p>
30
+ They’ll get a $50 credit towards a new account and you’ll get up to
31
+ $1200
32
+ </p></sqm-text></sqm-titled-section><sqm-referral-card><sqm-timeline slot="left" icon="circle"><sqm-timeline-entry reward="75" unit="points" desc="Your friends signs up for a free trial">
33
+ </sqm-timeline-entry><sqm-timeline-entry reward="$50" unit="visa giftcard" desc="Your friends signs up for Klip Business">
34
+ </sqm-timeline-entry><sqm-timeline-entry reward="$200" unit="visa giftcard" desc="Your friend qualifies as a good fit for Klip Enterprise">
35
+ </sqm-timeline-entry><sqm-timeline-entry reward="$1000" unit="visa giftcard" desc="Your friend purchases Klip Enterprise">
36
+ </sqm-timeline-entry></sqm-timeline><sqm-portal-container gap="large" slot="right"><sqm-text>Choose how you want to share: </sqm-text><sqm-text><p light="">Your unique referral link:</p><sqm-share-link> </sqm-share-link></sqm-text><sqm-portal-container gap="x-small"><sqm-share-button medium="email">
37
+ Share via email
38
+ </sqm-share-button><sqm-share-button medium="linkedin">
39
+ Share on LinkedIn
40
+ </sqm-share-button><sqm-share-button medium="twitter">
41
+ Tweet about us
42
+ </sqm-share-button></sqm-portal-container></sqm-portal-container></sqm-referral-card></sqm-portal-container><sqm-portal-container direction="column" padding="none" gap="xx-large"><sqm-titled-section align="center"><sqm-text slot="label"><h3>Earn more rewards</h3></sqm-text><sqm-text slot="content"><p>
43
+ Get points while using Klip. Use those points to redeem rewards like
44
+ one free month of Klip Enterprise or two plane tickets to anywhere
45
+ in North America
46
+ </p></sqm-text></sqm-titled-section><sqm-card-feed><sqb-program-section program-id="klip-loyalty"><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">
47
+ </sqm-task-card></sqb-program-section><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">
48
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><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">
49
+ </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="100" goal="5" repeatable="true" show-progress-bar="true" steps="true" card-title="Share 5 Videos" description="Earn 100 points for collaborating each time you share 5 videos." button-text="Share" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videosShared" open-new-tab="false">
50
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Buy a Business or Enterprise plan and get 1 free month of Klip for being a committed customer." button-text="Upgrade" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/programGoals/count/Upgrade-Plan" open-new-tab="false">
51
+ </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="200" goal="5" show-progress-bar="" steps="" card-title="Purchase 5 Seats" description="Earn 200 points when you expand your Klip Team by purchasing 5 or more seats." button-text="Purchase seats" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/customFields/seatCount" reward-duration="2021-11-02T07:00:00.000Z/2021-11-07T07:00:00.000Z" show-expiry="">
52
+ </sqm-task-card><sqm-task-card reward-amount="250" goal="1" repeatable="" show-progress-bar="" card-title="Upload 1 Hour of Video" description="Record and upload an hour of video and get 250 points for being a super user." button-text="Upload" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videoHoursCount" reward-duration="2021-12-31T08:00:00.000Z/2022-01-02T08:00:00.000Z" show-expiry="" finite="3" progress-bar-unit="" reward-unit="Points">
53
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="100" goal="1" card-title="Complete an NPS Survey" description="Fill out our NPS survey and get 100 points for giving us honest feedback. Be sure to use your Klip account email when completing the survey." button-text="Complete survey" button-link="https://y5tqgj96plv.typeform.com/to/p6N7lHUk" stat-type="/programGoals/count/NPS-Survey" reward-unit="Points" open-new-tab="true">
54
+ </sqm-task-card></sqb-program-section><sqb-conditional-section condition="'champion' in user.segments"><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="$100" goal="1" card-title="Complete a Case Study" description="Write a Klip case study and earn a $100 Visa Gift Card for letting us know how Klip has helped your team succeed." button-text="Complete case study" button-link="https://y5tqgj96plv.typeform.com/to/CPhkFBBW" stat-type="/programGoals/count/Case-Study" reward-unit="Visa Gift Card" open-new-tab="true">
55
+ </sqm-task-card></sqb-program-section></sqb-conditional-section></sqm-card-feed><sl-tab-group><sl-tab slot="nav" panel="referralLeaderboard">Leaderboard </sl-tab><sl-tab slot="nav" panel="referralHistory">Referral history </sl-tab><sl-tab slot="nav" panel="rewardHistory">Reward history </sl-tab><sl-tab slot="nav" panel="rewardExchange">Redeem </sl-tab><sl-tab-panel name="referralHistory"><sqm-referral-table per-page="4"><sqm-referral-table-user-column column-title="User">
56
+ </sqm-referral-table-user-column><sqm-referral-table-status-column column-title="Referral status">
57
+ </sqm-referral-table-status-column><sqm-referral-table-rewards-column>
58
+ </sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date referred" date-shown="dateReferralStarted">
59
+ </sqm-referral-table-date-column></sqm-referral-table></sl-tab-panel><sl-tab-panel name="referralLeaderboard"><sqm-portal-container gap="large"><sqm-hero-image image-url="https://i.imgur.com/2evfTx7.png" description="Be one of the top 3 referrers at the end of the year and receive Klip free for 1 year!" layout="columns" image-pos="left" background-color="#EFF8FE">
60
+ </sqm-hero-image><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true">
61
+ </sqm-leaderboard></sqm-portal-container></sl-tab-panel><sl-tab-panel name="rewardHistory"><sqb-program-section program-id=""><sqm-rewards-table per-page="4"><sqm-rewards-table-reward-column></sqm-rewards-table-reward-column><sqm-rewards-table-source-column></sqm-rewards-table-source-column><sqm-rewards-table-status-column></sqm-rewards-table-status-column><sqm-rewards-table-date-column></sqm-rewards-table-date-column></sqm-rewards-table></sqb-program-section></sl-tab-panel><sl-tab-panel name="rewardExchange"><sqm-reward-exchange-list></sqm-reward-exchange-list></sl-tab-panel></sl-tab-group></sqm-portal-container></sqm-portal-container></sqm-brand><style>* { box-sizing: border-box; } body {margin: 0;}:root{--sqm-portal-background: white;}sl-tab-panel::part(base){padding-top: !important;padding-right: !important;padding-bottom: !important;padding-left: !important;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}.facebook-button::part(defaultsharebutton-base):active{outline-color:initial;outline-style:none;outline-width:initial;}</style>
62
+ </body>
63
+ </html>
54
64
  `,
55
65
  jsOptions: {},
56
66
  user: {
@@ -1,56 +1,66 @@
1
1
  export default {
2
- template: `<!DOCTYPE html>
2
+ template: `
3
+ <!DOCTYPE html>
3
4
  <html>
4
- <head>
5
- <script type="text/javascript">
6
- window.widgetIdent = {"programId":"klip-referral-program","userId":"sam+klip@saasquat.ch","accountId":"sam+klip@saasquat.ch","token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InNhbStrbGlwQHNhYXNxdWF0LmNoIiwiaWQiOiJzYW0ra2xpcEBzYWFzcXVhdC5jaCIsImVtYWlsIjoic2FtK2tsaXBAc2Fhc3F1YXQuY2giLCJsb2NhbGUiOiJlbiJ9fQ.a2nYYrSJ81FHXlCU-Sqp_-wquQizinHBhzwzULDzimg","tenantAlias":"test_a74miwdpofztj","engagementMedium":"EMBED","appDomain":"https://staging.referralsaasquatch.com"};
7
- </script>
8
-
9
- <link rel="stylesheet" type="text/css" href="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-30/dist/mint-components/mint-components.css">
10
-
11
- <script src="https://fast-staging.ssqt.io/npm/@saasquatch/bedrock-components@1.3.0/dist/bedrock-components/bedrock-components.js"></script>
12
-
13
- <script src="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-30/dist/mint-components/mint-components.js"></script>
14
-
15
-
16
- <script src="https://fast-staging.ssqt.io/npm/@elastic/apm-rum@4.0.1/dist/bundles/elastic-apm-rum.umd.min.js" crossorigin></script>
17
- <script>
18
- window.apm = elasticApm.init({
19
- serviceName: 'programwidget-staging',
20
- serverUrl: 'https://1c9081d2ac2d43548254f581dca2dbee.apm.us-central1.gcp.cloud.es.io:443',
21
- active: Math.random() < 0.1
22
- })
23
- </script>
24
-
25
- </head>
26
- <body>
27
- <sqm-brand brand-color="#4225c4" brand-font="Nunito Sans"><sqm-portal-container class="squatch-container" direction="column" padding="small" gap="xxxx-large"><sqm-portal-container direction="column" padding="none" gap="xxx-large"><sqm-program-explainer header-background="#f3f0ec" card-background="#f4f2fd" color="black" card-description="Earn points by completing tasks like uploading your first video or sharing videos with friends. Use your points to redeem rewards like one free month of Klip Enterprise or two plane tickets to anywhere in North America." header="Klip Rewards" card-title="Earn rewards with our loyalty program"><sqm-program-explainer-step background="#5B3EDA" color="white" description="Earn up to $1200 in rewards for each referral" card-title="Invite your friends to Klip" icon="person-plus">
28
- </sqm-program-explainer-step><sqm-program-explainer-step background="#F3CC66" color="black" description="Get a $50 VISA giftcard when they pay for their first month" card-title="If your friend signs up for a Klip Business plan" icon="cash-stack">
29
- </sqm-program-explainer-step><sqm-program-explainer-step background="#D3CCF5" color="black" description="Get up to $1200 in rewards - a $200 VISA giftcard when our sales team qualifies them as a good fit for Klip, and a $1000 VISA giftcard when they become a paying customer" card-title="If your friend signs up for a Klip Enterprise plan" icon="people">
30
- </sqm-program-explainer-step></sqm-program-explainer><sqm-portal-container max-width="600px"><sqm-titled-section label-margin="small" padding="none" class="share-link-container"><sqm-text slot="label"><h3>Share your referral link</h3></sqm-text><sqm-share-link slot="content" class="share-link"> </sqm-share-link></sqm-titled-section><sqm-titled-section label-margin="small" padding="none"><sqm-text slot="label"><h3>Share via social media</h3></sqm-text><sqm-portal-container slot="content" direction="row" padding="none" gap="x-large" min-width="160px"><sqm-share-button icon="envelope" medium="email" size="medium" pill="true" class="email-button">Email a friend
31
- </sqm-share-button><sqm-share-button medium="twitter" size="medium" pill="true" class="twitter-button">Tweet about us
32
- </sqm-share-button><sqm-share-button medium="whatsapp" size="medium" pill="true" class="facebook-button">Share on Facebook
33
- </sqm-share-button></sqm-portal-container></sqm-titled-section></sqm-portal-container></sqm-portal-container><sqm-portal-container direction="column" padding="none" gap="xx-large"><sqm-titled-section padding="none" label-margin="none"><sqm-text slot="label"><h2>Referrals and rewards</h2></sqm-text></sqm-titled-section><sqm-stat-container space="xxxx-large"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount"><sqm-text><p>Referrals</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE"><sqm-text><p>Giftcards Earned</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/global"><sqm-text><p>Points Balance</p></sqm-text></sqm-big-stat></sqm-stat-container><sqm-card-feed><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="" open-new-tab="false">
34
- </sqm-task-card><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">
35
- </sqm-task-card><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">
36
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><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">
37
- </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="100" goal="5" repeatable="true" show-progress-bar="true" steps="true" card-title="Share 5 Videos" description="Earn 100 points for collaborating each time you share 5 videos." button-text="Share" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videosShared" open-new-tab="false">
38
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Buy a Business or Enterprise plan and get 1 free month of Klip for being a committed customer." button-text="Upgrade" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/programGoals/count/Upgrade-Plan" open-new-tab="false">
39
- </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="200" goal="5" show-progress-bar="" steps="" card-title="Purchase 5 Seats" description="Earn 200 points when you expand your Klip Team by purchasing 5 or more seats." button-text="Purchase seats" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/customFields/seatCount" reward-duration="2021-11-02T07:00:00.000Z/2021-11-07T07:00:00.000Z" show-expiry="">
40
- </sqm-task-card><sqm-task-card reward-amount="250" goal="1" repeatable="" show-progress-bar="" card-title="Upload 1 Hour of Video" description="Record and upload an hour of video and get 250 points for being a super user." button-text="Upload" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videoHoursCount" reward-duration="2021-12-31T08:00:00.000Z/2022-01-02T08:00:00.000Z" show-expiry="" finite="3" progress-bar-unit="" reward-unit="Points">
41
- </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="100" goal="1" card-title="Complete an NPS Survey" description="Fill out our NPS survey and get 100 points for giving us honest feedback. Be sure to use your Klip account email when completing the survey." button-text="Complete survey" button-link="https://y5tqgj96plv.typeform.com/to/p6N7lHUk" stat-type="/programGoals/count/NPS-Survey" reward-unit="Points" open-new-tab="true">
42
- </sqm-task-card></sqb-program-section><sqb-conditional-section condition="'champion' in user.segments"><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="$100" goal="1" card-title="Complete a Case Study" description="Write a Klip case study and earn a $100 Visa Gift Card for letting us know how Klip has helped your team succeed." button-text="Complete case study" button-link="https://y5tqgj96plv.typeform.com/to/CPhkFBBW" stat-type="/programGoals/count/Case-Study" reward-unit="Visa Gift Card" open-new-tab="true">
43
- </sqm-task-card></sqb-program-section></sqb-conditional-section></sqm-card-feed><sl-tab-group><sl-tab slot="nav" panel="referralLeaderboard">Leaderboard</sl-tab><sl-tab slot="nav" panel="referralHistory">Referral history</sl-tab><sl-tab slot="nav" panel="rewardHistory">Reward history</sl-tab><sl-tab slot="nav" panel="rewardExchange">Redeem</sl-tab><sl-tab-panel name="referralHistory"><sqm-referral-table><sqm-referral-table-user-column column-title="User">
44
- </sqm-referral-table-user-column><sqm-referral-table-status-column column-title="Referral Status">
45
- </sqm-referral-table-status-column><sqm-referral-table-rewards-column>
46
- </sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date Referred" date-shown="dateReferralStarted">
47
- </sqm-referral-table-date-column></sqm-referral-table></sl-tab-panel><sl-tab-panel name="referralLeaderboard"><sqm-titled-section padding="medium" label-margin="small"><sqm-text slot="label"><h2>Leaderboard</h2></sqm-text><sqm-text slot="content"><p>
48
- Be one of the top 3 referrers at the end of the year and receive
49
- Klip free for 1 year!
50
- </p></sqm-text></sqm-titled-section><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" interval="2021-10-05T07:00:00.000Z/2022-03-13T08:00:00.000Z" rankheading="Rank">
51
- </sqm-leaderboard></sl-tab-panel><sl-tab-panel name="rewardHistory"><sqb-program-section program-id=""><sqm-rewards-table per-page="4"><sqm-rewards-table-reward-column></sqm-rewards-table-reward-column><sqm-rewards-table-source-column></sqm-rewards-table-source-column><sqm-rewards-table-status-column></sqm-rewards-table-status-column><sqm-rewards-table-date-column></sqm-rewards-table-date-column></sqm-rewards-table></sqb-program-section></sl-tab-panel><sl-tab-panel name="rewardExchange"><sqm-reward-exchange-list></sqm-reward-exchange-list></sl-tab-panel></sl-tab-group></sqm-portal-container></sqm-portal-container></sqm-brand><style>* { box-sizing: border-box; } body {margin: 0;}:root{--sqm-portal-background: white;--sl-color-primary-hue: var(--sl-color-primary-500);--sl-focus-ring-color-primary: var(--sl-color-primary-100);}.twitter-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(0, 172, 238);}.facebook-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(59, 89, 152);}.email-button::part(defaultsharebutton-base){border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px;color:rgb(255, 255, 255);border-top-width:initial;border-right-width:initial;border-bottom-width:initial;border-left-width:initial;border-top-style:none;border-right-style:none;border-bottom-style:none;border-left-style:none;border-top-color:initial;border-right-color:initial;border-bottom-color:initial;border-left-color:initial;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background-image:initial;background-position-x:initial;background-position-y:initial;background-size:initial;background-repeat-x:initial;background-repeat-y:initial;background-attachment:initial;background-origin:initial;background-clip:initial;background-color:rgb(102, 102, 102);}.facebook-button::part(defaultsharebutton-base):active{outline-color:initial;outline-style:none;outline-width:initial;}</style>
52
- </body>
53
- </html>`,
5
+ <head>
6
+ <script type="text/javascript">
7
+ window.widgetIdent = {"programId":"klip-referral-program","userId":"sam+klip@saasquat.ch","accountId":"sam+klip@saasquat.ch","token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyIjp7ImFjY291bnRJZCI6InNhbStrbGlwQHNhYXNxdWF0LmNoIiwiaWQiOiJzYW0ra2xpcEBzYWFzcXVhdC5jaCIsImVtYWlsIjoic2FtK2tsaXBAc2Fhc3F1YXQuY2giLCJsb2NhbGUiOiJlbiIsImN1c3RvbUZpZWxkcyI6e319fQ.4AneYO6_38IcAr6q_k7V-UDeU8aTtOzVu24zvUsnml4","tenantAlias":"test_a74miwdpofztj","engagementMedium":"EMBED","appDomain":"https://staging.referralsaasquatch.com"};
8
+ </script>
9
+
10
+ <link rel="stylesheet" type="text/css" href="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-62/dist/mint-components/mint-components.css">
11
+
12
+ <script src="https://fast-staging.ssqt.io/npm/@saasquatch/bedrock-components@1.3.1-7/dist/bedrock-components/bedrock-components.js"></script>
13
+
14
+ <script src="https://fast-staging.ssqt.io/npm/@saasquatch/mint-components@1.5.0-62/dist/mint-components/mint-components.js"></script>
15
+
16
+
17
+ <script src="https://fast-staging.ssqt.io/npm/@elastic/apm-rum@4.0.1/dist/bundles/elastic-apm-rum.umd.min.js" crossorigin></script>
18
+ <script>
19
+ window.apm = elasticApm.init({
20
+ serviceName: 'programwidget-staging',
21
+ serverUrl: 'https://1c9081d2ac2d43548254f581dca2dbee.apm.us-central1.gcp.cloud.es.io:443',
22
+ active: Math.random() < 0.1
23
+ })
24
+ </script>
25
+
26
+ </head>
27
+ <body>
28
+ <sqm-brand brand-color="#4225c4" brand-font="Nunito Sans"><sqm-portal-container class="squatch-container" direction="column" padding="small" gap="xxxx-large"><sqm-portal-container direction="column" padding="none" gap="xxx-large"><sqm-hero-image image-url="https://i.imgur.com/yr6ER3R.png" header="Klip Rewards" description="Refer friends and complete tasks while using Klip to earn rewards" layout="columns" image-pos="right" background-color="#F9F9F9">
29
+ </sqm-hero-image><sqm-stat-container space="xxxx-large"><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/referralsCount"><sqm-text><p>Referrals</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/integrationRewardsCountFiltered/AVAILABLE"><sqm-text><p>Giftcards Earned</p></sqm-text></sqm-big-stat><sqm-big-stat flex-reverse="true" alignment="left" stat-type="/rewardBalance/CREDIT/POINT/value/global"><sqm-text><p>Points Balance</p></sqm-text></sqm-big-stat></sqm-stat-container><sqm-titled-section align="center"><sqm-text slot="label"><h3>Share $50 with friends</h3></sqm-text><sqm-text slot="content"><p>
30
+ They’ll get a $50 credit towards a new account and you’ll get up to
31
+ $1200
32
+ </p></sqm-text></sqm-titled-section><sqm-referral-card><sqm-timeline slot="left" icon="circle"><sqm-timeline-entry reward="75" unit="points" desc="Your friends signs up for a free trial">
33
+ </sqm-timeline-entry><sqm-timeline-entry reward="$50" unit="visa giftcard" desc="Your friends signs up for Klip Business">
34
+ </sqm-timeline-entry><sqm-timeline-entry reward="$200" unit="visa giftcard" desc="Your friend qualifies as a good fit for Klip Enterprise">
35
+ </sqm-timeline-entry><sqm-timeline-entry reward="$1000" unit="visa giftcard" desc="Your friend purchases Klip Enterprise">
36
+ </sqm-timeline-entry></sqm-timeline><sqm-portal-container gap="large" slot="right"><sqm-text>Choose how you want to share: </sqm-text><sqm-text><p light="">Your unique referral link:</p><sqm-share-link> </sqm-share-link></sqm-text><sqm-portal-container gap="x-small"><sqm-share-button medium="email">
37
+ Share via email
38
+ </sqm-share-button><sqm-share-button medium="linkedin">
39
+ Share on LinkedIn
40
+ </sqm-share-button><sqm-share-button medium="twitter">
41
+ Tweet about us
42
+ </sqm-share-button></sqm-portal-container></sqm-portal-container></sqm-referral-card></sqm-portal-container><sqm-portal-container direction="column" padding="none" gap="xx-large"><sqm-titled-section align="center"><sqm-text slot="label"><h3>Earn more rewards</h3></sqm-text><sqm-text slot="content"><p>
43
+ Get points while using Klip. Use those points to redeem rewards like
44
+ one free month of Klip Enterprise or two plane tickets to anywhere
45
+ in North America
46
+ </p></sqm-text></sqm-titled-section><sqm-card-feed><sqb-program-section program-id="klip-loyalty"><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">
47
+ </sqm-task-card></sqb-program-section><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">
48
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><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">
49
+ </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="100" goal="5" repeatable="true" show-progress-bar="true" steps="true" card-title="Share 5 Videos" description="Earn 100 points for collaborating each time you share 5 videos." button-text="Share" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videosShared" open-new-tab="false">
50
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="1" reward-unit="Free Month" goal="1" card-title="Upgrade Your Plan" description="Buy a Business or Enterprise plan and get 1 free month of Klip for being a committed customer." button-text="Upgrade" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/programGoals/count/Upgrade-Plan" open-new-tab="false">
51
+ </sqm-task-card></sqb-program-section><sqm-task-card reward-amount="200" goal="5" show-progress-bar="" steps="" card-title="Purchase 5 Seats" description="Earn 200 points when you expand your Klip Team by purchasing 5 or more seats." button-text="Purchase seats" button-link="https://klip-staging.vercel.app/app/plans" stat-type="/customFields/seatCount" reward-duration="2021-11-02T07:00:00.000Z/2021-11-07T07:00:00.000Z" show-expiry="">
52
+ </sqm-task-card><sqm-task-card reward-amount="250" goal="1" repeatable="" show-progress-bar="" card-title="Upload 1 Hour of Video" description="Record and upload an hour of video and get 250 points for being a super user." button-text="Upload" button-link="https://klip-staging.vercel.app/app" stat-type="/customFields/videoHoursCount" reward-duration="2021-12-31T08:00:00.000Z/2022-01-02T08:00:00.000Z" show-expiry="" finite="3" progress-bar-unit="" reward-unit="Points">
53
+ </sqm-task-card><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="100" goal="1" card-title="Complete an NPS Survey" description="Fill out our NPS survey and get 100 points for giving us honest feedback. Be sure to use your Klip account email when completing the survey." button-text="Complete survey" button-link="https://y5tqgj96plv.typeform.com/to/p6N7lHUk" stat-type="/programGoals/count/NPS-Survey" reward-unit="Points" open-new-tab="true">
54
+ </sqm-task-card></sqb-program-section><sqb-conditional-section condition="'champion' in user.segments"><sqb-program-section program-id="klip-loyalty"><sqm-task-card reward-amount="$100" goal="1" card-title="Complete a Case Study" description="Write a Klip case study and earn a $100 Visa Gift Card for letting us know how Klip has helped your team succeed." button-text="Complete case study" button-link="https://y5tqgj96plv.typeform.com/to/CPhkFBBW" stat-type="/programGoals/count/Case-Study" reward-unit="Visa Gift Card" open-new-tab="true">
55
+ </sqm-task-card></sqb-program-section></sqb-conditional-section></sqm-card-feed><sl-tab-group><sl-tab slot="nav" panel="referralLeaderboard">Leaderboard </sl-tab><sl-tab slot="nav" panel="referralHistory">Referral history </sl-tab><sl-tab slot="nav" panel="rewardHistory">Reward history </sl-tab><sl-tab slot="nav" panel="rewardExchange">Redeem </sl-tab><sl-tab-panel name="referralHistory"><sqm-referral-table per-page="4"><sqm-referral-table-user-column column-title="User">
56
+ </sqm-referral-table-user-column><sqm-referral-table-status-column column-title="Referral status">
57
+ </sqm-referral-table-status-column><sqm-referral-table-rewards-column>
58
+ </sqm-referral-table-rewards-column><sqm-referral-table-date-column column-title="Date referred" date-shown="dateReferralStarted">
59
+ </sqm-referral-table-date-column></sqm-referral-table></sl-tab-panel><sl-tab-panel name="referralLeaderboard"><sqm-portal-container gap="large"><sqm-hero-image image-url="https://i.imgur.com/2evfTx7.png" description="Be one of the top 3 referrers at the end of the year and receive Klip free for 1 year!" layout="columns" image-pos="left" background-color="#EFF8FE">
60
+ </sqm-hero-image><sqm-leaderboard usersheading="Referrer" statsheading="Referrals" rank-type="rank" leaderboard-type="topStartedReferrers" rankheading="Rank" show-rank="true">
61
+ </sqm-leaderboard></sqm-portal-container></sl-tab-panel><sl-tab-panel name="rewardHistory"><sqb-program-section program-id=""><sqm-rewards-table per-page="4"><sqm-rewards-table-reward-column></sqm-rewards-table-reward-column><sqm-rewards-table-source-column></sqm-rewards-table-source-column><sqm-rewards-table-status-column></sqm-rewards-table-status-column><sqm-rewards-table-date-column></sqm-rewards-table-date-column></sqm-rewards-table></sqb-program-section></sl-tab-panel><sl-tab-panel name="rewardExchange"><sqm-reward-exchange-list></sqm-reward-exchange-list></sl-tab-panel></sl-tab-group></sqm-portal-container></sqm-portal-container></sqm-brand><style>* { box-sizing: border-box; } body {margin: 0;}:root{--sqm-portal-background: white;}sl-tab-panel::part(base){padding-top: !important;padding-right: !important;padding-bottom: !important;padding-left: !important;}*{box-sizing:border-box;}body{margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;}.facebook-button::part(defaultsharebutton-base):active{outline-color:initial;outline-style:none;outline-width:initial;}</style>
62
+ </body>
63
+ </html>`,
54
64
  jsOptions: {},
55
65
  user: {
56
66
  id: "sam+klip@saasquat.ch",