@sypra-ui/pages 0.2.0 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -31,10 +31,10 @@ payments.
31
31
 
32
32
  ## Authentication methods
33
33
 
34
- `LoginPage`, `SignupPage`, and `AuthModal` can show email/password and any
35
- selection of provider buttons. Email/password is enabled by default; set
36
- `emailPassword={false}` for provider-only sign-in. The library calls your
37
- handler and never owns OAuth client IDs, redirects, or callback exchanges.
34
+ `LoginPage`, `SignupPage`, `AuthModal`, and the unwrapped `AuthForm` accept
35
+ `authMethods`. Enable any combination of email/password, Google, and GitHub.
36
+ The library calls your handler and never owns OAuth client IDs, redirects, or
37
+ callback exchanges.
38
38
 
39
39
  ```tsx
40
40
  const startOAuth = (provider: string) => {
@@ -42,19 +42,53 @@ const startOAuth = (provider: string) => {
42
42
  };
43
43
 
44
44
  // Email/password only
45
- <LoginPage onSubmit={signInWithPassword} />;
46
-
47
- // Google only (or use 'github')
48
45
  <LoginPage
49
- emailPassword={false}
50
- providers={['google']}
51
- onProviderLogin={startOAuth}
46
+ authMethods={{ emailPassword: true }}
47
+ onSubmit={signInWithPassword}
52
48
  />;
53
49
 
50
+ // Google only (or use 'github')
51
+ <LoginPage authMethods={{ google: true }} onProviderLogin={startOAuth} />;
52
+
54
53
  // Email/password, Google, and GitHub
55
54
  <LoginPage
56
- providers={['google', 'github']}
55
+ authMethods={{ emailPassword: true, google: true, github: true }}
57
56
  onProviderLogin={startOAuth}
58
57
  onSubmit={signInWithPassword}
59
58
  />;
59
+
60
+ // Your own page shell
61
+ <section className="my-auth-page">
62
+ <AuthForm
63
+ mode="login"
64
+ authMethods={{ google: true, github: true }}
65
+ onProviderLogin={startOAuth}
66
+ />
67
+ </section>;
68
+ ```
69
+
70
+ ## Page sections
71
+
72
+ Composite pages expose their smaller building blocks and let you hide sections
73
+ you do not need:
74
+
75
+ ```tsx
76
+ <SecurityPage sections={{ password: false, twoFactor: false }} />
77
+ <BillingPage sections={{ paymentMethod: false, invoices: false }} />
78
+ <LandingPage sections={{ header: false, footer: false }} />
79
+ <ProfilePage fields={{ avatar: false, email: false }} />
80
+ <ApiKeyManager actions={{ create: false, revoke: false }} />
81
+ ```
82
+
83
+ Use exported components such as `SessionManager`, `SubscriptionCard`,
84
+ `PaymentMethodCard`, `InvoiceTable`, `Hero`, `FeatureGrid`, `FAQ`, `CTA`, and
85
+ `Footer` directly when you need a completely custom page layout.
86
+
87
+ Every composite page also accepts `children` as an extension slot for future
88
+ application-specific content:
89
+
90
+ ```tsx
91
+ <BillingPage sections={{ paymentMethod: false }} invoices={invoices}>
92
+ <UsageChart />
93
+ </BillingPage>
60
94
  ```
package/dist/index.d.ts CHANGED
@@ -2,12 +2,22 @@ import * as react from 'react';
2
2
  import { ReactNode } from 'react';
3
3
 
4
4
  type AuthProvider = 'google' | 'github' | string;
5
+ type LoginOption = 'email-password' | AuthProvider;
5
6
  type AuthValues = {
6
7
  email: string;
7
8
  password: string;
8
9
  name?: string;
9
10
  };
