@vadimcomanescu/nadicode-design-system 2.0.5 → 2.0.7

package/dist/components/page-kits/PricingPageKit.js

@@ -0,0 +1,279 @@
+import { MarketingShellPageKit } from '../../chunk-E4L6LR6P.js';
+import { PricingBlock } from '../../chunk-AURJQZC4.js';
+import '../../chunk-DARC2ACH.js';
+import { FAQBlock } from '../../chunk-NEHCPO53.js';
+import '../../chunk-AYWL4IYM.js';
+import '../../chunk-WOYBVPXK.js';
+import { ComparisonBlock } from '../../chunk-VZCB4APK.js';
+import { CallToActionBlock } from '../../chunk-GJPTPLCQ.js';
+import '../../chunk-G5EO22OR.js';
+import '../../chunk-ANBJ2OLC.js';
+import '../../chunk-LV4LBWCS.js';
+import '../../chunk-XZ3A33GP.js';
+import '../../chunk-F3T2U7YL.js';
+import '../../chunk-6DYFX5IR.js';
+import '../../chunk-EB5PYS7Q.js';
+import '../../chunk-OHX2LFAH.js';
+import '../../chunk-SGI25ZJ6.js';
+import { Typography } from '../../chunk-N53OMWW2.js';
+import '../../chunk-R7N7YLFT.js';
+import '../../chunk-DQPK2XRL.js';
+import '../../chunk-HOWTYZL5.js';
+import '../../chunk-GHIBG7OM.js';
+import '../../chunk-ULLTRLBD.js';
+import '../../chunk-4O6L5YWT.js';
+import { Heading } from '../../chunk-WI547C47.js';
+import '../../chunk-PXDHNGTG.js';
+import '../../chunk-A7NUWD76.js';
+import '../../chunk-CUZJIDU7.js';
+import '../../chunk-AP3XXYAY.js';
+import '../../chunk-LIBXYD5Q.js';
+import '../../chunk-I23DDSU7.js';
+import { Card, CardHeader, CardTitle, CardContent } from '../../chunk-AH6YSYYT.js';
+import { Button } from '../../chunk-7KIDDF3I.js';
+import '../../chunk-6FOHUNXR.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-W4YX7N46.js';
+import '../../chunk-GO35FTNJ.js';
+import '../../chunk-PSVQ7ZNX.js';
+import '../../chunk-FLF5AMNO.js';
+import '../../chunk-WFJQ43SM.js';
+import '../../chunk-S4GKGKON.js';
+import '../../chunk-LCDDAE7J.js';
+import '../../chunk-R674XI7C.js';
+import '../../chunk-WUO7OONN.js';
+import '../../chunk-BPCCTJSK.js';
+import '../../chunk-CGUCH322.js';
+import '../../chunk-ELKIUARM.js';
+import '../../chunk-ZU2GYVAP.js';
+import '../../chunk-KSHJQ2VT.js';
+import '../../chunk-3CLXYQKB.js';
+import '../../chunk-JHQ5NMLZ.js';
+import '../../chunk-CRZ2JE24.js';
+import '../../chunk-TXGANOAX.js';
+import '../../chunk-OITJWGFV.js';
+import '../../chunk-Z74D6D2W.js';
+import '../../chunk-HNY45VUQ.js';
+import '../../chunk-IJJI4RQU.js';
+import '../../chunk-E7RBK6ML.js';
+import '../../chunk-UBIGDGOP.js';
+import '../../chunk-Q7LVUGFL.js';
+import '../../chunk-ALMGJVMT.js';
+import '../../chunk-QPXTBZWN.js';
+import '../../chunk-GAKU7DFY.js';
+import '../../chunk-T6BRD7TS.js';
+import '../../chunk-R5XP45PD.js';
+import '../../chunk-G5EO5FWC.js';
+import '../../chunk-NCULQXJE.js';
+import '../../chunk-VDYPDMYR.js';
+import '../../chunk-WDGIQDQG.js';
+import '../../chunk-WKRIKCJC.js';
+import '../../chunk-7WDT2PRI.js';
+import '../../chunk-AP5Y5M3R.js';
+import '../../chunk-JZ4G2SJH.js';
+import '../../chunk-KYGKJ553.js';
+import '../../chunk-M7YSMMAC.js';
+import '../../chunk-XQ2UDMPO.js';
+import '../../chunk-JMCSAGZ3.js';
+import '../../chunk-QUKDUSHD.js';
+import '../../chunk-4NXZIMYZ.js';
+import '../../chunk-TBKJ34BB.js';
+import '../../chunk-2IZC7HSV.js';
+import '../../chunk-2SDZMTB2.js';
+import '../../chunk-R3AO6AZM.js';
+import '../../chunk-RYOTIXZO.js';
+import '../../chunk-W3B3UOEG.js';
+import '../../chunk-ACRVOD7W.js';
+import '../../chunk-QSU23VYZ.js';
+import '../../chunk-BJYCQ2NV.js';
+import '../../chunk-VM462WZC.js';
+import '../../chunk-O74AEVHW.js';
+import '../../chunk-ZUHIWALK.js';
+import '../../chunk-5UZDOF6V.js';
+import '../../chunk-PKVTEDKO.js';
+import '../../chunk-I3TH7PIB.js';
+import '../../chunk-WGPK3FQ7.js';
+import '../../chunk-JL4MVVFH.js';
+import '../../chunk-IQEBXXB5.js';
+import '../../chunk-AZUJNRQU.js';
+import '../../chunk-WA45EC4Y.js';
+import '../../chunk-2MOEOEOI.js';
+import '../../chunk-5LCXASRW.js';
+import '../../chunk-2ZJVU7NV.js';
+import '../../chunk-5ESF6N36.js';
+import '../../chunk-RBPLOM3A.js';
+import '../../chunk-GCUTJI7M.js';
+import '../../chunk-2NT57K4U.js';
+import '../../chunk-6G3RRWJT.js';
+import '../../chunk-JRJGSNI4.js';
+import '../../chunk-RF6ECFS5.js';
+import '../../chunk-TV4RSQH4.js';
+import '../../chunk-4FEAWXJD.js';
+import '../../chunk-JHQTKMKG.js';
+import '../../chunk-CI7GPGCJ.js';
+import '../../chunk-226EBOTK.js';
+import '../../chunk-G5YLGJXR.js';
+import '../../chunk-G24VV5NO.js';
+import '../../chunk-6BAV4TZ5.js';
+import '../../chunk-SW6QPJM4.js';
+import '../../chunk-V6WNRZT3.js';
+import '../../chunk-JBK2LA6U.js';
+import '../../chunk-55U27XY4.js';
+import '../../chunk-LSPO6OBI.js';
+import '../../chunk-Y56WBNCY.js';
+import '../../chunk-KYZT3RNW.js';
+import '../../chunk-UEG2LI7Z.js';
+import '../../chunk-JJTQOH7J.js';
+import '../../chunk-72X6SXOX.js';
+import '../../chunk-SR5U52V3.js';
+import '../../chunk-74RKVIBV.js';
+import '../../chunk-AWIJHDNK.js';
+import '../../chunk-BRP6D56U.js';
+import '../../chunk-S733NAYS.js';
+import '../../chunk-MAUTIHQG.js';
+import '../../chunk-666N6OTL.js';
+import '../../chunk-FMH55OKV.js';
+import '../../chunk-WXVNTJIB.js';
+import '../../chunk-CXACRCZ4.js';
+import '../../chunk-T7H53CK2.js';
+import '../../chunk-BFLN54VR.js';
+import '../../chunk-P6IRHPFM.js';
+import '../../chunk-SXHYB7JB.js';
+import '../../chunk-ONGJ7AC2.js';
+import '../../chunk-UHXGBV5N.js';
+import '../../chunk-UIUMTURU.js';
+import '../../chunk-PRUXIDBD.js';
+import '../../chunk-NURPUVUV.js';
+import { Badge } from '../../chunk-S4JAHKOP.js';
+import '../../chunk-HJBXUXTD.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import React from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var STATE_BADGE_LABELS = {
+  "billing-toggle": "Billing toggle",
+  "loading-action": "Loading actions",
+  "empty-plan": "Empty plan state"
+};
+var EMPTY_PLAN_ACTIONS = [];
+var EMPTY_PLANS = [];
+var DEFAULT_COMPARISON = {};
+var DEFAULT_FAQ = {};
+var DEFAULT_CTA = {
+  title: "Need a custom rollout?",
+  description: "Talk to our team for multi-team migration and governance support.",
+  primaryAction: { label: "Contact sales", href: "/contact" }
+};
+var DEFAULT_EMPTY_STATE = {
+  title: "No plans available",
+  description: "Configure at least one plan to render pricing actions."
+};
+function PricingPageKit({
+  shell,
+  state = "default",
+  title = "Choose the plan that fits your team.",
+  description = "Use stable pricing blocks while keeping plan copy, links, and billing behavior app-owned.",
+  plans = EMPTY_PLANS,
+  billing,
+  comparison = DEFAULT_COMPARISON,
+  faq = DEFAULT_FAQ,
+  cta = DEFAULT_CTA,
+  planActions = EMPTY_PLAN_ACTIONS,
+  emptyState = DEFAULT_EMPTY_STATE,
+  loadingMessage = "Preparing checkout actions...",
+  className
+}) {
+  const [selectedBilling, setSelectedBilling] = React.useState("monthly");
+  const supportsYearly = billing?.supportsYearly ?? true;
+  const monthlyLabel = billing?.monthlyLabel ?? "Monthly";
+  const yearlyLabel = billing?.yearlyLabel ?? "Yearly";
+  const yearlyBadgeLabel = billing?.yearlyBadgeLabel ?? "Save";
+  const isLoadingActions = state === "loading-action";
+  const shouldRenderEmpty = state === "empty-plan" || plans.length === 0;
+  return /* @__PURE__ */ jsx(MarketingShellPageKit, { ...shell, children: /* @__PURE__ */ jsxs("section", { className: cn("mx-auto w-full max-w-6xl space-y-8 px-6 pb-16", className), children: [
+    /* @__PURE__ */ jsxs("header", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsx(Heading, { level: 2, children: title }),
+      /* @__PURE__ */ jsx(Typography, { variant: "muted", children: description }),
+      state !== "default" ? /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2", children: /* @__PURE__ */ jsx(Badge, { variant: "outline", children: STATE_BADGE_LABELS[state] }) }) : null
+    ] }),
+    state === "billing-toggle" ? /* @__PURE__ */ jsxs(Card, { "data-testid": "pricing-billing-controls", children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Billing interval" }) }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "space-y-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-2 rounded-md border border-border/70 bg-surface/60 p-1", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              size: "sm",
+              variant: selectedBilling === "monthly" ? "primary" : "ghost",
+              onClick: () => setSelectedBilling("monthly"),
+              children: monthlyLabel
+            }
+          ),
+          supportsYearly ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              Button,
+              {
+                type: "button",
+                size: "sm",
+                variant: selectedBilling === "yearly" ? "primary" : "ghost",
+                onClick: () => setSelectedBilling("yearly"),
+                children: yearlyLabel
+              }
+            ),
+            /* @__PURE__ */ jsx(Badge, { variant: "accent", children: yearlyBadgeLabel })
+          ] }) : null
+        ] }),
+        billing?.note ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: billing.note }) : null
+      ] })
+    ] }) : null,
+    isLoadingActions ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-testid": "pricing-loading-action",
+        role: "status",
+        className: "rounded-md border border-border/70 bg-surface/70 px-4 py-3 text-sm text-text-secondary",
+        children: loadingMessage
+      }
+    ) : null,
+    shouldRenderEmpty ? /* @__PURE__ */ jsxs(Card, { "data-testid": "pricing-empty-state", children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: emptyState.title }) }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "muted", children: emptyState.description }) })
+    ] }) : /* @__PURE__ */ jsx(
+      PricingBlock,
+      {
+        title: "Pricing plans",
+        description: "All plans are rendered from declared data inputs.",
+        plans,
+        showBillingToggle: state === "billing-toggle" && supportsYearly
+      }
+    ),
+    planActions.length > 0 ? /* @__PURE__ */ jsxs(Card, { "data-testid": "pricing-plan-actions", children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: "Checkout actions" }) }),
+      /* @__PURE__ */ jsx(CardContent, { className: "grid gap-3 sm:grid-cols-2", children: planActions.map((action) => {
+        const isDisabled = isLoadingActions || action.disabled;
+        return /* @__PURE__ */ jsxs("div", { className: "rounded-md border border-border/70 p-3", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              disabled: isDisabled,
+              onClick: action.onAction,
+              className: "w-full",
+              children: action.label
+            }
+          ),
+          /* @__PURE__ */ jsx(Typography, { variant: "small", className: "mt-2 break-all text-text-tertiary", children: action.href })
+        ] }, action.id);
+      }) })
+    ] }) : null,
+    comparison === null ? null : /* @__PURE__ */ jsx("section", { children: /* @__PURE__ */ jsx(ComparisonBlock, { ...comparison }) }),
+    faq === null ? null : /* @__PURE__ */ jsx("section", { children: /* @__PURE__ */ jsx(FAQBlock, { ...faq }) }),
+    cta === null ? null : /* @__PURE__ */ jsx("section", { children: /* @__PURE__ */ jsx(CallToActionBlock, { ...cta }) })
+  ] }) });
+}
+
+export { PricingPageKit };

