@saasquatch/mint-components 1.5.0-44 → 1.5.0-45

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.
@@ -533,6 +533,10 @@ const ReferralTableRewardsCell = class {
533
533
  render() {
534
534
  global.intl.locale = this.locale;
535
535
  const style = {
536
+ "@keyframes slideRight": {
537
+ from: { opacity: 0 },
538
+ to: { opacity: 1 },
539
+ },
536
540
  DetailsContainer: {
537
541
  width: "100%",
538
542
  display: "flex",
@@ -558,10 +562,12 @@ const ReferralTableRewardsCell = class {
558
562
  "&::part(summary-icon)": {
559
563
  display: `${this.hideDetails ? "none" : "flex"}`,
560
564
  },
565
+ "&::part(summary-icon[open])": {
566
+ transform: "rotate(-90deg)",
567
+ background: "red",
568
+ },
561
569
  },
562
570
  BadgeContainer: {
563
- float: "right",
564
- marginRight: "var(--sl-spacing-medium)",
565
571
  "& > :not(:last-child)": {
566
572
  "margin-right": "var(--sl-spacing-x-small)",
567
573
  },
@@ -578,47 +584,6 @@ const ReferralTableRewardsCell = class {
578
584
  background: "var(--sl-color-blue-600)",
579
585
  },
580
586
  },
581
- Description: {
582
- maxWidth: "500px",
583
- padding: "var(--sl-spacing-x-small)",
584
- border: "1px solid var(--sl-color-neutral-200)",
585
- borderRadius: "var(--sl-border-radius-medium)",
586
- boxSizing: "border-box",
587
- marginBottom: "var(--sl-spacing-small)",
588
- "& input[type=checkbox]": {
589
- display: "none",
590
- },
591
- "& input:checked ~ .details": {
592
- transform: "rotate(-180deg)",
593
- },
594
- "& .details": {
595
- float: "right",
596
- top: "var(--sl-spacing-medium)",
597
- right: "var(--sl-spacing-medium)",
598
- color: "var(--sl-color-neutral-700)",
599
- fontSize: "var(--sl-font-size-large)",
600
- "& :hover": {
601
- color: "var(--sl-color-primary-700)",
602
- },
603
- transformOrigin: "50% 37%",
604
- transition: "transform var(--sl-transition-medium) ease",
605
- cursor: "pointer",
606
- },
607
- "& input:checked ~ .summary": {
608
- transition: "all var(--sl-transition-slow) ease",
609
- maxHeight: "200px",
610
- },
611
- "& .content": {
612
- padding: "var(--sl-spacing-small)",
613
- },
614
- "& .summary": {
615
- display: "block",
616
- overflow: "hidden",
617
- fontSize: "var(--sl-font-size-small)",
618
- maxHeight: "0px",
619
- transition: "all var(--sl-transition-fast) ease",
620
- },
621
- },
622
587
  };
623
588
  const sheet = JSS.createStyleSheet(style);
624
589
  const styleString = sheet.toString();
@@ -669,7 +634,7 @@ const ReferralTableRewardsCell = class {
669
634
  status: state,
670
635
  });
671
636
  const rid = Math.random().toString(36).slice(2);
672
- return (index$1.h("div", null, index$1.h("style", { type: "text/css" }, styleString), index$1.h("div", { class: sheet.classes.Description }, index$1.h("input", { type: "checkbox", id: "details-" + rid }), index$1.h("label", { class: "details", htmlFor: "details-" + rid }, index$1.h("sl-icon", { name: "chevron-down" })), index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, index$1.h("span", { class: sheet.classes.BoldText }, reward.prettyValue)), index$1.h("span", { class: sheet.classes.BadgeContainer }, state === "PENDING" && reward.dateScheduledFor ? (index$1.h("sl-badge", { class: slBadgeType === "primary"
637
+ return (index$1.h("sl-details", { class: sheet.classes.Details, disabled: this.hideDetails }, index$1.h("style", { type: "text/css" }, styleString), index$1.h("div", { slot: "summary", class: sheet.classes.DetailsContainer }, index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, index$1.h("span", { class: sheet.classes.BoldText }, reward.prettyValue)), index$1.h("div", { class: sheet.classes.BadgeContainer }, state === "PENDING" && reward.dateScheduledFor ? (index$1.h("sl-badge", { class: slBadgeType === "primary"
673
638
  ? sheet.classes.RedeemBadge
674
639
  : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, global.intl.formatMessage({
675
640
  id: "pendingForText",
@@ -681,7 +646,7 @@ const ReferralTableRewardsCell = class {
681
646
  ? sheet.classes.RedeemBadge
682
647
  : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, badgeText)), reward.dateExpires && state === "AVAILABLE" && (index$1.h("sl-badge", { class: slBadgeType === "primary"
683
648
  ? sheet.classes.RedeemBadge
684
- : sheet.classes.StatusBadge, type: "info", pill: true }, this.expiringText, ` ${getTimeDiff(reward.dateExpires)}`))), index$1.h("div", { class: "summary" }, index$1.h("div", { class: "content" }, reward.dateGiven && (index$1.h("div", null, index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, this.rewardReceivedText, " ", index$1.h("span", { class: sheet.classes.BoldText }, luxon.luxon.DateTime.fromMillis(reward.dateGiven)
649
+ : sheet.classes.StatusBadge, type: "info", pill: true }, this.expiringText, ` ${getTimeDiff(reward.dateExpires)}`)))), index$1.h("div", null, reward.dateGiven && (index$1.h("div", null, index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, this.rewardReceivedText, " ", index$1.h("span", { class: sheet.classes.BoldText }, luxon.luxon.DateTime.fromMillis(reward.dateGiven)
685
650
  .setLocale(utils.luxonLocale(this.locale))
686
651
  .toLocaleString(luxon.luxon.DateTime.DATE_MED))))), state === "EXPIRED" && reward.dateExpires && (index$1.h("div", null, index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, statusText, " ", index$1.h("span", { class: sheet.classes.BoldText }, luxon.luxon.DateTime.fromMillis(reward.dateExpires)
687
652
  .setLocale(utils.luxonLocale(this.locale))
@@ -691,7 +656,7 @@ const ReferralTableRewardsCell = class {
691
656
  .setLocale(utils.luxonLocale(this.locale))
692
657
  .toLocaleString(luxon.luxon.DateTime.DATE_MED))))), " ", state === "AVAILABLE" && reward.dateExpires && (index$1.h("div", null, index$1.h(sqmTextSpanView.TextSpanView, { type: "p" }, statusText, " ", index$1.h("span", { class: sheet.classes.BoldText }, luxon.luxon.DateTime.fromMillis(reward.dateExpires)
693
658
  .setLocale(utils.luxonLocale(this.locale))
694
- .toLocaleString(luxon.luxon.DateTime.DATE_MED))))), reward.fuelTankCode && (index$1.h("div", null, this.fuelTankText, " ", index$1.h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))))));
659
+ .toLocaleString(luxon.luxon.DateTime.DATE_MED))))), reward.fuelTankCode && (index$1.h("div", null, this.fuelTankText, " ", index$1.h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))));
695
660
  });
696
661
  }
697
662
  };
