@vadimcomanescu/nadicode-design-system 2.0.9 → 4.0.1

package/dist/chunk-MGSGCARB.js

@@ -0,0 +1,164 @@
+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 { 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 { 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/chunk-N3YFYMNZ.js

@@ -0,0 +1,73 @@
+import { LoginBlock } from './chunk-RGE5OQMZ.js';
+import { StaggerChildren } from './chunk-DQPK2XRL.js';
+import { Heading } from './chunk-WI547C47.js';
+import { siteConfig } from './chunk-A7NUWD76.js';
+import { AnimatedBackground } from './chunk-4GSFNJAJ.js';
+import { useMotionConfig, m, motionSpring } from './chunk-PD2YEH3H.js';
+import { SparklesIcon } from './chunk-CGUCH322.js';
+import { cn } from './chunk-QYZT24TS.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var FORM_ENTRANCE_Y = 12;
+var VISUAL_STAGGER_MS = 100;
+var defaultLabels = {
+  headline: "Build the future, faster.",
+  quote: "This library has saved me countless hours of work and helped me deliver stunning designs to my clients faster than ever before.",
+  quoteAttribution: "Sofia Davis, Lead Engineer"
+};
+function AuthLayout({
+  mode = "login",
+  action,
+  error,
+  googleAction,
+  labels: userLabels,
+  className
+}) {
+  const motionConfig = useMotionConfig();
+  const labels = { ...defaultLabels, ...userLabels };
+  return /* @__PURE__ */ jsxs("div", { className: cn("w-full min-h-dvh lg:h-dvh lg:min-h-[800px] grid lg:grid-cols-2 overflow-hidden bg-background", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "hidden lg:flex relative h-full w-full flex-col bg-muted text-overlay-foreground dark:border-r border-border/50", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-surface-active" }),
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx(AnimatedBackground, {}) }),
+      /* @__PURE__ */ jsxs("div", { className: "relative z-20 flex items-center text-lg font-medium p-8", children: [
+        /* @__PURE__ */ jsx(SparklesIcon, { size: 24, className: "mr-2 text-accent" }),
+        siteConfig.name
+      ] }),
+      /* @__PURE__ */ jsxs(StaggerChildren, { staggerMs: VISUAL_STAGGER_MS, className: "relative z-20 m-auto max-w-lg text-center space-y-4", children: [
+        /* @__PURE__ */ jsx(Heading, { level: 2, size: "display", className: "font-bold bg-clip-text text-transparent bg-gradient-to-b from-overlay-foreground to-overlay-foreground/60 relative", children: labels.headline }),
+        /* @__PURE__ */ jsxs("blockquote", { className: "text-lg text-text-tertiary relative", children: [
+          /* @__PURE__ */ jsxs("p", { children: [
+            '"',
+            labels.quote,
+            '"'
+          ] }),
+          /* @__PURE__ */ jsx("footer", { className: "mt-2 text-sm", children: labels.quoteAttribution })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center p-8 bg-background relative overflow-y-auto", children: [
+      /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-t from-background via-background to-accent/5 pointer-events-none" }),
+      /* @__PURE__ */ jsx(
+        m.div,
+        {
+          initial: { opacity: 0, y: FORM_ENTRANCE_Y },
+          animate: { opacity: 1, y: 0 },
+          transition: { ...motionSpring.gentle, ...motionConfig },
+          className: "relative z-10 w-full max-w-sm",
+          children: /* @__PURE__ */ jsx(
+            LoginBlock,
+            {
+              className: "w-full",
+              type: mode === "signup" ? "signup" : "login",
+              action,
+              error,
+              googleAction
+            }
+          )
+        }
+      )
+    ] })
+  ] });
+}
+
+export { AuthLayout };

package/dist/{chunk-DSMGCFMJ.js → chunk-POFFOUQW.js}

@@ -5,10 +5,7 @@ import { createPortal } from 'react-dom';
 import { useReducedMotion, useMotionValue, useMotionTemplate } from 'motion/react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
-function getAccentColor() {
-  if (typeof window === "undefined") return "10 158 111";
-  return getComputedStyle(document.documentElement).getPropertyValue("--color-accent").trim() || "10 158 111";
-}
+var CSS_ACCENT_095 = "rgb(var(--color-accent) / 0.95)";
 function MouseGlow({
   className,
   dotColor = "rgba(255, 255, 255, 0.5)",
@@ -20,7 +17,7 @@ function MouseGlow({
   const containerRef = React.useRef(null);
   const overlayRef = React.useRef(null);
   const [mounted, setMounted] = React.useState(false);
-  const resolvedOverlayColor = overlayColor ?? `rgba(${getAccentColor().replace(/ /g, ", ")}, 0.95)`;
+  const resolvedOverlayColor = overlayColor ?? CSS_ACCENT_095;
   React.useEffect(() => {
     setMounted(true);
     const handleMouseMove = (e) => {

package/dist/chunk-Q5IYBNA7.js

@@ -0,0 +1,56 @@
+import { Heading } from './chunk-WI547C47.js';
+import { Card, CardHeader, CardContent } from './chunk-AH6YSYYT.js';
+import { ZapIcon } from './chunk-FLF5AMNO.js';
+import { SparklesIcon } from './chunk-CGUCH322.js';
+import { SettingsIcon } from './chunk-OITJWGFV.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var defaultFeatures = [
+  {
+    title: "Customizable",
+    description: "Extensive customization options, allowing you to tailor every aspect to meet your specific needs.",
+    icon: /* @__PURE__ */ jsx(ZapIcon, { size: 24, "aria-hidden": true })
+  },
+  {
+    title: "You have full control",
+    description: "From design elements to functionality, you have complete control to create a unique and personalized experience.",
+    icon: /* @__PURE__ */ jsx(SettingsIcon, { size: 24, "aria-hidden": true })
+  },
+  {
+    title: "Powered By AI",
+    description: "Elements to functionality, you have complete control to create a unique experience.",
+    icon: /* @__PURE__ */ jsx(SparklesIcon, { size: 24, "aria-hidden": true })
+  }
+];
+function FeatureGridBlock({
+  title = "Built to cover your needs",
+  description = "Libero sapiente aliquam quibusdam aspernatur, praesentium iusto repellendus.",
+  features = defaultFeatures,
+  className
+} = {}) {
+  return /* @__PURE__ */ jsx("section", { className: className ?? "bg-background py-16 md:py-32 dark:bg-transparent", children: /* @__PURE__ */ jsxs("div", { className: "@container mx-auto max-w-5xl px-6", children: [
+    /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
+      /* @__PURE__ */ jsx(Heading, { level: 2, size: "section", className: "text-4xl lg:text-5xl", children: title }),
+      /* @__PURE__ */ jsx("p", { className: "mt-4", children: description })
+    ] }),
+    /* @__PURE__ */ jsx(Card, { className: "lg:max-w-full lg:grid-cols-3 lg:divide-x lg:divide-y-0 mx-auto mt-8 grid max-w-sm divide-y overflow-hidden shadow-sm *:text-center md:mt-16", children: features.map((feature, i) => /* @__PURE__ */ jsxs("div", { className: "group shadow-sm", children: [
+      /* @__PURE__ */ jsxs(CardHeader, { className: "pb-4", children: [
+        /* @__PURE__ */ jsx(CardDecorator, { children: feature.icon }),
+        /* @__PURE__ */ jsx(Heading, { level: 3, size: "title", className: "mt-6 font-medium", children: feature.title })
+      ] }),
+      /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("p", { className: "mt-4 text-sm", children: feature.description }) })
+    ] }, i)) })
+  ] }) });
+}
+var CardDecorator = ({ children }) => /* @__PURE__ */ jsxs("div", { className: "mask-radial-from-40% mask-radial-to-60% relative mx-auto size-36 duration-200 [--color-border:color-mix(in_oklab,var(--color-text-primary)10%,transparent)] group-hover:[--color-border:color-mix(in_oklab,var(--color-text-primary)20%,transparent)] dark:[--color-border:color-mix(in_oklab,var(--color-text-primary)15%,transparent)] dark:group-hover:[--color-border:color-mix(in_oklab,var(--color-text-primary)20%,transparent)]", children: [
+  /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-hidden": true,
+      className: "absolute inset-0 bg-[linear-gradient(to_right,var(--color-border)_1px,transparent_1px),linear-gradient(to_bottom,var(--color-border)_1px,transparent_1px)] bg-[size:24px_24px] dark:opacity-50"
+    }
+  ),
+  /* @__PURE__ */ jsx("div", { className: "bg-background absolute inset-0 m-auto flex size-12 items-center justify-center border-l border-t", children })
+] });
+
+export { FeatureGridBlock };

package/dist/chunk-QJCE7NZF.js

@@ -0,0 +1,85 @@
+import { useSidebar, SidebarMenu, SidebarMenuItem, SidebarMenuButton } from './chunk-J2DCQDXO.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuGroup, DropdownMenuItem } from './chunk-CQEUNASC.js';
+import { Avatar, AvatarImage, AvatarFallback } from './chunk-NAAU5IWU.js';
+import { ChevronsUpDownIcon } from './chunk-SW6QPJM4.js';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function getInitials(name) {
+  return name.split(" ").map((n) => n[0]).join("").toUpperCase().slice(0, 2);
+}
+var EMPTY_ITEMS = [];
+function NavUser({ user, items = EMPTY_ITEMS, footer }) {
+  const { isMobile } = useSidebar();
+  const initials = getInitials(user.name);
+  return /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      SidebarMenuButton,
+      {
+        size: "lg",
+        className: "data-[state=open]:bg-surface-hover",
+        children: [
+          /* @__PURE__ */ jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+            user.avatar && /* @__PURE__ */ jsx(AvatarImage, { src: user.avatar, alt: user.name }),
+            /* @__PURE__ */ jsx(AvatarFallback, { className: "rounded-lg text-xs", children: initials })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight min-w-0", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-text-primary", children: user.name }),
+            /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-text-tertiary", children: user.email })
+          ] }),
+          /* @__PURE__ */ jsx(
+            ChevronsUpDownIcon,
+            {
+              size: 16,
+              className: "ml-auto text-text-tertiary"
+            }
+          )
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(
+      DropdownMenuContent,
+      {
+        className: "w-[var(--radix-dropdown-menu-trigger-width)] min-w-56 rounded-lg",
+        side: isMobile ? "bottom" : "right",
+        align: "end",
+        sideOffset: 4,
+        children: [
+          /* @__PURE__ */ jsx(DropdownMenuLabel, { className: "p-0 font-normal", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-1.5 py-1.5", children: [
+            /* @__PURE__ */ jsxs(Avatar, { className: "h-8 w-8 rounded-lg", children: [
+              user.avatar && /* @__PURE__ */ jsx(AvatarImage, { src: user.avatar, alt: user.name }),
+              /* @__PURE__ */ jsx(AvatarFallback, { className: "rounded-lg text-xs", children: initials })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight min-w-0", children: [
+              /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-text-primary", children: user.name }),
+              /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-text-tertiary", children: user.email })
+            ] })
+          ] }) }),
+          items.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ jsx(DropdownMenuGroup, { children: items.map((item) => /* @__PURE__ */ jsx(
+              DropdownMenuItem,
+              {
+                asChild: !!item.href,
+                onClick: item.onClick,
+                children: item.href ? /* @__PURE__ */ jsxs("a", { href: item.href, children: [
+                  item.icon,
+                  item.label
+                ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  item.icon,
+                  item.label
+                ] })
+              },
+              item.label
+            )) })
+          ] }),
+          !!footer && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+            footer
+          ] })
+        ]
+      }
+    )
+  ] }) }) });
+}
+
+export { NavUser };