package/dist/components/page-kits/ProfileSettingsPageKit.d.ts

@@ -0,0 +1,50 @@
+import React from "react";
+import { type SettingsPageKitSaveState, type SettingsPageKitSection } from "./SettingsPageKit";
+export type ProfileSettingsPageKitMode = "view" | "edit";
+export type ProfileSettingsAvatarStatus = "idle" | "uploading" | "error";
+export interface ProfileSettingsPageKitField {
+    id: string;
+    label: string;
+    value: string;
+    placeholder?: string;
+    type?: "text" | "email" | "url" | "tel";
+    required?: boolean;
+    readOnly?: boolean;
+    helperText?: string;
+}
+export interface ProfileSettingsPageKitNotificationPreference {
+    id: string;
+    label: string;
+    description?: string;
+    enabled: boolean;
+    disabled?: boolean;
+}
+export interface ProfileSettingsPageKitAvatar {
+    src?: string;
+    fallback?: string;
+    status?: ProfileSettingsAvatarStatus;
+    errorMessage?: string;
+    onUpload?: () => void;
+    onRemove?: () => void;
+}
+export interface ProfileSettingsPageKitProps {
+    title?: string;
+    description?: string;
+    sections?: SettingsPageKitSection[];
+    activeSectionId?: string;
+    onSectionChange?: (sectionId: string) => void;
+    profileFields: ProfileSettingsPageKitField[];
+    notificationPreferences: ProfileSettingsPageKitNotificationPreference[];
+    avatar?: ProfileSettingsPageKitAvatar;
+    mode?: ProfileSettingsPageKitMode;
+    saveState?: SettingsPageKitSaveState;
+    validationErrors?: Record<string, string>;
+    validationMessage?: string;
+    fatalErrorMessage?: string;
+    onFieldChange?: (fieldId: string, value: string) => void;
+    onNotificationChange?: (id: string, enabled: boolean) => void;
+    onSave?: () => void;
+    onDiscard?: () => void;
+    renderAdditionalSection?: (section: SettingsPageKitSection) => React.ReactNode;
+}
+export declare function ProfileSettingsPageKit({ title, description, sections, activeSectionId, onSectionChange, profileFields, notificationPreferences, avatar, mode, saveState, validationErrors, validationMessage, fatalErrorMessage, onFieldChange, onNotificationChange, onSave, onDiscard, renderAdditionalSection, }: ProfileSettingsPageKitProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/page-kits/ProfileSettingsPageKit.js

@@ -0,0 +1,171 @@
+import { SettingsPageKit } from '../../chunk-RKQPU75I.js';
+import { Typography } from '../../chunk-N53OMWW2.js';
+import { Switch } from '../../chunk-R7N7YLFT.js';
+import { Field, FieldLabel } from '../../chunk-RX5EUODB.js';
+import '../../chunk-WI547C47.js';
+import '../../chunk-55HD4L6G.js';
+import { Input } from '../../chunk-AP3XXYAY.js';
+import { Label } from '../../chunk-LIBXYD5Q.js';
+import { Card, CardHeader, CardTitle, CardDescription, CardContent } from '../../chunk-AH6YSYYT.js';
+import { Avatar, AvatarImage, AvatarFallback } from '../../chunk-NAAU5IWU.js';
+import { Button } from '../../chunk-7KIDDF3I.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-S4JAHKOP.js';
+import '../../chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var DEFAULT_SECTIONS = [{ id: "profile", label: "Profile" }];
+var EMPTY_VALIDATION_ERRORS = {};
+function renderProfileSection({
+  profileFields,
+  notificationPreferences,
+  avatar,
+  mode,
+  validationErrors,
+  onFieldChange,
+  onNotificationChange
+}) {
+  const readOnlyMode = mode === "view";
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Avatar" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Upload a profile image visible to your workspace." })
+      ] }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "flex flex-wrap items-center gap-4", children: [
+        /* @__PURE__ */ jsxs(Avatar, { className: "h-14 w-14", children: [
+          /* @__PURE__ */ jsx(AvatarImage, { src: avatar?.src, alt: "Profile avatar" }),
+          /* @__PURE__ */ jsx(AvatarFallback, { children: avatar?.fallback ?? "U" })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "secondary",
+              onClick: avatar?.onUpload,
+              disabled: readOnlyMode || avatar?.status === "uploading",
+              children: avatar?.status === "uploading" ? "Uploading\u2026" : "Upload avatar"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: avatar?.onRemove, disabled: readOnlyMode, children: "Remove" })
+        ] })
+      ] }),
+      avatar?.errorMessage ? /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-destructive", children: avatar.errorMessage }) }) : null
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Personal information" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Control profile details used across your account." })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { className: "space-y-4", children: profileFields.map((field) => {
+        const inputId = `profile-settings-field-${field.id}`;
+        const fieldError = validationErrors[field.id];
+        return /* @__PURE__ */ jsxs(Field, { children: [
+          /* @__PURE__ */ jsxs(FieldLabel, { htmlFor: inputId, children: [
+            field.label,
+            field.required ? " *" : ""
+          ] }),
+          /* @__PURE__ */ jsx(
+            Input,
+            {
+              id: inputId,
+              type: field.type ?? "text",
+              value: field.value,
+              placeholder: field.placeholder,
+              readOnly: readOnlyMode || field.readOnly,
+              disabled: readOnlyMode || field.readOnly,
+              onChange: (event) => onFieldChange?.(field.id, event.target.value)
+            }
+          ),
+          field.helperText ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-tertiary", children: field.helperText }) : null,
+          fieldError ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-destructive", children: fieldError }) : null
+        ] }, field.id);
+      }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsxs(CardHeader, { children: [
+        /* @__PURE__ */ jsx(CardTitle, { children: "Notification preferences" }),
+        /* @__PURE__ */ jsx(CardDescription, { children: "Set communication and security notification behavior." })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { className: "space-y-4", children: notificationPreferences.map((preference) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex flex-wrap items-center justify-between gap-3 rounded-lg border border-border-subtle bg-surface-hover p-4",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+              /* @__PURE__ */ jsx(Label, { htmlFor: `profile-settings-pref-${preference.id}`, children: preference.label }),
+              preference.description ? /* @__PURE__ */ jsx(Typography, { variant: "small", className: "text-text-secondary", children: preference.description }) : null
+            ] }),
+            /* @__PURE__ */ jsx(
+              Switch,
+              {
+                id: `profile-settings-pref-${preference.id}`,
+                checked: preference.enabled,
+                disabled: readOnlyMode || preference.disabled,
+                onCheckedChange: (checked) => onNotificationChange?.(preference.id, checked),
+                "aria-label": preference.label
+              }
+            )
+          ]
+        },
+        preference.id
+      )) })
+    ] })
+  ] });
+}
+function ProfileSettingsPageKit({
+  title = "Profile settings",
+  description = "Manage profile details, avatar controls, and personal notification preferences.",
+  sections = DEFAULT_SECTIONS,
+  activeSectionId,
+  onSectionChange,
+  profileFields,
+  notificationPreferences,
+  avatar,
+  mode = "edit",
+  saveState = "default",
+  validationErrors = EMPTY_VALIDATION_ERRORS,
+  validationMessage,
+  fatalErrorMessage,
+  onFieldChange,
+  onNotificationChange,
+  onSave,
+  onDiscard,
+  renderAdditionalSection
+}) {
+  const firstSectionId = sections[0]?.id ?? "profile";
+  const resolvedActiveSectionId = activeSectionId ?? firstSectionId;
+  return /* @__PURE__ */ jsx(
+    SettingsPageKit,
+    {
+      title,
+      description,
+      sections,
+      activeSectionId: resolvedActiveSectionId,
+      onSectionChange,
+      saveState,
+      validationMessage,
+      fatalErrorMessage,
+      onSave,
+      onDiscard,
+      renderSection: (section) => {
+        if (section.id === "profile") {
+          return renderProfileSection({
+            profileFields,
+            notificationPreferences,
+            avatar,
+            mode,
+            validationErrors,
+            onFieldChange,
+            onNotificationChange
+          });
+        }
+        return renderAdditionalSection ? renderAdditionalSection(section) : null;
+      }
+    }
+  );
+}
+
+export { ProfileSettingsPageKit };

