@nswds/app 1.64.0 → 1.65.0

package/dist/globals.css

@@ -1055,6 +1055,9 @@
   .mt-8 {
     margin-top: calc(var(--spacing) * 8);
   }
+  .mt-10 {
+    margin-top: calc(var(--spacing) * 10);
+  }
   .mt-12 {
     margin-top: calc(var(--spacing) * 12);
   }

package/dist/index.cjs

@@ -13675,7 +13675,7 @@ function FormatToggle({ format, setFormat }) {
 
 // package.json
 var package_default = {
-  version: "1.63.0"};
+  version: "1.64.0"};
 function Heading({
   className,
   trim = "normal",
@@ -13912,7 +13912,7 @@ var heroBannerVariants = classVarianceAuthority.cva("relative", {
   variants: {
     variant: {
       "primary-800": "bg-primary-800 text-white",
-      "grey-200": "bg-grey-200 text-grey-900",
+      "grey-150": "bg-grey-150 text-grey-800",
       "accent-800": "bg-accent-800 text-white",
       "primary-200": "bg-primary-200 text-primary-800",
       white: "bg-white text-grey-800"
@@ -13928,12 +13928,50 @@ function HeroBannerSupportingImage({
   imgSrc,
   imgBgcolor,
   heading,
-  subtitle
+  subtitle,
+  primaryButton,
+  secondaryButton
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: heroBannerVariants({ variant }), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-7xl lg:grid lg:grid-cols-12 lg:gap-x-8 lg:px-8", children: [
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-6 pt-10 pb-24 sm:pb-32 lg:col-span-8 lg:px-0 lg:pt-24 lg:pb-28 xl:col-span-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-2xl lg:mx-0", children: [
       heading && /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "mt-24 text-4xl font-bold tracking-tight sm:mt-10 sm:text-6xl", children: heading }),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-6 text-lg leading-8", children: subtitle })
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-6 text-lg leading-8", children: subtitle }),
+      (primaryButton || secondaryButton) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-10 flex items-center gap-x-6", children: [
+        primaryButton && (primaryButton.href ? /* @__PURE__ */ jsxRuntime.jsx(
+          Button2,
+          {
+            href: primaryButton.href,
+            variant: primaryButton.variant,
+            color: primaryButton.color ?? void 0,
+            children: primaryButton.text
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
+          Button2,
+          {
+            onClick: primaryButton.onClick,
+            variant: primaryButton.variant,
+            color: primaryButton.color ?? void 0,
+            children: primaryButton.text
+          }
+        )),
+        secondaryButton && (secondaryButton.href ? /* @__PURE__ */ jsxRuntime.jsx(
+          Button2,
+          {
+            href: secondaryButton.href,
+            variant: secondaryButton.variant,
+            color: secondaryButton.color ?? void 0,
+            children: secondaryButton.text
+          }
+        ) : /* @__PURE__ */ jsxRuntime.jsx(
+          Button2,
+          {
+            onClick: secondaryButton.onClick,
+            variant: secondaryButton.variant,
+            color: secondaryButton.color ?? void 0,
+            children: secondaryButton.text
+          }
+        ))
+      ] })
     ] }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative lg:col-span-4 lg:-mr-8 xl:absolute xl:inset-0 xl:left-2/3 xl:mr-0", children: /* @__PURE__ */ jsxRuntime.jsx(
       Image2__default.default,
@@ -23705,7 +23743,7 @@ function PageHeading({
     children
   ] }) });
 }
-var buttonVariants3 = classVarianceAuthority.cva(
+var buttonVariants4 = classVarianceAuthority.cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
   {
     variants: {
@@ -23756,7 +23794,7 @@ function PaginationLink({ className, isActive, size = "icon", ...props }) {
       "data-slot": "pagination-link",
       "data-active": isActive,
       className: cn(
-        buttonVariants3({
+        buttonVariants4({
           variant: isActive ? "outline" : "ghost",
           size
         }),