Skip to content

Commit bebaa7a

Browse files
00salmon00salmon
committed
Merge remote-tracking branch 'origin/cash-reward-redemption-andy' into cash-reward-redemption
2 parents 2710f9c + 2fdaf6e commit bebaa7a

File tree

5 files changed

+691
-0
lines changed

5 files changed

+691
-0
lines changed

‎packages/mint-components/src/components.d.ts‎

Lines changed: 128 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import { NavigationMenuViewProps } from "./components/sqm-navigation-menu/sqm-na
3434
import { NavigationSidebarViewProps } from "./components/sqm-navigation-sidebar/sqm-navigation-sidebar-view";
3535
import { NavigationSidebarItemViewProps } from "./components/sqm-navigation-sidebar-item/sqm-navigation-sidebar-item-view";
3636
import { UsePagination } from "./components/sqm-pagination/usePagination";
37+
import { PartnerInfoModalViewProps } from "./components/sqm-partner-info-modal/sqm-partner-info-modal-view";
3738
import { PasswordFieldViewDemoProps } from "./components/sqm-password-field/usePasswordField";
3839
import { PayoutButtonScrollViewProps } from "./components/sqm-payout-button-scroll/sqm-payout-button-scroll-view";
3940
import { PayoutStatusAlertViewProps } from "./components/tax-and-cash/sqm-payout-status-alert/sqm-payout-status-alert-view";
@@ -2310,6 +2311,65 @@ export namespace Components {
23102311
*/
23112312
"paginationText": string;
23122313
}
2314+
interface SqmPartnerInfoModal {
2315+
/**
2316+
* @uiName Confirm button label
2317+
*/
2318+
"confirmButtonLabel": string;
2319+
/**
2320+
* @uiName Country label
2321+
*/
2322+
"countryLabel": string;
2323+
/**
2324+
* @uiName Currency label
2325+
*/
2326+
"currencyLabel": string;
2327+
/**
2328+
* @undocumented
2329+
* @uiType object
2330+
*/
2331+
"demoData"?: DemoData<PartnerInfoModalViewProps>;
2332+
/**
2333+
* Description for existing partner confirmation
2334+
* @uiName Existing partner description
2335+
* @uiWidget textArea
2336+
*/
2337+
"descriptionExistingPartner": string;
2338+
/**
2339+
* Description for new partner setup
2340+
* @uiName New partner description
2341+
* @uiWidget textArea
2342+
*/
2343+
"descriptionNewPartner": string;
2344+
/**
2345+
* @uiName Missing fields error text
2346+
* @uiWidget textArea
2347+
*/
2348+
"missingFieldsErrorText": string;
2349+
/**
2350+
* Header text when user has no existing partner
2351+
* @uiName New partner header
2352+
* @uiWidget textArea
2353+
*/
2354+
"modalBrandHeader": string;
2355+
/**
2356+
* @uiName Network error text
2357+
* @uiWidget textArea
2358+
*/
2359+
"networkErrorText": string;
2360+
/**
2361+
* @uiName Search country placeholder
2362+
*/
2363+
"searchCountryPlaceholder": string;
2364+
/**
2365+
* @uiName Search currency placeholder
2366+
*/
2367+
"searchCurrencyPlaceholder": string;
2368+
/**
2369+
* @uiName Submit button label
2370+
*/
2371+
"submitButtonLabel": string;
2372+
}
23132373
interface SqmPasswordField {
23142374
/**
23152375
* @undocumented
@@ -7497,6 +7557,12 @@ declare global {
74977557
prototype: HTMLSqmPaginationElement;
74987558
new (): HTMLSqmPaginationElement;
74997559
};
7560+
interface HTMLSqmPartnerInfoModalElement extends Components.SqmPartnerInfoModal, HTMLStencilElement {
7561+
}
7562+
var HTMLSqmPartnerInfoModalElement: {
7563+
prototype: HTMLSqmPartnerInfoModalElement;
7564+
new (): HTMLSqmPartnerInfoModalElement;
7565+
};
75007566
interface HTMLSqmPasswordFieldElement extends Components.SqmPasswordField, HTMLStencilElement {
75017567
}
75027568
var HTMLSqmPasswordFieldElement: {
@@ -8021,6 +8087,7 @@ declare global {
80218087
"sqm-navigation-sidebar": HTMLSqmNavigationSidebarElement;
80228088
"sqm-navigation-sidebar-item": HTMLSqmNavigationSidebarItemElement;
80238089
"sqm-pagination": HTMLSqmPaginationElement;
8090+
"sqm-partner-info-modal": HTMLSqmPartnerInfoModalElement;
80248091
"sqm-password-field": HTMLSqmPasswordFieldElement;
80258092
"sqm-payout-button-scroll": HTMLSqmPayoutButtonScrollElement;
80268093
"sqm-payout-details-card": HTMLSqmPayoutDetailsCardElement;
@@ -10347,6 +10414,65 @@ declare namespace LocalJSX {
1034710414
*/
1034810415
"paginationText"?: string;
1034910416
}
10417+
interface SqmPartnerInfoModal {
10418+
/**
10419+
* @uiName Confirm button label
10420+
*/
10421+
"confirmButtonLabel"?: string;
10422+
/**
10423+
* @uiName Country label
10424+
*/
10425+
"countryLabel"?: string;
10426+
/**
10427+
* @uiName Currency label
10428+
*/
10429+
"currencyLabel"?: string;
10430+
/**
10431+
* @undocumented
10432+
* @uiType object
10433+
*/
10434+
"demoData"?: DemoData<PartnerInfoModalViewProps>;
10435+
/**
10436+
* Description for existing partner confirmation
10437+
* @uiName Existing partner description
10438+
* @uiWidget textArea
10439+
*/
10440+
"descriptionExistingPartner"?: string;
10441+
/**
10442+
* Description for new partner setup
10443+
* @uiName New partner description
10444+
* @uiWidget textArea
10445+
*/
10446+
"descriptionNewPartner"?: string;
10447+
/**
10448+
* @uiName Missing fields error text
10449+
* @uiWidget textArea
10450+
*/
10451+
"missingFieldsErrorText"?: string;
10452+
/**
10453+
* Header text when user has no existing partner
10454+
* @uiName New partner header
10455+
* @uiWidget textArea
10456+
*/
10457+
"modalBrandHeader"?: string;
10458+
/**
10459+
* @uiName Network error text
10460+
* @uiWidget textArea
10461+
*/
10462+
"networkErrorText"?: string;
10463+
/**
10464+
* @uiName Search country placeholder
10465+
*/
10466+
"searchCountryPlaceholder"?: string;
10467+
/**
10468+
* @uiName Search currency placeholder
10469+
*/
10470+
"searchCurrencyPlaceholder"?: string;
10471+
/**
10472+
* @uiName Submit button label
10473+
*/
10474+
"submitButtonLabel"?: string;
10475+
}
1035010476
interface SqmPasswordField {
1035110477
/**
1035210478
* @undocumented
@@ -15263,6 +15389,7 @@ declare namespace LocalJSX {
1526315389
"sqm-navigation-sidebar": SqmNavigationSidebar;
1526415390
"sqm-navigation-sidebar-item": SqmNavigationSidebarItem;
1526515391
"sqm-pagination": SqmPagination;
15392+
"sqm-partner-info-modal": SqmPartnerInfoModal;
1526615393
"sqm-password-field": SqmPasswordField;
1526715394
"sqm-payout-button-scroll": SqmPayoutButtonScroll;
1526815395
"sqm-payout-details-card": SqmPayoutDetailsCard;
@@ -15397,6 +15524,7 @@ declare module "@stencil/core" {
1539715524
"sqm-navigation-sidebar": LocalJSX.SqmNavigationSidebar & JSXBase.HTMLAttributes<HTMLSqmNavigationSidebarElement>;
1539815525
"sqm-navigation-sidebar-item": LocalJSX.SqmNavigationSidebarItem & JSXBase.HTMLAttributes<HTMLSqmNavigationSidebarItemElement>;
1539915526
"sqm-pagination": LocalJSX.SqmPagination & JSXBase.HTMLAttributes<HTMLSqmPaginationElement>;
15527+
"sqm-partner-info-modal": LocalJSX.SqmPartnerInfoModal & JSXBase.HTMLAttributes<HTMLSqmPartnerInfoModalElement>;
1540015528
"sqm-password-field": LocalJSX.SqmPasswordField & JSXBase.HTMLAttributes<HTMLSqmPasswordFieldElement>;
1540115529
"sqm-payout-button-scroll": LocalJSX.SqmPayoutButtonScroll & JSXBase.HTMLAttributes<HTMLSqmPayoutButtonScrollElement>;
1540215530
"sqm-payout-details-card": LocalJSX.SqmPayoutDetailsCard & JSXBase.HTMLAttributes<HTMLSqmPayoutDetailsCardElement>;

‎packages/mint-components/src/components/sqm-partner-info-modal/PartnerInfoModal.stories.tsx‎

Lines changed: 171 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,171 @@
1+
import { h } from "@stencil/core";
2+
import {
3+
PartnerInfoModalView,
4+
PartnerInfoModalViewProps,
5+
} from "./sqm-partner-info-modal-view";
6+
7+
export default {
8+
title: "Components/Partner Info Modal",
9+
};
10+
11+
const demoCountries = [
12+
{ countryCode: "US", displayName: "United States" },
13+
{ countryCode: "CA", displayName: "Canada" },
14+
{ countryCode: "GB", displayName: "United Kingdom" },
15+
{ countryCode: "AU", displayName: "Australia" },
16+
{ countryCode: "DE", displayName: "Germany" },
17+
{ countryCode: "FR", displayName: "France" },
18+
{ countryCode: "JP", displayName: "Japan" },
19+
];
20+
21+
const demoCurrencies = [
22+
{ currencyCode: "USD", displayName: "US Dollar" },
23+
{ currencyCode: "CAD", displayName: "Canadian Dollar" },
24+
{ currencyCode: "GBP", displayName: "British Pound" },
25+
{ currencyCode: "EUR", displayName: "Euro" },
26+
{ currencyCode: "AUD", displayName: "Australian Dollar" },
27+
];
28+
29+
const noopCallbacks = {
30+
onCountryChange: (e: any) => console.log("Country changed:", e),
31+
onCurrencyChange: (e: any) => console.log("Currency changed:", e),
32+
onCountrySearch: (v: string) => console.log("Country search:", v),
33+
onCurrencySearch: (v: string) => console.log("Currency search:", v),
34+
onSubmit: () => console.log("Submit"),
35+
onClose: () => console.log("Close"),
36+
};
37+
38+
const defaultText = {
39+
modalBrandHeader: "Welcome to {brandName} Program!",
40+
descriptionNewPartner:
41+
"We just need a bit more information about you before you start earning cash!",
42+
descriptionExistingPartner:
43+
"We noticed you are already an Impact.com partner, please confirm your information.",
44+
countryLabel: "Country",
45+
currencyLabel: "Currency",
46+
submitButtonLabel: "Submit",
47+
confirmButtonLabel: "Confirm",
48+
searchCountryPlaceholder: "Search for a country",
49+
searchCurrencyPlaceholder: "Search for a currency",
50+
};
51+
52+
const defaultProps: PartnerInfoModalViewProps = {
53+
states: {
54+
open: true,
55+
loading: false,
56+
submitting: false,
57+
isExistingPartner: false,
58+
countryCode: "",
59+
currency: "",
60+
error: "",
61+
success: false,
62+
brandName: "Test Brand",
63+
filteredCountries: demoCountries,
64+
filteredCurrencies: demoCurrencies,
65+
},
66+
callbacks: noopCallbacks,
67+
text: defaultText,
68+
};
69+
70+
export const NewPartnerEmpty = () => {
71+
return <PartnerInfoModalView {...defaultProps} />;
72+
};
73+
74+
export const NewPartnerPrefilled = () => {
75+
const props: PartnerInfoModalViewProps = {
76+
...defaultProps,
77+
states: {
78+
...defaultProps.states,
79+
countryCode: "US",
80+
currency: "",
81+
},
82+
};
83+
return <PartnerInfoModalView {...props} />;
84+
};
85+
86+
export const NewPartnerFullySelected = () => {
87+
const props: PartnerInfoModalViewProps = {
88+
...defaultProps,
89+
states: {
90+
...defaultProps.states,
91+
countryCode: "US",
92+
currency: "USD",
93+
},
94+
};
95+
return <PartnerInfoModalView {...props} />;
96+
};
97+
98+
export const ExistingPartnerConfirm = () => {
99+
const props: PartnerInfoModalViewProps = {
100+
...defaultProps,
101+
states: {
102+
...defaultProps.states,
103+
isExistingPartner: true,
104+
countryCode: "CA",
105+
currency: "CAD",
106+
},
107+
};
108+
return <PartnerInfoModalView {...props} />;
109+
};
110+
111+
export const Submitting = () => {
112+
const props: PartnerInfoModalViewProps = {
113+
...defaultProps,
114+
states: {
115+
...defaultProps.states,
116+
countryCode: "GB",
117+
currency: "GBP",
118+
submitting: true,
119+
},
120+
};
121+
return <PartnerInfoModalView {...props} />;
122+
};
123+
124+
export const WithError = () => {
125+
const props: PartnerInfoModalViewProps = {
126+
...defaultProps,
127+
states: {
128+
...defaultProps.states,
129+
countryCode: "US",
130+
currency: "USD",
131+
error:
132+
"An error occurred while creating your partner account. Please try again.",
133+
},
134+
};
135+
return <PartnerInfoModalView {...props} />;
136+
};
137+
138+
export const ValidationError = () => {
139+
const props: PartnerInfoModalViewProps = {
140+
...defaultProps,
141+
states: {
142+
...defaultProps.states,
143+
countryCode: "",
144+
currency: "",
145+
error: "Please select both a country and currency.",
146+
},
147+
};
148+
return <PartnerInfoModalView {...props} />;
149+
};
150+
151+
export const Closed = () => {
152+
const props: PartnerInfoModalViewProps = {
153+
...defaultProps,
154+
states: {
155+
...defaultProps.states,
156+
open: false,
157+
},
158+
};
159+
return <PartnerInfoModalView {...props} />;
160+
};
161+
162+
export const FullStackDemo = () => {
163+
return (
164+
<sqm-partner-info-modal
165+
brand-name="Acme"
166+
header-new-partner="Welcome to {brandName} Program!"
167+
description-new-partner="We just need a bit more information about you before you start earning cash!"
168+
submit-button-label="Submit"
169+
></sqm-partner-info-modal>
170+
);
171+
};

0 commit comments

Comments
 (0)