package/dist/components/page-kits/RecoveryPageKit.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { PasswordRecoveryBlock } from "../blocks/PasswordRecoveryBlock";
+type PasswordRecoveryBlockProps = React.ComponentProps<typeof PasswordRecoveryBlock>;
+export interface RecoveryPageKitProps {
+    mode?: PasswordRecoveryBlockProps["mode"];
+    onSubmit?: PasswordRecoveryBlockProps["onSubmit"];
+    onBackToLogin?: PasswordRecoveryBlockProps["onBackToLogin"];
+    title?: PasswordRecoveryBlockProps["title"];
+    description?: PasswordRecoveryBlockProps["description"];
+    buttonText?: PasswordRecoveryBlockProps["buttonText"];
+    successTitle?: PasswordRecoveryBlockProps["successTitle"];
+    errorMessage?: React.ReactNode;
+    className?: string;
+    cardClassName?: string;
+}
+export declare function RecoveryPageKit({ mode, onSubmit, onBackToLogin, title, description, buttonText, successTitle, errorMessage, className, cardClassName, }: RecoveryPageKitProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/page-kits/RecoveryPageKit.js

@@ -0,0 +1,58 @@
+import { PasswordRecoveryBlock } from '../../chunk-5PZ4VR2D.js';
+import '../../chunk-MDAYDDTC.js';
+import '../../chunk-ZLSWCV55.js';
+import '../../chunk-RX5EUODB.js';
+import '../../chunk-CUZJIDU7.js';
+import '../../chunk-AP3XXYAY.js';
+import '../../chunk-LIBXYD5Q.js';
+import '../../chunk-AH6YSYYT.js';
+import '../../chunk-7KIDDF3I.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-CGUCH322.js';
+import '../../chunk-XQ2UDMPO.js';
+import '../../chunk-CXACRCZ4.js';
+import '../../chunk-S4JAHKOP.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function RecoveryPageKit({
+  mode = "reset",
+  onSubmit,
+  onBackToLogin,
+  title,
+  description,
+  buttonText,
+  successTitle,
+  errorMessage,
+  className,
+  cardClassName
+}) {
+  return /* @__PURE__ */ jsx("section", { className: cn("min-h-dvh w-full bg-background px-4 py-12 md:px-8 md:py-20", className), children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-5xl flex-col items-center justify-center gap-4", children: [
+    errorMessage ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "alert",
+        className: "w-full max-w-sm rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+        children: errorMessage
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      PasswordRecoveryBlock,
+      {
+        className: cn("w-full", cardClassName),
+        mode,
+        onSubmit,
+        onBackToLogin,
+        title,
+        description,
+        buttonText,
+        successTitle
+      }
+    )
+  ] }) });
+}
+
+export { RecoveryPageKit };

