@timmbr/ui 1.2.0 → 1.3.1

package/dist/components/NavHeader/subcomponents/NavMobileTabSlider.js

@@ -0,0 +1,111 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { motion } from '@timmbr/motion';
+import { cn } from '@timmbr/utils';
+import { mobileTabItemVariants, mobileTabSliderVariants } from '../NavHeader.styles.js';
+import { resolveNavDestination, isCrossZoneNavigation } from '../NavHeader.helpers.js';
+import { useTimmbrConfig } from '../../../providers/TimmbrConfigProvider.js';
+
+const NavMobileTabSlider = ({
+  items,
+  activeItemId,
+  onItemClick,
+  shouldAnimate = true,
+  motionClass,
+  linkComponent: CustomLink
+}) => {
+  const config = useTimmbrConfig();
+  const activeTabRef = React.useRef(null);
+  React.useEffect(() => {
+    if (activeTabRef.current && typeof activeTabRef.current.scrollIntoView === "function") {
+      activeTabRef.current.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest",
+        inline: "center"
+      });
+    }
+  }, [activeItemId]);
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      "aria-label": "Category Navigation",
+      className: cn(mobileTabSliderVariants(), motionClass),
+      "data-slot": "nav-mobile-tab-slider",
+      children: items.map((item) => {
+        const isActive = activeItemId === item.id;
+        const resolvedHref = resolveNavDestination(item.href, item.zone, config.zones?.zones);
+        const requiresCrossZone = isCrossZoneNavigation(item.zone, config.zones?.currentZone, item.crossZone);
+        const ariaLabelText = item.ariaLabel ?? (typeof item.label === "string" ? item.label : void 0);
+        const tabIndicator = isActive && shouldAnimate ? /* @__PURE__ */ jsx(
+          motion.div,
+          {
+            layoutId: "active-mobile-tab-indicator",
+            className: "absolute bottom-0 left-0 right-0 h-[2.5px] bg-[#C0643A] rounded-full",
+            transition: { type: "spring", stiffness: 380, damping: 30 }
+          }
+        ) : isActive ? /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 left-0 right-0 h-[2.5px] bg-[#C0643A] rounded-full" }) : null;
+        if (resolvedHref && !item.content && !item.disabled) {
+          if (CustomLink && !requiresCrossZone) {
+            return /* @__PURE__ */ jsxs(
+              CustomLink,
+              {
+                ref: isActive ? activeTabRef : void 0,
+                href: resolvedHref,
+                role: "tab",
+                "aria-selected": isActive,
+                "aria-label": ariaLabelText,
+                className: cn(mobileTabItemVariants({ active: isActive, disabled: item.disabled }), item.className),
+                onClick: () => onItemClick(item.id, item),
+                children: [
+                  /* @__PURE__ */ jsx("span", { children: item.label }),
+                  tabIndicator
+                ]
+              },
+              item.id
+            );
+          }
+          return /* @__PURE__ */ jsxs(
+            "a",
+            {
+              ref: isActive ? activeTabRef : void 0,
+              href: resolvedHref,
+              role: "tab",
+              "aria-selected": isActive,
+              "aria-label": ariaLabelText,
+              "data-cross-zone": requiresCrossZone ? "true" : void 0,
+              className: cn(mobileTabItemVariants({ active: isActive, disabled: item.disabled }), item.className),
+              onClick: () => onItemClick(item.id, item),
+              children: [
+                /* @__PURE__ */ jsx("span", { children: item.label }),
+                tabIndicator
+              ]
+            },
+            item.id
+          );
+        }
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: isActive ? activeTabRef : void 0,
+            type: "button",
+            role: "tab",
+            "aria-selected": isActive,
+            "aria-expanded": isActive,
+            "aria-label": ariaLabelText,
+            disabled: item.disabled,
+            onClick: () => onItemClick(item.id, item),
+            className: cn(mobileTabItemVariants({ active: isActive, disabled: item.disabled }), item.className),
+            children: [
+              /* @__PURE__ */ jsx("span", { children: item.label }),
+              tabIndicator
+            ]
+          },
+          item.id
+        );
+      })
+    }
+  );
+};
+
+export { NavMobileTabSlider };

package/dist/components/NavHeader/subcomponents/NavSearch.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import type { NavSearchConfig } from '../NavHeader.types';
+export interface NavSearchProps {
+    config?: NavSearchConfig | boolean;
+    isOpen: boolean;
+    onOpenChange: (open: boolean) => void;
+    value: string;
+    onChange: (value: string) => void;
+    onSubmit: (query: string) => void;
+    shouldAnimate?: boolean;
+    motionClass?: string;
+    linkComponent?: React.ComponentType<any>;
+}
+export declare const NavSearch: React.FC<NavSearchProps>;
+//# sourceMappingURL=NavSearch.d.ts.map