package/dist/chunk-QW5II6YK.js

@@ -0,0 +1,96 @@
+import { MarketingShellPageKit } from './chunk-Z233ZQZE.js';
+import { TeamBlock } from './chunk-VBZQ4DBE.js';
+import { ContactBlock } from './chunk-U4GYSYGN.js';
+import { FAQBlock } from './chunk-NEHCPO53.js';
+import { CallToActionBlock } from './chunk-GJPTPLCQ.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { Card, CardHeader, CardTitle, CardContent } from './chunk-AH6YSYYT.js';
+import { cn } from './chunk-QYZT24TS.js';
+import React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var DEFAULT_SECTION_ORDER = [
+  "narrative",
+  "team",
+  "contact",
+  "faq",
+  "cta"
+];
+var DEFAULTS_BY_VARIANT = {
+  "company-about": {
+    narrative: {
+      title: "Built by practitioners who ship with contracts first.",
+      description: "We partner with teams that need high-quality interfaces and predictable release confidence."
+    },
+    team: {
+      title: "Leadership team"
+    },
+    contact: null,
+    faq: {},
+    cta: {
+      title: "Interested in working together?",
+      description: "Share your route goals and we will propose a rollout plan.",
+      primaryAction: { label: "Talk to us", href: "/contact" }
+    }
+  },
+  "company-contact": {
+    narrative: {
+      title: "Talk to our delivery team",
+      description: "Tell us what you are building, we will recommend an implementation path."
+    },
+    team: null,
+    contact: {
+      title: "Contact request",
+      description: "We respond within one business day.",
+      submitLabel: "Send request"
+    },
+    faq: {},
+    cta: {
+      title: "Prefer self-serve?",
+      description: "Start with our templates and scale with support as needed.",
+      primaryAction: { label: "View templates", href: "/templates" }
+    }
+  }
+};
+var SECTION_CLASS = "mx-auto w-full max-w-6xl px-6";
+function normalizeSectionOrder(sectionOrder) {
+  if (!sectionOrder || sectionOrder.length === 0) {
+    return DEFAULT_SECTION_ORDER;
+  }
+  return [...new Set(sectionOrder)];
+}
+function CompanySuitePageKit({
+  shell,
+  variant = "company-about",
+  sectionOrder,
+  narrative,
+  team,
+  contact,
+  faq,
+  cta,
+  className
+}) {
+  const defaults = DEFAULTS_BY_VARIANT[variant];
+  const resolvedNarrative = narrative ?? defaults.narrative ?? { title: "Company overview" };
+  const resolvedTeam = team === void 0 ? defaults.team : team;
+  const resolvedContact = contact === void 0 ? defaults.contact : contact;
+  const resolvedFaq = faq === void 0 ? defaults.faq : faq;
+  const resolvedCta = cta === void 0 ? defaults.cta : cta;
+  const orderedSections = normalizeSectionOrder(sectionOrder);
+  const sectionById = {
+    narrative: resolvedNarrative === null ? null : /* @__PURE__ */ jsx("section", { "data-testid": "company-section-narrative", className: SECTION_CLASS, children: /* @__PURE__ */ jsxs(Card, { children: [
+      /* @__PURE__ */ jsx(CardHeader, { children: /* @__PURE__ */ jsx(CardTitle, { children: resolvedNarrative.title }) }),
+      /* @__PURE__ */ jsxs(CardContent, { className: "space-y-3", children: [
+        resolvedNarrative.description ? /* @__PURE__ */ jsx(Typography, { variant: "muted", children: resolvedNarrative.description }) : null,
+        resolvedNarrative.content ? /* @__PURE__ */ jsx("div", { children: resolvedNarrative.content }) : null
+      ] })
+    ] }) }),
+    team: resolvedTeam === null ? null : /* @__PURE__ */ jsx("section", { "data-testid": "company-section-team", className: SECTION_CLASS, children: /* @__PURE__ */ jsx(TeamBlock, { ...resolvedTeam }) }),
+    contact: resolvedContact === null ? null : /* @__PURE__ */ jsx("section", { "data-testid": "company-section-contact", className: SECTION_CLASS, children: /* @__PURE__ */ jsx(ContactBlock, { ...resolvedContact }) }),
+    faq: resolvedFaq === null ? null : /* @__PURE__ */ jsx("section", { "data-testid": "company-section-faq", className: SECTION_CLASS, children: /* @__PURE__ */ jsx(FAQBlock, { ...resolvedFaq }) }),
+    cta: resolvedCta === null ? null : /* @__PURE__ */ jsx("section", { "data-testid": "company-section-cta", className: cn(SECTION_CLASS, "pb-16"), children: /* @__PURE__ */ jsx(CallToActionBlock, { ...resolvedCta }) })
+  };
+  return /* @__PURE__ */ jsx(MarketingShellPageKit, { ...shell, children: /* @__PURE__ */ jsx("div", { className: cn("space-y-10 pb-10", className), children: orderedSections.map((sectionId) => /* @__PURE__ */ jsx(React.Fragment, { children: sectionById[sectionId] }, sectionId)) }) });
+}
+
+export { CompanySuitePageKit };

package/dist/chunk-RMGDDOCD.js

@@ -0,0 +1,138 @@
+import { MarketingShellPageKit } from './chunk-Z233ZQZE.js';
+import { PricingBlock } from './chunk-VNNAL4A6.js';
+import { FAQBlock } from './chunk-NEHCPO53.js';
+import { CallToActionBlock } from './chunk-GJPTPLCQ.js';
+import { ComparisonBlock } from './chunk-VZCB4APK.js';
+import { Typography } from './chunk-N53OMWW2.js';
+import { Heading } from './chunk-WI547C47.js';
+import { Card, CardHeader, CardTitle, CardContent } from './chunk-AH6YSYYT.js';
+import { Button } from './chunk-7KIDDF3I.js';
+import { Badge } from './chunk-S4JAHKOP.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 };