@@ -11,6 +11,10 @@ export class ReferralTableRewardsCell {
11
11
  render() {
12
12
  intl.locale = this.locale;
13
13
  const style = {
14
+ "@keyframes slideRight": {
15
+ from: { opacity: 0 },
16
+ to: { opacity: 1 },
17
+ },
14
18
  DetailsContainer: {
15
19
  width: "100%",
16
20
  display: "flex",
@@ -36,10 +40,12 @@ export class ReferralTableRewardsCell {
36
40
  "&::part(summary-icon)": {
37
41
  display: `${this.hideDetails ? "none" : "flex"}`,
38
42
  },
43
+ "&::part(summary-icon[open])": {
44
+ transform: "rotate(-90deg)",
45
+ background: "red",
46
+ },
39
47
  },
40
48
  BadgeContainer: {
41
- float: "right",
42
- marginRight: "var(--sl-spacing-medium)",
43
49
  "& > :not(:last-child)": {
44
50
  "margin-right": "var(--sl-spacing-x-small)",
45
51
  },
@@ -56,47 +62,6 @@ export class ReferralTableRewardsCell {
56
62
  background: "var(--sl-color-blue-600)",
57
63
  },
58
64
  },
59
- Description: {
60
- maxWidth: "500px",
61
- padding: "var(--sl-spacing-x-small)",
62
- border: "1px solid var(--sl-color-neutral-200)",
63
- borderRadius: "var(--sl-border-radius-medium)",
64
- boxSizing: "border-box",
65
- marginBottom: "var(--sl-spacing-small)",
66
- "& input[type=checkbox]": {
67
- display: "none",
68
- },
69
- "& input:checked ~ .details": {
70
- transform: "rotate(-180deg)",
71
- },
72
- "& .details": {
73
- float: "right",
74
- top: "var(--sl-spacing-medium)",
75
- right: "var(--sl-spacing-medium)",
76
- color: "var(--sl-color-neutral-700)",
77
- fontSize: "var(--sl-font-size-large)",
78
- "& :hover": {
79
- color: "var(--sl-color-primary-700)",
80
- },
81
- transformOrigin: "50% 37%",
82
- transition: "transform var(--sl-transition-medium) ease",
83
- cursor: "pointer",
84
- },
85
- "& input:checked ~ .summary": {
86
- transition: "all var(--sl-transition-slow) ease",
87
- maxHeight: "200px",
88
- },
89
- "& .content": {
90
- padding: "var(--sl-spacing-small)",
91
- },
92
- "& .summary": {
93
- display: "block",
94
- overflow: "hidden",
95
- fontSize: "var(--sl-font-size-small)",
96
- maxHeight: "0px",
97
- transition: "all var(--sl-transition-fast) ease",
98
- },
99
- },
100
65
  };
101
66
  const sheet = createStyleSheet(style);
102
67
  const styleString = sheet.toString();
@@ -147,15 +112,12 @@ export class ReferralTableRewardsCell {
147
112
  status: state,
148
113
  });
149
114
  const rid = Math.random().toString(36).slice(2);
150
- return (h("div", null,
115
+ return (h("sl-details", { class: sheet.classes.Details, disabled: this.hideDetails },
151
116
  h("style", { type: "text/css" }, styleString),
152
- h("div", { class: sheet.classes.Description },
153
- h("input", { type: "checkbox", id: "details-" + rid }),
154
- h("label", { class: "details", htmlFor: "details-" + rid },
155
- h("sl-icon", { name: "chevron-down" })),
117
+ h("div", { slot: "summary", class: sheet.classes.DetailsContainer },
156
118
  h(TextSpanView, { type: "p" },
157
119
  h("span", { class: sheet.classes.BoldText }, reward.prettyValue)),
158
- h("span", { class: sheet.classes.BadgeContainer },
120
+ h("div", { class: sheet.classes.BadgeContainer },
159
121
  state === "PENDING" && reward.dateScheduledFor ? (h("sl-badge", { class: slBadgeType === "primary"
160
122
  ? sheet.classes.RedeemBadge
161
123
  : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, intl.formatMessage({
@@ -171,49 +133,48 @@ export class ReferralTableRewardsCell {
171
133
  ? sheet.classes.RedeemBadge
172
134
  : sheet.classes.StatusBadge, type: "info", pill: true },
173
135
  this.expiringText,
174
- ` ${getTimeDiff(reward.dateExpires)}`))),
175
- h("div", { class: "summary" },
176
- h("div", { class: "content" },
177
- reward.dateGiven && (h("div", null,
178
- h(TextSpanView, { type: "p" },
179
- this.rewardReceivedText,
180
- " ",
181
- h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateGiven)
182
- .setLocale(luxonLocale(this.locale))
183
- .toLocaleString(DateTime.DATE_MED))))),
184
- state === "EXPIRED" && reward.dateExpires && (h("div", null,
185
- h(TextSpanView, { type: "p" },
186
- statusText,
187
- " ",
188
- h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateExpires)
189
- .setLocale(luxonLocale(this.locale))
190
- .toLocaleString(DateTime.DATE_MED))))),
191
- state === "CANCELLED" && reward.dateCancelled && (h("div", null,
192
- h(TextSpanView, { type: "p" },
193
- statusText,
194
- " ",
195
- h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateCancelled)
196
- .setLocale(luxonLocale(this.locale))
197
- .toLocaleString(DateTime.DATE_MED))))),
198
- state === "PENDING" && reward.dateScheduledFor && (h("div", null,
199
- h(TextSpanView, { type: "p" },
200
- statusText,
201
- " ",
202
- h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateScheduledFor)
203
- .setLocale(luxonLocale(this.locale))
204
- .toLocaleString(DateTime.DATE_MED))))),
136
+ ` ${getTimeDiff(reward.dateExpires)}`)))),
137
+ h("div", null,
138
+ reward.dateGiven && (h("div", null,
139
+ h(TextSpanView, { type: "p" },
140
+ this.rewardReceivedText,
141
+ " ",
142
+ h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateGiven)
143
+ .setLocale(luxonLocale(this.locale))
144
+ .toLocaleString(DateTime.DATE_MED))))),
145
+ state === "EXPIRED" && reward.dateExpires && (h("div", null,
146
+ h(TextSpanView, { type: "p" },
147
+ statusText,
148
+ " ",
149
+ h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateExpires)
150
+ .setLocale(luxonLocale(this.locale))
151
+ .toLocaleString(DateTime.DATE_MED))))),
152
+ state === "CANCELLED" && reward.dateCancelled && (h("div", null,
153
+ h(TextSpanView, { type: "p" },
154
+ statusText,
155
+ " ",
156
+ h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateCancelled)
157
+ .setLocale(luxonLocale(this.locale))
158
+ .toLocaleString(DateTime.DATE_MED))))),
159
+ state === "PENDING" && reward.dateScheduledFor && (h("div", null,
160
+ h(TextSpanView, { type: "p" },
161
+ statusText,
162
+ " ",
163
+ h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateScheduledFor)
164
+ .setLocale(luxonLocale(this.locale))
165
+ .toLocaleString(DateTime.DATE_MED))))),
166
+ " ",
167
+ state === "AVAILABLE" && reward.dateExpires && (h("div", null,
168
+ h(TextSpanView, { type: "p" },
169
+ statusText,
205
170
  " ",
206
- state === "AVAILABLE" && reward.dateExpires && (h("div", null,
207
- h(TextSpanView, { type: "p" },
208
- statusText,
209
- " ",
210
- h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateExpires)
211
- .setLocale(luxonLocale(this.locale))
212
- .toLocaleString(DateTime.DATE_MED))))),
213
- reward.fuelTankCode && (h("div", null,
214
- this.fuelTankText,
215
- " ",
216
- h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))))));
171
+ h("span", { class: sheet.classes.BoldText }, DateTime.fromMillis(reward.dateExpires)
172
+ .setLocale(luxonLocale(this.locale))
173
+ .toLocaleString(DateTime.DATE_MED))))),
174
+ reward.fuelTankCode && (h("div", null,
175
+ this.fuelTankText,
176
+ " ",
177
+ h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))));
217
178
  });
218
179
  }
219
180
  static get is() { return "sqm-referral-table-rewards-cell"; }