package/dist/components/NavHeader/subcomponents/NavSearch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavSearch.d.ts","sourceRoot":"","sources":["../../../../src/components/NavHeader/subcomponents/NavSearch.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,eAAe,EAAoB,MAAM,oBAAoB,CAAC;AAG5E,MAAM,WAAW,cAAc;IAC7B,MAAM,CAAC,EAAE,eAAe,GAAG,OAAO,CAAC;IACnC,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;CAC1C;AAaD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAmO9C,CAAC"}

package/dist/components/NavHeader/subcomponents/NavSearch.js

@@ -0,0 +1,222 @@
+"use client";
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { AnimatePresence, motion } from '@timmbr/motion';
+import { Search, X, TrendingUp } from '@timmbr/icons';
+import { cn } from '@timmbr/utils';
+import { navActionVariants, searchPopoverCardVariants } from '../NavHeader.styles.js';
+import { resolveNavDestination, isCrossZoneNavigation } from '../NavHeader.helpers.js';
+import { useTimmbrConfig } from '../../../providers/TimmbrConfigProvider.js';
+
+const defaultPopularSearches = [
+  { id: "1", label: "Centre Tables" },
+  { id: "2", label: "TV Units" },
+  { id: "3", label: "bed" },
+  { id: "4", label: "bedsheet" },
+  { id: "5", label: "mirror" },
+  { id: "6", label: "office chair" },
+  { id: "7", label: "shoe rack" },
+  { id: "8", label: "sofa cum bed" }
+];
+const NavSearch = ({
+  config,
+  isOpen,
+  onOpenChange,
+  value,
+  onChange,
+  onSubmit,
+  shouldAnimate = true,
+  motionClass,
+  linkComponent: CustomLink
+}) => {
+  const globalConfig = useTimmbrConfig();
+  const searchConfig = typeof config === "object" ? config : {};
+  const {
+    placeholder = "Search for furniture, decor, and more...",
+    popoverContent,
+    popularSearches = defaultPopularSearches,
+    popularSearchesTitle = "Popular Searches",
+    onPopularSearchClick,
+    ariaLabel = "Search store products"
+  } = searchConfig;
+  const [showPopover, setShowPopover] = React.useState(false);
+  const containerRef = React.useRef(null);
+  const inputRef = React.useRef(null);
+  React.useEffect(() => {
+    if (isOpen) {
+      inputRef.current?.focus();
+      setShowPopover(true);
+    } else {
+      setShowPopover(false);
+    }
+  }, [isOpen]);
+  React.useEffect(() => {
+    if (!isOpen) return;
+    const handleClickOutside = (e) => {
+      if (containerRef.current && !containerRef.current.contains(e.target)) {
+        setShowPopover(false);
+        if (!value.trim()) {
+          onOpenChange(false);
+        }
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [isOpen, value, onOpenChange]);
+  const handleToggle = () => {
+    const nextState = !isOpen;
+    onOpenChange(nextState);
+    if (nextState) {
+      setShowPopover(true);
+    }
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      onSubmit(value);
+      setShowPopover(false);
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      setShowPopover(false);
+      onOpenChange(false);
+    }
+  };
+  const handleTagClick = (tag) => {
+    onChange(tag.label);
+    onPopularSearchClick?.(tag);
+    tag.onClick?.(tag);
+    onSubmit(tag.label);
+    setShowPopover(false);
+  };
+  return /* @__PURE__ */ jsxs("div", { ref: containerRef, className: "relative flex items-center", "data-slot": "nav-search-container", children: [
+    !isOpen && /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: handleToggle,
+        "aria-label": "Open search bar",
+        "aria-expanded": isOpen,
+        className: navActionVariants({ active: isOpen }),
+        "data-slot": "nav-search-trigger",
+        children: [
+          /* @__PURE__ */ jsx(Search, { size: 22, className: "shrink-0 stroke-[1.8]" }),
+          /* @__PURE__ */ jsx("span", { className: "font-sans font-bold text-[10px] tracking-[0.0926em] uppercase", children: "SEARCH" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: isOpen && /* @__PURE__ */ jsxs(
+      motion.div,
+      {
+        initial: shouldAnimate ? { width: 0, opacity: 0 } : false,
+        animate: shouldAnimate ? { width: 350, opacity: 1 } : void 0,
+        exit: shouldAnimate ? { width: 0, opacity: 0 } : void 0,
+        transition: { duration: 0.28, ease: [0.25, 1, 0.5, 1] },
+        className: cn("relative flex flex-col", !shouldAnimate && "transition-none", motionClass),
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "relative flex items-center w-full h-10 bg-white border border-grey-300 rounded-full shadow-sm focus-within:ring-2 focus-within:ring-[#C0643A]/30 focus-within:border-[#C0643A] overflow-hidden", children: [
+            /* @__PURE__ */ jsx(
+              Search,
+              {
+                size: 18,
+                className: "absolute left-3.5 top-1/2 -translate-y-1/2 text-grey-500 pointer-events-none shrink-0"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: inputRef,
+                type: "text",
+                role: "searchbox",
+                autoComplete: "off",
+                value,
+                placeholder,
+                "aria-label": ariaLabel,
+                onChange: (e) => onChange(e.target.value),
+                onFocus: () => setShowPopover(true),
+                onKeyDown: handleKeyDown,
+                className: "w-full h-full pl-10 pr-9 bg-transparent text-sm text-[#1A1A1A] placeholder:text-grey-400 border-none focus:outline-none [&::-webkit-search-cancel-button]:hidden [&::-webkit-search-decoration]:hidden",
+                "data-slot": "nav-search-input"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  if (value) {
+                    onChange("");
+                  } else {
+                    onOpenChange(false);
+                  }
+                },
+                "aria-label": "Close search",
+                className: "absolute right-2.5 top-1/2 -translate-y-1/2 p-1 text-grey-400 hover:text-grey-700 rounded-full hover:bg-grey-100 transition-colors shrink-0",
+                children: /* @__PURE__ */ jsx(X, { size: 15 })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: showPopover && /* @__PURE__ */ jsx(
+            motion.div,
+            {
+              initial: shouldAnimate ? { opacity: 0, y: 4 } : false,
+              animate: shouldAnimate ? { opacity: 1, y: 0 } : void 0,
+              exit: shouldAnimate ? { opacity: 0, y: 4 } : void 0,
+              transition: { duration: 0.18, ease: [0.25, 1, 0.5, 1] },
+              className: cn(searchPopoverCardVariants(), !shouldAnimate && "transition-none", motionClass),
+              "data-slot": "nav-search-popover",
+              children: popoverContent ? popoverContent : /* @__PURE__ */ jsxs("div", { children: [
+                popularSearchesTitle && /* @__PURE__ */ jsx("h4", { className: "font-sans font-bold text-sm tracking-wide text-[#E11D48] mb-3 uppercase flex items-center gap-1.5", children: /* @__PURE__ */ jsx("span", { children: popularSearchesTitle }) }),
+                /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-2", children: popularSearches.map((tag, idx) => {
+                  const resolvedTagHref = resolveNavDestination(tag.href, tag.zone, globalConfig.zones?.zones);
+                  const requiresCrossZone = isCrossZoneNavigation(tag.zone, globalConfig.zones?.currentZone);
+                  const tagContent = /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx(TrendingUp, { size: 13, className: "text-grey-500 shrink-0" }),
+                    /* @__PURE__ */ jsx("span", { children: tag.label })
+                  ] });
+                  const tagClass = "inline-flex items-center gap-1.5 px-3 py-1.5 rounded-lg border border-grey-200 bg-white hover:border-grey-400 hover:bg-grey-50 text-xs font-medium text-grey-800 transition-all cursor-pointer";
+                  if (resolvedTagHref) {
+                    if (CustomLink && !requiresCrossZone) {
+                      return /* @__PURE__ */ jsx(
+                        CustomLink,
+                        {
+                          href: resolvedTagHref,
+                          className: tagClass,
+                          onClick: () => handleTagClick(tag),
+                          children: tagContent
+                        },
+                        tag.id ?? idx
+                      );
+                    }
+                    return /* @__PURE__ */ jsx(
+                      "a",
+                      {
+                        href: resolvedTagHref,
+                        "data-cross-zone": requiresCrossZone ? "true" : void 0,
+                        className: tagClass,
+                        onClick: () => handleTagClick(tag),
+                        children: tagContent
+                      },
+                      tag.id ?? idx
+                    );
+                  }
+                  return /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      type: "button",
+                      onClick: () => handleTagClick(tag),
+                      className: tagClass,
+                      children: tagContent
+                    },
+                    tag.id ?? idx
+                  );
+                }) })
+              ] })
+            }
+          ) })
+        ]
+      }
+    ) })
+  ] });
+};
+
+export { NavSearch };

