@slyxup/ui 2.5.4 → 3.0.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/README.md +22 -10
- package/dist/components/BillingPortal/BillingPortal.d.ts +2 -1
- package/dist/components/BillingPortal/BillingPortal.d.ts.map +1 -1
- package/dist/components/BillingPortal/BillingPortal.js +2 -2
- package/dist/components/BillingPortal/BillingPortal.js.map +1 -1
- package/dist/components/InvoicesTable/InvoicesTable.d.ts.map +1 -1
- package/dist/components/InvoicesTable/InvoicesTable.js +9 -7
- package/dist/components/InvoicesTable/InvoicesTable.js.map +1 -1
- package/dist/components/PlanCard/PlanCard.js +1 -1
- package/dist/components/PlanCard/PlanCard.js.map +1 -1
- package/dist/components/PricingTable/PricingTable.d.ts +2 -2
- package/dist/components/PricingTable/PricingTable.d.ts.map +1 -1
- package/dist/components/PricingTable/PricingTable.js +8 -1
- package/dist/components/PricingTable/PricingTable.js.map +1 -1
- package/dist/components/SignIn/SignIn.d.ts.map +1 -1
- package/dist/components/SignIn/SignIn.js +43 -14
- package/dist/components/SignIn/SignIn.js.map +1 -1
- package/dist/components/SignUp/SignUp.d.ts.map +1 -1
- package/dist/components/SignUp/SignUp.js +15 -5
- package/dist/components/SignUp/SignUp.js.map +1 -1
- package/dist/components/SocialButtons/SocialButtons.d.ts.map +1 -1
- package/dist/components/SocialButtons/SocialButtons.js +16 -7
- package/dist/components/SocialButtons/SocialButtons.js.map +1 -1
- package/dist/react/context/auth-context.d.ts +4 -0
- package/dist/react/context/auth-context.d.ts.map +1 -1
- package/dist/react/context/auth-context.js.map +1 -1
- package/dist/react/hooks/useAuth.d.ts +2 -0
- package/dist/react/hooks/useAuth.d.ts.map +1 -1
- package/dist/react/hooks/useAuth.js +3 -0
- package/dist/react/hooks/useAuth.js.map +1 -1
- package/dist/react/hooks/useBilling.d.ts +2 -0
- package/dist/react/hooks/useBilling.d.ts.map +1 -1
- package/dist/react/hooks/useBilling.js +56 -13
- package/dist/react/hooks/useBilling.js.map +1 -1
- package/dist/react/provider/SlyxUpProvider.d.ts +4 -1
- package/dist/react/provider/SlyxUpProvider.d.ts.map +1 -1
- package/dist/react/provider/SlyxUpProvider.js +19 -4
- package/dist/react/provider/SlyxUpProvider.js.map +1 -1
- package/dist/styles.d.ts +2 -2
- package/dist/styles.d.ts.map +1 -1
- package/dist/styles.js +22 -8
- package/dist/styles.js.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -12,20 +12,27 @@ npm install @slyxup/ui @slyxup/core
|
|
|
12
12
|
|
|
13
13
|
## Setup
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
Wrap auth and billing UI in a provider at your app root:
|
|
16
16
|
|
|
17
17
|
```tsx
|
|
18
|
-
import {
|
|
19
|
-
import { SlyxUpStyles } from '@slyxup/ui';
|
|
20
|
-
|
|
21
|
-
const client = new SlyxupClient({ publishableKey: 'pk_test_xxx', apiUrl: '...' });
|
|
18
|
+
import { SlyxUpProvider, SlyxUpStyles } from '@slyxup/ui';
|
|
22
19
|
|
|
23
|
-
<
|
|
24
|
-
|
|
20
|
+
<SlyxUpProvider
|
|
21
|
+
publishableKey="pk_test_your_project_key"
|
|
22
|
+
apiUrl="https://auth.slyxup.online"
|
|
23
|
+
billingApiUrl="https://billing.slyxup.online"
|
|
24
|
+
>
|
|
25
|
+
<SlyxUpStyles />
|
|
26
|
+
<App />
|
|
27
|
+
</SlyxUpProvider>
|
|
25
28
|
```
|
|
26
29
|
|
|
27
30
|
(Components also auto-inject on first mount if you skip this.)
|
|
28
31
|
|
|
32
|
+
The default stylesheet inherits host typography and does not load external fonts. Webfonts are loaded only when you explicitly select a font theme that has a stylesheet URL.
|
|
33
|
+
|
|
34
|
+
Pass configuration explicitly (`import.meta.env.VITE_*` in Vite or `process.env.NEXT_PUBLIC_*` in a Next.js client boundary). Tokens are memory-only by default. Client-only SPAs can opt into `tokenStorage="sessionStorage"` for same-tab reload persistence, scoped by auth URL and project key. This remains script-readable; a same-origin server with HttpOnly cookies is the preferred sensitive-app integration. Billing hooks inherit the provider's key, current token, and `billingApiUrl`; they no longer use a global localStorage token. `useInvoices()` returns `{ invoices, loading, error, reload }`, so failures can be shown with a retry action instead of an empty invoice history.
|
|
35
|
+
|
|
29
36
|
## Components
|
|
30
37
|
|
|
31
38
|
### `<SignIn />` / `<SignUp />`
|
|
@@ -44,8 +51,8 @@ import { SignIn, SignUp } from '@slyxup/ui';
|
|
|
44
51
|
```
|
|
45
52
|
|
|
46
53
|
Notes:
|
|
47
|
-
- `SignIn` accepts **either an email or a username**
|
|
48
|
-
- When the account has 2FA enabled, `SignIn`
|
|
54
|
+
- `SignIn username` accepts **either an email or a username** and sends the corresponding field. Without this prop the field validates an email address.
|
|
55
|
+
- When the account has 2FA enabled, `SignIn` swaps to an authenticator-code step with a **Use a recovery code** alternative. Errors remain visible until the next attempt. Each instance has unique input IDs for accessible labels.
|
|
49
56
|
- `SignUp` includes an optional **username** field (used for password sign-in as an alternative to email).
|
|
50
57
|
|
|
51
58
|
### `<UserButton />` — avatar + dropdown
|
|
@@ -112,6 +119,10 @@ Requires the endpoints shipped in the auth worker (`POST /v1/user/password`, `GE
|
|
|
112
119
|
|
|
113
120
|
Redirects to the hosted OAuth flow.
|
|
114
121
|
|
|
122
|
+
**Release update:** project-scoped OAuth is now implemented. SignIn/SignUp call `client.auth.startOAuth`; the provider exchanges the callback code using the initiating tab's verifier. `useAuth()` exposes `oauthChallenge` and `authError`; SignIn displays the second-factor step when OAuth requires it. Register the return hostname on the project; test projects also allow localhost. Use the current SDK flow rather than hand-built OAuth links.
|
|
123
|
+
|
|
124
|
+
`SocialButtons` uses the same proof-key flow and displays start errors. For custom servers configure the provider `apiUrl`; a conflicting legacy `basePath` is rejected rather than bypassing the callback exchange.
|
|
125
|
+
|
|
115
126
|
### `<PricingTable />` — billing plans grid
|
|
116
127
|
|
|
117
128
|
```tsx
|
|
@@ -162,10 +173,11 @@ const client = new SlyxupClient({ publishableKey: 'pk_test_xxx', apiUrl: '...' }
|
|
|
162
173
|
subscription={subscription}
|
|
163
174
|
invoices={invoices}
|
|
164
175
|
onCancel={cancelSubscription}
|
|
176
|
+
onResume={resumeSubscription}
|
|
165
177
|
/>
|
|
166
178
|
```
|
|
167
179
|
|
|
168
|
-
Shows current plan, status, renewal date, invoice history, and
|
|
180
|
+
Shows current plan, status, renewal date, invoice history, and optional cancel/resume actions. Invoice amounts use currency-aware formatting; totals are grouped by currency rather than adding unrelated currencies together.
|
|
169
181
|
|
|
170
182
|
### Granular billing parts — compose your own layouts
|
|
171
183
|
|
|
@@ -10,6 +10,7 @@ export interface BillingPortalProps {
|
|
|
10
10
|
subscription: PortalSubscription | null;
|
|
11
11
|
invoices: InvoiceRow[];
|
|
12
12
|
onCancel?: () => void;
|
|
13
|
+
onResume?: () => void;
|
|
13
14
|
/** Per-component theme (accent, mode, radius…) — scoped, never global. */
|
|
14
15
|
theme?: SlyxUpTheme;
|
|
15
16
|
style?: CSSProperties;
|
|
@@ -20,5 +21,5 @@ export interface BillingPortalProps {
|
|
|
20
21
|
* Composes CurrentPlanCard + InvoicesTable — use those directly for
|
|
21
22
|
* finer-grained layouts.
|
|
22
23
|
*/
|
|
23
|
-
export declare function BillingPortal({ subscription, invoices, onCancel, theme, style, className, }: BillingPortalProps): import("react").JSX.Element;
|
|
24
|
+
export declare function BillingPortal({ subscription, invoices, onCancel, onResume, theme, style, className, }: BillingPortalProps): import("react").JSX.Element;
|
|
24
25
|
//# sourceMappingURL=BillingPortal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BillingPortal.d.ts","sourceRoot":"","sources":["../../../src/components/BillingPortal/BillingPortal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,gCAAgC,CAAC;AAEhF,MAAM,WAAW,kBAAmB,SAAQ,uBAAuB;IACjE,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,YAAY,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACxC,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"BillingPortal.d.ts","sourceRoot":"","sources":["../../../src/components/BillingPortal/BillingPortal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,UAAU,EAAiB,MAAM,gCAAgC,CAAC;AAEhF,MAAM,WAAW,kBAAmB,SAAQ,uBAAuB;IACjE,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,kBAAkB;IACjC,YAAY,EAAE,kBAAkB,GAAG,IAAI,CAAC;IACxC,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,kBAAkB,+BAgBpB"}
|
|
@@ -8,8 +8,8 @@ import { InvoicesTable } from '../InvoicesTable/InvoicesTable';
|
|
|
8
8
|
* Composes CurrentPlanCard + InvoicesTable — use those directly for
|
|
9
9
|
* finer-grained layouts.
|
|
10
10
|
*/
|
|
11
|
-
export function BillingPortal({ subscription, invoices, onCancel, theme, style, className, }) {
|
|
11
|
+
export function BillingPortal({ subscription, invoices, onCancel, onResume, theme, style, className, }) {
|
|
12
12
|
injectStyles();
|
|
13
|
-
return (_jsxs("div", { className: className, style: { display: 'flex', flexDirection: 'column', gap: 18, ...style }, children: [_jsx(CurrentPlanCard, { subscription: subscription, onCancel: onCancel, theme: theme }), _jsx(InvoicesTable, { invoices: invoices, theme: theme })] }));
|
|
13
|
+
return (_jsxs("div", { className: className, style: { display: 'flex', flexDirection: 'column', gap: 18, ...style }, children: [_jsx(CurrentPlanCard, { subscription: subscription, onCancel: onCancel, onResume: onResume, theme: theme }), _jsx(InvoicesTable, { invoices: invoices, theme: theme })] }));
|
|
14
14
|
}
|
|
15
15
|
//# sourceMappingURL=BillingPortal.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BillingPortal.js","sourceRoot":"","sources":["../../../src/components/BillingPortal/BillingPortal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EACL,eAAe,GAEhB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAmB,aAAa,EAAE,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"BillingPortal.js","sourceRoot":"","sources":["../../../src/components/BillingPortal/BillingPortal.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EACL,eAAe,GAEhB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,EAAmB,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAkBhF;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,GACU;IACnB,YAAY,EAAE,CAAC;IACf,OAAO,CACL,eACE,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,KAAK,EAAE,aAEtE,KAAC,eAAe,IACd,YAAY,EAAE,YAAY,EAC1B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,GACZ,EACF,KAAC,aAAa,IAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,GAAI,IAC/C,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InvoicesTable.d.ts","sourceRoot":"","sources":["../../../src/components/InvoicesTable/InvoicesTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IACpD,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wFAAwF;AACxF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAkB,EAClB,SAAgB,EAChB,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"InvoicesTable.d.ts","sourceRoot":"","sources":["../../../src/components/InvoicesTable/InvoicesTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IACpD,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;CACzB;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,UAAU,EAAE,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wFAAwF;AACxF,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAkB,EAClB,SAAgB,EAChB,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,kBAAkB,sCA4FpB"}
|
|
@@ -9,16 +9,18 @@ export function InvoicesTable({ invoices, title = 'Invoices', showTotal = true,
|
|
|
9
9
|
const ref = useScopedTheme(theme);
|
|
10
10
|
if (invoices.length === 0)
|
|
11
11
|
return null;
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
.
|
|
15
|
-
|
|
16
|
-
|
|
12
|
+
const totals = new Map();
|
|
13
|
+
for (const invoice of invoices) {
|
|
14
|
+
if (invoice.status === 'paid')
|
|
15
|
+
totals.set(invoice.currency, (totals.get(invoice.currency) ?? 0) + invoice.amount);
|
|
16
|
+
}
|
|
17
|
+
const money = (amount, currency) => new Intl.NumberFormat(undefined, { style: 'currency', currency }).format(amount / 100);
|
|
18
|
+
return (_jsxs("div", { ref: ref, className: `slx-card ${className ?? ''}`, style: style, children: [_jsx("h3", { style: { fontSize: 15, fontWeight: 600, marginBottom: 12 }, children: title }), _jsxs("table", { "aria-label": title, style: { width: '100%', fontSize: 13, borderCollapse: 'collapse' }, children: [_jsx("thead", { children: _jsxs("tr", { style: {
|
|
17
19
|
borderBottom: '1px solid var(--slx-border)',
|
|
18
20
|
textAlign: 'left',
|
|
19
21
|
}, children: [_jsx("th", { style: { padding: '6px 0', fontWeight: 550 }, children: "Date" }), _jsx("th", { style: { padding: '6px 0', fontWeight: 550 }, children: "Amount" }), _jsx("th", { style: { padding: '6px 0', fontWeight: 550 }, children: "Status" })] }) }), _jsx("tbody", { children: invoices.map((inv) => (_jsxs("tr", { className: "slx-row-hover", style: { borderBottom: '1px solid var(--slx-border)' }, children: [_jsx("td", { style: { padding: '8px 0' }, children: inv.billedAt
|
|
20
22
|
? new Date(inv.billedAt).toLocaleDateString()
|
|
21
|
-
: '—' }), _jsxs("td", { style: { padding: '8px 0' }, children: [
|
|
23
|
+
: '—' }), _jsxs("td", { style: { padding: '8px 0' }, children: [money(inv.amount, inv.currency), " ", inv.currency] }), _jsx("td", { style: { padding: '8px 0' }, children: _jsx(SubscriptionStatus, { status: inv.status }) })] }, inv.id))) }), showTotal && totals.size > 0 && (_jsx("tfoot", { children: Array.from(totals, ([currency, paidTotal]) => (_jsxs("tr", { children: [_jsx("td", { colSpan: 2, style: {
|
|
22
24
|
padding: '10px 0 2px',
|
|
23
25
|
fontSize: 12,
|
|
24
26
|
fontWeight: 600,
|
|
@@ -30,6 +32,6 @@ export function InvoicesTable({ invoices, title = 'Invoices', showTotal = true,
|
|
|
30
32
|
fontSize: 14,
|
|
31
33
|
fontWeight: 750,
|
|
32
34
|
fontFamily: 'var(--slx-display)',
|
|
33
|
-
}, children: [
|
|
35
|
+
}, children: [money(paidTotal, currency), " ", currency] })] }, currency))) }))] })] }));
|
|
34
36
|
}
|
|
35
37
|
//# sourceMappingURL=InvoicesTable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InvoicesTable.js","sourceRoot":"","sources":["../../../src/components/InvoicesTable/InvoicesTable.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AAqB9E,wFAAwF;AACxF,MAAM,UAAU,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAK,GAAG,UAAU,EAClB,SAAS,GAAG,IAAI,EAChB,KAAK,EACL,KAAK,EACL,SAAS,GACU;IACnB,YAAY,EAAE,CAAC;IACf,MAAM,GAAG,GAAG,cAAc,CAAiB,KAAK,CAAC,CAAC;IAClD,IAAI,QAAQ,CAAC,MAAM,KAAK,CAAC;QAAE,OAAO,IAAI,CAAC;IACvC,MAAM,
|
|
1
|
+
{"version":3,"file":"InvoicesTable.js","sourceRoot":"","sources":["../../../src/components/InvoicesTable/InvoicesTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -25,6 +25,6 @@ export function PlanCard({ plan, current = false, currentLabel = 'Current plan',
|
|
|
25
25
|
left: 0,
|
|
26
26
|
color: '#34d399',
|
|
27
27
|
fontWeight: 700,
|
|
28
|
-
}, children: "\u2713" }), ' ', f] }, f))) }), _jsx("button", { type: "button", className:
|
|
28
|
+
}, children: "\u2713" }), ' ', f] }, f))) }), _jsx("button", { type: "button", className: current ? 'slx-btn-current' : 'slx-btn', onClick: () => (current ? undefined : onSelect?.(plan)), disabled: loading || current, style: current ? { opacity: 1, cursor: 'default' } : undefined, children: current ? currentLabel : ctaLabel })] }));
|
|
29
29
|
}
|
|
30
30
|
//# sourceMappingURL=PlanCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PlanCard.js","sourceRoot":"","sources":["../../../src/components/PlanCard/PlanCard.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AA6B5C,mEAAmE;AACnE,MAAM,UAAU,QAAQ,CAAC,EACvB,IAAI,EACJ,OAAO,GAAG,KAAK,EACf,YAAY,GAAG,cAAc,EAC7B,QAAQ,GAAG,aAAa,EACxB,gBAAgB,GAAG,SAAS,EAC5B,QAAQ,EACR,OAAO,EACP,KAAK,EACL,KAAK,EACL,SAAS,GACK;IACd,YAAY,EAAE,CAAC;IACf,MAAM,GAAG,GAAG,cAAc,CAAiB,KAAK,CAAC,CAAC;IAClD,OAAO,CACL,eACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,0BAA0B,IAAI,CAAC,SAAS,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,EAAE,IAAI,SAAS,IAAI,EAAE,EAAE,EAChH,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,OAAO,EAAE,MAAM;YACf,aAAa,EAAE,QAAQ;YACvB,GAAG,KAAK;SACT,aAEA,IAAI,CAAC,SAAS,IAAI,CAAC,OAAO,IAAI,CAC7B,eAAM,SAAS,EAAC,iBAAiB,YAAE,gBAAgB,GAAQ,CAC5D,EACA,OAAO,IAAI,eAAM,SAAS,EAAC,mBAAmB,YAAE,YAAY,GAAQ,EACrE,aAAI,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,KAAK,EAAE,kBAAkB,EAAE,YACpE,IAAI,CAAC,IAAI,GACP,EACL,eAAK,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,aACjC,gBAAM,SAAS,EAAC,WAAW,kBAAG,CAAC,IAAI,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAQ,EACpE,gBAAM,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,kBACpD,IAAI,CAAC,QAAQ,IACV,IACH,EACL,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,aACE,KAAK,EAAE;oBACL,QAAQ,EAAE,EAAE;oBACZ,KAAK,EAAE,mBAAmB;oBAC1B,YAAY,EAAE,CAAC;iBAChB,aAEA,IAAI,CAAC,SAAS,uBACb,CACL,CAAC,CAAC,CAAC,CACF,YAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC,EAAE,uBAE7D,CACL,EACD,aAAI,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,EAAE,YAC5D,CAAC,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAc,CAAC,GAAG,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,CACtD,cAEE,KAAK,EAAE;wBACL,QAAQ,EAAE,IAAI;wBACd,KAAK,EAAE,gBAAgB;wBACvB,OAAO,EAAE,gBAAgB;wBACzB,QAAQ,EAAE,UAAU;qBACrB,aAED,eACE,KAAK,EAAE;gCACL,QAAQ,EAAE,UAAU;gCACpB,IAAI,EAAE,CAAC;gCACP,KAAK,EAAE,SAAS;gCAChB,UAAU,EAAE,GAAG;6BAChB,uBAGI,EAAC,GAAG,EACV,CAAC,KAlBG,CAAC,CAmBH,CACN,CAAC,GACC,EACL,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,
|
|
1
|
+
{"version":3,"file":"PlanCard.js","sourceRoot":"","sources":["../../../src/components/PlanCard/PlanCard.tsx"],"names":[],"mappings":"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"}
|
|
@@ -10,8 +10,8 @@ export interface PricingTableProps {
|
|
|
10
10
|
* `currentLabel` disabled instead of "Get started". Pass the active
|
|
11
11
|
* subscription's planId, or the $0 plan's id when on the free tier. */
|
|
12
12
|
currentPlanId?: string | null;
|
|
13
|
-
currentLabel?: string;
|
|
14
|
-
ctaLabel?: string;
|
|
13
|
+
currentLabel?: string | ((plan: PricingPlan) => string);
|
|
14
|
+
ctaLabel?: string | ((plan: PricingPlan) => string);
|
|
15
15
|
/** Per-component theme (accent, mode, radius…) — scoped, never global. */
|
|
16
16
|
theme?: SlyxUpTheme;
|
|
17
17
|
style?: CSSProperties;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PricingTable.d.ts","sourceRoot":"","sources":["../../../src/components/PricingTable/PricingTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAY,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEnE,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC;AAQvC,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;4EAEwE;IACxE,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"PricingTable.d.ts","sourceRoot":"","sources":["../../../src/components/PricingTable/PricingTable.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAG3C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAY,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEnE,MAAM,MAAM,WAAW,GAAG,YAAY,CAAC;AAQvC,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACvC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;4EAEwE;IACxE,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,WAAW,KAAK,MAAM,CAAC,CAAC;IACxD,QAAQ,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,IAAI,EAAE,WAAW,KAAK,MAAM,CAAC,CAAC;IACpD,0EAA0E;IAC1E,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,yEAAyE;AACzE,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,OAAO,EACP,aAAoB,EACpB,YAA6B,EAC7B,QAAwB,EACxB,KAAK,EACL,KAAK,EACL,SAAS,GACV,EAAE,iBAAiB,+BAwEnB"}
|
|
@@ -18,6 +18,13 @@ export function PricingTable({ plans, onSelect, loading, currentPlanId = null, c
|
|
|
18
18
|
if (loading) {
|
|
19
19
|
return (_jsxs(_Fragment, { children: [_jsx("style", { children: PRICING_GRID_CSS }), _jsx("div", { ref: ref, className: gridClass, style: style, "aria-busy": "true", children: [1, 2, 3].map((i) => (_jsxs("div", { className: "slx-card", style: { minHeight: 320 }, children: [_jsx("div", { className: "slx-skeleton", style: { height: 18, width: '45%' } }), _jsx("div", { className: "slx-skeleton", style: { height: 40, width: '60%', marginTop: 14 } }), _jsx("div", { className: "slx-skeleton", style: { height: 12, width: '80%', marginTop: 18 } }), _jsx("div", { className: "slx-skeleton", style: { height: 12, width: '70%', marginTop: 10 } }), _jsx("div", { className: "slx-skeleton", style: { height: 12, width: '75%', marginTop: 10 } }), _jsx("div", { className: "slx-skeleton", style: { height: 40, marginTop: 26 } })] }, i))) })] }));
|
|
20
20
|
}
|
|
21
|
-
return (_jsxs(_Fragment, { children: [_jsx("style", { children: PRICING_GRID_CSS }), _jsx("div", { ref: ref, className: gridClass, style: style, children: plans.map((plan, i) =>
|
|
21
|
+
return (_jsxs(_Fragment, { children: [_jsx("style", { children: PRICING_GRID_CSS }), _jsx("div", { ref: ref, className: gridClass, style: style, children: plans.map((plan, i) => {
|
|
22
|
+
const isCurrent = currentPlanId != null && plan.id === currentPlanId;
|
|
23
|
+
const resolvedCurrentLabel = typeof currentLabel === 'function'
|
|
24
|
+
? currentLabel(plan)
|
|
25
|
+
: currentLabel;
|
|
26
|
+
const resolvedCtaLabel = typeof ctaLabel === 'function' ? ctaLabel(plan) : ctaLabel;
|
|
27
|
+
return (_jsx(PlanCard, { plan: plan, current: isCurrent, currentLabel: resolvedCurrentLabel, ctaLabel: resolvedCtaLabel, onSelect: onSelect, loading: loading, className: i < 3 ? `slx-rise-${i + 1}` : undefined }, plan.id));
|
|
28
|
+
}) })] }));
|
|
22
29
|
}
|
|
23
30
|
//# sourceMappingURL=PricingTable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PricingTable.js","sourceRoot":"","sources":["../../../src/components/PricingTable/PricingTable.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAqB,MAAM,sBAAsB,CAAC;AAInE,MAAM,gBAAgB,GAAG;IACvB,oEAAoE;IACpE,qJAAqJ;IACrJ,gHAAgH;CACjH,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAkBX,yEAAyE;AACzE,MAAM,UAAU,YAAY,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,OAAO,EACP,aAAa,GAAG,IAAI,EACpB,YAAY,GAAG,cAAc,EAC7B,QAAQ,GAAG,aAAa,EACxB,KAAK,EACL,KAAK,EACL,SAAS,GACS;IAClB,YAAY,EAAE,CAAC;IACf,MAAM,GAAG,GAAG,cAAc,CAAiB,KAAK,CAAC,CAAC;IAClD,uEAAuE;IACvE,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACpD,MAAM,SAAS,GAAG,sCAAsC,IAAI,IAAI,SAAS,IAAI,EAAE,EAAE,CAAC;IAClF,IAAI,OAAO,EAAE,CAAC;QACZ,OAAO,CACL,8BACE,0BAAQ,gBAAgB,GAAS,EACjC,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,eAAY,MAAM,YAChE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACpB,eAAa,SAAS,EAAC,UAAU,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE,aACzD,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,GACnC,EACF,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,GAClD,EACF,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,GAClD,EACF,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,GAClD,EACF,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,GAClD,EACF,cACE,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,GACpC,KAxBM,CAAC,CAyBL,CACP,CAAC,GACE,IACL,CACJ,CAAC;IACJ,CAAC;IAED,OAAO,CACL,8BACE,0BAAQ,gBAAgB,GAAS,EACjC,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,YAC9C,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,
|
|
1
|
+
{"version":3,"file":"PricingTable.js","sourceRoot":"","sources":["../../../src/components/PricingTable/PricingTable.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SignIn.d.ts","sourceRoot":"","sources":["../../../src/components/SignIn/SignIn.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,WAAW,WAAW;IAC1B,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,wBAAwB;IACxB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,4DAA4D;IAC5D,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,oGAAoG;IACpG,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,2CAA2C;AAC3C,wBAAgB,MAAM,CAAC,EACrB,MAAa,EACb,SAAS,EACT,aAAa,EACb,qBAAqB,EACrB,MAAmB,EACnB,QAAgB,EAChB,UAAmC,EACnC,aAA6E,EAC7E,
|
|
1
|
+
{"version":3,"file":"SignIn.d.ts","sourceRoot":"","sources":["../../../src/components/SignIn/SignIn.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,WAAW,WAAW;IAC1B,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,wBAAwB;IACxB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,4DAA4D;IAC5D,qBAAqB,CAAC,EAAE,MAAM,IAAI,CAAC;IACnC,oGAAoG;IACpG,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,8EAA8E;IAC9E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,2CAA2C;AAC3C,wBAAgB,MAAM,CAAC,EACrB,MAAa,EACb,SAAS,EACT,aAAa,EACb,qBAAqB,EACrB,MAAmB,EACnB,QAAgB,EAChB,UAAmC,EACnC,aAA6E,EAC7E,WAIC,GACF,EAAE,WAAW,+BAkSb"}
|
|
@@ -1,33 +1,44 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { SlyxupError } from '@slyxup/core';
|
|
3
|
-
import { useEffect, useRef, useState } from 'react';
|
|
3
|
+
import { useEffect, useId, useRef, useState } from 'react';
|
|
4
4
|
import { GitHubIcon, GoogleIcon, KeyholeMark } from '../../icons';
|
|
5
5
|
import { useAuth } from '../../react/hooks/useAuth';
|
|
6
6
|
import { injectStyles } from '../../styles';
|
|
7
7
|
import { PasswordField } from '../PasswordField';
|
|
8
8
|
/** Email/password + OAuth sign-in card. */
|
|
9
|
-
export function SignIn({ social = true, onSuccess, onSignUpClick, onForgotPasswordClick, layout = 'centered', username = false, brandTitle = 'Ship auth in minutes', brandSubtitle = 'Email, OAuth and 2FA — one integration, secured by default.', brandPoints = [
|
|
9
|
+
export function SignIn({ social = true, onSuccess, onSignUpClick, onForgotPasswordClick, layout = 'centered', username = false, brandTitle = 'Ship auth in minutes', brandSubtitle = 'Email, OAuth and 2FA — one integration, secured by default.', brandPoints = [
|
|
10
|
+
'Email + OAuth out of the box',
|
|
11
|
+
'HttpOnly sessions, secured by default',
|
|
12
|
+
'Billing ready when you are',
|
|
13
|
+
], }) {
|
|
10
14
|
injectStyles();
|
|
11
|
-
const { signIn, completeSignIn, client } = useAuth();
|
|
15
|
+
const { signIn, completeSignIn, client, oauthChallenge, authError } = useAuth();
|
|
16
|
+
const id = useId();
|
|
12
17
|
const [email, setEmail] = useState('');
|
|
13
18
|
const [password, setPassword] = useState('');
|
|
14
19
|
const [busy, setBusy] = useState(false);
|
|
15
20
|
const [error, setError] = useState(null);
|
|
16
21
|
const [challengeToken, setChallengeToken] = useState(null);
|
|
17
22
|
const [tfaCode, setTfaCode] = useState('');
|
|
23
|
+
const [recoveryMode, setRecoveryMode] = useState(false);
|
|
18
24
|
const cardRef = useRef(null);
|
|
19
25
|
useEffect(() => {
|
|
20
|
-
if (
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
26
|
+
if (oauthChallenge)
|
|
27
|
+
setChallengeToken(oauthChallenge);
|
|
28
|
+
}, [oauthChallenge]);
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
if (authError)
|
|
31
|
+
setError(authError);
|
|
32
|
+
}, [authError]);
|
|
25
33
|
async function onSubmit(e) {
|
|
26
34
|
e.preventDefault();
|
|
27
35
|
setBusy(true);
|
|
28
36
|
setError(null);
|
|
29
37
|
try {
|
|
30
|
-
const
|
|
38
|
+
const identity = email.trim();
|
|
39
|
+
const res = await signIn(username && !identity.includes('@')
|
|
40
|
+
? { username: identity, password }
|
|
41
|
+
: { email: identity, password });
|
|
31
42
|
if (res && 'challengeToken' in res) {
|
|
32
43
|
setChallengeToken(res.challengeToken);
|
|
33
44
|
return;
|
|
@@ -50,7 +61,12 @@ export function SignIn({ social = true, onSuccess, onSignUpClick, onForgotPasswo
|
|
|
50
61
|
setBusy(true);
|
|
51
62
|
setError(null);
|
|
52
63
|
try {
|
|
53
|
-
await completeSignIn({
|
|
64
|
+
await completeSignIn({
|
|
65
|
+
challengeToken,
|
|
66
|
+
...(recoveryMode
|
|
67
|
+
? { recoveryCode: tfaCode.trim() }
|
|
68
|
+
: { code: tfaCode.trim() }),
|
|
69
|
+
});
|
|
54
70
|
onSuccess?.();
|
|
55
71
|
}
|
|
56
72
|
catch (err) {
|
|
@@ -61,15 +77,28 @@ export function SignIn({ social = true, onSuccess, onSignUpClick, onForgotPasswo
|
|
|
61
77
|
}
|
|
62
78
|
}
|
|
63
79
|
function oauth(provider) {
|
|
64
|
-
|
|
65
|
-
|
|
80
|
+
void client.auth
|
|
81
|
+
.startOAuth(provider)
|
|
82
|
+
.catch((error) => setError(error instanceof Error
|
|
83
|
+
? error.message
|
|
84
|
+
: 'Unable to start social sign-in'));
|
|
66
85
|
}
|
|
67
86
|
const missingKey = !client.publishableKey ||
|
|
68
87
|
client.publishableKey === 'pk_test_missing' ||
|
|
69
88
|
client.publishableKey.includes('REPLACE');
|
|
70
|
-
return (_jsxs("div", { ref: cardRef, className: `slx-card${error ? ' slx-card-error' : ''}${layout === 'centered' ? '' : ` slx-layout-${layout}`}`, children: [layout === 'split' && (_jsxs("div", { className: "slx-split-brand", children: [_jsx("div", { className: "slx-split-mark", children: _jsx(KeyholeMark, {}) }), _jsx("h2", { className: "slx-split-title", children: brandTitle }), _jsx("p", { className: "slx-split-sub", children: brandSubtitle }), _jsx("ul", { className: "slx-split-points", children: brandPoints.map((pt) => (_jsx("li", { children: pt }, pt))) })] })), _jsxs("div", { className: layout === 'split' ? 'slx-split-form' : 'slx-form-full', children: [missingKey && (_jsxs("p", { className: "slx-setup-note", children: [_jsx("strong", { children: "Setup:" }), " Add", ' ', _jsx("code", { children: "NEXT_PUBLIC_SLYXUP_PUBLISHABLE_KEY" }), " to", ' ', _jsx("code", { children: ".env.local" })
|
|
89
|
+
return (_jsxs("div", { ref: cardRef, className: `slx-card${error ? ' slx-card-error' : ''}${layout === 'centered' ? '' : ` slx-layout-${layout}`}`, children: [layout === 'split' && (_jsxs("div", { className: "slx-split-brand", children: [_jsx("div", { className: "slx-split-mark", children: _jsx(KeyholeMark, {}) }), _jsx("h2", { className: "slx-split-title", children: brandTitle }), _jsx("p", { className: "slx-split-sub", children: brandSubtitle }), _jsx("ul", { className: "slx-split-points", children: brandPoints.map((pt) => (_jsx("li", { children: pt }, pt))) })] })), _jsxs("div", { className: layout === 'split' ? 'slx-split-form' : 'slx-form-full', children: [missingKey && (_jsxs("p", { className: "slx-setup-note", children: [_jsx("strong", { children: "Setup:" }), " Add", ' ', _jsx("code", { children: "NEXT_PUBLIC_SLYXUP_PUBLISHABLE_KEY" }), " to", ' ', _jsx("code", { children: ".env.local" })] })), _jsx("div", { className: "slx-mark", children: _jsx(KeyholeMark, {}) }), _jsx("h1", { className: "slx-title", children: "Sign in" }), _jsx("p", { className: "slx-subtitle", children: "Welcome back. Enter your details to continue." }), social && !challengeToken && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "slx-social", children: [_jsxs("button", { type: "button", className: "slx-social-btn", onClick: () => oauth('google'), children: [_jsx(GoogleIcon, {}), " Continue with Google"] }), _jsxs("button", { type: "button", className: "slx-social-btn", onClick: () => oauth('github'), children: [_jsx(GitHubIcon, {}), " Continue with GitHub"] })] }), _jsx("div", { className: "slx-divider", children: "or" })] })), error && (_jsx("p", { id: `${id}-error`, className: "slx-error-text", role: "alert", children: error })), challengeToken ? (_jsxs("form", { onSubmit: onSubmit2FA, "aria-busy": busy, "aria-describedby": error ? `${id}-error` : undefined, children: [_jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: `${id}-2fa`, children: recoveryMode ? 'Recovery code' : 'Authenticator code' }), _jsx("input", { id: `${id}-2fa`, className: "slx-input", type: "text", inputMode: recoveryMode ? 'text' : 'numeric', autoComplete: "one-time-code", maxLength: recoveryMode ? 128 : 6, pattern: recoveryMode ? undefined : '[0-9]{6}', placeholder: recoveryMode ? 'Enter a saved recovery code' : '000000', value: tfaCode, onChange: (e) => setTfaCode(recoveryMode
|
|
90
|
+
? e.target.value
|
|
91
|
+
: e.target.value.replace(/\D/g, '')), disabled: busy, required: true }), _jsx("p", { className: "slx-hint", children: recoveryMode
|
|
92
|
+
? 'Each recovery code can be used once.'
|
|
93
|
+
: 'Enter the 6-digit code from your authenticator app.' })] }), _jsxs("button", { className: "slx-btn", type: "submit", disabled: busy, children: [busy && _jsx("span", { className: "slx-spinner", "aria-hidden": "true" }), busy ? 'Verifying…' : 'Verify code'] }), _jsx("button", { type: "button", className: "slx-link", disabled: busy, onClick: () => {
|
|
94
|
+
setRecoveryMode(!recoveryMode);
|
|
95
|
+
setTfaCode('');
|
|
96
|
+
setError(null);
|
|
97
|
+
}, children: recoveryMode ? 'Use authenticator app' : 'Use a recovery code' }), _jsx("button", { type: "button", className: "slx-link", style: { marginTop: 8 }, disabled: busy, onClick: () => {
|
|
71
98
|
setChallengeToken(null);
|
|
72
99
|
setTfaCode('');
|
|
73
|
-
|
|
100
|
+
setError(null);
|
|
101
|
+
setRecoveryMode(false);
|
|
102
|
+
}, children: "\u2190 Back to sign in" })] })) : (_jsxs("form", { onSubmit: onSubmit, "aria-busy": busy, "aria-describedby": error ? `${id}-error` : undefined, children: [_jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: `${id}-email`, children: username ? (_jsxs(_Fragment, { children: ["Username ", _jsx("span", { className: "slx-hint", children: "or email" })] })) : ('Email') }), _jsx("input", { id: `${id}-email`, className: "slx-input", type: username ? 'text' : 'email', autoComplete: "username", placeholder: username ? 'you@example.com or yourname' : 'you@example.com', disabled: busy, value: email, onChange: (e) => setEmail(e.target.value), required: true })] }), _jsxs("div", { className: "slx-field", children: [_jsxs("div", { className: "slx-row", children: [_jsx("label", { className: "slx-label", htmlFor: `${id}-password`, children: "Password" }), onForgotPasswordClick && (_jsx("button", { type: "button", className: "slx-link slx-forgot", onClick: onForgotPasswordClick, children: "Forgot password?" }))] }), _jsx(PasswordField, { id: `${id}-password`, value: password, onChange: setPassword, autoComplete: "current-password", placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022", required: true })] }), _jsxs("button", { className: "slx-btn", type: "submit", disabled: busy, children: [busy && _jsx("span", { className: "slx-spinner", "aria-hidden": "true" }), busy ? 'Signing in…' : 'Sign in'] })] })), onSignUpClick && (_jsxs("p", { className: "slx-footer", children: ["Don't have an account?", ' ', _jsx("button", { type: "button", className: "slx-link", onClick: onSignUpClick, children: "Sign up" })] }))] })] }));
|
|
74
103
|
}
|
|
75
104
|
//# sourceMappingURL=SignIn.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SignIn.js","sourceRoot":"","sources":["../../../src/components/SignIn/SignIn.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SignIn.js","sourceRoot":"","sources":["../../../src/components/SignIn/SignIn.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAkB,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAqBjD,2CAA2C;AAC3C,MAAM,UAAU,MAAM,CAAC,EACrB,MAAM,GAAG,IAAI,EACb,SAAS,EACT,aAAa,EACb,qBAAqB,EACrB,MAAM,GAAG,UAAU,EACnB,QAAQ,GAAG,KAAK,EAChB,UAAU,GAAG,sBAAsB,EACnC,aAAa,GAAG,6DAA6D,EAC7E,WAAW,GAAG;IACZ,8BAA8B;IAC9B,uCAAuC;IACvC,4BAA4B;CAC7B,GACW;IACZ,YAAY,EAAE,CAAC;IACf,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GACjE,OAAO,EAAE,CAAC;IACZ,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IACnB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC7C,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAC1E,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC3C,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,MAAM,OAAO,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC7C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,cAAc;YAAE,iBAAiB,CAAC,cAAc,CAAC,CAAC;IACxD,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IACrB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,KAAK,UAAU,QAAQ,CAAC,CAAY;QAClC,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC,CAAC;QACd,QAAQ,CAAC,IAAI,CAAC,CAAC;QACf,IAAI,CAAC;YACH,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC;YAC9B,MAAM,GAAG,GAAG,MAAM,MAAM,CACtB,QAAQ,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,GAAG,CAAC;gBACjC,CAAC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE;gBAClC,CAAC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAClC,CAAC;YACF,IAAI,GAAG,IAAI,gBAAgB,IAAI,GAAG,EAAE,CAAC;gBACnC,iBAAiB,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;gBACtC,OAAO;YACT,CAAC;YACD,SAAS,EAAE,EAAE,CAAC;QAChB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,QAAQ,CACN,GAAG,YAAY,WAAW;gBACxB,CAAC,CAAC,GAAG,CAAC,OAAO;gBACb,CAAC,CAAC,kCAAkC,CACvC,CAAC;QACJ,CAAC;gBAAS,CAAC;YACT,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,KAAK,UAAU,WAAW,CAAC,CAAY;QACrC,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,IAAI,CAAC,cAAc;YAAE,OAAO;QAC5B,OAAO,CAAC,IAAI,CAAC,CAAC;QACd,QAAQ,CAAC,IAAI,CAAC,CAAC;QACf,IAAI,CAAC;YACH,MAAM,cAAc,CAAC;gBACnB,cAAc;gBACd,GAAG,CAAC,YAAY;oBACd,CAAC,CAAC,EAAE,YAAY,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE;oBAClC,CAAC,CAAC,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;aAC9B,CAAC,CAAC;YACH,SAAS,EAAE,EAAE,CAAC;QAChB,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,QAAQ,CACN,GAAG,YAAY,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,0BAA0B,CACtE,CAAC;QACJ,CAAC;gBAAS,CAAC;YACT,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC;IAED,SAAS,KAAK,CAAC,QAA6B;QAC1C,KAAK,MAAM,CAAC,IAAI;aACb,UAAU,CAAC,QAAQ,CAAC;aACpB,KAAK,CAAC,CAAC,KAAc,EAAE,EAAE,CACxB,QAAQ,CACN,KAAK,YAAY,KAAK;YACpB,CAAC,CAAC,KAAK,CAAC,OAAO;YACf,CAAC,CAAC,gCAAgC,CACrC,CACF,CAAC;IACN,CAAC;IAED,MAAM,UAAU,GACd,CAAC,MAAM,CAAC,cAAc;QACtB,MAAM,CAAC,cAAc,KAAK,iBAAiB;QAC3C,MAAM,CAAC,cAAc,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IAE5C,OAAO,CACL,eACE,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,WAAW,KAAK,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,GAAG,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,eAAe,MAAM,EAAE,EAAE,aAE5G,MAAM,KAAK,OAAO,IAAI,CACrB,eAAK,SAAS,EAAC,iBAAiB,aAC9B,cAAK,SAAS,EAAC,gBAAgB,YAC7B,KAAC,WAAW,KAAG,GACX,EACN,aAAI,SAAS,EAAC,iBAAiB,YAAE,UAAU,GAAM,EACjD,YAAG,SAAS,EAAC,eAAe,YAAE,aAAa,GAAK,EAChD,aAAI,SAAS,EAAC,kBAAkB,YAC7B,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,CACvB,uBAAc,EAAE,IAAP,EAAE,CAAW,CACvB,CAAC,GACC,IACD,CACP,EACD,eAAK,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,eAAe,aACpE,UAAU,IAAI,CACb,aAAG,SAAS,EAAC,gBAAgB,aAC3B,sCAAuB,UAAK,GAAG,EAC/B,gEAA+C,SAAI,GAAG,EACtD,wCAAuB,IACrB,CACL,EACD,cAAK,SAAS,EAAC,UAAU,YACvB,KAAC,WAAW,KAAG,GACX,EACN,aAAI,SAAS,EAAC,WAAW,wBAAa,EACtC,YAAG,SAAS,EAAC,cAAc,8DAEvB,EAEH,MAAM,IAAI,CAAC,cAAc,IAAI,CAC5B,8BACE,eAAK,SAAS,EAAC,YAAY,aACzB,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,aAE9B,KAAC,UAAU,KAAG,6BACP,EACT,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,aAE9B,KAAC,UAAU,KAAG,6BACP,IACL,EACN,cAAK,SAAS,EAAC,aAAa,mBAAS,IACpC,CACJ,EAEA,KAAK,IAAI,CACR,YAAG,EAAE,EAAE,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAC,gBAAgB,EAAC,IAAI,EAAC,OAAO,YAC1D,KAAK,GACJ,CACL,EAEA,cAAc,CAAC,CAAC,CAAC,CAChB,gBACE,QAAQ,EAAE,WAAW,eACV,IAAI,sBACG,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,aAEnD,eAAK,SAAS,EAAC,WAAW,aACxB,gBAAO,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,MAAM,YAC9C,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,oBAAoB,GAChD,EACR,gBACE,EAAE,EAAE,GAAG,EAAE,MAAM,EACf,SAAS,EAAC,WAAW,EACrB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAC5C,YAAY,EAAC,eAAe,EAC5B,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EACjC,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,EAC9C,WAAW,EACT,YAAY,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,QAAQ,EAEzD,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACd,UAAU,CACR,YAAY;4CACV,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;4CAChB,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CACtC,EAEH,QAAQ,EAAE,IAAI,EACd,QAAQ,SACR,EACF,YAAG,SAAS,EAAC,UAAU,YACpB,YAAY;4CACX,CAAC,CAAC,sCAAsC;4CACxC,CAAC,CAAC,qDAAqD,GACvD,IACA,EACN,kBAAQ,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,aACrD,IAAI,IAAI,eAAM,SAAS,EAAC,aAAa,iBAAa,MAAM,GAAG,EAC3D,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,IAC7B,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,UAAU,EACpB,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,GAAG,EAAE;oCACZ,eAAe,CAAC,CAAC,YAAY,CAAC,CAAC;oCAC/B,UAAU,CAAC,EAAE,CAAC,CAAC;oCACf,QAAQ,CAAC,IAAI,CAAC,CAAC;gCACjB,CAAC,YAEA,YAAY,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,qBAAqB,GACxD,EACT,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,UAAU,EACpB,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EACvB,QAAQ,EAAE,IAAI,EACd,OAAO,EAAE,GAAG,EAAE;oCACZ,iBAAiB,CAAC,IAAI,CAAC,CAAC;oCACxB,UAAU,CAAC,EAAE,CAAC,CAAC;oCACf,QAAQ,CAAC,IAAI,CAAC,CAAC;oCACf,eAAe,CAAC,KAAK,CAAC,CAAC;gCACzB,CAAC,uCAGM,IACJ,CACR,CAAC,CAAC,CAAC,CACF,gBACE,QAAQ,EAAE,QAAQ,eACP,IAAI,sBACG,KAAK,CAAC,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,aAEnD,eAAK,SAAS,EAAC,WAAW,aACxB,gBAAO,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,YAChD,QAAQ,CAAC,CAAC,CAAC,CACV,2CACW,eAAM,SAAS,EAAC,UAAU,yBAAgB,IAClD,CACJ,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GACK,EACR,gBACE,EAAE,EAAE,GAAG,EAAE,QAAQ,EACjB,SAAS,EAAC,WAAW,EACrB,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EACjC,YAAY,EAAC,UAAU,EACvB,WAAW,EACT,QAAQ,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,iBAAiB,EAE9D,QAAQ,EAAE,IAAI,EACd,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,QAAQ,SACR,IACE,EACN,eAAK,SAAS,EAAC,WAAW,aACxB,eAAK,SAAS,EAAC,SAAS,aACtB,gBAAO,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,WAAW,yBAE9C,EACP,qBAAqB,IAAI,CACxB,iBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,qBAAqB,EAC/B,OAAO,EAAE,qBAAqB,iCAGvB,CACV,IACG,EACN,KAAC,aAAa,IACZ,EAAE,EAAE,GAAG,EAAE,WAAW,EACpB,KAAK,EAAE,QAAQ,EACf,QAAQ,EAAE,WAAW,EACrB,YAAY,EAAC,kBAAkB,EAC/B,WAAW,EAAC,kDAAU,EACtB,QAAQ,SACR,IACE,EACN,kBAAQ,SAAS,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,IAAI,aACrD,IAAI,IAAI,eAAM,SAAS,EAAC,aAAa,iBAAa,MAAM,GAAG,EAC3D,IAAI,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,IAC1B,IACJ,CACR,EAEA,aAAa,IAAI,CAChB,aAAG,SAAS,EAAC,YAAY,uCACK,GAAG,EAC/B,iBAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAC,UAAU,EAAC,OAAO,EAAE,aAAa,wBAExD,IACP,CACL,IACG,IACF,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SignUp.d.ts","sourceRoot":"","sources":["../../../src/components/SignUp/SignUp.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"SignUp.d.ts","sourceRoot":"","sources":["../../../src/components/SignUp/SignUp.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAI9C,MAAM,WAAW,WAAW;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,oGAAoG;IACpG,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,6EAA6E;IAC7E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;CACxB;AAED,2CAA2C;AAC3C,wBAAgB,MAAM,CAAC,EACrB,MAAa,EACb,SAAS,EACT,aAAa,EACb,MAAmB,EACnB,QAAQ,EAAE,YAAmB,EAC7B,UAAkC,EAClC,aAA4D,EAC5D,WAIC,GACF,EAAE,WAAW,+BA8Nb"}
|
|
@@ -5,10 +5,15 @@ import { GitHubIcon, GoogleIcon, KeyholeMark } from '../../icons';
|
|
|
5
5
|
import { useAuth } from '../../react/hooks/useAuth';
|
|
6
6
|
import { injectStyles } from '../../styles';
|
|
7
7
|
import { PasswordField } from '../PasswordField';
|
|
8
|
+
import { SignIn } from '../SignIn/SignIn';
|
|
8
9
|
/** Email/password + OAuth sign-up card. */
|
|
9
|
-
export function SignUp({ social = true, onSuccess, onSignInClick, layout = 'centered', username: showUsername = true, brandTitle = 'Create your account', brandSubtitle = 'A minute to set up. Sign in forever after.', brandPoints = [
|
|
10
|
+
export function SignUp({ social = true, onSuccess, onSignInClick, layout = 'centered', username: showUsername = true, brandTitle = 'Create your account', brandSubtitle = 'A minute to set up. Sign in forever after.', brandPoints = [
|
|
11
|
+
'Email + OAuth out of the box',
|
|
12
|
+
'HttpOnly sessions, secured by default',
|
|
13
|
+
'Billing ready when you are',
|
|
14
|
+
], }) {
|
|
10
15
|
injectStyles();
|
|
11
|
-
const { signUp, client } = useAuth();
|
|
16
|
+
const { signUp, client, oauthChallenge } = useAuth();
|
|
12
17
|
const [firstName, setFirstName] = useState('');
|
|
13
18
|
const [username, setUsername] = useState('');
|
|
14
19
|
const [email, setEmail] = useState('');
|
|
@@ -47,12 +52,17 @@ export function SignUp({ social = true, onSuccess, onSignInClick, layout = 'cent
|
|
|
47
52
|
}
|
|
48
53
|
}
|
|
49
54
|
function oauth(provider) {
|
|
50
|
-
|
|
51
|
-
|
|
55
|
+
void client.auth
|
|
56
|
+
.startOAuth(provider)
|
|
57
|
+
.catch((error) => setError(error instanceof Error
|
|
58
|
+
? error.message
|
|
59
|
+
: 'Unable to start social sign-in'));
|
|
52
60
|
}
|
|
53
61
|
const missingKey = !client.publishableKey ||
|
|
54
62
|
client.publishableKey === 'pk_test_missing' ||
|
|
55
63
|
client.publishableKey.includes('REPLACE');
|
|
56
|
-
|
|
64
|
+
if (oauthChallenge)
|
|
65
|
+
return _jsx(SignIn, { social: false, onSuccess: onSuccess, layout: layout });
|
|
66
|
+
return (_jsxs("div", { ref: cardRef, className: `slx-card${error ? ' slx-card-error' : ''}${layout === 'centered' ? '' : ` slx-layout-${layout}`}`, children: [layout === 'split' && (_jsxs("div", { className: "slx-split-brand", children: [_jsx("div", { className: "slx-split-mark", children: _jsx(KeyholeMark, {}) }), _jsx("h2", { className: "slx-split-title", children: brandTitle }), _jsx("p", { className: "slx-split-sub", children: brandSubtitle }), _jsx("ul", { className: "slx-split-points", children: brandPoints.map((pt) => (_jsx("li", { children: pt }, pt))) })] })), _jsxs("div", { className: layout === 'split' ? 'slx-split-form' : 'slx-form-full', children: [missingKey && (_jsxs("p", { className: "slx-setup-note", children: [_jsx("strong", { children: "Setup:" }), " Add", ' ', _jsx("code", { children: "NEXT_PUBLIC_SLYXUP_PUBLISHABLE_KEY" }), " \u2014 run", ' ', _jsx("code", { children: ".env.local" })] })), _jsx("div", { className: "slx-mark", children: _jsx(KeyholeMark, {}) }), _jsx("h1", { className: "slx-title", children: "Create your account" }), _jsx("p", { className: "slx-subtitle", children: "A minute to set up. Sign in forever after." }), social && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "slx-social", children: [_jsxs("button", { type: "button", className: "slx-social-btn", onClick: () => oauth('google'), children: [_jsx(GoogleIcon, {}), " Continue with Google"] }), _jsxs("button", { type: "button", className: "slx-social-btn", onClick: () => oauth('github'), children: [_jsx(GitHubIcon, {}), " Continue with GitHub"] })] }), _jsx("div", { className: "slx-divider", children: "or" })] })), error && (_jsx("p", { className: "slx-error-text", role: "alert", children: error })), successEmail && (_jsxs("p", { className: "slx-success-text", "aria-live": "polite", style: { color: 'var(--slx-success)' }, children: ["Account created! We sent a verification link to", ' ', _jsx("strong", { children: successEmail }), ". Check your inbox to verify and sign in."] })), _jsxs("form", { onSubmit: onSubmit, children: [_jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: "slx-signup-name", children: "First name" }), _jsx("input", { id: "slx-signup-name", className: "slx-input", type: "text", autoComplete: "given-name", placeholder: "Ada", value: firstName, onChange: (e) => setFirstName(e.target.value) })] }), showUsername && (_jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: "slx-signup-username", children: "Username" }), _jsx("input", { id: "slx-signup-username", className: "slx-input", type: "text", autoComplete: "username", placeholder: "ada", value: username, onChange: (e) => setUsername(e.target.value) }), _jsx("p", { className: "slx-hint", children: "Optional \u2014 lets you sign in with a username instead of your email." })] })), _jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: "slx-signup-email", children: "Email" }), _jsx("input", { id: "slx-signup-email", className: "slx-input", type: "email", autoComplete: "email", placeholder: "you@example.com", value: email, onChange: (e) => setEmail(e.target.value), required: true })] }), _jsxs("div", { className: "slx-field", children: [_jsx("label", { className: "slx-label", htmlFor: "slx-signup-password", children: "Password" }), _jsx(PasswordField, { id: "slx-signup-password", value: password, onChange: setPassword, autoComplete: "new-password", placeholder: "At least 8 characters", required: true, minLength: 8 }), _jsx("p", { className: "slx-hint", children: "Use 8+ characters with a mix of letters and numbers." })] }), _jsxs("button", { className: "slx-btn", type: "submit", disabled: busy, children: [busy && _jsx("span", { className: "slx-spinner", "aria-hidden": "true" }), busy ? 'Creating account…' : 'Create account'] })] }), onSignInClick && (_jsxs("p", { className: "slx-footer", children: ["Already have an account?", ' ', _jsx("button", { type: "button", className: "slx-link", onClick: onSignInClick, children: "Sign in" })] }))] })] }));
|
|
57
67
|
}
|
|
58
68
|
//# sourceMappingURL=SignUp.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SignUp.js","sourceRoot":"","sources":["../../../src/components/SignUp/SignUp.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;
|
|
1
|
+
{"version":3,"file":"SignUp.js","sourceRoot":"","sources":["../../../src/components/SignUp/SignUp.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SocialButtons.d.ts","sourceRoot":"","sources":["../../../src/components/SocialButtons/SocialButtons.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SocialButtons.d.ts","sourceRoot":"","sources":["../../../src/components/SocialButtons/SocialButtons.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,kBAAkB;IACjC,+CAA+C;IAC/C,SAAS,CAAC,EAAE,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC;IACvC,mFAAmF;IACnF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAOD,4DAA4D;AAC5D,wBAAgB,aAAa,CAAC,EAC5B,SAAgC,EAChC,QAAQ,GACT,EAAE,kBAAkB,+BA2CpB"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
2
3
|
import { GitHubIcon, GoogleIcon } from '../../icons';
|
|
3
4
|
import { useAuth } from '../../react/hooks/useAuth';
|
|
4
5
|
import { injectStyles } from '../../styles';
|
|
@@ -9,14 +10,22 @@ const META = {
|
|
|
9
10
|
/** Provider buttons that redirect to hosted OAuth start. */
|
|
10
11
|
export function SocialButtons({ providers = ['google', 'github'], basePath, }) {
|
|
11
12
|
injectStyles();
|
|
13
|
+
const [error, setError] = useState(null);
|
|
12
14
|
const { client } = useAuth();
|
|
13
15
|
const base = basePath ?? `${client?.apiUrl ?? ''}/v1/oauth`;
|
|
14
|
-
return (
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
16
|
+
return (_jsxs("div", { className: "slx-social", children: [providers.map((p) => {
|
|
17
|
+
const { label, Icon } = META[p];
|
|
18
|
+
return (_jsxs("button", { type: "button", className: "slx-social-btn", onClick: () => {
|
|
19
|
+
if (basePath && base !== `${client.apiUrl}/v1/oauth`) {
|
|
20
|
+
setError('Configure the provider apiUrl for custom OAuth servers');
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
void client.auth
|
|
24
|
+
.startOAuth(p)
|
|
25
|
+
.catch((error) => setError(error instanceof Error
|
|
26
|
+
? error.message
|
|
27
|
+
: 'Unable to start sign-in'));
|
|
28
|
+
}, children: [_jsx(Icon, {}), " ", label] }, p));
|
|
29
|
+
}), error && (_jsx("p", { role: "alert", className: "slx-error-text", children: error }))] }));
|
|
21
30
|
}
|
|
22
31
|
//# sourceMappingURL=SocialButtons.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SocialButtons.js","sourceRoot":"","sources":["../../../src/components/SocialButtons/SocialButtons.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAS5C,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,IAAI,EAAE,UAAU,EAAE;IAC3D,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,IAAI,EAAE,UAAU,EAAE;CACnD,CAAC;AAEX,4DAA4D;AAC5D,MAAM,UAAU,aAAa,CAAC,EAC5B,SAAS,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAChC,QAAQ,GACW;IACnB,YAAY,EAAE,CAAC;IACf,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,
|
|
1
|
+
{"version":3,"file":"SocialButtons.js","sourceRoot":"","sources":["../../../src/components/SocialButtons/SocialButtons.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACpD,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAS5C,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,IAAI,EAAE,UAAU,EAAE;IAC3D,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,IAAI,EAAE,UAAU,EAAE;CACnD,CAAC;AAEX,4DAA4D;AAC5D,MAAM,UAAU,aAAa,CAAC,EAC5B,SAAS,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAChC,QAAQ,GACW;IACnB,YAAY,EAAE,CAAC;IACf,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACxD,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,EAAE,CAAC;IAC7B,MAAM,IAAI,GAAG,QAAQ,IAAI,GAAG,MAAM,EAAE,MAAM,IAAI,EAAE,WAAW,CAAC;IAC5D,OAAO,CACL,eAAK,SAAS,EAAC,YAAY,aACxB,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;gBACnB,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;gBAChC,OAAO,CACL,kBAEE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,GAAG,EAAE;wBACZ,IAAI,QAAQ,IAAI,IAAI,KAAK,GAAG,MAAM,CAAC,MAAM,WAAW,EAAE,CAAC;4BACrD,QAAQ,CACN,wDAAwD,CACzD,CAAC;4BACF,OAAO;wBACT,CAAC;wBACD,KAAK,MAAM,CAAC,IAAI;6BACb,UAAU,CAAC,CAAC,CAAC;6BACb,KAAK,CAAC,CAAC,KAAc,EAAE,EAAE,CACxB,QAAQ,CACN,KAAK,YAAY,KAAK;4BACpB,CAAC,CAAC,KAAK,CAAC,OAAO;4BACf,CAAC,CAAC,yBAAyB,CAC9B,CACF,CAAC;oBACN,CAAC,aAED,KAAC,IAAI,KAAG,OAAE,KAAK,KArBV,CAAC,CAsBC,CACV,CAAC;YACJ,CAAC,CAAC,EACD,KAAK,IAAI,CACR,YAAG,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,gBAAgB,YACvC,KAAK,GACJ,CACL,IACG,CACP,CAAC;AACJ,CAAC"}
|