package/dist/components/page-kits/ResetPageKit.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { ResetPasswordBlock } from "../blocks/ResetPasswordBlock";
+type ResetPasswordBlockProps = React.ComponentProps<typeof ResetPasswordBlock>;
+export interface ResetPageKitProps {
+    onSubmit?: ResetPasswordBlockProps["onSubmit"];
+    onBackToLogin?: ResetPasswordBlockProps["onBackToLogin"];
+    title?: ResetPasswordBlockProps["title"];
+    description?: ResetPasswordBlockProps["description"];
+    errorMessage?: React.ReactNode;
+    className?: string;
+    cardClassName?: string;
+}
+export declare function ResetPageKit({ onSubmit, onBackToLogin, title, description, errorMessage, className, cardClassName, }: ResetPageKitProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/page-kits/ResetPageKit.js

@@ -0,0 +1,52 @@
+import { ResetPasswordBlock } from '../../chunk-X6VXWEDO.js';
+import '../../chunk-ZLSWCV55.js';
+import '../../chunk-UJDEGCCZ.js';
+import '../../chunk-RX5EUODB.js';
+import '../../chunk-AP3XXYAY.js';
+import '../../chunk-LIBXYD5Q.js';
+import '../../chunk-AH6YSYYT.js';
+import '../../chunk-7KIDDF3I.js';
+import '../../chunk-PD2YEH3H.js';
+import '../../chunk-CRY67BIF.js';
+import '../../chunk-HJC6U46F.js';
+import '../../chunk-QSU23VYZ.js';
+import '../../chunk-666N6OTL.js';
+import '../../chunk-FMH55OKV.js';
+import '../../chunk-CXACRCZ4.js';
+import '../../chunk-UIUMTURU.js';
+import '../../chunk-ASKFAYYR.js';
+import { cn } from '../../chunk-QYZT24TS.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+function ResetPageKit({
+  onSubmit,
+  onBackToLogin,
+  title,
+  description,
+  errorMessage,
+  className,
+  cardClassName
+}) {
+  return /* @__PURE__ */ jsx("section", { className: cn("min-h-dvh w-full bg-background px-4 py-12 md:px-8 md:py-20", className), children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-5xl flex-col items-center justify-center gap-4", children: [
+    errorMessage ? /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "alert",
+        className: "w-full max-w-sm rounded-md border border-destructive/40 bg-destructive/10 px-4 py-3 text-sm text-destructive",
+        children: errorMessage
+      }
+    ) : null,
+    /* @__PURE__ */ jsx(
+      ResetPasswordBlock,
+      {
+        className: cn("w-full", cardClassName),
+        onSubmit,
+        onBackToLogin,
+        title,
+        description
+      }
+    )
+  ] }) });
+}
+
+export { ResetPageKit };