package/dist/components/NavHeader/subcomponents/OfferBanner.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import type { OfferBannerConfig } from '../NavHeader.types';
+export interface OfferBannerProps {
+    banner?: OfferBannerConfig | React.ReactNode | boolean;
+    show?: boolean;
+    shouldAnimate?: boolean;
+    motionClass?: string;
+    linkComponent?: React.ComponentType<any>;
+}
+export declare const OfferBanner: React.FC<OfferBannerProps>;
+//# sourceMappingURL=OfferBanner.d.ts.map

package/dist/components/NavHeader/subcomponents/OfferBanner.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OfferBanner.d.ts","sourceRoot":"","sources":["../../../../src/components/NavHeader/subcomponents/OfferBanner.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAG5D,MAAM,WAAW,gBAAgB;IAC/B,MAAM,CAAC,EAAE,iBAAiB,GAAG,KAAK,CAAC,SAAS,GAAG,OAAO,CAAC;IACvD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;CAC1C;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAmGlD,CAAC"}

package/dist/components/NavHeader/subcomponents/OfferBanner.js

@@ -0,0 +1,92 @@
+"use client";
+import { jsx, jsxs } from 'react/jsx-runtime';
+import * as React from 'react';
+import { AnimatePresence, motion, collapseVariants, getTransition } from '@timmbr/motion';
+import { X } from '@timmbr/icons';
+import { cn } from '@timmbr/utils';
+import { offerBannerVariants } from '../NavHeader.styles.js';
+import { resolveNavDestination, isCrossZoneNavigation } from '../NavHeader.helpers.js';
+import { useTimmbrConfig } from '../../../providers/TimmbrConfigProvider.js';
+
+const OfferBanner = ({
+  banner,
+  show = true,
+  shouldAnimate = true,
+  motionClass,
+  linkComponent: CustomLink
+}) => {
+  const [dismissed, setDismissed] = React.useState(false);
+  const config = useTimmbrConfig();
+  if (!show || banner === false || banner === null || banner === void 0 || dismissed) {
+    return null;
+  }
+  if (React.isValidElement(banner) || typeof banner === "string" || typeof banner === "number") {
+    return /* @__PURE__ */ jsx("div", { className: offerBannerVariants(), "data-slot": "nav-offer-banner", children: banner });
+  }
+  const bannerConfig = banner;
+  const { content, href, zone, crossZone, dismissible = false, onDismiss, action, className } = bannerConfig;
+  const resolvedHref = resolveNavDestination(href, zone, config.zones?.zones);
+  const requiresCrossZone = isCrossZoneNavigation(zone, config.zones?.currentZone, crossZone);
+  const handleDismiss = (e) => {
+    e.stopPropagation();
+    setDismissed(true);
+    onDismiss?.();
+  };
+  const renderContent = () => {
+    if (resolvedHref) {
+      if (CustomLink && !requiresCrossZone) {
+        return /* @__PURE__ */ jsxs(CustomLink, { href: resolvedHref, className: "hover:underline flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { children: content }),
+          action && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action })
+        ] });
+      }
+      return /* @__PURE__ */ jsxs(
+        "a",
+        {
+          href: resolvedHref,
+          "data-cross-zone": requiresCrossZone ? "true" : void 0,
+          className: "hover:underline flex items-center gap-2",
+          children: [
+            /* @__PURE__ */ jsx("span", { children: content }),
+            action && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action })
+          ]
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx("span", { children: content }),
+      action && /* @__PURE__ */ jsx("span", { className: "ml-2", children: action })
+    ] });
+  };
+  return /* @__PURE__ */ jsx(AnimatePresence, { initial: false, children: !dismissed && /* @__PURE__ */ jsxs(
+    motion.div,
+    {
+      initial: shouldAnimate ? "visible" : false,
+      exit: shouldAnimate ? "exit" : void 0,
+      variants: shouldAnimate ? collapseVariants : void 0,
+      transition: getTransition("fast"),
+      "data-slot": "nav-offer-banner",
+      className: cn(
+        offerBannerVariants(),
+        !shouldAnimate && "transition-none",
+        motionClass,
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center w-full px-8 text-center", children: renderContent() }),
+        dismissible && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: handleDismiss,
+            "aria-label": "Dismiss offer banner",
+            className: "absolute right-3 top-1/2 -translate-y-1/2 p-1 text-[#F7F1E6]/70 hover:text-[#F7F1E6] hover:bg-white/10 rounded transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-white",
+            children: /* @__PURE__ */ jsx(X, { size: 14 })
+          }
+        )
+      ]
+    }
+  ) });
+};
+
+export { OfferBanner };