@@ -529,6 +529,10 @@ const ReferralTableRewardsCell = class {
529
529
  render() {
530
530
  intl.locale = this.locale;
531
531
  const style = {
532
+ "@keyframes slideRight": {
533
+ from: { opacity: 0 },
534
+ to: { opacity: 1 },
535
+ },
532
536
  DetailsContainer: {
533
537
  width: "100%",
534
538
  display: "flex",
@@ -554,10 +558,12 @@ const ReferralTableRewardsCell = class {
554
558
  "&::part(summary-icon)": {
555
559
  display: `${this.hideDetails ? "none" : "flex"}`,
556
560
  },
561
+ "&::part(summary-icon[open])": {
562
+ transform: "rotate(-90deg)",
563
+ background: "red",
564
+ },
557
565
  },
558
566
  BadgeContainer: {
559
- float: "right",
560
- marginRight: "var(--sl-spacing-medium)",
561
567
  "& > :not(:last-child)": {
562
568
  "margin-right": "var(--sl-spacing-x-small)",
563
569
  },
@@ -574,47 +580,6 @@ const ReferralTableRewardsCell = class {
574
580
  background: "var(--sl-color-blue-600)",
575
581
  },
576
582
  },
577
- Description: {
578
- maxWidth: "500px",
579
- padding: "var(--sl-spacing-x-small)",
580
- border: "1px solid var(--sl-color-neutral-200)",
581
- borderRadius: "var(--sl-border-radius-medium)",
582
- boxSizing: "border-box",
583
- marginBottom: "var(--sl-spacing-small)",
584
- "& input[type=checkbox]": {
585
- display: "none",
586
- },
587
- "& input:checked ~ .details": {
588
- transform: "rotate(-180deg)",
589
- },
590
- "& .details": {
591
- float: "right",
592
- top: "var(--sl-spacing-medium)",
593
- right: "var(--sl-spacing-medium)",
594
- color: "var(--sl-color-neutral-700)",
595
- fontSize: "var(--sl-font-size-large)",
596
- "& :hover": {
597
- color: "var(--sl-color-primary-700)",
598
- },
599
- transformOrigin: "50% 37%",
600
- transition: "transform var(--sl-transition-medium) ease",
601
- cursor: "pointer",
602
- },
603
- "& input:checked ~ .summary": {
604
- transition: "all var(--sl-transition-slow) ease",
605
- maxHeight: "200px",
606
- },
607
- "& .content": {
608
- padding: "var(--sl-spacing-small)",
609
- },
610
- "& .summary": {
611
- display: "block",
612
- overflow: "hidden",
613
- fontSize: "var(--sl-font-size-small)",
614
- maxHeight: "0px",
615
- transition: "all var(--sl-transition-fast) ease",
616
- },
617
- },
618
583
  };
619
584
  const sheet = createStyleSheet(style);
620
585
  const styleString = sheet.toString();
@@ -665,7 +630,7 @@ const ReferralTableRewardsCell = class {
665
630
  status: state,
666
631
  });
667
632
  const rid = Math.random().toString(36).slice(2);
668
- return (h("div", null, h("style", { type: "text/css" }, styleString), h("div", { class: sheet.classes.Description }, h("input", { type: "checkbox", id: "details-" + rid }), h("label", { class: "details", htmlFor: "details-" + rid }, h("sl-icon", { name: "chevron-down" })), h(TextSpanView, { type: "p" }, h("span", { class: sheet.classes.BoldText }, reward.prettyValue)), h("span", { class: sheet.classes.BadgeContainer }, state === "PENDING" && reward.dateScheduledFor ? (h("sl-badge", { class: slBadgeType === "primary"
633
+ return (h("sl-details", { class: sheet.classes.Details, disabled: this.hideDetails }, h("style", { type: "text/css" }, styleString), h("div", { slot: "summary", class: sheet.classes.DetailsContainer }, h(TextSpanView, { type: "p" }, h("span", { class: sheet.classes.BoldText }, reward.prettyValue)), h("div", { class: sheet.classes.BadgeContainer }, state === "PENDING" && reward.dateScheduledFor ? (h("sl-badge", { class: slBadgeType === "primary"
669
634
  ? sheet.classes.RedeemBadge
670
635
  : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, intl.formatMessage({
671
636
  id: "pendingForText",
@@ -677,7 +642,7 @@ const ReferralTableRewardsCell = class {
677
642
  ? sheet.classes.RedeemBadge
678
643
  : sheet.classes.StatusBadge, type: slBadgeType, pill: true }, badgeText)), reward.dateExpires && state === "AVAILABLE" && (h("sl-badge", { class: slBadgeType === "primary"
679
644
  ? sheet.classes.RedeemBadge
680
- : sheet.classes.StatusBadge, type: "info", pill: true }, this.expiringText, ` ${getTimeDiff(reward.dateExpires)}`))), h("div", { class: "summary" }, h("div", { class: "content" }, reward.dateGiven && (h("div", null, h(TextSpanView, { type: "p" }, this.rewardReceivedText, " ", h("span", { class: sheet.classes.BoldText }, luxon.DateTime.fromMillis(reward.dateGiven)
645
+ : sheet.classes.StatusBadge, type: "info", pill: true }, this.expiringText, ` ${getTimeDiff(reward.dateExpires)}`)))), h("div", null, reward.dateGiven && (h("div", null, h(TextSpanView, { type: "p" }, this.rewardReceivedText, " ", h("span", { class: sheet.classes.BoldText }, luxon.DateTime.fromMillis(reward.dateGiven)
681
646
  .setLocale(luxonLocale(this.locale))
682
647
  .toLocaleString(luxon.DateTime.DATE_MED))))), state === "EXPIRED" && reward.dateExpires && (h("div", null, h(TextSpanView, { type: "p" }, statusText, " ", h("span", { class: sheet.classes.BoldText }, luxon.DateTime.fromMillis(reward.dateExpires)
683
648
  .setLocale(luxonLocale(this.locale))
@@ -687,7 +652,7 @@ const ReferralTableRewardsCell = class {
687
652
  .setLocale(luxonLocale(this.locale))
688
653
  .toLocaleString(luxon.DateTime.DATE_MED))))), " ", state === "AVAILABLE" && reward.dateExpires && (h("div", null, h(TextSpanView, { type: "p" }, statusText, " ", h("span", { class: sheet.classes.BoldText }, luxon.DateTime.fromMillis(reward.dateExpires)
689
654
  .setLocale(luxonLocale(this.locale))
690
- .toLocaleString(luxon.DateTime.DATE_MED))))), reward.fuelTankCode && (h("div", null, this.fuelTankText, " ", h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))))));
655
+ .toLocaleString(luxon.DateTime.DATE_MED))))), reward.fuelTankCode && (h("div", null, this.fuelTankText, " ", h("span", { class: sheet.classes.BoldText }, reward.fuelTankCode))))));
691
656
  });
692
657
  }
693
658
  };
@@ -1 +1 @@
1
- var __makeTemplateObject=this&&this.__makeTemplateObject||function(e,t){if(Object.defineProperty){Object.defineProperty(e,"raw",{value:t})}else{e.raw=t}return e};var __assign=this&&this.__assign||function(){__assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++){t=arguments[r];for(var a in t)if(Object.prototype.hasOwnProperty.call(t,a))e[a]=t[a]}return e};return __assign.apply(this,arguments)};var __awaiter=this&&this.__awaiter||function(e,t,r,n){function a(e){return e instanceof r?e:new r((function(t){t(e)}))}return new(r||(r=Promise))((function(r,l){function s(e){try{o(n.next(e))}catch(e){l(e)}}function i(e){try{o(n["throw"](e))}catch(e){l(e)}}function o(e){e.done?r(e.value):a(e.value).then(s,i)}o((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var r={label:0,sent:function(){if(l[0]&1)throw l[1];return l[1]},trys:[],ops:[]},n,a,l,s;return s={next:i(0),throw:i(1),return:i(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function i(e){return function(t){return o([e,t])}}function o(s){if(n)throw new TypeError("Generator is already executing.");while(r)try{if(n=1,a&&(l=s[0]&2?a["return"]:s[0]?a["throw"]||((l=a["return"])&&l.call(a),0):a.next)&&!(l=l.call(a,s[1])).done)return l;if(a=0,l)s=[s[0]&2,l.value];switch(s[0]){case 0:case 1:l=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;a=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(l=r.trys,l=l.length>0&&l[l.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!l||s[1]>l[0]&&s[1]<l[3])){r.label=s[1];break}if(s[0]===6&&r.label<l[1]){r.label=l[1];l=s;break}if(l&&r.label<l[2]){r.label=l[2];r.ops.push(s);break}if(l[2])r.ops.pop();r.trys.pop();continue}s=t.call(e,r)}catch(e){s=[6,e];a=0}finally{n=l=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};var __spreadArrays=this&&this.__spreadArrays||function(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;for(var n=Array(e),a=0,t=0;t<r;t++)for(var l=arguments[t],s=0,i=l.length;s<i;s++,a++)n[a]=l[s];return n};import{h,r as registerInstance,g as getElement,c as Host}from"./index-17b4da69.js";import{e as useReducer,u as useEffect,m as h$1}from"./stencil-hooks.module-2f159754.js";import{i as intl}from"./global-baef42b7.js";import"./use-callback-d8ef4b5d.js";import{i as ie,M,A as An,b as sn,a as mn,j as jn}from"./index.module-c6efec0e.js";import"./extends-c31f1eff.js";import"./insertcss-bcaf3818.js";import{c as cjs}from"./cjs-bdfb4486.js";import"./mixins-10353a39.js";import{c as createStyleSheet}from"./JSS-96eeab98.js";import{G as GenericTableView}from"./GenericTableView-25965d2b.js";import{g as gql}from"./index-0e5ee1c5.js";import{u as useRerenderListener,a as useChildElements,b as useRequestRerender}from"./useChildElements-b6a77993.js";import{l as luxon}from"./luxon-5fa22651.js";import{l as luxonLocale}from"./utils-1d345130.js";import{T as TextSpanView}from"./sqm-text-span-view-7e61c95c.js";var CSS_NAMESPACE="sqm-referral-table";var GET_REFERRER_DATA=gql(templateObject_1||(templateObject_1=__makeTemplateObject(["\n query getReferrals(\n $programId: ID\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n referredByReferral(programId: $programId) {\n dateReferralStarted\n dateConverted\n referrerUser {\n firstName\n lastName\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n }\n }\n }\n }\n"],["\n query getReferrals(\n $programId: ID\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n referredByReferral(programId: $programId) {\n dateReferralStarted\n dateConverted\n referrerUser {\n firstName\n lastName\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n }\n }\n }\n }\n"])));var GET_REFERRAL_DATA=gql(templateObject_2||(templateObject_2=__makeTemplateObject(['\n query getReferrals(\n $limit: Int!\n $offset: Int!\n $referralFilter: ReferralFilterInput\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n id\n paidReferrals: referrals(\n filter: { dateReferralPaid_timeframe: "this_10_years" }\n limit: 1\n ) {\n totalCount\n }\n referrals(limit: $limit, offset: $offset, filter: $referralFilter) {\n totalCount\n count\n data {\n id\n referredUser {\n id\n accountId\n firstName\n lastName\n email\n programGoals {\n goalId\n programId\n count\n firstDate\n lastDate\n conversionCount\n }\n }\n shareLinkUsed\n referralCodeUsed\n moderationStatus\n dateConverted\n dateFraudChecksCompleted\n dateModerated\n dateModified\n dateReferralEnded\n dateReferralPaid\n dateReferralStarted\n dateUserModified\n programId\n program {\n id\n name\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n childNodes(limit: 10, offset: 0) {\n data {\n data {\n id\n ... on FlatReward {\n id\n statuses\n type\n value\n }\n ... on ProgramEmailTransaction {\n id\n rewardId\n dateCreated\n dateSent\n dateQueued\n }\n }\n depth\n }\n }\n }\n }\n }\n }\n }\n'],['\n query getReferrals(\n $limit: Int!\n $offset: Int!\n $referralFilter: ReferralFilterInput\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n id\n paidReferrals: referrals(\n filter: { dateReferralPaid_timeframe: "this_10_years" }\n limit: 1\n ) {\n totalCount\n }\n referrals(limit: $limit, offset: $offset, filter: $referralFilter) {\n totalCount\n count\n data {\n id\n referredUser {\n id\n accountId\n firstName\n lastName\n email\n programGoals {\n goalId\n programId\n count\n firstDate\n lastDate\n conversionCount\n }\n }\n shareLinkUsed\n referralCodeUsed\n moderationStatus\n dateConverted\n dateFraudChecksCompleted\n dateModerated\n dateModified\n dateReferralEnded\n dateReferralPaid\n dateReferralStarted\n dateUserModified\n programId\n program {\n id\n name\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n childNodes(limit: 10, offset: 0) {\n data {\n data {\n id\n ... on FlatReward {\n id\n statuses\n type\n value\n }\n ... on ProgramEmailTransaction {\n id\n rewardId\n dateCreated\n dateSent\n dateQueued\n }\n }\n depth\n }\n }\n }\n }\n }\n }\n }\n'])));function useReferralTable(e,t,r){var n,a,l;var s=ie();var i=M();var o=(n=e.programId)!==null&&n!==void 0?n:i;var d=o?o==="classic"?{programId_exists:false}:{programId_eq:o}:{};var u={userId_eq:s===null||s===void 0?void 0:s.id,accountId_eq:s===null||s===void 0?void 0:s.accountId};var c=useReducer((function(e,t){return __assign(__assign({},e),t)}),{columns:[],rows:[],loading:false,page:0}),f=c[0],p=c[1];var m=An();var h=sn(GET_REFERRER_DATA,{programId:o==="classic"?null:o,rewardFilter:u,locale:m},!e.showReferrer||!(s===null||s===void 0?void 0:s.jwt)),v=h.data,g=h.loading,y=h.refetch;var _=(a=v===null||v===void 0?void 0:v.viewer)===null||a===void 0?void 0:a.referredByReferral;var b=e.showReferrer&&!!(_===null||_===void 0?void 0:_.dateReferralStarted);var w=mn(GET_REFERRAL_DATA,(function(e){var t;return(t=e===null||e===void 0?void 0:e.viewer)===null||t===void 0?void 0:t.referrals}),{limit:e.perPage,offset:0},{referralFilter:d,rewardFilter:u,locale:m},e.showReferrer&&g&&!v||!(s===null||s===void 0?void 0:s.jwt)),T=w.envelope,R=w.states,x=w.callbacks;useEffect((function(){if(R.currentPage===0&&b)x.setLimit(e.perPage-1)}),[b]);useEffect((function(){if(e.showReferrer&&b){x.setLimit(e.perPage-1);x.setCurrentPage(0)}else{x.setLimit(e.perPage);x.setCurrentPage(0)}}),[e.showReferrer]);var E=useRerenderListener();var C=T===null||T===void 0?void 0:T.data;var S=useChildElements();function L(e){return __awaiter(this,void 0,void 0,(function(){var t,r,n,a,l,s,i,o,d,u;var c=this;return __generator(this,(function(f){switch(f.label){case 0:t=e.filter((function(e){return e.slot!=="loading"&&e.slot!=="empty"}));r=t===null||t===void 0?void 0:t.map((function(e){return __awaiter(c,void 0,void 0,(function(){return __generator(this,(function(t){return[2,tryMethod(e,(function(){return e.renderLabel()}))]}))}))}));if(!(b&&R.currentPage===0))return[3,2];a=t===null||t===void 0?void 0:t.map((function(e){return __awaiter(c,void 0,void 0,(function(){return __generator(this,(function(t){return[2,tryMethod(e,(function t(){return e.renderReferrerCell(_,e)}))]}))}))}));return[4,Promise.all(a)];case 1:n=f.sent();f.label=2;case 2:l=C===null||C===void 0?void 0:C.map((function(e){return __awaiter(c,void 0,void 0,(function(){var r,n;var a=this;return __generator(this,(function(l){switch(l.label){case 0:r=t===null||t===void 0?void 0:t.map((function(t){return __awaiter(a,void 0,void 0,(function(){return __generator(this,(function(r){return[2,tryMethod(t,(function(){return t.renderCell(e,m)}))]}))}))}));return[4,Promise.all(r)];case 1:n=l.sent();return[2,n]}}))}))}));i=l;if(!i)return[3,4];o=[[n]];return[4,Promise.all(l)];case 3:i=__spreadArrays.apply(void 0,o.concat([f.sent()])).filter((function(e){return e}));f.label=4;case 4:s=i;p({rows:s});u=r;if(!u)return[3,6];return[4,Promise.all(r)];case 5:u=f.sent();f.label=6;case 6:d=u;p({columns:d,loading:false,page:R.currentPage});return[2]}}))}))}useEffect((function(){p({loading:true});T&&L(S)}),[T,S,E]);var D=!((l=f===null||f===void 0?void 0:f.rows)===null||l===void 0?void 0:l.length)&&!(C===null||C===void 0?void 0:C.length);var I=R.loading||f.loading?"loading":D?"empty":"rows";return{states:{hasNext:R.currentPage<R.pageCount-1,hasPrev:R.currentPage>0,show:I,namespace:CSS_NAMESPACE},data:{textOverrides:{showLabels:e.showLabels,prevLabel:e.prevLabel,moreLabel:e.moreLabel},hiddenColumns:e.hiddenColumns,smBreakpoint:e.smBreakpoint,mdBreakpoint:e.mdBreakpoint},elements:{columns:f.columns,rows:f.rows,emptyElement:t,loadingElement:r},callbacks:{nextPage:function(){if(R.currentPage===0&&b)x.setLimit(e.perPage);x.setCurrentPage(R.currentPage+1)},prevPage:function(){if(R.currentPage===1&&b)x.setLimit(e.perPage-1);x.setCurrentPage(R.currentPage-1)}}}}function generateUserError(e){try{return JSON.stringify(e)}catch(e){return"An unknown error"}}function tryMethod(e,t){return __awaiter(this,void 0,void 0,(function(){var r,n,a,l;return __generator(this,(function(s){switch(s.label){case 0:r=e.tagName.toLowerCase();return[4,customElements.whenDefined(r)];case 1:s.sent();try{n=t()}catch(e){if(t.name==="renderReferrerCell"){console.error("column does not have a renderReferrerCell method.")}else{console.error("label promise failed",e)}return[2,h("span",null)]}s.label=2;case 2:s.trys.push([2,4,,5]);return[4,n];case 3:return[2,s.sent()];case 4:a=s.sent();console.error("Error rendering label",a);l=generateUserError(a);return[2,h("details",null,h("summary",null,"Error"),l)];case 5:return[2]}}))}))}var ReferralTable=function(){function e(e){registerInstance(this,e);this.perPage=3;this.showLabels=true;this.prevLabel="Prev";this.moreLabel="Next";this.showReferrer=false;this.hiddenColumns="0";this.smBreakpoint=634;this.mdBreakpoint=899;this.emptyStateImgUrl="https://res.cloudinary.com/saasquatch/image/upload/v1642618031/squatch-assets/image_3_1.png";this.emptyStateTitle="View your referral details";this.emptyStateText="Track the status of your referrals and rewards earned by referring friends";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){var e=h(EmptySlot,{emptyStateImgUrl:this.emptyStateImgUrl,emptyStateTitle:this.emptyStateTitle,emptyStateText:this.emptyStateText});var t=h(LoadingSlot,null);var r=jn()?useReferraltableDemo(this):useReferralTable(this,e,t),n=r.states,a=r.data,l=r.callbacks,s=r.elements;return h(GenericTableView,{states:n,data:a,callbacks:l,elements:s})};return e}();function LoadingSlot(){return h("slot",{name:"loading"},h(LoadingRow,null),h(LoadingRow,null),h(LoadingRow,null),h(LoadingRow,null))}function LoadingRow(){return h("sqm-table-row",null,h("sqm-table-cell",{colspan:5},h("sl-skeleton",null)))}function useReferraltableDemo(e){return cjs({states:{hasPrev:false,hasNext:false,loading:false},callbacks:{prevPage:function(){return console.log("Prev")},nextPage:function(){return console.log("Next")}},data:{textOverrides:{showLabels:e.showLabels,prevLabel:e.prevLabel,moreLabel:e.moreLabel},referralData:[]},elements:{emptyElement:h(EmptySlot,{emptyStateImgUrl:"https://res.cloudinary.com/saasquatch/image/upload/v1642618031/squatch-assets/image_3_1.png",emptyStateTitle:"View your referral details",emptyStateText:"Track the status of your referrals and rewards earned by referring\r\n\t\tfriends"}),loadingElement:h(LoadingSlot,null),columns:[h("div",null,"User"),h("div",null,"Referral Status"),h("div",null,"Rewards")],rows:[]}},e.demoData||{},{arrayMerge:function(e,t){return t}})}function EmptySlot(e){var t=e.emptyStateImgUrl,r=e.emptyStateTitle,n=e.emptyStateText;return h("div",{slot:"empty",style:{display:"contents"}},h("sqm-table-row",null,h("sqm-table-cell",{colspan:5,style:{textAlign:"center"}},h("div",{style:{padding:"var(--sl-spacing-xxx-large)"}},h("img",{src:t,style:{width:"100px"}}),h("div",null,h("b",null,r)),h("div",{style:{marginTop:"var(--sl-spacing-xx-small)",fontSize:"var(--sl-font-size-small)",color:"var(--sl-color-neutral-500)"}},n)))))}var ReferralTableCell=function(){function e(e){registerInstance(this,e);this.ignored=true;h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){return h("div",{innerHTML:this.innerTemplate})};return e}();var ReferralTableGenericColumn=function(){function e(e){registerInstance(this,e);h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,h("sqm-referral-table-cell",{"inner-template":getElement(this).innerHTML})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,Promise.resolve(this.columnTitle)]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}},h("slot",null))};return e}();var ReferralTableDateCell=function(){function e(e){registerInstance(this,e);this.ignored=true;this.locale="en";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){var e;var t=!this.date?"-":(e=luxon.DateTime.fromMillis(this.date))===null||e===void 0?void 0:e.setLocale(luxonLocale(this.locale)).toLocaleString(luxon.DateTime.DATE_MED);return t};return e}();var ReferralTableDateColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Date Converted";this.dateShown="dateConverted";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e,t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){console.log("date column - referral",{locale:t});return[2,h("sqm-referral-table-date-cell",{date:e[this.dateShown],locale:t})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.dateShown,this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableRewardsCell=function(){function e(e){registerInstance(this,e);this.locale="en"}e.prototype.render=function(){var e=this;intl.locale=this.locale;var t={DetailsContainer:{width:"100%",display:"flex","align-items":"center","justify-content":"space-between","margin-right":"var(--sl-spacing-small)","flex-wrap":"wrap"},Details:{"padding-bottom":"var(--sl-spacing-small)","max-width":"500px","&::part(header)":{padding:"var(--sl-spacing-x-small)",cursor:""+(this.hideDetails?"default":"pointer")},"&::part(content)":{padding:"var(--sl-spacing-x-small) var(--sl-spacing-medium)"},"&::part(base)":{opacity:"1"},"&::part(summary-icon)":{display:""+(this.hideDetails?"none":"flex")}},BadgeContainer:{float:"right",marginRight:"var(--sl-spacing-medium)","& > :not(:last-child)":{"margin-right":"var(--sl-spacing-x-small)"}},BoldText:{"font-weight":"var(--sl-font-weight-semibold)"},StatusBadge:{paddingLeft:"var(--sl-spacing-xxx-small)"},RedeemBadge:{paddingLeft:"var(--sl-spacing-xxx-small)","&::part(base)":{background:"var(--sl-color-blue-600)"}},Description:{maxWidth:"500px",padding:"var(--sl-spacing-x-small)",border:"1px solid var(--sl-color-neutral-200)",borderRadius:"var(--sl-border-radius-medium)",boxSizing:"border-box",marginBottom:"var(--sl-spacing-small)","& input[type=checkbox]":{display:"none"},"& input:checked ~ .details":{transform:"rotate(-180deg)"},"& .details":{float:"right",top:"var(--sl-spacing-medium)",right:"var(--sl-spacing-medium)",color:"var(--sl-color-neutral-700)",fontSize:"var(--sl-font-size-large)","& :hover":{color:"var(--sl-color-primary-700)"},transformOrigin:"50% 37%",transition:"transform var(--sl-transition-medium) ease",cursor:"pointer"},"& input:checked ~ .summary":{transition:"all var(--sl-transition-slow) ease",maxHeight:"200px"},"& .content":{padding:"var(--sl-spacing-small)"},"& .summary":{display:"block",overflow:"hidden",fontSize:"var(--sl-font-size-small)",maxHeight:"0px",transition:"all var(--sl-transition-fast) ease"}}};var r=createStyleSheet(t);var n=r.toString();var a=function(e){var t=["REDEEMED","CANCELLED","EXPIRED","PENDING","AVAILABLE"];if(e.length===1)return e[0];return t.find((function(t){return e.includes(t)&&t}))};var l=function(e){switch(e){case"REDEEMED":return"primary";case"EXPIRED":return"danger";case"CANCELLED":return"danger";case"PENDING":return"warning";case"AVAILABLE":return"success"}};var s=function(t){return luxon.DateTime.fromMillis(t).setLocale(luxonLocale(e.locale)).toRelative().replace("in","").trim()};return this.rewards.map((function(t){var i=a(t.statuses);var o=l(i);var d=intl.formatMessage({id:"statusShortMessage",defaultMessage:e.statusText},{status:i});var u=intl.formatMessage({id:"statusLongMessage",defaultMessage:e.statusLongText},{status:i});var c=Math.random().toString(36).slice(2);return h("div",null,h("style",{type:"text/css"},n),h("div",{class:r.classes.Description},h("input",{type:"checkbox",id:"details-"+c}),h("label",{class:"details",htmlFor:"details-"+c},h("sl-icon",{name:"chevron-down"})),h(TextSpanView,{type:"p"},h("span",{class:r.classes.BoldText},t.prettyValue)),h("span",{class:r.classes.BadgeContainer},i==="PENDING"&&t.dateScheduledFor?h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:o,pill:true},intl.formatMessage({id:"pendingForText",defaultMessage:e.pendingForText},{status:d,date:s(t.dateScheduledFor)})):h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:o,pill:true},d),t.dateExpires&&i==="AVAILABLE"&&h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:"info",pill:true},e.expiringText," "+s(t.dateExpires))),h("div",{class:"summary"},h("div",{class:"content"},t.dateGiven&&h("div",null,h(TextSpanView,{type:"p"},e.rewardReceivedText," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateGiven).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="EXPIRED"&&t.dateExpires&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateExpires).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="CANCELLED"&&t.dateCancelled&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateCancelled).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="PENDING"&&t.dateScheduledFor&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateScheduledFor).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED))))," ",i==="AVAILABLE"&&t.dateExpires&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateExpires).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),t.fuelTankCode&&h("div",null,e.fuelTankText," ",h("span",{class:r.classes.BoldText},t.fuelTankCode))))))}))};return e}();var ReferralTableRewardsColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Rewards";this.statusText="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }";this.statusLongText="{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }";this.fuelTankText="Your code is";this.rewardReceivedText="Reward received on";this.expiringText="Expiring in";this.pendingForText="{status} for {date}";this.hideDetails=false;h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e,t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){return[2,h("sqm-referral-table-rewards-cell",{rewards:e.rewards,statusText:this.statusText,statusLongText:this.statusLongText,fuelTankText:this.fuelTankText,rewardReceivedText:this.rewardReceivedText,expiringText:this.expiringText,pendingForText:this.pendingForText,hideDetails:this.hideDetails,locale:t})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableStatusCell=function(){function e(e){registerInstance(this,e)}e.prototype.render=function(){var e={Badge:{"&::part(base)":{fontSize:"var(--sl-font-size-small)",padding:"4px 8px"}}};var t=createStyleSheet(e);var r=t.toString();return h("div",null,h("style",{type:"text/css"},r),h("sl-badge",{pill:true,type:this.converted?"success":"warning",class:t.classes.Badge},this.statusText))};return e}();var ReferralTableStatusColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Status";this.convertedStatusText="Converted";this.inProgressStatusText="In Progress";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(r){t=e.dateConverted?this.convertedStatusText:this.inProgressStatusText;return[2,h("sqm-referral-table-status-cell",{"status-text":t,converted:e.dateConverted?true:false})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableUserCell=function(){function e(e){registerInstance(this,e)}e.prototype.render=function(){return this.name};return e}();var ReferralTableUserColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Customer";this.anonymousUser="Anonymous User";this.deletedUser="Deleted User";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){var t,r,n,a,l;return __generator(this,(function(s){if(!(e===null||e===void 0?void 0:e.referredUser)){l=this.deletedUser}else if(!((t=e===null||e===void 0?void 0:e.referredUser)===null||t===void 0?void 0:t.firstName)&&!((r=e===null||e===void 0?void 0:e.referredUser)===null||r===void 0?void 0:r.lastName)){l=this.anonymousUser}else{l=((n=e===null||e===void 0?void 0:e.referredUser)===null||n===void 0?void 0:n.firstName)+" "+((a=e===null||e===void 0?void 0:e.referredUser)===null||a===void 0?void 0:a.lastName)}return[2,h("sqm-referral-table-user-cell",{name:l})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.deletedUser,this.anonymousUser,this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();export{ReferralTable as sqm_referral_table,ReferralTableCell as sqm_referral_table_cell,ReferralTableGenericColumn as sqm_referral_table_column,ReferralTableDateCell as sqm_referral_table_date_cell,ReferralTableDateColumn as sqm_referral_table_date_column,ReferralTableRewardsCell as sqm_referral_table_rewards_cell,ReferralTableRewardsColumn as sqm_referral_table_rewards_column,ReferralTableStatusCell as sqm_referral_table_status_cell,ReferralTableStatusColumn as sqm_referral_table_status_column,ReferralTableUserCell as sqm_referral_table_user_cell,ReferralTableUserColumn as sqm_referral_table_user_column};var templateObject_1,templateObject_2;
1
+ var __makeTemplateObject=this&&this.__makeTemplateObject||function(e,t){if(Object.defineProperty){Object.defineProperty(e,"raw",{value:t})}else{e.raw=t}return e};var __assign=this&&this.__assign||function(){__assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++){t=arguments[r];for(var a in t)if(Object.prototype.hasOwnProperty.call(t,a))e[a]=t[a]}return e};return __assign.apply(this,arguments)};var __awaiter=this&&this.__awaiter||function(e,t,r,n){function a(e){return e instanceof r?e:new r((function(t){t(e)}))}return new(r||(r=Promise))((function(r,l){function s(e){try{o(n.next(e))}catch(e){l(e)}}function i(e){try{o(n["throw"](e))}catch(e){l(e)}}function o(e){e.done?r(e.value):a(e.value).then(s,i)}o((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var r={label:0,sent:function(){if(l[0]&1)throw l[1];return l[1]},trys:[],ops:[]},n,a,l,s;return s={next:i(0),throw:i(1),return:i(2)},typeof Symbol==="function"&&(s[Symbol.iterator]=function(){return this}),s;function i(e){return function(t){return o([e,t])}}function o(s){if(n)throw new TypeError("Generator is already executing.");while(r)try{if(n=1,a&&(l=s[0]&2?a["return"]:s[0]?a["throw"]||((l=a["return"])&&l.call(a),0):a.next)&&!(l=l.call(a,s[1])).done)return l;if(a=0,l)s=[s[0]&2,l.value];switch(s[0]){case 0:case 1:l=s;break;case 4:r.label++;return{value:s[1],done:false};case 5:r.label++;a=s[1];s=[0];continue;case 7:s=r.ops.pop();r.trys.pop();continue;default:if(!(l=r.trys,l=l.length>0&&l[l.length-1])&&(s[0]===6||s[0]===2)){r=0;continue}if(s[0]===3&&(!l||s[1]>l[0]&&s[1]<l[3])){r.label=s[1];break}if(s[0]===6&&r.label<l[1]){r.label=l[1];l=s;break}if(l&&r.label<l[2]){r.label=l[2];r.ops.push(s);break}if(l[2])r.ops.pop();r.trys.pop();continue}s=t.call(e,r)}catch(e){s=[6,e];a=0}finally{n=l=0}if(s[0]&5)throw s[1];return{value:s[0]?s[1]:void 0,done:true}}};var __spreadArrays=this&&this.__spreadArrays||function(){for(var e=0,t=0,r=arguments.length;t<r;t++)e+=arguments[t].length;for(var n=Array(e),a=0,t=0;t<r;t++)for(var l=arguments[t],s=0,i=l.length;s<i;s++,a++)n[a]=l[s];return n};import{h,r as registerInstance,g as getElement,c as Host}from"./index-17b4da69.js";import{e as useReducer,u as useEffect,m as h$1}from"./stencil-hooks.module-2f159754.js";import{i as intl}from"./global-baef42b7.js";import"./use-callback-d8ef4b5d.js";import{i as ie,M,A as An,b as sn,a as mn,j as jn}from"./index.module-c6efec0e.js";import"./extends-c31f1eff.js";import"./insertcss-bcaf3818.js";import{c as cjs}from"./cjs-bdfb4486.js";import"./mixins-10353a39.js";import{c as createStyleSheet}from"./JSS-96eeab98.js";import{G as GenericTableView}from"./GenericTableView-25965d2b.js";import{g as gql}from"./index-0e5ee1c5.js";import{u as useRerenderListener,a as useChildElements,b as useRequestRerender}from"./useChildElements-b6a77993.js";import{l as luxon}from"./luxon-5fa22651.js";import{l as luxonLocale}from"./utils-1d345130.js";import{T as TextSpanView}from"./sqm-text-span-view-7e61c95c.js";var CSS_NAMESPACE="sqm-referral-table";var GET_REFERRER_DATA=gql(templateObject_1||(templateObject_1=__makeTemplateObject(["\n query getReferrals(\n $programId: ID\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n referredByReferral(programId: $programId) {\n dateReferralStarted\n dateConverted\n referrerUser {\n firstName\n lastName\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n }\n }\n }\n }\n"],["\n query getReferrals(\n $programId: ID\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n referredByReferral(programId: $programId) {\n dateReferralStarted\n dateConverted\n referrerUser {\n firstName\n lastName\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n }\n }\n }\n }\n"])));var GET_REFERRAL_DATA=gql(templateObject_2||(templateObject_2=__makeTemplateObject(['\n query getReferrals(\n $limit: Int!\n $offset: Int!\n $referralFilter: ReferralFilterInput\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n id\n paidReferrals: referrals(\n filter: { dateReferralPaid_timeframe: "this_10_years" }\n limit: 1\n ) {\n totalCount\n }\n referrals(limit: $limit, offset: $offset, filter: $referralFilter) {\n totalCount\n count\n data {\n id\n referredUser {\n id\n accountId\n firstName\n lastName\n email\n programGoals {\n goalId\n programId\n count\n firstDate\n lastDate\n conversionCount\n }\n }\n shareLinkUsed\n referralCodeUsed\n moderationStatus\n dateConverted\n dateFraudChecksCompleted\n dateModerated\n dateModified\n dateReferralEnded\n dateReferralPaid\n dateReferralStarted\n dateUserModified\n programId\n program {\n id\n name\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n childNodes(limit: 10, offset: 0) {\n data {\n data {\n id\n ... on FlatReward {\n id\n statuses\n type\n value\n }\n ... on ProgramEmailTransaction {\n id\n rewardId\n dateCreated\n dateSent\n dateQueued\n }\n }\n depth\n }\n }\n }\n }\n }\n }\n }\n'],['\n query getReferrals(\n $limit: Int!\n $offset: Int!\n $referralFilter: ReferralFilterInput\n $rewardFilter: RewardFilterInput\n $locale: RSLocale\n ) {\n viewer {\n ... on User {\n id\n paidReferrals: referrals(\n filter: { dateReferralPaid_timeframe: "this_10_years" }\n limit: 1\n ) {\n totalCount\n }\n referrals(limit: $limit, offset: $offset, filter: $referralFilter) {\n totalCount\n count\n data {\n id\n referredUser {\n id\n accountId\n firstName\n lastName\n email\n programGoals {\n goalId\n programId\n count\n firstDate\n lastDate\n conversionCount\n }\n }\n shareLinkUsed\n referralCodeUsed\n moderationStatus\n dateConverted\n dateFraudChecksCompleted\n dateModerated\n dateModified\n dateReferralEnded\n dateReferralPaid\n dateReferralStarted\n dateUserModified\n programId\n program {\n id\n name\n }\n rewards(filter: $rewardFilter) {\n id\n type\n value\n unit\n name\n dateGiven\n dateExpires\n dateCancelled\n dateRedeemed\n dateScheduledFor\n fuelTankCode\n fuelTankType\n currency\n prettyValue(locale: $locale)\n statuses\n globalRewardKey\n programRewardKey\n rewardRedemptionTransactions {\n data {\n exchangedRewards {\n data {\n prettyValue(locale: $locale)\n type\n fuelTankCode\n globalRewardKey\n }\n }\n }\n }\n }\n childNodes(limit: 10, offset: 0) {\n data {\n data {\n id\n ... on FlatReward {\n id\n statuses\n type\n value\n }\n ... on ProgramEmailTransaction {\n id\n rewardId\n dateCreated\n dateSent\n dateQueued\n }\n }\n depth\n }\n }\n }\n }\n }\n }\n }\n'])));function useReferralTable(e,t,r){var n,a,l;var s=ie();var i=M();var o=(n=e.programId)!==null&&n!==void 0?n:i;var d=o?o==="classic"?{programId_exists:false}:{programId_eq:o}:{};var u={userId_eq:s===null||s===void 0?void 0:s.id,accountId_eq:s===null||s===void 0?void 0:s.accountId};var c=useReducer((function(e,t){return __assign(__assign({},e),t)}),{columns:[],rows:[],loading:false,page:0}),f=c[0],p=c[1];var m=An();var h=sn(GET_REFERRER_DATA,{programId:o==="classic"?null:o,rewardFilter:u,locale:m},!e.showReferrer||!(s===null||s===void 0?void 0:s.jwt)),v=h.data,g=h.loading,y=h.refetch;var _=(a=v===null||v===void 0?void 0:v.viewer)===null||a===void 0?void 0:a.referredByReferral;var b=e.showReferrer&&!!(_===null||_===void 0?void 0:_.dateReferralStarted);var w=mn(GET_REFERRAL_DATA,(function(e){var t;return(t=e===null||e===void 0?void 0:e.viewer)===null||t===void 0?void 0:t.referrals}),{limit:e.perPage,offset:0},{referralFilter:d,rewardFilter:u,locale:m},e.showReferrer&&g&&!v||!(s===null||s===void 0?void 0:s.jwt)),T=w.envelope,R=w.states,x=w.callbacks;useEffect((function(){if(R.currentPage===0&&b)x.setLimit(e.perPage-1)}),[b]);useEffect((function(){if(e.showReferrer&&b){x.setLimit(e.perPage-1);x.setCurrentPage(0)}else{x.setLimit(e.perPage);x.setCurrentPage(0)}}),[e.showReferrer]);var E=useRerenderListener();var C=T===null||T===void 0?void 0:T.data;var L=useChildElements();function S(e){return __awaiter(this,void 0,void 0,(function(){var t,r,n,a,l,s,i,o,d,u;var c=this;return __generator(this,(function(f){switch(f.label){case 0:t=e.filter((function(e){return e.slot!=="loading"&&e.slot!=="empty"}));r=t===null||t===void 0?void 0:t.map((function(e){return __awaiter(c,void 0,void 0,(function(){return __generator(this,(function(t){return[2,tryMethod(e,(function(){return e.renderLabel()}))]}))}))}));if(!(b&&R.currentPage===0))return[3,2];a=t===null||t===void 0?void 0:t.map((function(e){return __awaiter(c,void 0,void 0,(function(){return __generator(this,(function(t){return[2,tryMethod(e,(function t(){return e.renderReferrerCell(_,e)}))]}))}))}));return[4,Promise.all(a)];case 1:n=f.sent();f.label=2;case 2:l=C===null||C===void 0?void 0:C.map((function(e){return __awaiter(c,void 0,void 0,(function(){var r,n;var a=this;return __generator(this,(function(l){switch(l.label){case 0:r=t===null||t===void 0?void 0:t.map((function(t){return __awaiter(a,void 0,void 0,(function(){return __generator(this,(function(r){return[2,tryMethod(t,(function(){return t.renderCell(e,m)}))]}))}))}));return[4,Promise.all(r)];case 1:n=l.sent();return[2,n]}}))}))}));i=l;if(!i)return[3,4];o=[[n]];return[4,Promise.all(l)];case 3:i=__spreadArrays.apply(void 0,o.concat([f.sent()])).filter((function(e){return e}));f.label=4;case 4:s=i;p({rows:s});u=r;if(!u)return[3,6];return[4,Promise.all(r)];case 5:u=f.sent();f.label=6;case 6:d=u;p({columns:d,loading:false,page:R.currentPage});return[2]}}))}))}useEffect((function(){p({loading:true});T&&S(L)}),[T,L,E]);var D=!((l=f===null||f===void 0?void 0:f.rows)===null||l===void 0?void 0:l.length)&&!(C===null||C===void 0?void 0:C.length);var I=R.loading||f.loading?"loading":D?"empty":"rows";return{states:{hasNext:R.currentPage<R.pageCount-1,hasPrev:R.currentPage>0,show:I,namespace:CSS_NAMESPACE},data:{textOverrides:{showLabels:e.showLabels,prevLabel:e.prevLabel,moreLabel:e.moreLabel},hiddenColumns:e.hiddenColumns,smBreakpoint:e.smBreakpoint,mdBreakpoint:e.mdBreakpoint},elements:{columns:f.columns,rows:f.rows,emptyElement:t,loadingElement:r},callbacks:{nextPage:function(){if(R.currentPage===0&&b)x.setLimit(e.perPage);x.setCurrentPage(R.currentPage+1)},prevPage:function(){if(R.currentPage===1&&b)x.setLimit(e.perPage-1);x.setCurrentPage(R.currentPage-1)}}}}function generateUserError(e){try{return JSON.stringify(e)}catch(e){return"An unknown error"}}function tryMethod(e,t){return __awaiter(this,void 0,void 0,(function(){var r,n,a,l;return __generator(this,(function(s){switch(s.label){case 0:r=e.tagName.toLowerCase();return[4,customElements.whenDefined(r)];case 1:s.sent();try{n=t()}catch(e){if(t.name==="renderReferrerCell"){console.error("column does not have a renderReferrerCell method.")}else{console.error("label promise failed",e)}return[2,h("span",null)]}s.label=2;case 2:s.trys.push([2,4,,5]);return[4,n];case 3:return[2,s.sent()];case 4:a=s.sent();console.error("Error rendering label",a);l=generateUserError(a);return[2,h("details",null,h("summary",null,"Error"),l)];case 5:return[2]}}))}))}var ReferralTable=function(){function e(e){registerInstance(this,e);this.perPage=3;this.showLabels=true;this.prevLabel="Prev";this.moreLabel="Next";this.showReferrer=false;this.hiddenColumns="0";this.smBreakpoint=634;this.mdBreakpoint=899;this.emptyStateImgUrl="https://res.cloudinary.com/saasquatch/image/upload/v1642618031/squatch-assets/image_3_1.png";this.emptyStateTitle="View your referral details";this.emptyStateText="Track the status of your referrals and rewards earned by referring friends";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){var e=h(EmptySlot,{emptyStateImgUrl:this.emptyStateImgUrl,emptyStateTitle:this.emptyStateTitle,emptyStateText:this.emptyStateText});var t=h(LoadingSlot,null);var r=jn()?useReferraltableDemo(this):useReferralTable(this,e,t),n=r.states,a=r.data,l=r.callbacks,s=r.elements;return h(GenericTableView,{states:n,data:a,callbacks:l,elements:s})};return e}();function LoadingSlot(){return h("slot",{name:"loading"},h(LoadingRow,null),h(LoadingRow,null),h(LoadingRow,null),h(LoadingRow,null))}function LoadingRow(){return h("sqm-table-row",null,h("sqm-table-cell",{colspan:5},h("sl-skeleton",null)))}function useReferraltableDemo(e){return cjs({states:{hasPrev:false,hasNext:false,loading:false},callbacks:{prevPage:function(){return console.log("Prev")},nextPage:function(){return console.log("Next")}},data:{textOverrides:{showLabels:e.showLabels,prevLabel:e.prevLabel,moreLabel:e.moreLabel},referralData:[]},elements:{emptyElement:h(EmptySlot,{emptyStateImgUrl:"https://res.cloudinary.com/saasquatch/image/upload/v1642618031/squatch-assets/image_3_1.png",emptyStateTitle:"View your referral details",emptyStateText:"Track the status of your referrals and rewards earned by referring\r\n\t\tfriends"}),loadingElement:h(LoadingSlot,null),columns:[h("div",null,"User"),h("div",null,"Referral Status"),h("div",null,"Rewards")],rows:[]}},e.demoData||{},{arrayMerge:function(e,t){return t}})}function EmptySlot(e){var t=e.emptyStateImgUrl,r=e.emptyStateTitle,n=e.emptyStateText;return h("div",{slot:"empty",style:{display:"contents"}},h("sqm-table-row",null,h("sqm-table-cell",{colspan:5,style:{textAlign:"center"}},h("div",{style:{padding:"var(--sl-spacing-xxx-large)"}},h("img",{src:t,style:{width:"100px"}}),h("div",null,h("b",null,r)),h("div",{style:{marginTop:"var(--sl-spacing-xx-small)",fontSize:"var(--sl-font-size-small)",color:"var(--sl-color-neutral-500)"}},n)))))}var ReferralTableCell=function(){function e(e){registerInstance(this,e);this.ignored=true;h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){return h("div",{innerHTML:this.innerTemplate})};return e}();var ReferralTableGenericColumn=function(){function e(e){registerInstance(this,e);h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,h("sqm-referral-table-cell",{"inner-template":getElement(this).innerHTML})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,Promise.resolve(this.columnTitle)]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}},h("slot",null))};return e}();var ReferralTableDateCell=function(){function e(e){registerInstance(this,e);this.ignored=true;this.locale="en";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.render=function(){var e;var t=!this.date?"-":(e=luxon.DateTime.fromMillis(this.date))===null||e===void 0?void 0:e.setLocale(luxonLocale(this.locale)).toLocaleString(luxon.DateTime.DATE_MED);return t};return e}();var ReferralTableDateColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Date Converted";this.dateShown="dateConverted";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e,t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){console.log("date column - referral",{locale:t});return[2,h("sqm-referral-table-date-cell",{date:e[this.dateShown],locale:t})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.dateShown,this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableRewardsCell=function(){function e(e){registerInstance(this,e);this.locale="en"}e.prototype.render=function(){var e=this;intl.locale=this.locale;var t={"@keyframes slideRight":{from:{opacity:0},to:{opacity:1}},DetailsContainer:{width:"100%",display:"flex","align-items":"center","justify-content":"space-between","margin-right":"var(--sl-spacing-small)","flex-wrap":"wrap"},Details:{"padding-bottom":"var(--sl-spacing-small)","max-width":"500px","&::part(header)":{padding:"var(--sl-spacing-x-small)",cursor:""+(this.hideDetails?"default":"pointer")},"&::part(content)":{padding:"var(--sl-spacing-x-small) var(--sl-spacing-medium)"},"&::part(base)":{opacity:"1"},"&::part(summary-icon)":{display:""+(this.hideDetails?"none":"flex")},"&::part(summary-icon[open])":{transform:"rotate(-90deg)",background:"red"}},BadgeContainer:{"& > :not(:last-child)":{"margin-right":"var(--sl-spacing-x-small)"}},BoldText:{"font-weight":"var(--sl-font-weight-semibold)"},StatusBadge:{paddingLeft:"var(--sl-spacing-xxx-small)"},RedeemBadge:{paddingLeft:"var(--sl-spacing-xxx-small)","&::part(base)":{background:"var(--sl-color-blue-600)"}}};var r=createStyleSheet(t);var n=r.toString();var a=function(e){var t=["REDEEMED","CANCELLED","EXPIRED","PENDING","AVAILABLE"];if(e.length===1)return e[0];return t.find((function(t){return e.includes(t)&&t}))};var l=function(e){switch(e){case"REDEEMED":return"primary";case"EXPIRED":return"danger";case"CANCELLED":return"danger";case"PENDING":return"warning";case"AVAILABLE":return"success"}};var s=function(t){return luxon.DateTime.fromMillis(t).setLocale(luxonLocale(e.locale)).toRelative().replace("in","").trim()};return this.rewards.map((function(t){var i=a(t.statuses);var o=l(i);var d=intl.formatMessage({id:"statusShortMessage",defaultMessage:e.statusText},{status:i});var u=intl.formatMessage({id:"statusLongMessage",defaultMessage:e.statusLongText},{status:i});var c=Math.random().toString(36).slice(2);return h("sl-details",{class:r.classes.Details,disabled:e.hideDetails},h("style",{type:"text/css"},n),h("div",{slot:"summary",class:r.classes.DetailsContainer},h(TextSpanView,{type:"p"},h("span",{class:r.classes.BoldText},t.prettyValue)),h("div",{class:r.classes.BadgeContainer},i==="PENDING"&&t.dateScheduledFor?h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:o,pill:true},intl.formatMessage({id:"pendingForText",defaultMessage:e.pendingForText},{status:d,date:s(t.dateScheduledFor)})):h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:o,pill:true},d),t.dateExpires&&i==="AVAILABLE"&&h("sl-badge",{class:o==="primary"?r.classes.RedeemBadge:r.classes.StatusBadge,type:"info",pill:true},e.expiringText," "+s(t.dateExpires)))),h("div",null,t.dateGiven&&h("div",null,h(TextSpanView,{type:"p"},e.rewardReceivedText," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateGiven).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="EXPIRED"&&t.dateExpires&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateExpires).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="CANCELLED"&&t.dateCancelled&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateCancelled).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),i==="PENDING"&&t.dateScheduledFor&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateScheduledFor).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED))))," ",i==="AVAILABLE"&&t.dateExpires&&h("div",null,h(TextSpanView,{type:"p"},u," ",h("span",{class:r.classes.BoldText},luxon.DateTime.fromMillis(t.dateExpires).setLocale(luxonLocale(e.locale)).toLocaleString(luxon.DateTime.DATE_MED)))),t.fuelTankCode&&h("div",null,e.fuelTankText," ",h("span",{class:r.classes.BoldText},t.fuelTankCode))))}))};return e}();var ReferralTableRewardsColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Rewards";this.statusText="{status, select, AVAILABLE {Available} CANCELLED {Cancelled} PENDING {Pending} EXPIRED {Expired} REDEEMED {Redeemed} other {Not available} }";this.statusLongText="{status, select, AVAILABLE {Reward expiring on} CANCELLED {Reward cancelled on} PENDING {Available on} EXPIRED {Reward expired on} other {Not available} }";this.fuelTankText="Your code is";this.rewardReceivedText="Reward received on";this.expiringText="Expiring in";this.pendingForText="{status} for {date}";this.hideDetails=false;h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e,t){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(r){return[2,h("sqm-referral-table-rewards-cell",{rewards:e.rewards,statusText:this.statusText,statusLongText:this.statusLongText,fuelTankText:this.fuelTankText,rewardReceivedText:this.rewardReceivedText,expiringText:this.expiringText,pendingForText:this.pendingForText,hideDetails:this.hideDetails,locale:t})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableStatusCell=function(){function e(e){registerInstance(this,e)}e.prototype.render=function(){var e={Badge:{"&::part(base)":{fontSize:"var(--sl-font-size-small)",padding:"4px 8px"}}};var t=createStyleSheet(e);var r=t.toString();return h("div",null,h("style",{type:"text/css"},r),h("sl-badge",{pill:true,type:this.converted?"success":"warning",class:t.classes.Badge},this.statusText))};return e}();var ReferralTableStatusColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Status";this.convertedStatusText="Converted";this.inProgressStatusText="In Progress";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){var t;return __generator(this,(function(r){t=e.dateConverted?this.convertedStatusText:this.inProgressStatusText;return[2,h("sqm-referral-table-status-cell",{"status-text":t,converted:e.dateConverted?true:false})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();var ReferralTableUserCell=function(){function e(e){registerInstance(this,e)}e.prototype.render=function(){return this.name};return e}();var ReferralTableUserColumn=function(){function e(e){registerInstance(this,e);this.columnTitle="Customer";this.anonymousUser="Anonymous User";this.deletedUser="Deleted User";h$1(this)}e.prototype.disconnectedCallback=function(){};e.prototype.renderCell=function(e){return __awaiter(this,void 0,void 0,(function(){var t,r,n,a,l;return __generator(this,(function(s){if(!(e===null||e===void 0?void 0:e.referredUser)){l=this.deletedUser}else if(!((t=e===null||e===void 0?void 0:e.referredUser)===null||t===void 0?void 0:t.firstName)&&!((r=e===null||e===void 0?void 0:e.referredUser)===null||r===void 0?void 0:r.lastName)){l=this.anonymousUser}else{l=((n=e===null||e===void 0?void 0:e.referredUser)===null||n===void 0?void 0:n.firstName)+" "+((a=e===null||e===void 0?void 0:e.referredUser)===null||a===void 0?void 0:a.lastName)}return[2,h("sqm-referral-table-user-cell",{name:l})]}))}))};e.prototype.renderLabel=function(){return __awaiter(this,void 0,void 0,(function(){return __generator(this,(function(e){return[2,this.columnTitle]}))}))};e.prototype.render=function(){useRequestRerender([this.deletedUser,this.anonymousUser,this.columnTitle]);return h(Host,{style:{display:"none"}})};return e}();export{ReferralTable as sqm_referral_table,ReferralTableCell as sqm_referral_table_cell,ReferralTableGenericColumn as sqm_referral_table_column,ReferralTableDateCell as sqm_referral_table_date_cell,ReferralTableDateColumn as sqm_referral_table_date_column,ReferralTableRewardsCell as sqm_referral_table_rewards_cell,ReferralTableRewardsColumn as sqm_referral_table_rewards_column,ReferralTableStatusCell as sqm_referral_table_status_cell,ReferralTableStatusColumn as sqm_referral_table_status_column,ReferralTableUserCell as sqm_referral_table_user_cell,ReferralTableUserColumn as sqm_referral_table_user_column};var templateObject_1,templateObject_2;