package/dist/components/page-kits/ServiceSuitePageKit.d.ts

@@ -0,0 +1,25 @@
+import React from "react";
+import { CallToActionBlock } from "../blocks/CallToActionBlock";
+import { FAQBlock } from "../blocks/FAQBlock";
+import { FeatureBlock } from "../blocks/FeatureBlock";
+import { HeroBlock } from "../blocks/HeroBlock";
+import { ProcessFlowBlock } from "../blocks/ProcessFlowBlock";
+import { TeamBlock } from "../blocks/TeamBlock";
+import { TestimonialsBlock } from "../blocks/TestimonialsBlock";
+import { type MarketingShellPageKitProps } from "./MarketingShellPageKit";
+export type ServiceSuitePageKitVariant = "agency-home" | "digital-workers" | "service-detail";
+export type ServiceSuitePageKitSectionId = "hero" | "features" | "process" | "team" | "testimonials" | "faq" | "cta";
+export interface ServiceSuitePageKitProps {
+    shell: Omit<MarketingShellPageKitProps, "children">;
+    variant?: ServiceSuitePageKitVariant;
+    sectionOrder?: ServiceSuitePageKitSectionId[];
+    hero?: Omit<React.ComponentProps<typeof HeroBlock>, "variant">;
+    features?: React.ComponentProps<typeof FeatureBlock> | null;
+    process?: React.ComponentProps<typeof ProcessFlowBlock> | null;
+    team?: React.ComponentProps<typeof TeamBlock> | null;
+    testimonials?: React.ComponentProps<typeof TestimonialsBlock> | null;
+    faq?: React.ComponentProps<typeof FAQBlock> | null;
+    cta?: React.ComponentProps<typeof CallToActionBlock> | null;
+    className?: string;
+}
+export declare function ServiceSuitePageKit({ shell, variant, sectionOrder, hero, features, process, team, testimonials, faq, cta, className, }: ServiceSuitePageKitProps): import("react/jsx-runtime").JSX.Element;