package/dist/index.d.ts

@@ -24,6 +24,7 @@ export * from './components/Toast';
 export * from './components/Tooltip';
 export * from './components/Tabs';
 export * from './components/SideBarNavigation';
+export * from './components/NavHeader';
 export * from './components/Button';
 export * from './components/LinkButton';
 export * from './components/Accordion';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,gBAAgB,CAAC;AAG/B,cAAc,aAAa,CAAC;AAG5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gCAAgC,CAAC;AAG/C,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AAGxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,gBAAgB,CAAC;AAG/B,cAAc,aAAa,CAAC;AAG5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,0BAA0B,CAAC;AACzC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,wBAAwB,CAAC;AAGvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,mBAAmB,CAAC;AAClC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC;AACrC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC;AACrC,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AAGxC,cAAc,oBAAoB,CAAC;AACnC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC"}

package/dist/index.js

@@ -22,6 +22,7 @@ export { EmptyState } from './components/EmptyState/EmptyState.js';
 export { FilmIcon, ImageIcon, PlayIcon, UploadCloudIcon } from './components/ImageUpload/subcomponents/ImageUploadIcons.js';
 export { FormField } from './components/FormField/FormField.js';
 export { Grid } from './components/Grid/Grid.js';
+export { Header, NavHeader } from './components/NavHeader/NavHeader.js';
 export { Heading } from './components/Heading/Heading.js';
 export { Icon } from './components/Icon/Icon.js';
 export { ImageUpload } from './components/ImageUpload/ImageUpload.js';
