@deriv-web-design/ui 0.1.8 → 0.1.10

package/dist/index.d.mts

@@ -667,9 +667,16 @@ interface HeaderProps extends HTMLAttributes<HTMLElement> {
      * The field always renders for that variant; this prop only customises it.
      */
     search?: HeaderSearchProps;
+    /**
+     * Set to `true` when the fixed `Navbar` is rendered above this header (it is
+     * the first section on the page). Reserves top clearance equal to the navbar's
+     * footprint so the vertically-centred title never slides under the fixed pill.
+     * Defaults to `false` — leave it off when there is no navbar above the header.
+     */
+    underNavbar?: boolean;
 }
 
-declare const Header: ({ variant, subtitle, title, description, primaryButton, secondaryButton, leftVisual, rightVisual, search, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
+declare const Header: ({ variant, subtitle, title, description, primaryButton, secondaryButton, leftVisual, rightVisual, search, underNavbar, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
 
 interface StatItem {
     /** Numeric or short display value, e.g. "2.5M+" */

package/dist/index.d.ts

@@ -667,9 +667,16 @@ interface HeaderProps extends HTMLAttributes<HTMLElement> {
      * The field always renders for that variant; this prop only customises it.
      */
     search?: HeaderSearchProps;
+    /**
+     * Set to `true` when the fixed `Navbar` is rendered above this header (it is
+     * the first section on the page). Reserves top clearance equal to the navbar's
+     * footprint so the vertically-centred title never slides under the fixed pill.
+     * Defaults to `false` — leave it off when there is no navbar above the header.
+     */
+    underNavbar?: boolean;
 }
 
-declare const Header: ({ variant, subtitle, title, description, primaryButton, secondaryButton, leftVisual, rightVisual, search, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
+declare const Header: ({ variant, subtitle, title, description, primaryButton, secondaryButton, leftVisual, rightVisual, search, underNavbar, className, ...props }: HeaderProps) => react_jsx_runtime.JSX.Element;
 
 interface StatItem {
     /** Numeric or short display value, e.g. "2.5M+" */

package/dist/index.js

@@ -2089,6 +2089,7 @@ var Header = ({
   leftVisual,
   rightVisual,
   search,
+  underNavbar = false,
   className,
   ...props
 }) => {
@@ -2135,7 +2136,7 @@ var Header = ({
     "section",
     {
       ref: sectionRef,
-      className: ["header", variantClass, className].filter(Boolean).join(" "),
+      className: ["header", variantClass, underNavbar && "header--under-navbar", className].filter(Boolean).join(" "),
       ...props,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "header__grid", "aria-hidden": "true" }),
@@ -5571,22 +5572,34 @@ var TrustpilotTestimonial = ({
             }
           ) }),
           items.length > 1 && (canPrev || canNext) && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "testimonial__tp-nav", children: [
-            canPrev && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
               "button",
               {
                 type: "button",
-                className: "testimonial__tp-nav-btn",
+                className: [
+                  "testimonial__tp-nav-btn",
+                  !canPrev ? "testimonial__tp-nav-btn--hidden" : ""
+                ].filter(Boolean).join(" "),
                 "aria-label": "Show previous testimonials",
+                "aria-hidden": !canPrev,
+                tabIndex: canPrev ? 0 : -1,
+                disabled: !canPrev,
                 onClick: () => scrollByCard(-1),
                 children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ArrowIcon, { direction: "prev" })
               }
             ),
-            canNext && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
               "button",
               {
                 type: "button",
-                className: "testimonial__tp-nav-btn",
+                className: [
+                  "testimonial__tp-nav-btn",
+                  !canNext ? "testimonial__tp-nav-btn--hidden" : ""
+                ].filter(Boolean).join(" "),
                 "aria-label": "Show next testimonials",
+                "aria-hidden": !canNext,
+                tabIndex: canNext ? 0 : -1,
+                disabled: !canNext,
                 onClick: () => scrollByCard(1),
                 children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ArrowIcon, { direction: "next" })
               }