11
+ type AuthMethods = {
12
+ emailPassword?: boolean;
13
+ google?: boolean;
14
+ github?: boolean;
15
+ };
10
16
  type AuthCallbacks = {
17
+ /** The enabled built-in authentication methods. */
18
+ authMethods?: AuthMethods;
19
+ /** The sign-in methods to render, such as ['google', 'github']. */
20
+ loginOptions?: LoginOption[];
11
21
  providers?: AuthProvider[];
12
22
  loading?: boolean;
13
23
  error?: ReactNode;
@@ -15,17 +25,15 @@ type AuthCallbacks = {
15
25
  onForgotPassword?: () => void;
16
26
  onSignup?: () => void;
17
27
  onLogin?: () => void;
28
+ children?: ReactNode;
18
29
  };
19
- type AuthMethods = {
20
- /** Render the email/password form. Disable for provider-only sign-in. */
21
- emailPassword?: true;
22
- onSubmit: (values: AuthValues) => void | Promise<void>;
23
- } | {
24
- emailPassword: false;
30
+ type AuthBehavior = {
31
+ /** Legacy alternative to omitting 'email-password' from loginOptions. */
32
+ emailPassword?: boolean;
25
33
  onSubmit?: (values: AuthValues) => void | Promise<void>;
26
34
  };
27
- type AuthProps = AuthCallbacks & AuthMethods;
28
- declare function AuthForm({ mode, onSubmit, emailPassword, providers, loading, error, onProviderLogin, onForgotPassword, onSignup, onLogin, }: AuthProps & {
35
+ type AuthProps = AuthCallbacks & AuthBehavior;
36
+ declare function AuthForm({ mode, onSubmit, authMethods, loginOptions, emailPassword, providers, loading, error, onProviderLogin, onForgotPassword, onSignup, onLogin, children, }: AuthProps & {
29
37
  mode: 'login' | 'signup' | 'forgot';
30
38
  }): react.JSX.Element;
31
39
  declare function LoginPage({ title, description, as, ...props }: AuthProps & {
@@ -54,10 +62,16 @@ type Profile = {
54
62
  email: string;
55
63
  avatar?: string;
56
64
  };
57
- declare function ProfilePage({ profile, loading, onSave, }: {
65
+ declare function ProfilePage({ profile, loading, onSave, fields, children, }: {
58
66
  profile: Profile;
59
67
  loading?: boolean;
60
68
  onSave: (profile: Profile) => void | Promise<void>;
69
+ fields?: {
70
+ avatar?: boolean;
71
+ name?: boolean;
72
+ email?: boolean;
73
+ };
74
+ children?: ReactNode;
61
75
  }): react.JSX.Element;
62
76
  type Session = {
63
77
  id: string;
@@ -72,15 +86,21 @@ declare function SessionManager({ sessions, currentSessionId, loading, onRevoke,
72
86
  onRevoke: (id: string) => void | Promise<void>;
73
87
  onRevokeAll: () => void | Promise<void>;
74
88
  }): react.JSX.Element;
75
- declare function SecurityPage({ sessions, currentSessionId, onRevoke, onRevokeAll, passwordEnabled, twoFactorEnabled, onChangePassword, onToggleTwoFactor, }: {
76
- sessions: Session[];
89
+ declare function SecurityPage({ sessions, currentSessionId, onRevoke, onRevokeAll, passwordEnabled, twoFactorEnabled, onChangePassword, onToggleTwoFactor, sections, children, }: {
90
+ sessions?: Session[];
77
91
  currentSessionId?: string;
78
- onRevoke: (id: string) => void | Promise<void>;
79
- onRevokeAll: () => void | Promise<void>;
92
+ onRevoke?: (id: string) => void | Promise<void>;
93
+ onRevokeAll?: () => void | Promise<void>;
80
94
  passwordEnabled?: boolean;
81
95
  twoFactorEnabled?: boolean;
82
96
  onChangePassword?: () => void;
83
97
  onToggleTwoFactor?: (enabled: boolean) => void;
98
+ sections?: {
99
+ password?: boolean;
100
+ twoFactor?: boolean;
101
+ sessions?: boolean;
102
+ };
103
+ children?: ReactNode;
84
104
  }): react.JSX.Element;
85
105
  type ApiKey = {
86
106
  id: string;
@@ -98,14 +118,19 @@ declare function CreateApiKeyDialog({ open, onOpenChange, onCreate, }: {
98
118
  permissions: string[];
99
119
  }) => void | Promise<void>;
100
120
  }): react.JSX.Element;
101
- declare function ApiKeyManager({ keys, loading, onCreate, onRevoke, }: {
121
+ declare function ApiKeyManager({ keys, loading, onCreate, onRevoke, actions, children, }: {
102
122
  keys: ApiKey[];
103
123
  loading?: boolean;
104
- onCreate: (values: {
124
+ onCreate?: (values: {
105
125
  name: string;
106
126
  permissions: string[];
107
127
  }) => void | Promise<void>;
108
- onRevoke: (id: string) => void | Promise<void>;
128
+ onRevoke?: (id: string) => void | Promise<void>;
129
+ actions?: {
130
+ create?: boolean;
131
+ revoke?: boolean;
132
+ };
133
+ children?: ReactNode;
109
134
  }): react.JSX.Element;
110
135
  declare function ApiKeyPage(props: ComponentProps<typeof ApiKeyManager>): react.JSX.Element;
111
136
  type ComponentProps<T> = T extends (props: infer Props) => unknown ? Props : never;
@@ -160,14 +185,20 @@ declare function PricingTable({ plans, onSelect, }: {
160
185
  }>;
161
186
  onSelect: (plan: string) => void;
162
187
  }): react.JSX.Element;
163
- declare function BillingPage({ subscription, paymentMethod, invoices, onChangePlan, onUpdatePaymentMethod, onCancel, onViewInvoice, }: {
188
+ declare function BillingPage({ subscription, paymentMethod, invoices, onChangePlan, onUpdatePaymentMethod, onCancel, onViewInvoice, sections, children, }: {
164
189
  subscription?: Subscription;
165
190
  paymentMethod?: PaymentMethod;
166
- invoices: Invoice[];
191
+ invoices?: Invoice[];
167
192
  onChangePlan?: () => void;
168
193
  onUpdatePaymentMethod?: () => void;
169
194
  onCancel?: () => void;
170
195
  onViewInvoice?: (invoice: Invoice) => void;
196
+ sections?: {
197
+ subscription?: boolean;
198
+ paymentMethod?: boolean;
199
+ invoices?: boolean;
200
+ };
201
+ children?: ReactNode;
171
202
  }): react.JSX.Element;
172
203
 
173
204
  declare function Hero({ eyebrow, title, description, primaryAction, secondaryAction, }: {
@@ -202,9 +233,9 @@ declare function Footer({ brand, links, }: {
202
233
  href: string;
203
234
  }>;
204
235
  }): react.JSX.Element;
205
- declare function LandingPage({ brand, hero, features, children, as, }: {
236
+ declare function LandingPage({ brand, hero, features, children, as, sections, }: {
206
237
  brand: ReactNode;
207
- hero: {
238
+ hero?: {
208
239
  title: ReactNode;
209
240
  description: ReactNode;
210
241
  primaryAction?: ReactNode;
@@ -217,9 +248,15 @@ declare function LandingPage({ brand, hero, features, children, as, }: {
217
248
  }>;
218
249
  children?: ReactNode;
219
250
  as?: 'main' | 'div';
251
+ sections?: {
252
+ header?: boolean;
253
+ hero?: boolean;
254
+ features?: boolean;
255
+ footer?: boolean;
256
+ };
220
257
  }): react.JSX.Element;
221
258
  declare function SettingsPageDemo({ children }: {
222
259
  children: ReactNode;
223
260
  }): react.JSX.Element;
224
261
 
225
- export { type ApiKey, ApiKeyManager, ApiKeyPage, AuthForm, AuthModal, type AuthProvider, type AuthValues, BillingPage, CTA, CreateApiKeyDialog, DangerZone, FAQ, FeatureGrid, Footer, ForgotPasswordPage, Hero, type Invoice, InvoiceTable, LandingPage, LoginPage, type PaymentMethod, PaymentMethodCard, PricingTable, type Profile, ProfilePage, SecurityPage, type Session, SessionManager, SettingsLayout, SettingsPageDemo, SignupPage, type Subscription, SubscriptionCard };
262
+ export { type ApiKey, ApiKeyManager, ApiKeyPage, AuthForm, type AuthMethods, AuthModal, type AuthProvider, type AuthValues, BillingPage, CTA, CreateApiKeyDialog, DangerZone, FAQ, FeatureGrid, Footer, ForgotPasswordPage, Hero, type Invoice, InvoiceTable, LandingPage, type LoginOption, LoginPage, type PaymentMethod, PaymentMethodCard, PricingTable, type Profile, ProfilePage, SecurityPage, type Session, SessionManager, SettingsLayout, SettingsPageDemo, SignupPage, type Subscription, SubscriptionCard };
package/dist/index.js CHANGED
@@ -22,6 +22,8 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
22
22
  function AuthForm({
23
23
  mode,
24
24
  onSubmit,
25
+ authMethods,
26
+ loginOptions,
25
27
  emailPassword = true,
26
28
  providers = [],
27
29
  loading,
@@ -29,7 +31,8 @@ function AuthForm({
29
31
  onProviderLogin,
30
32
  onForgotPassword,
31
33
  onSignup,
32
- onLogin
34
+ onLogin,
35
+ children
33
36
  }) {
34
37
  const [values, setValues] = useState({
35
38
  email: "",
@@ -41,9 +44,21 @@ function AuthForm({
41
44
  void onSubmit?.(values);
42
45
  };
43
46
  const isForgot = mode === "forgot";
47
+ const options = authMethods ? [
48
+ ...authMethods.emailPassword ? ["email-password"] : [],
49
+ ...authMethods.google ? ["google"] : [],
50
+ ...authMethods.github ? ["github"] : []
51
+ ] : loginOptions ?? [
52
+ ...emailPassword ? ["email-password"] : [],
53
+ ...providers
54
+ ];
55
+ const usesEmailPassword = options.includes("email-password");
56
+ const selectedProviders = options.filter(
57
+ (option) => option !== "email-password"
58
+ );
44
59
  return /* @__PURE__ */ jsxs("form", { className: "space-y-4", onSubmit: submit, children: [
45
60
  error && /* @__PURE__ */ jsx(Alert, { variant: "destructive", title: "Could not continue", children: error }),
46
- emailPassword && /* @__PURE__ */ jsxs(Fragment, { children: [
61
+ usesEmailPassword && /* @__PURE__ */ jsxs(Fragment, { children: [
47
62
  mode === "signup" && /* @__PURE__ */ jsxs("div", { children: [
48
63
  /* @__PURE__ */ jsx(Label, { htmlFor: "name", children: "Name" }),
49
64
  /* @__PURE__ */ jsx(
@@ -97,13 +112,13 @@ function AuthForm({
97
112
  ] }),
98
113
  /* @__PURE__ */ jsx(Button, { className: "w-full", type: "submit", loading, children: isForgot ? "Send reset link" : mode === "signup" ? "Create account" : "Continue" })
99
114
  ] }),
100
- providers.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
101
- emailPassword && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 text-xs text-[hsl(var(--rui-muted-foreground))]", children: [
115
+ selectedProviders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
116
+ usesEmailPassword && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 text-xs text-[hsl(var(--rui-muted-foreground))]", children: [
102
117
  /* @__PURE__ */ jsx(Separator, {}),
103
118
  /* @__PURE__ */ jsx("span", { children: "OR" }),
104
119
  /* @__PURE__ */ jsx(Separator, {})
105
120
  ] }),
106
- /* @__PURE__ */ jsx("div", { className: "grid gap-2", children: providers.map((provider) => /* @__PURE__ */ jsxs(
121
+ /* @__PURE__ */ jsx("div", { className: "grid gap-2", children: selectedProviders.map((provider) => /* @__PURE__ */ jsxs(
107
122
  Button,
108
123
  {
109
124
  type: "button",
@@ -118,7 +133,7 @@ function AuthForm({
118
133
  provider
119
134
  )) })
120
135
  ] }),
121
- emailPassword && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-[hsl(var(--rui-muted-foreground))]", children: mode === "login" ? /* @__PURE__ */ jsxs(Fragment, { children: [
136
+ usesEmailPassword && /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-[hsl(var(--rui-muted-foreground))]", children: mode === "login" ? /* @__PURE__ */ jsxs(Fragment, { children: [
122
137
  "No account?",
123
138
  " ",
124
139
  /* @__PURE__ */ jsx(
@@ -150,7 +165,8 @@ function AuthForm({
150
165
  onClick: onLogin,
151
166
  children: "Back to login"
152
167
  }
153
- ) })
168
+ ) }),
169
+ children
154
170
  ] });
155
171
  }
156
172
  function LoginPage({
@@ -244,12 +260,15 @@ function SettingsLayout({ children }) {
244
260
  function ProfilePage({
245
261
  profile,
246
262
  loading,
247
- onSave
263
+ onSave,
264
+ fields,
265
+ children
248
266
  }) {
249
267
  const [next, setNext] = useState2(profile);
268
+ const visibleFields = { avatar: true, name: true, email: true, ...fields };
250
269
  return /* @__PURE__ */ jsx2(Section, { title: "Profile", description: "Update the details people see.", children: /* @__PURE__ */ jsxs2(Card2, { children: [
251
270
  /* @__PURE__ */ jsxs2("div", { className: "mb-5 flex items-center gap-3", children: [
252
- /* @__PURE__ */ jsx2(Avatar, { src: next.avatar, alt: next.name }),
271
+ visibleFields.avatar && /* @__PURE__ */ jsx2(Avatar, { src: next.avatar, alt: next.name }),
253
272
  /* @__PURE__ */ jsxs2("div", { children: [
254
273
  /* @__PURE__ */ jsx2(CardTitle2, { children: next.name || "Your profile" }),
255
274
  /* @__PURE__ */ jsx2(CardDescription2, { children: next.email })
@@ -264,7 +283,7 @@ function ProfilePage({
264
283
  void onSave(next);
265
284
  },
266
285
  children: [
267
- /* @__PURE__ */ jsxs2("div", { children: [
286
+ visibleFields.name && /* @__PURE__ */ jsxs2("div", { children: [
268
287
  /* @__PURE__ */ jsx2(Label2, { htmlFor: "profile-name", children: "Name" }),
269
288
  /* @__PURE__ */ jsx2(
270
289
  Input2,
@@ -276,7 +295,7 @@ function ProfilePage({
276
295
  }
277
296
  )
278
297
  ] }),
279
- /* @__PURE__ */ jsxs2("div", { children: [
298
+ visibleFields.email && /* @__PURE__ */ jsxs2("div", { children: [
280
299
  /* @__PURE__ */ jsx2(Label2, { htmlFor: "profile-email", children: "Email" }),
281
300
  /* @__PURE__ */ jsx2(
282
301
  Input2,
@@ -289,10 +308,11 @@ function ProfilePage({
289
308
  }
290
309
  )
291
310
  ] }),
292
- /* @__PURE__ */ jsx2(Button2, { type: "submit", loading, children: "Save changes" })
311
+ (visibleFields.name || visibleFields.email) && /* @__PURE__ */ jsx2(Button2, { type: "submit", loading, children: "Save changes" })
293
312
  ]
294
313
  }
295
- )
314
+ ),
315
+ children
296
316
  ] }) });
297
317
  }
298
318
  function SessionManager({
@@ -356,19 +376,27 @@ function SecurityPage({
356
376
  passwordEnabled = true,
357
377
  twoFactorEnabled,
358
378
  onChangePassword,
359
- onToggleTwoFactor
379
+ onToggleTwoFactor,
380
+ sections,
381
+ children
360
382
  }) {
383
+ const visibleSections = {
384
+ password: true,
385
+ twoFactor: true,
386
+ sessions: true,
387
+ ...sections
388
+ };
361
389
  return /* @__PURE__ */ jsxs2(Stack, { gap: 8, children: [
362
- /* @__PURE__ */ jsx2(Section, { title: "Security", description: "Keep your account secure.", children: /* @__PURE__ */ jsxs2(Card2, { className: "space-y-4", children: [
363
- /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between gap-3", children: [
390
+ (visibleSections.password || visibleSections.twoFactor) && /* @__PURE__ */ jsx2(Section, { title: "Security", description: "Keep your account secure.", children: /* @__PURE__ */ jsxs2(Card2, { className: "space-y-4", children: [
391
+ visibleSections.password && /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between gap-3", children: [
364
392
  /* @__PURE__ */ jsxs2("div", { children: [
365
393
  /* @__PURE__ */ jsx2(CardTitle2, { children: "Password" }),
366
394
  /* @__PURE__ */ jsx2(CardDescription2, { children: passwordEnabled ? "Password is enabled." : "Passwordless sign-in." })
367
395
  ] }),
368
396
  onChangePassword && /* @__PURE__ */ jsx2(Button2, { variant: "outline", onClick: onChangePassword, children: "Change password" })
369
397
  ] }),
370
- /* @__PURE__ */ jsx2(Separator2, {}),
371
- /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between gap-3", children: [
398
+ visibleSections.password && visibleSections.twoFactor && /* @__PURE__ */ jsx2(Separator2, {}),
399
+ visibleSections.twoFactor && /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between gap-3", children: [
372
400
  /* @__PURE__ */ jsxs2("div", { children: [
373
401
  /* @__PURE__ */ jsx2(CardTitle2, { children: "Two-factor authentication" }),
374
402
  /* @__PURE__ */ jsx2(CardDescription2, { children: twoFactorEnabled ? "Enabled" : "Not enabled" })
@@ -382,7 +410,7 @@ function SecurityPage({
382
410
  )
383
411
  ] })
384
412
  ] }) }),
385
- /* @__PURE__ */ jsx2(
413
+ visibleSections.sessions && sessions && onRevoke && onRevokeAll && /* @__PURE__ */ jsx2(
386
414
  SessionManager,
387
415
  {
388
416
  sessions,
@@ -390,7 +418,8 @@ function SecurityPage({
390
418
  onRevoke,
391
419
  onRevokeAll
392
420
  }
393
- )
421
+ ),
422
+ children
394
423
  ] });
395
424
  }
396
425
  function CreateApiKeyDialog({
@@ -453,16 +482,19 @@ function ApiKeyManager({
453
482
  keys,
454
483
  loading,
455
484
  onCreate,
456
- onRevoke
485
+ onRevoke,
486
+ actions,
487
+ children
457
488
  }) {
458
489
  const [createOpen, setCreateOpen] = useState2(false);
490
+ const visibleActions = { create: true, revoke: true, ...actions };
459
491
  return /* @__PURE__ */ jsxs2(
460
492
  Section,
461
493
  {
462
494
  title: "API keys",
463
495
  description: "Create keys for programmatic access.",
464
496
  children: [
465
- /* @__PURE__ */ jsx2("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx2(Button2, { onClick: () => setCreateOpen(true), children: "Create API key" }) }),
497
+ visibleActions.create && onCreate && /* @__PURE__ */ jsx2("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx2(Button2, { onClick: () => setCreateOpen(true), children: "Create API key" }) }),
466
498
  /* @__PURE__ */ jsx2(Stack, { children: keys.length ? keys.map((key) => /* @__PURE__ */ jsxs2(
467
499
  Card2,
468
500
  {
@@ -480,7 +512,7 @@ function ApiKeyManager({
480
512
  key.lastUsedAt ? ` \xB7 Last used ${key.lastUsedAt}` : " \xB7 Never used"
481
513
  ] })
482
514
  ] }),
483
- /* @__PURE__ */ jsx2(
515
+ visibleActions.revoke && onRevoke && /* @__PURE__ */ jsx2(
484
516
  Button2,
485
517
  {
486
518
  variant: "outline",
@@ -500,7 +532,8 @@ function ApiKeyManager({
500
532
  description: "Create one when you need programmatic access."
501
533
  }
502
534
  ) }),
503
- /* @__PURE__ */ jsx2(
535
+ children,
536
+ visibleActions.create && onCreate && /* @__PURE__ */ jsx2(
504
537
  CreateApiKeyDialog,
505
538
  {
506
539
  open: createOpen,
@@ -695,10 +728,18 @@ function BillingPage({
695
728
  onChangePlan,
696
729
  onUpdatePaymentMethod,
697
730
  onCancel,
698
- onViewInvoice
731
+ onViewInvoice,
732
+ sections,
733
+ children
699
734
  }) {
735
+ const visibleSections = {
736
+ subscription: true,
737
+ paymentMethod: true,
738
+ invoices: true,
739
+ ...sections
740
+ };
700
741
  return /* @__PURE__ */ jsxs3(Stack2, { gap: 8, children: [
701
- /* @__PURE__ */ jsx3(
742
+ visibleSections.subscription && /* @__PURE__ */ jsx3(
702
743
  Section2,
703
744
  {
704
745
  title: "Billing",
@@ -713,14 +754,15 @@ function BillingPage({
713
754
  )
714
755
  }
715
756
  ),
716
- /* @__PURE__ */ jsx3(
757
+ visibleSections.paymentMethod && /* @__PURE__ */ jsx3(
717
758
  PaymentMethodCard,
718
759
  {
719
760
  paymentMethod,
720
761
  onUpdate: onUpdatePaymentMethod
721
762
  }
722
763
  ),
723
- /* @__PURE__ */ jsx3(Section2, { title: "Invoices", children: /* @__PURE__ */ jsx3(InvoiceTable, { invoices, onView: onViewInvoice }) })
764
+ visibleSections.invoices && /* @__PURE__ */ jsx3(Section2, { title: "Invoices", children: /* @__PURE__ */ jsx3(InvoiceTable, { invoices: invoices ?? [], onView: onViewInvoice }) }),
765
+ children
724
766
  ] });
725
767
  }
726
768
 
@@ -803,14 +845,22 @@ function LandingPage({
803
845
  hero,
804
846
  features,
805
847
  children,
806
- as
848
+ as,
849
+ sections
807
850
  }) {
851
+ const visibleSections = {
852
+ header: true,
853
+ hero: true,
854
+ features: true,
855
+ footer: true,
856
+ ...sections
857
+ };
808
858
  return /* @__PURE__ */ jsx4(PageShell2, { as, children: /* @__PURE__ */ jsxs4(Container, { children: [
809
- /* @__PURE__ */ jsx4("header", { className: "flex h-16 items-center justify-between", children: /* @__PURE__ */ jsx4("strong", { children: brand }) }),
810
- /* @__PURE__ */ jsx4(Hero, { ...hero }),
811
- features && /* @__PURE__ */ jsx4(FeatureGrid, { features }),
859
+ visibleSections.header && /* @__PURE__ */ jsx4("header", { className: "flex h-16 items-center justify-between", children: /* @__PURE__ */ jsx4("strong", { children: brand }) }),
860
+ visibleSections.hero && hero && /* @__PURE__ */ jsx4(Hero, { ...hero }),
861
+ visibleSections.features && features && /* @__PURE__ */ jsx4(FeatureGrid, { features }),
812
862
  children,
813
- /* @__PURE__ */ jsx4(Footer, { brand })
863
+ visibleSections.footer && /* @__PURE__ */ jsx4(Footer, { brand })
814
864
  ] }) });
815
865
  }
816
866
  function SettingsPageDemo({ children }) {
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/pages/auth.tsx","../src/pages/settings.tsx","../src/pages/billing.tsx","../src/pages/marketing.tsx"],"sourcesContent":["'use client';\n\nimport { useState, type FormEvent, type ReactNode } from 'react';\nimport {\n Alert,\n Button,\n Card,\n CardDescription,\n CardHeader,\n CardTitle,\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n Input,\n Label,\n PageShell,\n PasswordInput,\n Separator,\n} from '@sypra-ui/ui';\n\nexport type AuthProvider = 'google' | 'github' | string;\nexport type AuthValues = { email: string; password: string; name?: string };\ntype AuthCallbacks = {\n providers?: AuthProvider[];\n loading?: boolean;\n error?: ReactNode;\n onProviderLogin?: (provider: AuthProvider) => void;\n onForgotPassword?: () => void;\n onSignup?: () => void;\n onLogin?: () => void;\n};\ntype AuthMethods =\n | {\n /** Render the email/password form. Disable for provider-only sign-in. */\n emailPassword?: true;\n onSubmit: (values: AuthValues) => void | Promise<void>;\n }\n | {\n emailPassword: false;\n onSubmit?: (values: AuthValues) => void | Promise<void>;\n };\ntype AuthProps = AuthCallbacks & AuthMethods;\nexport function AuthForm({\n mode,\n onSubmit,\n emailPassword = true,\n providers = [],\n loading,\n error,\n onProviderLogin,\n onForgotPassword,\n onSignup,\n onLogin,\n}: AuthProps & {\n mode: 'login' | 'signup' | 'forgot';\n}) {\n const [values, setValues] = useState<AuthValues>({\n email: '',\n password: '',\n name: '',\n });\n const submit = (event: FormEvent) => {\n event.preventDefault();\n void onSubmit?.(values);\n };\n const isForgot = mode === 'forgot';\n return (\n <form className=\"space-y-4\" onSubmit={submit}>\n {error && (\n <Alert variant=\"destructive\" title=\"Could not continue\">\n {error}\n </Alert>\n )}\n {emailPassword && (\n <>\n {mode === 'signup' && (\n <div>\n <Label htmlFor=\"name\">Name</Label>\n <Input\n id=\"name\"\n value={values.name}\n onChange={(event) =>\n setValues({ ...values, name: event.target.value })\n }\n autoComplete=\"name\"\n required\n />\n </div>\n )}\n <div>\n <Label htmlFor=\"email\">Email</Label>\n <Input\n id=\"email\"\n type=\"email\"\n value={values.email}\n onChange={(event) =>\n setValues({ ...values, email: event.target.value })\n }\n autoComplete=\"email\"\n required\n />\n </div>\n {!isForgot && (\n <div>\n <div className=\"flex justify-between\">\n <Label htmlFor=\"password\">Password</Label>\n {mode === 'login' && (\n <button\n type=\"button\"\n className=\"rui-focus text-xs text-[hsl(var(--rui-primary))]\"\n onClick={onForgotPassword}\n >\n Forgot password?\n </button>\n )}\n </div>\n <PasswordInput\n id=\"password\"\n value={values.password}\n onChange={(event) =>\n setValues({ ...values, password: event.target.value })\n }\n autoComplete={\n mode === 'signup' ? 'new-password' : 'current-password'\n }\n required\n />\n </div>\n )}\n <Button className=\"w-full\" type=\"submit\" loading={loading}>\n {isForgot\n ? 'Send reset link'\n : mode === 'signup'\n ? 'Create account'\n : 'Continue'}\n </Button>\n </>\n )}\n {providers.length > 0 && (\n <>\n {emailPassword && (\n <div className=\"flex items-center gap-3 text-xs text-[hsl(var(--rui-muted-foreground))]\">\n <Separator />\n <span>OR</span>\n <Separator />\n </div>\n )}\n <div className=\"grid gap-2\">\n {providers.map((provider) => (\n <Button\n key={provider}\n type=\"button\"\n variant=\"outline\"\n onClick={() => onProviderLogin?.(provider)}\n >\n Continue with{' '}\n {provider === 'github'\n ? 'GitHub'\n : provider.slice(0, 1).toUpperCase() + provider.slice(1)}\n </Button>\n ))}\n </div>\n </>\n )}\n {emailPassword && (\n <p className=\"text-center text-sm text-[hsl(var(--rui-muted-foreground))]\">\n {mode === 'login' ? (\n <>\n No account?{' '}\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onSignup}\n >\n Sign up\n </button>\n </>\n ) : mode === 'signup' ? (\n <>\n Already have an account?{' '}\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onLogin}\n >\n Log in\n </button>\n </>\n ) : (\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onLogin}\n >\n Back to login\n </button>\n )}\n </p>\n )}\n </form>\n );\n}\nexport function LoginPage({\n title = 'Welcome back',\n description = 'Sign in to continue.',\n as,\n ...props\n}: AuthProps & {\n title?: string;\n description?: string;\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage title={title} description={description} as={as}>\n <AuthForm mode=\"login\" {...props} />\n </AuthPage>\n );\n}\nexport function SignupPage({\n title = 'Create your account',\n description = 'Start with a free account.',\n as,\n ...props\n}: AuthProps & {\n title?: string;\n description?: string;\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage title={title} description={description} as={as}>\n <AuthForm mode=\"signup\" {...props} />\n </AuthPage>\n );\n}\nexport function ForgotPasswordPage({\n as,\n ...props\n}: AuthProps & {\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage\n title=\"Reset your password\"\n description=\"We’ll email a reset link.\"\n as={as}\n >\n <AuthForm mode=\"forgot\" {...props} />\n </AuthPage>\n );\n}\nfunction AuthPage({\n title,\n description,\n children,\n as,\n}: {\n title: string;\n description: string;\n children: ReactNode;\n as?: 'main' | 'div';\n}) {\n return (\n <PageShell as={as} className=\"grid place-items-center p-4\">\n <Card className=\"w-full max-w-md\">\n <CardHeader>\n <div>\n <CardTitle>{title}</CardTitle>\n <CardDescription>{description}</CardDescription>\n </div>\n </CardHeader>\n {children}\n </Card>\n </PageShell>\n );\n}\nexport function AuthModal({\n open,\n onOpenChange,\n ...props\n}: AuthProps & {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n}) {\n return (\n <Dialog open={open} onOpenChange={onOpenChange}>\n <DialogContent>\n <DialogHeader>\n <DialogTitle>Welcome back</DialogTitle>\n <DialogDescription>Sign in to your account.</DialogDescription>\n </DialogHeader>\n <AuthForm mode=\"login\" {...props} />\n </DialogContent>\n </Dialog>\n );\n}\n","'use client';\n\nimport { useState, type ReactNode } from 'react';\nimport {\n Avatar,\n Badge,\n Button,\n Card,\n CardDescription,\n CardTitle,\n Checkbox,\n Dialog,\n DialogBody,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n EmptyState,\n Input,\n Label,\n Section,\n Separator,\n Stack,\n Switch,\n} from '@sypra-ui/ui';\n\nexport function SettingsLayout({ children }: { children: ReactNode }) {\n return <div className=\"min-w-0 space-y-8\">{children}</div>;\n}\nexport type Profile = { name: string; email: string; avatar?: string };\nexport function ProfilePage({\n profile,\n loading,\n onSave,\n}: {\n profile: Profile;\n loading?: boolean;\n onSave: (profile: Profile) => void | Promise<void>;\n}) {\n const [next, setNext] = useState(profile);\n return (\n <Section title=\"Profile\" description=\"Update the details people see.\">\n <Card>\n <div className=\"mb-5 flex items-center gap-3\">\n <Avatar src={next.avatar} alt={next.name} />\n <div>\n <CardTitle>{next.name || 'Your profile'}</CardTitle>\n <CardDescription>{next.email}</CardDescription>\n </div>\n </div>\n <form\n className=\"max-w-lg space-y-4\"\n onSubmit={(event) => {\n event.preventDefault();\n void onSave(next);\n }}\n >\n <div>\n <Label htmlFor=\"profile-name\">Name</Label>\n <Input\n id=\"profile-name\"\n value={next.name}\n onChange={(event) =>\n setNext({ ...next, name: event.target.value })\n }\n required\n />\n </div>\n <div>\n <Label htmlFor=\"profile-email\">Email</Label>\n <Input\n id=\"profile-email\"\n type=\"email\"\n value={next.email}\n onChange={(event) =>\n setNext({ ...next, email: event.target.value })\n }\n required\n />\n </div>\n <Button type=\"submit\" loading={loading}>\n Save changes\n </Button>\n </form>\n </Card>\n </Section>\n );\n}\nexport type Session = {\n id: string;\n device: string;\n location?: string;\n lastActive: string;\n};\nexport function SessionManager({\n sessions,\n currentSessionId,\n loading,\n onRevoke,\n onRevokeAll,\n}: {\n sessions: Session[];\n currentSessionId?: string;\n loading?: boolean;\n onRevoke: (id: string) => void | Promise<void>;\n onRevokeAll: () => void | Promise<void>;\n}) {\n return (\n <Section\n title=\"Active sessions\"\n description=\"Review where your account is signed in.\"\n >\n <Stack>\n {sessions.length ? (\n sessions.map((session) => (\n <Card\n key={session.id}\n className=\"flex flex-wrap items-center justify-between gap-3\"\n >\n <div>\n <CardTitle>\n {session.device}{' '}\n {session.id === currentSessionId && <Badge>Current</Badge>}\n </CardTitle>\n <CardDescription>\n {[session.location, session.lastActive]\n .filter(Boolean)\n .join(' · ')}\n </CardDescription>\n </div>\n {session.id !== currentSessionId && (\n <Button\n variant=\"outline\"\n size=\"sm\"\n loading={loading}\n onClick={() => void onRevoke(session.id)}\n >\n Revoke\n </Button>\n )}\n </Card>\n ))\n ) : (\n <EmptyState title=\"No sessions\" />\n )}\n </Stack>\n {sessions.length > 1 && (\n <Button\n variant=\"destructive\"\n loading={loading}\n onClick={() => void onRevokeAll()}\n >\n Sign out of other sessions\n </Button>\n )}\n </Section>\n );\n}\nexport function SecurityPage({\n sessions,\n currentSessionId,\n onRevoke,\n onRevokeAll,\n passwordEnabled = true,\n twoFactorEnabled,\n onChangePassword,\n onToggleTwoFactor,\n}: {\n sessions: Session[];\n currentSessionId?: string;\n onRevoke: (id: string) => void | Promise<void>;\n onRevokeAll: () => void | Promise<void>;\n passwordEnabled?: boolean;\n twoFactorEnabled?: boolean;\n onChangePassword?: () => void;\n onToggleTwoFactor?: (enabled: boolean) => void;\n}) {\n return (\n <Stack gap={8}>\n <Section title=\"Security\" description=\"Keep your account secure.\">\n <Card className=\"space-y-4\">\n <div className=\"flex items-center justify-between gap-3\">\n <div>\n <CardTitle>Password</CardTitle>\n <CardDescription>\n {passwordEnabled\n ? 'Password is enabled.'\n : 'Passwordless sign-in.'}\n </CardDescription>\n </div>\n {onChangePassword && (\n <Button variant=\"outline\" onClick={onChangePassword}>\n Change password\n </Button>\n )}\n </div>\n <Separator />\n <div className=\"flex items-center justify-between gap-3\">\n <div>\n <CardTitle>Two-factor authentication</CardTitle>\n <CardDescription>\n {twoFactorEnabled ? 'Enabled' : 'Not enabled'}\n </CardDescription>\n </div>\n <Switch\n checked={twoFactorEnabled}\n onChange={(event) => onToggleTwoFactor?.(event.target.checked)}\n />\n </div>\n </Card>\n </Section>\n <SessionManager\n sessions={sessions}\n currentSessionId={currentSessionId}\n onRevoke={onRevoke}\n onRevokeAll={onRevokeAll}\n />\n </Stack>\n );\n}\n\nexport type ApiKey = {\n id: string;\n name: string;\n prefix: string;\n createdAt: string;\n lastUsedAt?: string;\n permissions?: string[];\n};\nexport function CreateApiKeyDialog({\n open,\n onOpenChange,\n onCreate,\n}: {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n onCreate: (values: {\n name: string;\n permissions: string[];\n }) => void | Promise<void>;\n}) {\n const [name, setName] = useState('');\n const [write, setWrite] = useState(false);\n return (\n <Dialog open={open} onOpenChange={onOpenChange}>\n <DialogContent>\n <DialogHeader>\n <DialogTitle>Create API key</DialogTitle>\n <DialogDescription>\n The full key should only be shown once by your application.\n </DialogDescription>\n </DialogHeader>\n <DialogBody>\n <div>\n <Label htmlFor=\"key-name\">Name</Label>\n <Input\n id=\"key-name\"\n value={name}\n onChange={(event) => setName(event.target.value)}\n placeholder=\"Production\"\n />\n </div>\n <label className=\"flex items-center gap-2 text-sm\">\n <Checkbox\n checked={write}\n onChange={(event) => setWrite(event.target.checked)}\n />{' '}\n Allow write access\n </label>\n </DialogBody>\n <DialogFooter>\n <DialogClose asChild>\n <Button variant=\"outline\">Cancel</Button>\n </DialogClose>\n <Button\n onClick={() => {\n void onCreate({\n name,\n permissions: write ? ['read', 'write'] : ['read'],\n });\n onOpenChange(false);\n }}\n disabled={!name.trim()}\n >\n Create key\n </Button>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n );\n}\nexport function ApiKeyManager({\n keys,\n loading,\n onCreate,\n onRevoke,\n}: {\n keys: ApiKey[];\n loading?: boolean;\n onCreate: (values: {\n name: string;\n permissions: string[];\n }) => void | Promise<void>;\n onRevoke: (id: string) => void | Promise<void>;\n}) {\n const [createOpen, setCreateOpen] = useState(false);\n return (\n <Section\n title=\"API keys\"\n description=\"Create keys for programmatic access.\"\n >\n <div className=\"flex justify-end\">\n <Button onClick={() => setCreateOpen(true)}>Create API key</Button>\n </div>\n <Stack>\n {keys.length ? (\n keys.map((key) => (\n <Card\n key={key.id}\n className=\"flex flex-wrap items-center justify-between gap-3\"\n >\n <div>\n <CardTitle>{key.name}</CardTitle>\n <CardDescription>\n <code>{key.prefix}••••••••</code> · Created {key.createdAt}\n {key.lastUsedAt\n ? ` · Last used ${key.lastUsedAt}`\n : ' · Never used'}\n </CardDescription>\n </div>\n <Button\n variant=\"outline\"\n size=\"sm\"\n loading={loading}\n onClick={() => void onRevoke(key.id)}\n >\n Revoke\n </Button>\n </Card>\n ))\n ) : (\n <EmptyState\n title=\"No API keys\"\n description=\"Create one when you need programmatic access.\"\n />\n )}\n </Stack>\n <CreateApiKeyDialog\n open={createOpen}\n onOpenChange={setCreateOpen}\n onCreate={onCreate}\n />\n </Section>\n );\n}\nexport function ApiKeyPage(props: ComponentProps<typeof ApiKeyManager>) {\n return <ApiKeyManager {...props} />;\n}\ntype ComponentProps<T> = T extends (props: infer Props) => unknown\n ? Props\n : never;\nexport function DangerZone({\n onDeleteAccount,\n confirmationText = 'DELETE',\n}: {\n onDeleteAccount: () => void | Promise<void>;\n confirmationText?: string;\n}) {\n const [value, setValue] = useState('');\n return (\n <Section title=\"Danger zone\" description=\"These actions are permanent.\">\n <Card className=\"border-[hsl(var(--rui-destructive))]\">\n <CardTitle>Delete account</CardTitle>\n <CardDescription>\n Delete all account data. This cannot be undone.\n </CardDescription>\n <div className=\"mt-4 max-w-sm\">\n <Label htmlFor=\"delete-confirmation\">\n Type {confirmationText} to confirm\n </Label>\n <Input\n id=\"delete-confirmation\"\n value={value}\n onChange={(event) => setValue(event.target.value)}\n />\n </div>\n <Button\n className=\"mt-4\"\n variant=\"destructive\"\n disabled={value !== confirmationText}\n onClick={() => void onDeleteAccount()}\n >\n Delete account\n </Button>\n </Card>\n </Section>\n );\n}\n","import {\n Badge,\n Button,\n Card,\n CardDescription,\n CardHeader,\n CardTitle,\n DataTable,\n EmptyState,\n Section,\n Stack,\n type DataColumn,\n} from '@sypra-ui/ui';\n\nexport type Subscription = {\n plan: string;\n price: string;\n interval?: string;\n nextBillingDate?: string;\n status?: string;\n usage?: Array<{ label: string; value: string }>;\n};\nexport type PaymentMethod = {\n brand: string;\n last4: string;\n expiresAt?: string;\n};\nexport type Invoice = {\n id: string;\n date: string;\n amount: string;\n status: string;\n href?: string;\n};\nexport function SubscriptionCard({\n subscription,\n onChangePlan,\n onCancel,\n}: {\n subscription?: Subscription;\n onChangePlan?: () => void;\n onCancel?: () => void;\n}) {\n if (!subscription)\n return (\n <EmptyState\n title=\"No active subscription\"\n action={\n onChangePlan && <Button onClick={onChangePlan}>View plans</Button>\n }\n />\n );\n return (\n <Card>\n <CardHeader>\n <div>\n <CardTitle>{subscription.plan}</CardTitle>\n <CardDescription>\n {subscription.price}\n {subscription.interval && ` / ${subscription.interval}`}\n </CardDescription>\n </div>\n {subscription.status && (\n <Badge variant=\"success\">{subscription.status}</Badge>\n )}\n </CardHeader>\n {subscription.nextBillingDate && (\n <p className=\"text-sm text-[hsl(var(--rui-muted-foreground))]\">\n Next billing date: {subscription.nextBillingDate}\n </p>\n )}\n {subscription.usage?.length ? (\n <div className=\"mt-4 grid gap-2 text-sm sm:grid-cols-2\">\n {subscription.usage.map((item) => (\n <div\n key={item.label}\n className=\"rounded bg-[hsl(var(--rui-muted))] p-3\"\n >\n <strong className=\"block\">{item.value}</strong>\n <span className=\"text-[hsl(var(--rui-muted-foreground))]\">\n {item.label}\n </span>\n </div>\n ))}\n </div>\n ) : null}\n <div className=\"mt-5 flex flex-wrap gap-2\">\n {onChangePlan && <Button onClick={onChangePlan}>Change plan</Button>}\n {onCancel && (\n <Button variant=\"outline\" onClick={onCancel}>\n Manage subscription\n </Button>\n )}\n </div>\n </Card>\n );\n}\nexport function PaymentMethodCard({\n paymentMethod,\n onUpdate,\n}: {\n paymentMethod?: PaymentMethod;\n onUpdate?: () => void;\n}) {\n return (\n <Card>\n <CardHeader>\n <div>\n <CardTitle>Payment method</CardTitle>\n <CardDescription>\n {paymentMethod\n ? `${paymentMethod.brand} •••• ${paymentMethod.last4}${paymentMethod.expiresAt ? ` · Expires ${paymentMethod.expiresAt}` : ''}`\n : 'No payment method on file.'}\n </CardDescription>\n </div>\n {onUpdate && (\n <Button variant=\"outline\" size=\"sm\" onClick={onUpdate}>\n {paymentMethod ? 'Update' : 'Add payment method'}\n </Button>\n )}\n </CardHeader>\n </Card>\n );\n}\nexport function InvoiceTable({\n invoices,\n onView,\n}: {\n invoices: Invoice[];\n onView?: (invoice: Invoice) => void;\n}) {\n const columns: DataColumn<Invoice>[] = [\n { key: 'date', header: 'Date', sortable: true },\n { key: 'amount', header: 'Amount' },\n {\n key: 'status',\n header: 'Status',\n cell: (invoice) => (\n <Badge\n variant={\n invoice.status.toLowerCase() === 'paid' ? 'success' : 'warning'\n }\n >\n {invoice.status}\n </Badge>\n ),\n },\n {\n key: 'id',\n header: <span className=\"sr-only\">Actions</span>,\n cell: (invoice) =>\n onView && (\n <Button variant=\"ghost\" size=\"sm\" onClick={() => onView(invoice)}>\n View\n </Button>\n ),\n },\n ];\n return (\n <DataTable\n data={invoices}\n columns={columns}\n emptyMessage=\"No invoices yet.\"\n />\n );\n}\nexport function PricingTable({\n plans,\n onSelect,\n}: {\n plans: Array<{\n name: string;\n price: string;\n description?: string;\n features: string[];\n highlighted?: boolean;\n }>;\n onSelect: (plan: string) => void;\n}) {\n return (\n <div className=\"grid gap-4 md:grid-cols-3\">\n {plans.map((plan) => (\n <Card\n key={plan.name}\n className={\n plan.highlighted ? 'border-[hsl(var(--rui-primary))]' : undefined\n }\n >\n <CardTitle>{plan.name}</CardTitle>\n <p className=\"mt-3 text-2xl font-bold\">{plan.price}</p>\n {plan.description && (\n <CardDescription>{plan.description}</CardDescription>\n )}\n <ul className=\"my-5 space-y-2 text-sm\">\n {plan.features.map((feature) => (\n <li key={feature}>✓ {feature}</li>\n ))}\n </ul>\n <Button\n className=\"w-full\"\n variant={plan.highlighted ? 'primary' : 'outline'}\n onClick={() => onSelect(plan.name)}\n >\n Choose {plan.name}\n </Button>\n </Card>\n ))}\n </div>\n );\n}\nexport function BillingPage({\n subscription,\n paymentMethod,\n invoices,\n onChangePlan,\n onUpdatePaymentMethod,\n onCancel,\n onViewInvoice,\n}: {\n subscription?: Subscription;\n paymentMethod?: PaymentMethod;\n invoices: Invoice[];\n onChangePlan?: () => void;\n onUpdatePaymentMethod?: () => void;\n onCancel?: () => void;\n onViewInvoice?: (invoice: Invoice) => void;\n}) {\n return (\n <Stack gap={8}>\n <Section\n title=\"Billing\"\n description=\"Manage your plan and payment details.\"\n >\n <SubscriptionCard\n subscription={subscription}\n onChangePlan={onChangePlan}\n onCancel={onCancel}\n />\n </Section>\n <PaymentMethodCard\n paymentMethod={paymentMethod}\n onUpdate={onUpdatePaymentMethod}\n />\n <Section title=\"Invoices\">\n <InvoiceTable invoices={invoices} onView={onViewInvoice} />\n </Section>\n </Stack>\n );\n}\n","import { type ReactNode } from 'react';\nimport {\n Badge,\n Card,\n CardDescription,\n CardTitle,\n Container,\n PageContent,\n PageHeader,\n PageShell,\n} from '@sypra-ui/ui';\n\nexport function Hero({\n eyebrow,\n title,\n description,\n primaryAction,\n secondaryAction,\n}: {\n eyebrow?: ReactNode;\n title: ReactNode;\n description: ReactNode;\n primaryAction?: ReactNode;\n secondaryAction?: ReactNode;\n}) {\n return (\n <section className=\"py-20 text-center sm:py-28\">\n {eyebrow && <Badge>{eyebrow}</Badge>}\n <h1 className=\"mx-auto mt-5 max-w-3xl text-4xl font-bold tracking-tight sm:text-6xl\">\n {title}\n </h1>\n <p className=\"mx-auto mt-5 max-w-2xl text-lg text-[hsl(var(--rui-muted-foreground))]\">\n {description}\n </p>\n <div className=\"mt-8 flex flex-wrap justify-center gap-3\">\n {primaryAction}\n {secondaryAction}\n </div>\n </section>\n );\n}\nexport function FeatureGrid({\n features,\n}: {\n features: Array<{ title: string; description: string; icon?: ReactNode }>;\n}) {\n return (\n <section className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n {features.map((feature) => (\n <Card key={feature.title}>\n {feature.icon && (\n <div className=\"mb-3 text-[hsl(var(--rui-primary))]\">\n {feature.icon}\n </div>\n )}\n <CardTitle>{feature.title}</CardTitle>\n <CardDescription>{feature.description}</CardDescription>\n </Card>\n ))}\n </section>\n );\n}\nexport function FAQ({\n items,\n}: {\n items: Array<{ question: string; answer: ReactNode }>;\n}) {\n return (\n <section className=\"mx-auto max-w-3xl space-y-4\">\n {items.map((item) => (\n <Card key={item.question}>\n <CardTitle>{item.question}</CardTitle>\n <CardDescription>{item.answer}</CardDescription>\n </Card>\n ))}\n </section>\n );\n}\nexport function CTA({\n title,\n description,\n action,\n}: {\n title: ReactNode;\n description?: ReactNode;\n action: ReactNode;\n}) {\n return (\n <section className=\"rounded-[calc(var(--rui-radius)+.2rem)] bg-[hsl(var(--rui-primary))] px-6 py-14 text-center text-[hsl(var(--rui-primary-foreground))]\">\n <h2 className=\"text-3xl font-bold\">{title}</h2>\n {description && <p className=\"mt-3 opacity-85\">{description}</p>}\n <div className=\"mt-6\">{action}</div>\n </section>\n );\n}\nexport function Footer({\n brand,\n links,\n}: {\n brand: ReactNode;\n links?: Array<{ label: string; href: string }>;\n}) {\n return (\n <footer className=\"mt-16 border-t border-[hsl(var(--rui-border))] py-8 text-sm text-[hsl(var(--rui-muted-foreground))]\">\n <div className=\"flex flex-wrap items-center justify-between gap-4\">\n <strong className=\"text-[hsl(var(--rui-foreground))]\">{brand}</strong>\n <div className=\"flex gap-4\">\n {links?.map((link) => (\n <a\n key={link.href}\n href={link.href}\n className=\"hover:text-[hsl(var(--rui-foreground))]\"\n >\n {link.label}\n </a>\n ))}\n </div>\n </div>\n </footer>\n );\n}\nexport function LandingPage({\n brand,\n hero,\n features,\n children,\n as,\n}: {\n brand: ReactNode;\n hero: {\n title: ReactNode;\n description: ReactNode;\n primaryAction?: ReactNode;\n secondaryAction?: ReactNode;\n };\n features?: Array<{ title: string; description: string; icon?: ReactNode }>;\n children?: ReactNode;\n as?: 'main' | 'div';\n}) {\n return (\n <PageShell as={as}>\n <Container>\n <header className=\"flex h-16 items-center justify-between\">\n <strong>{brand}</strong>\n </header>\n <Hero {...hero} />\n {features && <FeatureGrid features={features} />}\n {children}\n <Footer brand={brand} />\n </Container>\n </PageShell>\n );\n}\n\nexport function SettingsPageDemo({ children }: { children: ReactNode }) {\n return (\n <PageShell>\n <Container className=\"py-8\">\n <PageHeader title=\"Settings\" description=\"Manage your account.\" />\n <PageContent>{children}</PageContent>\n </Container>\n </PageShell>\n );\n}\n"],"mappings":"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","names":["useState","Button","Card","CardDescription","CardTitle","Dialog","DialogContent","DialogDescription","DialogHeader","DialogTitle","Input","Label","Separator","jsx","jsxs","Badge","Button","Card","CardDescription","CardHeader","CardTitle","EmptyState","Section","Stack","jsx","jsxs","Badge","Card","CardDescription","CardTitle","PageShell","jsx","jsxs"]}
1
+ {"version":3,"sources":["../src/pages/auth.tsx","../src/pages/settings.tsx","../src/pages/billing.tsx","../src/pages/marketing.tsx"],"sourcesContent":["'use client';\n\nimport { useState, type FormEvent, type ReactNode } from 'react';\nimport {\n Alert,\n Button,\n Card,\n CardDescription,\n CardHeader,\n CardTitle,\n Dialog,\n DialogContent,\n DialogDescription,\n DialogHeader,\n DialogTitle,\n Input,\n Label,\n PageShell,\n PasswordInput,\n Separator,\n} from '@sypra-ui/ui';\n\nexport type AuthProvider = 'google' | 'github' | string;\nexport type LoginOption = 'email-password' | AuthProvider;\nexport type AuthValues = { email: string; password: string; name?: string };\nexport type AuthMethods = {\n emailPassword?: boolean;\n google?: boolean;\n github?: boolean;\n};\ntype AuthCallbacks = {\n /** The enabled built-in authentication methods. */\n authMethods?: AuthMethods;\n /** The sign-in methods to render, such as ['google', 'github']. */\n loginOptions?: LoginOption[];\n providers?: AuthProvider[];\n loading?: boolean;\n error?: ReactNode;\n onProviderLogin?: (provider: AuthProvider) => void;\n onForgotPassword?: () => void;\n onSignup?: () => void;\n onLogin?: () => void;\n children?: ReactNode;\n};\ntype AuthBehavior = {\n /** Legacy alternative to omitting 'email-password' from loginOptions. */\n emailPassword?: boolean;\n onSubmit?: (values: AuthValues) => void | Promise<void>;\n};\ntype AuthProps = AuthCallbacks & AuthBehavior;\nexport function AuthForm({\n mode,\n onSubmit,\n authMethods,\n loginOptions,\n emailPassword = true,\n providers = [],\n loading,\n error,\n onProviderLogin,\n onForgotPassword,\n onSignup,\n onLogin,\n children,\n}: AuthProps & {\n mode: 'login' | 'signup' | 'forgot';\n}) {\n const [values, setValues] = useState<AuthValues>({\n email: '',\n password: '',\n name: '',\n });\n const submit = (event: FormEvent) => {\n event.preventDefault();\n void onSubmit?.(values);\n };\n const isForgot = mode === 'forgot';\n const options = authMethods\n ? [\n ...(authMethods.emailPassword ? ['email-password'] : []),\n ...(authMethods.google ? ['google'] : []),\n ...(authMethods.github ? ['github'] : []),\n ]\n : (loginOptions ?? [\n ...(emailPassword ? ['email-password'] : []),\n ...providers,\n ]);\n const usesEmailPassword = options.includes('email-password');\n const selectedProviders = options.filter(\n (option) => option !== 'email-password',\n );\n return (\n <form className=\"space-y-4\" onSubmit={submit}>\n {error && (\n <Alert variant=\"destructive\" title=\"Could not continue\">\n {error}\n </Alert>\n )}\n {usesEmailPassword && (\n <>\n {mode === 'signup' && (\n <div>\n <Label htmlFor=\"name\">Name</Label>\n <Input\n id=\"name\"\n value={values.name}\n onChange={(event) =>\n setValues({ ...values, name: event.target.value })\n }\n autoComplete=\"name\"\n required\n />\n </div>\n )}\n <div>\n <Label htmlFor=\"email\">Email</Label>\n <Input\n id=\"email\"\n type=\"email\"\n value={values.email}\n onChange={(event) =>\n setValues({ ...values, email: event.target.value })\n }\n autoComplete=\"email\"\n required\n />\n </div>\n {!isForgot && (\n <div>\n <div className=\"flex justify-between\">\n <Label htmlFor=\"password\">Password</Label>\n {mode === 'login' && (\n <button\n type=\"button\"\n className=\"rui-focus text-xs text-[hsl(var(--rui-primary))]\"\n onClick={onForgotPassword}\n >\n Forgot password?\n </button>\n )}\n </div>\n <PasswordInput\n id=\"password\"\n value={values.password}\n onChange={(event) =>\n setValues({ ...values, password: event.target.value })\n }\n autoComplete={\n mode === 'signup' ? 'new-password' : 'current-password'\n }\n required\n />\n </div>\n )}\n <Button className=\"w-full\" type=\"submit\" loading={loading}>\n {isForgot\n ? 'Send reset link'\n : mode === 'signup'\n ? 'Create account'\n : 'Continue'}\n </Button>\n </>\n )}\n {selectedProviders.length > 0 && (\n <>\n {usesEmailPassword && (\n <div className=\"flex items-center gap-3 text-xs text-[hsl(var(--rui-muted-foreground))]\">\n <Separator />\n <span>OR</span>\n <Separator />\n </div>\n )}\n <div className=\"grid gap-2\">\n {selectedProviders.map((provider) => (\n <Button\n key={provider}\n type=\"button\"\n variant=\"outline\"\n onClick={() => onProviderLogin?.(provider)}\n >\n Continue with{' '}\n {provider === 'github'\n ? 'GitHub'\n : provider.slice(0, 1).toUpperCase() + provider.slice(1)}\n </Button>\n ))}\n </div>\n </>\n )}\n {usesEmailPassword && (\n <p className=\"text-center text-sm text-[hsl(var(--rui-muted-foreground))]\">\n {mode === 'login' ? (\n <>\n No account?{' '}\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onSignup}\n >\n Sign up\n </button>\n </>\n ) : mode === 'signup' ? (\n <>\n Already have an account?{' '}\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onLogin}\n >\n Log in\n </button>\n </>\n ) : (\n <button\n type=\"button\"\n className=\"rui-focus text-[hsl(var(--rui-primary))]\"\n onClick={onLogin}\n >\n Back to login\n </button>\n )}\n </p>\n )}\n {children}\n </form>\n );\n}\nexport function LoginPage({\n title = 'Welcome back',\n description = 'Sign in to continue.',\n as,\n ...props\n}: AuthProps & {\n title?: string;\n description?: string;\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage title={title} description={description} as={as}>\n <AuthForm mode=\"login\" {...props} />\n </AuthPage>\n );\n}\nexport function SignupPage({\n title = 'Create your account',\n description = 'Start with a free account.',\n as,\n ...props\n}: AuthProps & {\n title?: string;\n description?: string;\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage title={title} description={description} as={as}>\n <AuthForm mode=\"signup\" {...props} />\n </AuthPage>\n );\n}\nexport function ForgotPasswordPage({\n as,\n ...props\n}: AuthProps & {\n as?: 'main' | 'div';\n}) {\n return (\n <AuthPage\n title=\"Reset your password\"\n description=\"We’ll email a reset link.\"\n as={as}\n >\n <AuthForm mode=\"forgot\" {...props} />\n </AuthPage>\n );\n}\nfunction AuthPage({\n title,\n description,\n children,\n as,\n}: {\n title: string;\n description: string;\n children: ReactNode;\n as?: 'main' | 'div';\n}) {\n return (\n <PageShell as={as} className=\"grid place-items-center p-4\">\n <Card className=\"w-full max-w-md\">\n <CardHeader>\n <div>\n <CardTitle>{title}</CardTitle>\n <CardDescription>{description}</CardDescription>\n </div>\n </CardHeader>\n {children}\n </Card>\n </PageShell>\n );\n}\nexport function AuthModal({\n open,\n onOpenChange,\n ...props\n}: AuthProps & {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n}) {\n return (\n <Dialog open={open} onOpenChange={onOpenChange}>\n <DialogContent>\n <DialogHeader>\n <DialogTitle>Welcome back</DialogTitle>\n <DialogDescription>Sign in to your account.</DialogDescription>\n </DialogHeader>\n <AuthForm mode=\"login\" {...props} />\n </DialogContent>\n </Dialog>\n );\n}\n","'use client';\n\nimport { useState, type ReactNode } from 'react';\nimport {\n Avatar,\n Badge,\n Button,\n Card,\n CardDescription,\n CardTitle,\n Checkbox,\n Dialog,\n DialogBody,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogTitle,\n EmptyState,\n Input,\n Label,\n Section,\n Separator,\n Stack,\n Switch,\n} from '@sypra-ui/ui';\n\nexport function SettingsLayout({ children }: { children: ReactNode }) {\n return <div className=\"min-w-0 space-y-8\">{children}</div>;\n}\nexport type Profile = { name: string; email: string; avatar?: string };\nexport function ProfilePage({\n profile,\n loading,\n onSave,\n fields,\n children,\n}: {\n profile: Profile;\n loading?: boolean;\n onSave: (profile: Profile) => void | Promise<void>;\n fields?: { avatar?: boolean; name?: boolean; email?: boolean };\n children?: ReactNode;\n}) {\n const [next, setNext] = useState(profile);\n const visibleFields = { avatar: true, name: true, email: true, ...fields };\n return (\n <Section title=\"Profile\" description=\"Update the details people see.\">\n <Card>\n <div className=\"mb-5 flex items-center gap-3\">\n {visibleFields.avatar && <Avatar src={next.avatar} alt={next.name} />}\n <div>\n <CardTitle>{next.name || 'Your profile'}</CardTitle>\n <CardDescription>{next.email}</CardDescription>\n </div>\n </div>\n <form\n className=\"max-w-lg space-y-4\"\n onSubmit={(event) => {\n event.preventDefault();\n void onSave(next);\n }}\n >\n {visibleFields.name && (\n <div>\n <Label htmlFor=\"profile-name\">Name</Label>\n <Input\n id=\"profile-name\"\n value={next.name}\n onChange={(event) =>\n setNext({ ...next, name: event.target.value })\n }\n required\n />\n </div>\n )}\n {visibleFields.email && (\n <div>\n <Label htmlFor=\"profile-email\">Email</Label>\n <Input\n id=\"profile-email\"\n type=\"email\"\n value={next.email}\n onChange={(event) =>\n setNext({ ...next, email: event.target.value })\n }\n required\n />\n </div>\n )}\n {(visibleFields.name || visibleFields.email) && (\n <Button type=\"submit\" loading={loading}>\n Save changes\n </Button>\n )}\n </form>\n {children}\n </Card>\n </Section>\n );\n}\nexport type Session = {\n id: string;\n device: string;\n location?: string;\n lastActive: string;\n};\nexport function SessionManager({\n sessions,\n currentSessionId,\n loading,\n onRevoke,\n onRevokeAll,\n}: {\n sessions: Session[];\n currentSessionId?: string;\n loading?: boolean;\n onRevoke: (id: string) => void | Promise<void>;\n onRevokeAll: () => void | Promise<void>;\n}) {\n return (\n <Section\n title=\"Active sessions\"\n description=\"Review where your account is signed in.\"\n >\n <Stack>\n {sessions.length ? (\n sessions.map((session) => (\n <Card\n key={session.id}\n className=\"flex flex-wrap items-center justify-between gap-3\"\n >\n <div>\n <CardTitle>\n {session.device}{' '}\n {session.id === currentSessionId && <Badge>Current</Badge>}\n </CardTitle>\n <CardDescription>\n {[session.location, session.lastActive]\n .filter(Boolean)\n .join(' · ')}\n </CardDescription>\n </div>\n {session.id !== currentSessionId && (\n <Button\n variant=\"outline\"\n size=\"sm\"\n loading={loading}\n onClick={() => void onRevoke(session.id)}\n >\n Revoke\n </Button>\n )}\n </Card>\n ))\n ) : (\n <EmptyState title=\"No sessions\" />\n )}\n </Stack>\n {sessions.length > 1 && (\n <Button\n variant=\"destructive\"\n loading={loading}\n onClick={() => void onRevokeAll()}\n >\n Sign out of other sessions\n </Button>\n )}\n </Section>\n );\n}\nexport function SecurityPage({\n sessions,\n currentSessionId,\n onRevoke,\n onRevokeAll,\n passwordEnabled = true,\n twoFactorEnabled,\n onChangePassword,\n onToggleTwoFactor,\n sections,\n children,\n}: {\n sessions?: Session[];\n currentSessionId?: string;\n onRevoke?: (id: string) => void | Promise<void>;\n onRevokeAll?: () => void | Promise<void>;\n passwordEnabled?: boolean;\n twoFactorEnabled?: boolean;\n onChangePassword?: () => void;\n onToggleTwoFactor?: (enabled: boolean) => void;\n sections?: { password?: boolean; twoFactor?: boolean; sessions?: boolean };\n children?: ReactNode;\n}) {\n const visibleSections = {\n password: true,\n twoFactor: true,\n sessions: true,\n ...sections,\n };\n return (\n <Stack gap={8}>\n {(visibleSections.password || visibleSections.twoFactor) && (\n <Section title=\"Security\" description=\"Keep your account secure.\">\n <Card className=\"space-y-4\">\n {visibleSections.password && (\n <div className=\"flex items-center justify-between gap-3\">\n <div>\n <CardTitle>Password</CardTitle>\n <CardDescription>\n {passwordEnabled\n ? 'Password is enabled.'\n : 'Passwordless sign-in.'}\n </CardDescription>\n </div>\n {onChangePassword && (\n <Button variant=\"outline\" onClick={onChangePassword}>\n Change password\n </Button>\n )}\n </div>\n )}\n {visibleSections.password && visibleSections.twoFactor && (\n <Separator />\n )}\n {visibleSections.twoFactor && (\n <div className=\"flex items-center justify-between gap-3\">\n <div>\n <CardTitle>Two-factor authentication</CardTitle>\n <CardDescription>\n {twoFactorEnabled ? 'Enabled' : 'Not enabled'}\n </CardDescription>\n </div>\n <Switch\n checked={twoFactorEnabled}\n onChange={(event) =>\n onToggleTwoFactor?.(event.target.checked)\n }\n />\n </div>\n )}\n </Card>\n </Section>\n )}\n {visibleSections.sessions && sessions && onRevoke && onRevokeAll && (\n <SessionManager\n sessions={sessions}\n currentSessionId={currentSessionId}\n onRevoke={onRevoke}\n onRevokeAll={onRevokeAll}\n />\n )}\n {children}\n </Stack>\n );\n}\n\nexport type ApiKey = {\n id: string;\n name: string;\n prefix: string;\n createdAt: string;\n lastUsedAt?: string;\n permissions?: string[];\n};\nexport function CreateApiKeyDialog({\n open,\n onOpenChange,\n onCreate,\n}: {\n open: boolean;\n onOpenChange: (open: boolean) => void;\n onCreate: (values: {\n name: string;\n permissions: string[];\n }) => void | Promise<void>;\n}) {\n const [name, setName] = useState('');\n const [write, setWrite] = useState(false);\n return (\n <Dialog open={open} onOpenChange={onOpenChange}>\n <DialogContent>\n <DialogHeader>\n <DialogTitle>Create API key</DialogTitle>\n <DialogDescription>\n The full key should only be shown once by your application.\n </DialogDescription>\n </DialogHeader>\n <DialogBody>\n <div>\n <Label htmlFor=\"key-name\">Name</Label>\n <Input\n id=\"key-name\"\n value={name}\n onChange={(event) => setName(event.target.value)}\n placeholder=\"Production\"\n />\n </div>\n <label className=\"flex items-center gap-2 text-sm\">\n <Checkbox\n checked={write}\n onChange={(event) => setWrite(event.target.checked)}\n />{' '}\n Allow write access\n </label>\n </DialogBody>\n <DialogFooter>\n <DialogClose asChild>\n <Button variant=\"outline\">Cancel</Button>\n </DialogClose>\n <Button\n onClick={() => {\n void onCreate({\n name,\n permissions: write ? ['read', 'write'] : ['read'],\n });\n onOpenChange(false);\n }}\n disabled={!name.trim()}\n >\n Create key\n </Button>\n </DialogFooter>\n </DialogContent>\n </Dialog>\n );\n}\nexport function ApiKeyManager({\n keys,\n loading,\n onCreate,\n onRevoke,\n actions,\n children,\n}: {\n keys: ApiKey[];\n loading?: boolean;\n onCreate?: (values: {\n name: string;\n permissions: string[];\n }) => void | Promise<void>;\n onRevoke?: (id: string) => void | Promise<void>;\n actions?: { create?: boolean; revoke?: boolean };\n children?: ReactNode;\n}) {\n const [createOpen, setCreateOpen] = useState(false);\n const visibleActions = { create: true, revoke: true, ...actions };\n return (\n <Section\n title=\"API keys\"\n description=\"Create keys for programmatic access.\"\n >\n {visibleActions.create && onCreate && (\n <div className=\"flex justify-end\">\n <Button onClick={() => setCreateOpen(true)}>Create API key</Button>\n </div>\n )}\n <Stack>\n {keys.length ? (\n keys.map((key) => (\n <Card\n key={key.id}\n className=\"flex flex-wrap items-center justify-between gap-3\"\n >\n <div>\n <CardTitle>{key.name}</CardTitle>\n <CardDescription>\n <code>{key.prefix}••••••••</code> · Created {key.createdAt}\n {key.lastUsedAt\n ? ` · Last used ${key.lastUsedAt}`\n : ' · Never used'}\n </CardDescription>\n </div>\n {visibleActions.revoke && onRevoke && (\n <Button\n variant=\"outline\"\n size=\"sm\"\n loading={loading}\n onClick={() => void onRevoke(key.id)}\n >\n Revoke\n </Button>\n )}\n </Card>\n ))\n ) : (\n <EmptyState\n title=\"No API keys\"\n description=\"Create one when you need programmatic access.\"\n />\n )}\n </Stack>\n {children}\n {visibleActions.create && onCreate && (\n <CreateApiKeyDialog\n open={createOpen}\n onOpenChange={setCreateOpen}\n onCreate={onCreate}\n />\n )}\n </Section>\n );\n}\nexport function ApiKeyPage(props: ComponentProps<typeof ApiKeyManager>) {\n return <ApiKeyManager {...props} />;\n}\ntype ComponentProps<T> = T extends (props: infer Props) => unknown\n ? Props\n : never;\nexport function DangerZone({\n onDeleteAccount,\n confirmationText = 'DELETE',\n}: {\n onDeleteAccount: () => void | Promise<void>;\n confirmationText?: string;\n}) {\n const [value, setValue] = useState('');\n return (\n <Section title=\"Danger zone\" description=\"These actions are permanent.\">\n <Card className=\"border-[hsl(var(--rui-destructive))]\">\n <CardTitle>Delete account</CardTitle>\n <CardDescription>\n Delete all account data. This cannot be undone.\n </CardDescription>\n <div className=\"mt-4 max-w-sm\">\n <Label htmlFor=\"delete-confirmation\">\n Type {confirmationText} to confirm\n </Label>\n <Input\n id=\"delete-confirmation\"\n value={value}\n onChange={(event) => setValue(event.target.value)}\n />\n </div>\n <Button\n className=\"mt-4\"\n variant=\"destructive\"\n disabled={value !== confirmationText}\n onClick={() => void onDeleteAccount()}\n >\n Delete account\n </Button>\n </Card>\n </Section>\n );\n}\n","import { type ReactNode } from 'react';\nimport {\n Badge,\n Button,\n Card,\n CardDescription,\n CardHeader,\n CardTitle,\n DataTable,\n EmptyState,\n Section,\n Stack,\n type DataColumn,\n} from '@sypra-ui/ui';\n\nexport type Subscription = {\n plan: string;\n price: string;\n interval?: string;\n nextBillingDate?: string;\n status?: string;\n usage?: Array<{ label: string; value: string }>;\n};\nexport type PaymentMethod = {\n brand: string;\n last4: string;\n expiresAt?: string;\n};\nexport type Invoice = {\n id: string;\n date: string;\n amount: string;\n status: string;\n href?: string;\n};\nexport function SubscriptionCard({\n subscription,\n onChangePlan,\n onCancel,\n}: {\n subscription?: Subscription;\n onChangePlan?: () => void;\n onCancel?: () => void;\n}) {\n if (!subscription)\n return (\n <EmptyState\n title=\"No active subscription\"\n action={\n onChangePlan && <Button onClick={onChangePlan}>View plans</Button>\n }\n />\n );\n return (\n <Card>\n <CardHeader>\n <div>\n <CardTitle>{subscription.plan}</CardTitle>\n <CardDescription>\n {subscription.price}\n {subscription.interval && ` / ${subscription.interval}`}\n </CardDescription>\n </div>\n {subscription.status && (\n <Badge variant=\"success\">{subscription.status}</Badge>\n )}\n </CardHeader>\n {subscription.nextBillingDate && (\n <p className=\"text-sm text-[hsl(var(--rui-muted-foreground))]\">\n Next billing date: {subscription.nextBillingDate}\n </p>\n )}\n {subscription.usage?.length ? (\n <div className=\"mt-4 grid gap-2 text-sm sm:grid-cols-2\">\n {subscription.usage.map((item) => (\n <div\n key={item.label}\n className=\"rounded bg-[hsl(var(--rui-muted))] p-3\"\n >\n <strong className=\"block\">{item.value}</strong>\n <span className=\"text-[hsl(var(--rui-muted-foreground))]\">\n {item.label}\n </span>\n </div>\n ))}\n </div>\n ) : null}\n <div className=\"mt-5 flex flex-wrap gap-2\">\n {onChangePlan && <Button onClick={onChangePlan}>Change plan</Button>}\n {onCancel && (\n <Button variant=\"outline\" onClick={onCancel}>\n Manage subscription\n </Button>\n )}\n </div>\n </Card>\n );\n}\nexport function PaymentMethodCard({\n paymentMethod,\n onUpdate,\n}: {\n paymentMethod?: PaymentMethod;\n onUpdate?: () => void;\n}) {\n return (\n <Card>\n <CardHeader>\n <div>\n <CardTitle>Payment method</CardTitle>\n <CardDescription>\n {paymentMethod\n ? `${paymentMethod.brand} •••• ${paymentMethod.last4}${paymentMethod.expiresAt ? ` · Expires ${paymentMethod.expiresAt}` : ''}`\n : 'No payment method on file.'}\n </CardDescription>\n </div>\n {onUpdate && (\n <Button variant=\"outline\" size=\"sm\" onClick={onUpdate}>\n {paymentMethod ? 'Update' : 'Add payment method'}\n </Button>\n )}\n </CardHeader>\n </Card>\n );\n}\nexport function InvoiceTable({\n invoices,\n onView,\n}: {\n invoices: Invoice[];\n onView?: (invoice: Invoice) => void;\n}) {\n const columns: DataColumn<Invoice>[] = [\n { key: 'date', header: 'Date', sortable: true },\n { key: 'amount', header: 'Amount' },\n {\n key: 'status',\n header: 'Status',\n cell: (invoice) => (\n <Badge\n variant={\n invoice.status.toLowerCase() === 'paid' ? 'success' : 'warning'\n }\n >\n {invoice.status}\n </Badge>\n ),\n },\n {\n key: 'id',\n header: <span className=\"sr-only\">Actions</span>,\n cell: (invoice) =>\n onView && (\n <Button variant=\"ghost\" size=\"sm\" onClick={() => onView(invoice)}>\n View\n </Button>\n ),\n },\n ];\n return (\n <DataTable\n data={invoices}\n columns={columns}\n emptyMessage=\"No invoices yet.\"\n />\n );\n}\nexport function PricingTable({\n plans,\n onSelect,\n}: {\n plans: Array<{\n name: string;\n price: string;\n description?: string;\n features: string[];\n highlighted?: boolean;\n }>;\n onSelect: (plan: string) => void;\n}) {\n return (\n <div className=\"grid gap-4 md:grid-cols-3\">\n {plans.map((plan) => (\n <Card\n key={plan.name}\n className={\n plan.highlighted ? 'border-[hsl(var(--rui-primary))]' : undefined\n }\n >\n <CardTitle>{plan.name}</CardTitle>\n <p className=\"mt-3 text-2xl font-bold\">{plan.price}</p>\n {plan.description && (\n <CardDescription>{plan.description}</CardDescription>\n )}\n <ul className=\"my-5 space-y-2 text-sm\">\n {plan.features.map((feature) => (\n <li key={feature}>✓ {feature}</li>\n ))}\n </ul>\n <Button\n className=\"w-full\"\n variant={plan.highlighted ? 'primary' : 'outline'}\n onClick={() => onSelect(plan.name)}\n >\n Choose {plan.name}\n </Button>\n </Card>\n ))}\n </div>\n );\n}\nexport function BillingPage({\n subscription,\n paymentMethod,\n invoices,\n onChangePlan,\n onUpdatePaymentMethod,\n onCancel,\n onViewInvoice,\n sections,\n children,\n}: {\n subscription?: Subscription;\n paymentMethod?: PaymentMethod;\n invoices?: Invoice[];\n onChangePlan?: () => void;\n onUpdatePaymentMethod?: () => void;\n onCancel?: () => void;\n onViewInvoice?: (invoice: Invoice) => void;\n sections?: {\n subscription?: boolean;\n paymentMethod?: boolean;\n invoices?: boolean;\n };\n children?: ReactNode;\n}) {\n const visibleSections = {\n subscription: true,\n paymentMethod: true,\n invoices: true,\n ...sections,\n };\n return (\n <Stack gap={8}>\n {visibleSections.subscription && (\n <Section\n title=\"Billing\"\n description=\"Manage your plan and payment details.\"\n >\n <SubscriptionCard\n subscription={subscription}\n onChangePlan={onChangePlan}\n onCancel={onCancel}\n />\n </Section>\n )}\n {visibleSections.paymentMethod && (\n <PaymentMethodCard\n paymentMethod={paymentMethod}\n onUpdate={onUpdatePaymentMethod}\n />\n )}\n {visibleSections.invoices && (\n <Section title=\"Invoices\">\n <InvoiceTable invoices={invoices ?? []} onView={onViewInvoice} />\n </Section>\n )}\n {children}\n </Stack>\n );\n}\n","import { type ReactNode } from 'react';\nimport {\n Badge,\n Card,\n CardDescription,\n CardTitle,\n Container,\n PageContent,\n PageHeader,\n PageShell,\n} from '@sypra-ui/ui';\n\nexport function Hero({\n eyebrow,\n title,\n description,\n primaryAction,\n secondaryAction,\n}: {\n eyebrow?: ReactNode;\n title: ReactNode;\n description: ReactNode;\n primaryAction?: ReactNode;\n secondaryAction?: ReactNode;\n}) {\n return (\n <section className=\"py-20 text-center sm:py-28\">\n {eyebrow && <Badge>{eyebrow}</Badge>}\n <h1 className=\"mx-auto mt-5 max-w-3xl text-4xl font-bold tracking-tight sm:text-6xl\">\n {title}\n </h1>\n <p className=\"mx-auto mt-5 max-w-2xl text-lg text-[hsl(var(--rui-muted-foreground))]\">\n {description}\n </p>\n <div className=\"mt-8 flex flex-wrap justify-center gap-3\">\n {primaryAction}\n {secondaryAction}\n </div>\n </section>\n );\n}\nexport function FeatureGrid({\n features,\n}: {\n features: Array<{ title: string; description: string; icon?: ReactNode }>;\n}) {\n return (\n <section className=\"grid gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n {features.map((feature) => (\n <Card key={feature.title}>\n {feature.icon && (\n <div className=\"mb-3 text-[hsl(var(--rui-primary))]\">\n {feature.icon}\n </div>\n )}\n <CardTitle>{feature.title}</CardTitle>\n <CardDescription>{feature.description}</CardDescription>\n </Card>\n ))}\n </section>\n );\n}\nexport function FAQ({\n items,\n}: {\n items: Array<{ question: string; answer: ReactNode }>;\n}) {\n return (\n <section className=\"mx-auto max-w-3xl space-y-4\">\n {items.map((item) => (\n <Card key={item.question}>\n <CardTitle>{item.question}</CardTitle>\n <CardDescription>{item.answer}</CardDescription>\n </Card>\n ))}\n </section>\n );\n}\nexport function CTA({\n title,\n description,\n action,\n}: {\n title: ReactNode;\n description?: ReactNode;\n action: ReactNode;\n}) {\n return (\n <section className=\"rounded-[calc(var(--rui-radius)+.2rem)] bg-[hsl(var(--rui-primary))] px-6 py-14 text-center text-[hsl(var(--rui-primary-foreground))]\">\n <h2 className=\"text-3xl font-bold\">{title}</h2>\n {description && <p className=\"mt-3 opacity-85\">{description}</p>}\n <div className=\"mt-6\">{action}</div>\n </section>\n );\n}\nexport function Footer({\n brand,\n links,\n}: {\n brand: ReactNode;\n links?: Array<{ label: string; href: string }>;\n}) {\n return (\n <footer className=\"mt-16 border-t border-[hsl(var(--rui-border))] py-8 text-sm text-[hsl(var(--rui-muted-foreground))]\">\n <div className=\"flex flex-wrap items-center justify-between gap-4\">\n <strong className=\"text-[hsl(var(--rui-foreground))]\">{brand}</strong>\n <div className=\"flex gap-4\">\n {links?.map((link) => (\n <a\n key={link.href}\n href={link.href}\n className=\"hover:text-[hsl(var(--rui-foreground))]\"\n >\n {link.label}\n </a>\n ))}\n </div>\n </div>\n </footer>\n );\n}\nexport function LandingPage({\n brand,\n hero,\n features,\n children,\n as,\n sections,\n}: {\n brand: ReactNode;\n hero?: {\n title: ReactNode;\n description: ReactNode;\n primaryAction?: ReactNode;\n secondaryAction?: ReactNode;\n };\n features?: Array<{ title: string; description: string; icon?: ReactNode }>;\n children?: ReactNode;\n as?: 'main' | 'div';\n sections?: {\n header?: boolean;\n hero?: boolean;\n features?: boolean;\n footer?: boolean;\n };\n}) {\n const visibleSections = {\n header: true,\n hero: true,\n features: true,\n footer: true,\n ...sections,\n };\n return (\n <PageShell as={as}>\n <Container>\n {visibleSections.header && (\n <header className=\"flex h-16 items-center justify-between\">\n <strong>{brand}</strong>\n </header>\n )}\n {visibleSections.hero && hero && <Hero {...hero} />}\n {visibleSections.features && features && (\n <FeatureGrid features={features} />\n )}\n {children}\n {visibleSections.footer && <Footer brand={brand} />}\n </Container>\n </PageShell>\n );\n}\n\nexport function SettingsPageDemo({ children }: { children: ReactNode }) {\n return (\n <PageShell>\n <Container className=\"py-8\">\n <PageHeader title=\"Settings\" description=\"Manage your account.\" />\n <PageContent>{children}</PageContent>\n </Container>\n </PageShell>\n );\n}\n"],"mappings":"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","names":["useState","Button","Card","CardDescription","CardTitle","Dialog","DialogContent","DialogDescription","DialogHeader","DialogTitle","Input","Label","Separator","jsx","jsxs","Badge","Button","Card","CardDescription","CardHeader","CardTitle","EmptyState","Section","Stack","jsx","jsxs","Badge","Card","CardDescription","CardTitle","PageShell","jsx","jsxs"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sypra-ui/pages",
3
- "version": "0.2.0",
3
+ "version": "0.4.0",
4
4
  "description": "Data-and-callback driven React page compositions.",
5
5
  "license": "MIT",
6
6
  "repository": {