@@ -34,6 +35,12 @@ export { Input } from './components/Input/Input.js';
 export { Label } from './components/Label/Label.js';
 export { LinkButton } from './components/LinkButton/LinkButton.js';
 export { List, ListItem, ListItemAction, ListItemIcon, ListItemText } from './components/List/List.js';
+export { NavActions } from './components/NavHeader/subcomponents/NavActions.js';
+export { NavBrand } from './components/NavHeader/subcomponents/NavBrand.js';
+export { NavItems } from './components/NavHeader/subcomponents/NavItems.js';
+export { NavMegaMenu } from './components/NavHeader/subcomponents/NavMegaMenu.js';
+export { NavSearch } from './components/NavHeader/subcomponents/NavSearch.js';
+export { OfferBanner } from './components/NavHeader/subcomponents/OfferBanner.js';
 export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from './components/Pagination/Pagination.js';
 export { Popover, PopoverAnchor, PopoverClose, PopoverContent, PopoverTrigger } from './components/Popover/Popover.js';
 export { Progress } from './components/Progress/Progress.js';
@@ -90,6 +97,7 @@ export { inputFieldVariants, inputWrapperVariants } from './components/Input/Inp
 export { labelVariants } from './components/Label/Label.styles.js';
 export { linkButtonVariants } from './components/LinkButton/LinkButton.styles.js';
 export { listItemActionVariants, listItemIconVariants, listItemTextVariants, listItemVariants, listVariants } from './components/List/List.styles.js';
+export { megaMenuCardVariants, navActionVariants, navHeaderContainerVariants, navHeaderItemVariants, navHeaderVariants, offerBannerVariants, searchPopoverCardVariants } from './components/NavHeader/NavHeader.styles.js';
 export { navBadgeVariants, navItemVariants, sidebarContainerVariants, sidebarToggleVariants, subItemVariants } from './components/SideBarNavigation/SideBarNavigation.styles.js';
 export { paginationLinkVariants } from './components/Pagination/Pagination.styles.js';
 export { popoverContentVariants } from './components/Popover/Popover.styles.js';
@@ -109,3 +117,4 @@ export { textareaVariants } from './components/Textarea/Textarea.styles.js';
 export { toast, toastStore, useToast } from './components/Toast/toastStore.js';
 export { toastVariants } from './components/Toast/Toast.styles.js';
 export { tooltipContentVariants } from './components/Tooltip/Tooltip.styles.js';
+export { useNavHeaderContext } from './components/NavHeader/NavHeader.context.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@timmbr/ui",
-  "version": "1.2.0",
+  "version": "1.3.1",
   "description": "High-performance, Next.js App Router-compatible UI design system components for Timmbr",
   "type": "module",
   "main": "./dist/index.js",
@@ -44,8 +44,8 @@
     "@timmbr/hooks": "1.0.0-beta",
     "@timmbr/motion": "1.1.0",
     "@timmbr/utils": "1.1.0",
-    "@timmbr/theme": "1.1.0",
-    "@timmbr/icons": "1.2.0"
+    "@timmbr/icons": "1.2.0",
+    "@timmbr/theme": "1.1.0"
   },
   "peerDependencies": {
     "next": ">=13.0.0 || >=14.0.0 || >=15.0.0 || >=16.0.0",