@syscore/ui-library 1.1.12 → 1.1.13

package/dist/ui/index.es.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import React__default, { useState, useEffect, useCallback, useRef } from "react";
 import * as AccordionPrimitive from "@radix-ui/react-accordion";
-import { ChevronDown, GripVertical, X, PanelLeft, Check, Circle, Dot, ChevronUp, ChevronRight, ChevronLeft, XIcon, Search, MoreHorizontal, ArrowLeft, ArrowRight, Building2 } from "lucide-react";
+import { ChevronDown, GripVertical, X, PanelLeft, Check, Circle, Dot, ChevronLeft, ChevronRight, XIcon, Search, MoreHorizontal, ArrowLeft, ArrowRight, Building2 } from "lucide-react";
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
 import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio";
@@ -87,7 +87,7 @@ const Card = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   {
     ref,
     className: cn(
-      "rounded-lg border border-gray-100 bg-cyan-50  shadow-xs p-6 space-y-6",
+      "rounded-lg border border-gray-100 bg-cyan-50 p-6 space-y-6",
       className
     ),
     ...props
@@ -298,12 +298,14 @@ function useIsMobile() {
   }, []);
   return !!isMobile;
 }
-const buttonVariants$1 = cva(
+const buttonVariants = cva(
   "group inline-flex items-center justify-center rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer",
   {
     variants: {
       variant: {
         // CTA variants
+        clear: "bg-none border-none",
+        default: "bg-white border border-gray-gray-100",
         "primary-gradient": "text-white hover:opacity-90 btn-primary-gradient",
         "primary-dark": "bg-cyan-800 text-white hover:bg-cyan-900 focus-visible:ring-cyan-800",
         "secondary-light": "bg-white border border-gray-200 text-cyan-800 hover:bg-gray-50 focus-visible:ring-gray-200",
@@ -319,7 +321,7 @@ const buttonVariants$1 = cva(
         xlarge: "h-16 px-10",
         large: "h-12 px-8",
         utility: "h-8 px-4",
-        icon: "size-[32px]"
+        icon: "size-8"
       }
     },
     compoundVariants: [
@@ -337,43 +339,83 @@ const buttonVariants$1 = cva(
       },
       {
         size: "icon",
-        className: "p-0 bg-white border border-gray-100 "
+        className: "p-0 bg-white border border-gray-100 hover:border-gray-200 hover:scale-[1.02] transition-all duration-200"
       }
     ],
     defaultVariants: {
-      variant: "primary-dark",
+      variant: "default",
       size: "large"
     }
   }
 );
-const Button$1 = React.forwardRef(
+const sizeTextClasses = {
+  xlarge: "body-large",
+  large: "body-base",
+  utility: "body-small",
+  icon: ""
+};
+const Button = React.forwardRef(
   ({ className, variant, size, children, style, ...props }, ref) => {
-    const bodyClass = size === "xlarge" ? "body-large" : size === "large" ? "body-base" : size === "utility" ? "body-small" : "";
+    const textClass = sizeTextClasses[size || "large"];
     return /* @__PURE__ */ jsx(
       "button",
       {
-        className: cn(buttonVariants$1({ variant, size }), className),
+        className: cn(
+          buttonVariants({ variant, size }),
+          "cursor-pointer",
+          className
+        ),
         style,
         ref,
         ...props,
-        children: size === "icon" ? children : /* @__PURE__ */ jsx("span", { className: cn("relative z-10", bodyClass), children })
+        children: size === "icon" ? children : /* @__PURE__ */ jsx("span", { className: cn("relative z-10 font-semibold ", textClass), children })
       }
     );
   }
 );
-Button$1.displayName = "Button";
+Button.displayName = "Button";
 const Input = React.forwardRef(
-  ({ className, type, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      "input",
+  ({ className, type, startIcon, endIcon, ...props }, ref) => {
+    const isReadOnly = props.readOnly;
+    const isDisabled = props.disabled;
+    return /* @__PURE__ */ jsxs(
+      "div",
       {
-        type,
         className: cn(
-          "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+          // Base wrapper styles (visual input)
+          "flex h-12 w-full items-center rounded-[6px] border border-gray-200 bg-white px-4 transition-shadow",
+          // Typography inheritance
+          "body-base font-medium font-mazzard text-gray-800",
+          // Focus states (focus-within matches input focus)
+          "focus-within:border-cyan-300",
+          // Disabled states
+          isDisabled && "opacity-50 cursor-not-allowed",
+          // Read-only states
+          isReadOnly && "bg-gray-50 border-blue-200 text-gray-600 focus-within:border-blue-200 cursor-default",
           className
         ),
-        ref,
-        ...props
+        children: [
+          startIcon ? /* @__PURE__ */ jsx("div", { className: "mr-3 flex items-center text-muted-foreground", children: startIcon }) : null,
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type,
+              className: cn(
+                // Reset styles to be transparent inside wrapper
+                "flex-1 w-full bg-transparent outline-none placeholder:text-gray-500",
+                // File input specific overrides
+                type === "file" && "p-0 italic text-muted-foreground/70 file:me-3 file:h-full file:border-0 file:border-r file:border-solid file:border-gray-200 file:bg-transparent file:px-3 file:text-base file:font-medium file:not-italic file:text-gray-800",
+                // Search input specific overrides
+                type === "search" && "[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none"
+              ),
+              ref,
+              disabled: isDisabled,
+              readOnly: isReadOnly,
+              ...props
+            }
+          ),
+          endIcon ? /* @__PURE__ */ jsx("div", { className: "ml-3 flex items-center text-muted-foreground", children: endIcon }) : null
+        ]
       }
     );
   }
@@ -488,6 +530,14 @@ function Skeleton({
     }
   );
 }
+const TooltipContext = React.createContext({
+  trigger: "hover",
+  toggle: () => {
+  },
+  close: () => {
+  },
+  triggerRef: { current: null }
+});
 function TooltipProvider({
   delayDuration = 0,
   ...props
@@ -502,14 +552,73 @@ function TooltipProvider({
   );
 }
 function Tooltip({
+  trigger = "hover",
+  open: controlledOpen,
+  onOpenChange,
+  children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
+  const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);
+  const triggerRef = React.useRef(null);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const handleOpenChange = React.useCallback(
+    (newOpen) => {
+      if (trigger === "click") return;
+      if (!isControlled) {
+        setUncontrolledOpen(newOpen);
+      }
+      onOpenChange == null ? void 0 : onOpenChange(newOpen);
+    },
+    [isControlled, onOpenChange, trigger]
+  );
+  const close = React.useCallback(() => {
+    if (!isControlled) {
+      setUncontrolledOpen(false);
+    }
+    onOpenChange == null ? void 0 : onOpenChange(false);
+  }, [isControlled, onOpenChange]);
+  const toggle = React.useCallback(() => {
+    const newOpen = !isOpen;
+    if (!isControlled) {
+      setUncontrolledOpen(newOpen);
+    }
+    onOpenChange == null ? void 0 : onOpenChange(newOpen);
+  }, [isOpen, isControlled, onOpenChange]);
+  const tooltipProps = trigger === "click" ? {
+    open: isOpen,
+    onOpenChange: handleOpenChange
+  } : {
+    open: isControlled ? controlledOpen : void 0,
+    onOpenChange
+  };
+  return /* @__PURE__ */ jsx(TooltipContext.Provider, { value: { trigger, toggle, close, triggerRef }, children: /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: trigger === "click" ? 1e5 : 0, children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...tooltipProps, ...props, children }) }) });
 }
 function TooltipTrigger({
+  onClick,
   ...props
 }) {
-  return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  const { trigger, toggle, triggerRef } = React.useContext(TooltipContext);
+  const handleClick = React.useCallback(
+    (e) => {
+      if (trigger === "click") {
+        e.preventDefault();
+        e.stopPropagation();
+        toggle();
+      }
+      onClick == null ? void 0 : onClick(e);
+    },
+    [trigger, toggle, onClick]
+  );
+  return /* @__PURE__ */ jsx(
+    TooltipPrimitive.Trigger,
+    {
+      ref: triggerRef,
+      "data-slot": "tooltip-trigger",
+      onClick: handleClick,
+      ...props
+    }
+  );
 }
 function TooltipContent({
   className,
@@ -519,20 +628,41 @@ function TooltipContent({
   alignOffset = 0,
   ...props
 }) {
+  const { trigger, close, triggerRef } = React.useContext(TooltipContext);
+  const contentRef = React.useRef(null);
+  React.useEffect(() => {
+    if (trigger !== "click") return;
+    const handleClickOutside = (event) => {
+      const target = event.target;
+      const isOutsideContent = contentRef.current && !contentRef.current.contains(target);
+      const isOutsideTrigger = triggerRef.current && !triggerRef.current.contains(target);
+      if (isOutsideContent && isOutsideTrigger) {
+        close();
+      }
+    };
+    const timeoutId = setTimeout(() => {
+      document.addEventListener("click", handleClickOutside);
+    }, 0);
+    return () => {
+      clearTimeout(timeoutId);
+      document.removeEventListener("click", handleClickOutside);
+    };
+  }, [trigger, close, triggerRef]);
   return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
     TooltipPrimitive.Content,
     {
+      ref: contentRef,
       "data-slot": "tooltip-content",
       sideOffset,
       alignOffset,
       side,
       className: cn(
-        "group relative bg-gray-700 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-lg px-6 pt-8 pb-6  text-balance shadow-sm",
+        "group relative bg-gray-700 animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-lg p-6 pt-8  shadow-sm mt-3",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsx("div", { className: "absolute  left-1/2 -translate-x-1/2 flex justify-center group-data-[side=top]:bottom-0 group-data-[side=top]:rotate-180 group-data-[side=bottom]:top-0 group-data-[side=left]:right-0 group-data-[side=right]:left-0", children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: "absolute  left-1/2 -translate-x-1/2 flex justify-center group-data-[side=top]:bottom-0 group-data-[side=top]:rotate-180 group-data-[side=bottom]:top-0 group-data-[side=left]:right-0 group-data-[side=right]:left-0 ", children: /* @__PURE__ */ jsx(
           "svg",
           {
             xmlns: "http://www.w3.org/2000/svg",
@@ -738,7 +868,7 @@ Sidebar.displayName = "Sidebar";
 const SidebarTrigger = React.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = useSidebar();
   return /* @__PURE__ */ jsxs(
-    Button$1,
+    Button,
     {
       ref,
       "data-sidebar": "trigger",
@@ -1122,7 +1252,7 @@ const SidebarMenuSubButton = React.forwardRef(({ asChild = false, size = "md", i
 });
 SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 const labelVariants = cva(
-  "overline-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+  "peer-disabled:cursor-not-allowed peer-disabled:opacity-70 text-gray-600 px-2"
 );
 const Label = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   LabelPrimitive.Root,
@@ -1130,7 +1260,7 @@ const Label = React.forwardRef(({ className, children, ...props }, ref) => /* @_
     ref,
     className: cn(labelVariants(), className),
     ...props,
-    children
+    children: /* @__PURE__ */ jsx("span", { className: "overline-medium", children })
   }
 ));
 Label.displayName = LabelPrimitive.Root.displayName;
@@ -1140,7 +1270,7 @@ const Textarea = React.forwardRef(
       "textarea",
       {
         className: cn(
-          "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+          "flex min-h-[80px] w-full rounded-[6px] border border-gray-200 bg-white p-4 body-base font-medium text-gray-800 placeholder:font-normal placeholder:text-gray-500 focus:border-cyan-300 focus:outline-none focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 disabled:border-blue-200 disabled:bg-transparent ring-0",
           className
         ),
         ref,
@@ -1269,22 +1399,56 @@ const InputOTPSlot = React.forwardRef(({ index, className, ...props }, ref) => {
 InputOTPSlot.displayName = "InputOTPSlot";
 const InputOTPSeparator = React.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ jsx(Dot, {}) }));
 InputOTPSeparator.displayName = "InputOTPSeparator";
+const UtilityChevronDown = ({
+  className
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "size-4 flex items-center justify-center text-gray-500",
+        className
+      ),
+      children: /* @__PURE__ */ jsx(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: "12",
+          height: "6",
+          viewBox: "0 0 12 6",
+          fill: "none",
+          className: cn("text-inherit"),
+          children: /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: "M11 0.75L6 5.25L1 0.75",
+              stroke: "currentColor",
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
+        }
+      )
+    }
+  );
+};
 const Select = SelectPrimitive.Root;
 const SelectGroup = SelectPrimitive.Group;
 const SelectValue = SelectPrimitive.Value;
-const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Trigger,
   {
     ref,
     className: cn(
-      "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      "group flex h-12 w-full rounded-[6px] border border-gray-200 bg-white p-4  text-gray-800 ring-offset-background placeholder:font-normal placeholder:text-gray-500 focus:outline-none focus:ring-0 data-[state=open]:border-cyan-300 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
       className
     ),
     ...props,
-    children: [
-      children,
-      /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 opacity-50" }) })
-    ]
+    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between w-full", children: [
+      /* @__PURE__ */ jsx("span", { className: " text-gray-800 font-mazzard body-base font-medium", children }),
+      /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(UtilityChevronDown, { className: " text-gray-600 group-data-[state=open]:rotate-180 transition-transform duration-200" }) })
+    ] })
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
@@ -1297,7 +1461,7 @@ const SelectScrollUpButton = React.forwardRef(({ className, ...props }, ref) =>
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx(ChevronUp, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx(UtilityChevronDown, {})
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
@@ -1310,7 +1474,7 @@ const SelectScrollDownButton = React.forwardRef(({ className, ...props }, ref) =
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx(UtilityChevronDown, {})
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
@@ -1319,8 +1483,7 @@ const SelectContent = React.forwardRef(({ className, children, position = "poppe
   {
     ref,
     className: cn(
-      "relative z-50 max-h-96 min-w-32 overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      "relative z-50 max-h-96 min-w-32 overflow-hidden border-cyan-300 bg-gray-700 text-gray-200 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[side=bottom]:-mt-1 data-[side=bottom]:rounded-t-none data-[side=bottom]:rounded-b-[6px] data-[side=top]:border-b-0 data-[side=top]:rounded-t-[6px] data-[side=top]:rounded-b-none data-[side=top]:-mb-1 data-[side=top]:border-t data-[side=bottom]:border-b",
       className
     ),
     position,
@@ -1331,7 +1494,7 @@ const SelectContent = React.forwardRef(({ className, children, position = "poppe
         SelectPrimitive.Viewport,
         {
           className: cn(
-            "p-1",
+            "",
             position === "popper" && "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)"
           ),
           children
@@ -1346,24 +1509,24 @@ const SelectLabel = React.forwardRef(({ className, ...props }, ref) => /* @__PUR
   SelectPrimitive.Label,
   {
     ref,
-    className: cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className),
+    className: cn(
+      "py-1.5 pl-8 pr-2 text-sm font-semibold font-mazzard",
+      className
+    ),
     ...props
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Item,
   {
     ref,
     className: cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50",
+      "relative flex h-12 w-full cursor-default select-none items-center border-x border-cyan-300 px-4 outline-none  focus:bg-[rgba(0,0,0,0.2)] data-disabled:pointer-events-none data-disabled:opacity-50",
       className
     ),
     ...props,
-    children: [
-      /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
-    ]
+    children: /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
@@ -1469,6 +1632,56 @@ const FormMessage = React.forwardRef(({ className, children, ...props }, ref) =>
   );
 });
 FormMessage.displayName = "FormMessage";
+const toggleVariants = cva(
+  "inline-flex items-center justify-center rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer",
+  {
+    variants: {
+      variant: {
+        default: "bg-gray-100 text-gray-600 hover:bg-gray-200"
+      },
+      size: {
+        default: "h-8 px-4"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+const ToggleGroupContext = React.createContext({
+  size: "default",
+  variant: "default"
+});
+const ToggleGroup = React.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx(
+  ToggleGroupPrimitive.Root,
+  {
+    ref,
+    className: cn("flex items-center justify-center gap-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: { variant, size }, children })
+  }
+));
+ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
+const ToggleGroupItem = React.forwardRef(({ className, children, variant, size, ...props }, ref) => {
+  const context = React.useContext(ToggleGroupContext);
+  return /* @__PURE__ */ jsx(
+    ToggleGroupPrimitive.Item,
+    {
+      ref,
+      className: cn(
+        toggleVariants({
+          variant: context.variant || variant,
+          size: context.size || size
+        }),
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+});
+ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 function useSegmentedControl({
   value,
   defaultValue,
@@ -1497,7 +1710,7 @@ function useSegmentedControl({
     onValueChange: handleValueChange
   };
 }
-const toggleVariants = cva(
+cva(
   "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
   {
     variants: {
@@ -1525,13 +1738,13 @@ const SegmentedControlInner = React.forwardRef(
       defaultValue: defaultValue ?? ((_a = options[0]) == null ? void 0 : _a.value),
       onValueChange
     });
-    return /* @__PURE__ */ jsx("div", { ref, className: cn(className), ...props, children: options.map((option) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("inline-flex", className), ...props, children: options.map((option) => {
       const isReactElement = React.isValidElement(option.label);
       return /* @__PURE__ */ jsx(
         "button",
         {
           className: cn(
-            "inline-flex items-center justify-center h-8 px-6  rounded-full transition-all focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring",
+            "inline-flex items-center justify-center h-8 px-4 rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring cursor-pointer",
             selectedValue === option.value ? "bg-cyan-700 text-white font-semibold" : "text-gray-600 hover:bg-gray-50 font-medium"
           ),
           onClick: () => handleValueChange(option.value),
@@ -1547,39 +1760,6 @@ const SegmentedControlInner = React.forwardRef(
 SegmentedControlInner.displayName = "SegmentedControl";
 const SegmentedControl = SegmentedControlInner;
 const Toggle = SegmentedControl;
-const ToggleGroupContext = React.createContext({
-  size: "default",
-  variant: "default"
-});
-const ToggleGroup = React.forwardRef(({ className, variant, size, children, ...props }, ref) => /* @__PURE__ */ jsx(
-  ToggleGroupPrimitive.Root,
-  {
-    ref,
-    className: cn("flex items-center justify-center gap-1", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, { value: { variant, size }, children })
-  }
-));
-ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-const ToggleGroupItem = React.forwardRef(({ className, children, variant, size, ...props }, ref) => {
-  const context = React.useContext(ToggleGroupContext);
-  return /* @__PURE__ */ jsx(
-    ToggleGroupPrimitive.Item,
-    {
-      ref,
-      className: cn(
-        toggleVariants({
-          variant: context.variant || variant,
-          size: context.size || size
-        }),
-        className
-      ),
-      ...props,
-      children
-    }
-  );
-});
-ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 const badgeVariants = cva(
   "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2",
   {
@@ -1721,7 +1901,7 @@ const AlertDialogAction = React.forwardRef(({ className, ...props }, ref) => /*
   AlertDialogPrimitive.Action,
   {
     ref,
-    className: cn(buttonVariants$1(), className),
+    className: cn(buttonVariants(), className),
     ...props
   }
 ));
@@ -1731,7 +1911,7 @@ const AlertDialogCancel = React.forwardRef(({ className, ...props }, ref) => /*
   {
     ref,
     className: cn(
-      buttonVariants$1({ variant: "general-secondary" }),
+      buttonVariants({ variant: "general-secondary" }),
       "mt-2 sm:mt-0",
       className
     ),
@@ -1814,7 +1994,10 @@ const BreadcrumbPage = React.forwardRef(({ className, ...props }, ref) => /* @__
     role: "link",
     "aria-disabled": "true",
     "aria-current": "page",
-    className: cn("font-normal text-foreground", className),
+    className: cn(
+      "body-small font-medium text-gray-600 text-center whitespace-nowrap",
+      className
+    ),
     ...props
   }
 ));
@@ -1828,9 +2011,31 @@ const BreadcrumbSeparator = ({
   {
     role: "presentation",
     "aria-hidden": "true",
-    className: cn("[&>svg]:size-3.5", className),
+    className: cn(
+      "size-4 flex items-center justify-center shrink-0",
+      className
+    ),
     ...props,
-    children: children ?? /* @__PURE__ */ jsx(ChevronRight, {})
+    children: children ?? /* @__PURE__ */ jsx(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: "5",
+        height: "8",
+        viewBox: "0 0 5 8",
+        fill: "none",
+        children: /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M0.75 6.75L3.75 3.75L0.75 0.75",
+            stroke: "#CBCDD2",
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        )
+      }
+    )
   }
 );
 BreadcrumbSeparator.displayName = "BreadcrumbSeparator";
@@ -1871,7 +2076,7 @@ function Calendar({
         caption_label: "text-sm font-medium",
         nav: "space-x-1 flex items-center",
         nav_button: cn(
-          buttonVariants$1({ variant: "general-secondary" }),
+          buttonVariants({ variant: "general-secondary" }),
           "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
         ),
         nav_button_previous: "absolute left-1",
@@ -1882,7 +2087,7 @@ function Calendar({
         row: "flex w-full mt-2",
         cell: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20",
         day: cn(
-          buttonVariants$1({ variant: "general-tertiary" }),
+          buttonVariants({ variant: "general-tertiary" }),
           "h-9 w-9 p-0 font-normal aria-selected:opacity-100"
         ),
         day_range_end: "day-range-end",
@@ -1966,28 +2171,28 @@ const NavLogo = ({ dark = false }) => {
           "path",
           {
             d: "M53.5868 0H55.0485C55.6026 0 56.0325 0.404706 56.0325 0.969412V12.8941H63.016C63.5701 12.8941 64 13.2988 64 13.8447V15.0306C64 15.5765 63.5701 16 63.016 16H53.5868C53.0327 16 52.6028 15.5765 52.6028 15.0306V0.969412C52.6028 0.404706 53.0423 0 53.5868 0Z",
-            fill: dark ? "currentColor" : "white"
+            fill: "currentColor"
           }
         ),
         /* @__PURE__ */ jsx(
           "path",
           {
             d: "M39.9826 0H41.4442C41.9983 0 42.4282 0.404706 42.4282 0.969412V12.8941H49.4118C49.9659 12.8941 50.3958 13.2988 50.3958 13.8447V15.0306C50.3958 15.5765 49.9659 16 49.4118 16H39.9826C39.4285 16 38.9986 15.5765 38.9986 15.0306V0.969412C38.9986 0.404706 39.4285 0 39.9826 0Z",
-            fill: dark ? "currentColor" : "white"
+            fill: "currentColor"
           }
         ),
         /* @__PURE__ */ jsx(
           "path",
           {
             d: "M25.4615 0H35.5212C36.0944 0 36.5052 0.404706 36.5052 0.969412V2.15529C36.5052 2.70118 36.0944 3.12471 35.5212 3.12471H27.9072V6.37176H34.222C34.7761 6.37176 35.206 6.77647 35.206 7.32235V8.50824C35.206 9.07294 34.7761 9.47765 34.222 9.47765H27.9072V12.8941H35.6359C36.2091 12.8941 36.6199 13.2988 36.6199 13.8447V15.0306C36.6199 15.5765 36.2091 16 35.6359 16H25.4615C24.9074 16 24.4775 15.5765 24.4775 15.0306V0.969412C24.4775 0.404706 24.9074 0 25.4615 0Z",
-            fill: dark ? "currentColor" : "white"
+            fill: "currentColor"
           }
         ),
         /* @__PURE__ */ jsx(
           "path",
           {
             d: "M2.26579 0C2.81989 0 3.37399 0.376471 3.53639 0.922353L6.56483 10.4941L9.51684 0.856471C9.66014 0.357647 10.1665 0 10.6728 0H11.6855C12.2109 0 12.7172 0.357647 12.8605 0.856471L15.8412 10.5035L18.8314 0.922353C18.9747 0.376471 19.5288 0 20.102 0H21.6401C22.1942 0 22.4808 0.404706 22.2898 0.922353L17.4653 15.1435C17.2933 15.6141 16.7965 16 16.2616 16H15.2489C14.7426 16 14.2362 15.6424 14.0929 15.1435L11.1887 5.92L8.25578 15.1435C8.11248 15.6424 7.60615 16 7.08071 16H6.08716C5.58083 16 5.0745 15.6235 4.91209 15.1435L0.0589489 0.922353C-0.13212 0.404706 0.154483 0 0.727688 0H2.26579Z",
-            fill: dark ? "currentColor" : "white"
+            fill: "currentColor"
           }
         )
       ]
@@ -2039,74 +2244,12 @@ const NavBullet = ({ color }) => {
     }
   );
 };
-const buttonVariants = cva(
-  "group inline-flex items-center justify-center rounded-full transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer",
-  {
-    variants: {
-      variant: {
-        // CTA variants
-        "primary-gradient": "text-white hover:opacity-90 btn-primary-gradient",
-        "primary-dark": "bg-cyan-800 text-white hover:bg-cyan-900 focus-visible:ring-cyan-800",
-        "secondary-light": "bg-white border border-gray-200 text-cyan-800 hover:bg-gray-50 focus-visible:ring-gray-200",
-        "tertiary-light": "bg-blue-50 border border-blue-200 text-blue-600 hover:bg-blue-100 focus-visible:ring-blue-200",
-        // Utility variants
-        "general-primary": "bg-blue-600 text-white hover:bg-blue-700 focus-visible:ring-blue-600",
-        "general-secondary": "bg-white border border-blue-200 text-blue-600 hover:bg-blue-50 focus-visible:ring-blue-200",
-        "general-tertiary": "bg-white border border-gray-200 text-gray-600 hover:bg-gray-50 focus-visible:ring-gray-200",
-        "tooltip-primary": "bg-cyan-300 text-white hover:bg-cyan-400 focus-visible:ring-cyan-300",
-        "tooltip-secondary": "bg-gray-500 text-white hover:bg-gray-600 focus-visible:ring-gray-500"
-      },
-      size: {
-        xlarge: "h-16 px-10",
-        large: "h-12 px-8",
-        utility: "h-8 px-4",
-        icon: "size-[32px]"
-      }
-    },
-    compoundVariants: [
-      {
-        size: "xlarge",
-        className: "font-semibold"
-      },
-      {
-        size: "large",
-        className: "font-semibold"
-      },
-      {
-        size: "utility",
-        className: "font-semibold"
-      },
-      {
-        size: "icon",
-        className: "p-0 bg-white border border-gray-100 "
-      }
-    ],
-    defaultVariants: {
-      variant: "primary-dark",
-      size: "large"
-    }
-  }
-);
-const Button = React.forwardRef(
-  ({ className, variant, size, children, style, ...props }, ref) => {
-    const bodyClass = size === "xlarge" ? "body-large" : size === "large" ? "body-base" : size === "utility" ? "body-small" : "";
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        className: cn(buttonVariants({ variant, size }), className),
-        style,
-        ref,
-        ...props,
-        children: size === "icon" ? children : /* @__PURE__ */ jsx("span", { className: cn("relative z-10", bodyClass), children })
-      }
-    );
-  }
-);
-Button.displayName = "Button";
 const Navigation = ({
   navItems,
   isStrategy = false,
-  onLinkClick
+  Link: LinkComponent,
+  onLinkClick,
+  onClose
 }) => {
   const [isOpen, setIsOpen] = React.useState(false);
   const [activeItem, setActiveItem] = React.useState(null);
@@ -2122,24 +2265,27 @@ const Navigation = ({
     setIsOpen(true);
     setActiveItem(index + 1);
   };
-  const handleLink = (href) => {
+  const NavLink = ({ href, className, "aria-label": ariaLabel, children }) => {
+    if (LinkComponent) {
+      return /* @__PURE__ */ jsx(LinkComponent, { href, className, "aria-label": ariaLabel, children });
+    }
     if (onLinkClick) {
-      onLinkClick(href);
+      return /* @__PURE__ */ jsx(
+        "a",
+        {
+          href,
+          className,
+          "aria-label": ariaLabel,
+          onClick: (e) => {
+            e.preventDefault();
+            onLinkClick(href);
+          },
+          children
+        }
+      );
     }
+    return /* @__PURE__ */ jsx("a", { href, className, "aria-label": ariaLabel, children });
   };
-  const Link = ({ to, className, "aria-label": ariaLabel, children }) => /* @__PURE__ */ jsx(
-    "a",
-    {
-      href: to,
-      className,
-      "aria-label": ariaLabel,
-      onClick: (e) => {
-        e.preventDefault();
-        handleLink(to);
-      },
-      children
-    }
-  );
   return /* @__PURE__ */ jsxs(
     "nav",
     {
@@ -2162,11 +2308,26 @@ const Navigation = ({
         ),
         /* @__PURE__ */ jsxs("div", { className: "container-lg flex h-14 items-center justify-between", children: [
           /* @__PURE__ */ jsxs("div", { className: "flex h-full sm:min-w-[200px] items-center", children: [
-            isStrategy ? /* @__PURE__ */ jsx(Button, { className: "mr-4", size: "icon", children: /* @__PURE__ */ jsx(UtilityClose, { className: "text-gray-700 group-hover:text-white" }) }) : null,
+            isStrategy ? /* @__PURE__ */ jsx(
+              Button,
+              {
+                className: "mr-4",
+                size: "icon",
+                onClick: (e) => {
+                  e.preventDefault();
+                  if (onClose) {
+                    onClose();
+                  } else if (onLinkClick) {
+                    onLinkClick("/");
+                  }
+                },
+                children: /* @__PURE__ */ jsx(UtilityClose, { className: "text-gray-700 group-hover:text-white" })
+              }
+            ) : null,
             /* @__PURE__ */ jsx(
-              Link,
+              NavLink,
               {
-                to: "/",
+                href: "/",
                 className: cn(
                   "flex items-center  ease-in-out duration-300 will-change-transform",
                   {
@@ -2184,7 +2345,7 @@ const Navigation = ({
               className: cn(
                 "relative hidden h-full flex-1 items-center justify-center space-x-12 md:flex"
               ),
-              children: /* @__PURE__ */ jsx("ul", { className: "flex h-full gap-x-12", children: navItems.map((item, index) => /* @__PURE__ */ jsxs(
+              children: /* @__PURE__ */ jsx("ul", { className: "flex h-full gap-x-12", children: navItems ? navItems.map((item, index) => /* @__PURE__ */ jsxs(
                 "li",
                 {
                   className: cn(
@@ -2240,13 +2401,13 @@ const Navigation = ({
                   ]
                 },
                 index + 1
-              )) })
+              )) : null })
             }
           ) : null,
           /* @__PURE__ */ jsx("div", { className: "flex h-full sm:min-w-[200px] items-center justify-end gap-4", children: /* @__PURE__ */ jsx(
-            Link,
+            NavLink,
             {
-              to: "/",
+              href: "/",
               "aria-label": "Account link",
               className: cn(
                 "flex h-8 w-8 items-center justify-center rounded-full transition-colors btn-icon",
@@ -2298,25 +2459,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Everything" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Explore WELL"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Enroll in WELL"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "What's new"
                             }
@@ -2327,25 +2488,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "WHY WELL" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Performance"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "ROI"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Impact"
                             }
@@ -2356,25 +2517,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Standard" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Strategies"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Themes"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Milestones"
                             }
@@ -2385,17 +2546,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Network" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Organizations"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "People"
                             }
@@ -2406,17 +2567,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Solutions" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Products"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Services"
                             }
@@ -2427,17 +2588,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Places" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-5", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Locations"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Portfolios"
                             }
@@ -2465,20 +2626,20 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "SUBSCRIBE" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL at scale"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
-                            /* @__PURE__ */ jsx(Link, { to: "/", children: /* @__PURE__ */ jsx("span", { className: "body-small font-medium text-gray-100", children: "Pricing" }) })
+                            /* @__PURE__ */ jsx(NavLink, { href: "/", children: /* @__PURE__ */ jsx("span", { className: "body-small font-medium text-gray-100", children: "Pricing" }) })
                           ] }) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
-                            /* @__PURE__ */ jsx(Link, { to: "/", children: /* @__PURE__ */ jsx("span", { className: "body-small font-medium text-gray-100", children: "Leaderboard" }) })
+                            /* @__PURE__ */ jsx(NavLink, { href: "/", children: /* @__PURE__ */ jsx("span", { className: "body-small font-medium text-gray-100", children: "Leaderboard" }) })
                           ] }) })
                         ] })
                       ] }),
@@ -2486,17 +2647,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Certify" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL Certification"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "text-gray-100 hover:text-white flex items-center justify-start body-base font-medium",
                               children: [
                                 "WELL Residence",
@@ -2510,9 +2671,9 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Get rated" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL Ratings"
                             }
@@ -2520,9 +2681,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#F3E7D8" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Health-Safety Rating"
                               }
@@ -2531,9 +2692,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#0F748A" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Performance Rating"
                               }
@@ -2542,9 +2703,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#17AA8D" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Equity Rating"
                               }
@@ -2572,17 +2733,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "JOIN" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Membership"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Works with WELL"
                             }
@@ -2590,9 +2751,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#2E74AD" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Enterprise Provider"
                               }
@@ -2601,9 +2762,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#149EBD" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Product Provider"
                               }
@@ -2612,9 +2773,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx(NavBullet, { color: "#ED896F" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Performance Testing Provider"
                               }
@@ -2626,17 +2787,17 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "EARN" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL AP"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL Faculty"
                             }
@@ -2663,9 +2824,9 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "LEARN" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL Forum"
                             }
@@ -2673,9 +2834,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Threads"
                               }
@@ -2684,9 +2845,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Webcasts"
                               }
@@ -2695,9 +2856,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Trainings"
                               }
@@ -2709,9 +2870,9 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "ATTEND" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "WELL 2025"
                             }
@@ -2719,9 +2880,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Flagship events"
                               }
@@ -2730,9 +2891,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Thematic summits"
                               }
@@ -2741,9 +2902,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Regional summits"
                               }
@@ -2755,9 +2916,9 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "GUIDANCE" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Knowledge base"
                             }
@@ -2765,9 +2926,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Tutorials"
                               }
@@ -2776,9 +2937,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Guides"
                               }
@@ -2787,9 +2948,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "FAQs"
                               }
@@ -2801,9 +2962,9 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Resources" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Resource library"
                             }
@@ -2811,9 +2972,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Technical tools"
                               }
@@ -2822,9 +2983,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Sales tools"
                               }
@@ -2833,9 +2994,9 @@ const Navigation = ({
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 pl-[6px]", children: [
                             /* @__PURE__ */ jsx("div", { className: "h-1 w-1 rounded-full bg-gray-500" }),
                             /* @__PURE__ */ jsx(
-                              Link,
+                              NavLink,
                               {
-                                to: "/",
+                                href: "/",
                                 className: "body-small font-medium text-gray-100",
                                 children: "Media"
                               }
@@ -2863,25 +3024,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "About" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "IWBI"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Research"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Advocacy"
                             }
@@ -2892,25 +3053,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Meet" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Team"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Advisories"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Governance Council"
                             }
@@ -2921,25 +3082,25 @@ const Navigation = ({
                         /* @__PURE__ */ jsx("h3", { className: "overline-medium font-semibold text-plum-400", children: "Explore" }),
                         /* @__PURE__ */ jsxs("ul", { className: "space-y-4", children: [
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Newsroom"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Jobs"
                             }
                           ) }),
                           /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                            Link,
+                            NavLink,
                             {
-                              to: "/",
+                              href: "/",
                               className: "body-base block font-medium text-gray-100 hover:text-white",
                               children: "Blog"
                             }
@@ -3007,7 +3168,7 @@ function DialogContent({
       {
         "data-slot": "dialog-content",
         className: cn(
-          "DialogContent overflow-hidden rounded-[40px] gap-4  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[30%] left-[50%] z-50 grid max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] border-12 border-[rgba(255,255,255,0.20)]  duration-200 sm:max-w-lg",
+          "DialogContent overflow-hidden rounded-[40px] gap-4  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-1/2 left-1/2 z-50 grid  -translate-x-1/2 -translate-y-1/2 border-12 border-[rgba(255,255,255,0.20)]  duration-200 ",
           className
         ),
         ...props,
@@ -3288,224 +3449,6 @@ const SearchField = ({
     ) })
   ] });
 };
-const conceptColors = {
-  mind: {
-    solid: "#0a5161",
-    light: "rgba(10,81,97,0.08)",
-    border: "rgba(10,81,97,0.16)",
-    prefix: "M"
-  },
-  community: {
-    solid: "#0f748a",
-    light: "rgba(15,116,138,0.12)",
-    border: "rgba(15,116,138,0.24)",
-    prefix: "C"
-  },
-  movement: {
-    solid: "#149ebd",
-    light: "rgba(20,158,189,0.12)",
-    border: "rgba(20,158,189,0.24)",
-    prefix: "V"
-  },
-  water: {
-    solid: "#39c9ea",
-    light: "rgba(57,201,234,0.12)",
-    border: "rgba(57,201,234,0.24)",
-    prefix: "W"
-  },
-  air: {
-    solid: "#87dff2",
-    light: "rgba(135,223,242,0.12)",
-    border: "rgba(135,223,242,0.24)",
-    prefix: "A"
-  },
-  light: {
-    solid: "#8aefdb",
-    light: "rgba(138,239,219,0.12)",
-    border: "rgba(138,239,219,0.24)",
-    prefix: "L"
-  },
-  thermalComfort: {
-    solid: "#3eddbf",
-    light: "rgba(62,221,191,0.12)",
-    border: "rgba(62,221,191,0.24)",
-    prefix: "T"
-  },
-  nourishment: {
-    solid: "#17aa8d",
-    light: "rgba(23,170,141,0.12)",
-    border: "rgba(23,170,141,0.24)",
-    prefix: "N"
-  },
-  sound: {
-    solid: "#0c705c",
-    light: "rgba(12,112,92,0.12)",
-    border: "rgba(12,112,92,0.24)",
-    prefix: "S"
-  },
-  materials: {
-    solid: "#0a4f41",
-    light: "rgba(10,79,65,0.08)",
-    border: "rgba(10,79,65,0.16)",
-    prefix: "X"
-  }
-};
-const StrategyTableRow = ({
-  data,
-  isFirst = false,
-  isLast = false,
-  showConceptHeader = true,
-  isExpanded = true
-}) => {
-  const { concept, theme, strategies } = data;
-  const colors = conceptColors[concept.type];
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    showConceptHeader && /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "flex items-center gap-4 p-4 border border-[#DEDFE3] bg-[#FAFEFF]",
-          "border-b-0",
-          isFirst && "rounded-tl-[12px] rounded-tr-[12px]"
-        ),
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "size-[48px] flex items-center justify-center shrink-0", children: concept.icon }),
-          /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-[#282A31] uppercase tracking-[0.5px] leading-[14px]", children: concept.name }) })
-        ]
-      }
-    ),
-    isExpanded && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 p-4 border border-[#DEDFE3] bg-[#FAFEFF] border-b-0", children: [
-      /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "flex items-center justify-center h-8 w-12 rounded-[6px] shrink-0",
-          style: { backgroundColor: colors.solid },
-          children: /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-white leading-[19.6px]", children: theme.code })
-        }
-      ),
-      /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("span", { className: "text-base font-medium text-[#282A31] leading-[21px]", children: theme.name }) })
-    ] }),
-    isExpanded && strategies.map((strategy, index) => {
-      var _a;
-      const isLastStrategy = index === strategies.length - 1 && isLast;
-      const scoreParts = ((_a = strategy.score) == null ? void 0 : _a.split("–")) || [];
-      const isRange = scoreParts.length > 1;
-      return /* @__PURE__ */ jsxs(
-        "div",
-        {
-          className: cn(
-            "flex items-center gap-4 pl-8 pr-4 py-4 border border-[#DEDFE3] bg-white",
-            "border-b-0",
-            isLastStrategy && "rounded-bl-[12px] rounded-br-[12px] border-b-0"
-          ),
-          children: [
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: "flex items-center justify-center h-8 w-12 rounded-[6px] border shrink-0",
-                style: {
-                  backgroundColor: colors.light,
-                  borderColor: colors.border
-                },
-                children: /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    className: "text-sm font-semibold leading-[19.6px]",
-                    style: { color: colors.solid },
-                    children: strategy.code
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsx("div", { className: "flex-1", children: /* @__PURE__ */ jsx("span", { className: "text-base font-medium text-[#282A31] leading-[21px]", children: strategy.name }) }),
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 shrink-0", children: [
-              strategy.hasTarget && /* @__PURE__ */ jsx("div", { className: "size-8 flex items-center justify-center", children: /* @__PURE__ */ jsxs(
-                "svg",
-                {
-                  width: "14",
-                  height: "14",
-                  viewBox: "0 0 14 14",
-                  fill: "none",
-                  className: "text-gray-400",
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      "circle",
-                      {
-                        cx: "7",
-                        cy: "7",
-                        r: "6.25",
-                        stroke: "currentColor",
-                        strokeWidth: "1.5"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "circle",
-                      {
-                        cx: "7",
-                        cy: "7",
-                        r: "3.5",
-                        stroke: "currentColor",
-                        strokeWidth: "1.5"
-                      }
-                    ),
-                    /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "1", fill: "currentColor" })
-                  ]
-                }
-              ) }),
-              strategy.score && /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-[4px]", children: [
-                /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold text-[#282A31] leading-[25.2px]", children: strategy.score }),
-                /* @__PURE__ */ jsxs("span", { className: "text-xs font-semibold text-[#282A31] uppercase tracking-[0.5px] leading-[12px]", children: [
-                  isRange ? "PTS" : "PT",
-                  !isRange && /* @__PURE__ */ jsx("span", { className: "text-transparent", children: "S" })
-                ] })
-              ] })
-            ] })
-          ]
-        },
-        strategy.id
-      );
-    })
-  ] });
-};
-const StrategyTable = ({
-  data,
-  className,
-  isExpanded = true
-}) => {
-  const groupedData = React.useMemo(() => {
-    const groups = {};
-    data.forEach((item) => {
-      const key = item.concept.id;
-      if (!groups[key]) {
-        groups[key] = [];
-      }
-      groups[key].push(item);
-    });
-    return Object.values(groups);
-  }, [data]);
-  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col", className), children: groupedData.map((group, groupIndex) => {
-    const isFirstGroup = groupIndex === 0;
-    const isLastGroup = groupIndex === groupedData.length - 1;
-    return group.map((item, itemIndex) => {
-      const isFirst = isFirstGroup && itemIndex === 0;
-      const isLastItemInGroup = itemIndex === group.length - 1;
-      const isLastStrategyRow = isLastGroup && isLastItemInGroup && item.strategies.length > 0;
-      const showConceptHeader = itemIndex === 0;
-      const uniqueId = `${item.concept.id}-${item.theme.id}`;
-      return /* @__PURE__ */ jsx(
-        StrategyTableRow,
-        {
-          data: item,
-          isFirst,
-          isLast: isLastStrategyRow,
-          showConceptHeader,
-          isExpanded
-        },
-        uniqueId
-      );
-    });
-  }) });
-};
 const getStatusColors = (status, variant = "light") => {
   const colors = {
     light: {
@@ -3573,7 +3516,7 @@ const Tag = React.forwardRef(
           ref,
           onClick,
           className: cn(
-            "inline-flex items-center p-[8px] rounded-[6px] w-fit",
+            "inline-flex items-center p-[8px] rounded-sm w-fit",
             "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
             "disabled:opacity-50 disabled:cursor-not-allowed",
             statusColors.bg,
@@ -3591,14 +3534,15 @@ const Tag = React.forwardRef(
         ref,
         onClick,
         className: cn(
-          "inline-flex items-center h-[32px] px-[12px] py-0 rounded-[6px] w-fit",
+          "inline-flex items-center h-[32px] px-[12px] py-0 rounded-sm w-fit cursor-pointer",
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
           "disabled:opacity-50 disabled:cursor-not-allowed",
-          active ? "bg-white border border-cyan-300 text-gray-800 hover:border-cyan-400" : "bg-blue-100 text-blue-700 hover:bg-blue-200",
+          "transition-all duration-200",
+          active ? "bg-cyan-700  text-white hover:border-cyan-700" : "bg-blue-100 text-blue-700 hover:bg-cyan-700 hover:text-white",
           className
         ),
         ...props,
-        children: /* @__PURE__ */ jsx("span", { className: "body-small font-medium", children })
+        children: /* @__PURE__ */ jsx("span", { className: "body-small font-semibold", children })
       }
     );
   }
@@ -3698,7 +3642,7 @@ const PaginationLink = ({
   {
     "aria-current": isActive ? "page" : void 0,
     className: cn(
-      buttonVariants$1({
+      buttonVariants({
         variant: isActive ? "general-secondary" : "general-tertiary",
         size
       }),
@@ -4519,7 +4463,7 @@ const CarouselPrevious = React.forwardRef(
   ({ className, variant = "general-secondary", size = "icon", ...props }, ref) => {
     const { orientation, scrollPrev, canScrollPrev } = useCarousel();
     return /* @__PURE__ */ jsxs(
-      Button$1,
+      Button,
       {
         ref,
         variant,
@@ -4545,7 +4489,7 @@ const CarouselNext = React.forwardRef(
   ({ className, variant = "general-secondary", size = "icon", ...props }, ref) => {
     const { orientation, scrollNext, canScrollNext } = useCarousel();
     return /* @__PURE__ */ jsxs(
-      Button$1,
+      Button,
       {
         ref,
         variant,
@@ -5346,7 +5290,7 @@ export {
   BreadcrumbList,
   BreadcrumbPage,
   BreadcrumbSeparator,
-  Button$1 as Button,
+  Button,
   Calendar,
   Card,
   CardContent,
@@ -5516,7 +5460,6 @@ export {
   Skeleton,
   Slider,
   Toaster as Sonner,
-  StrategyTable,
   Switch,
   Table,
   TableBody,
@@ -5549,9 +5492,8 @@ export {
   TooltipTrigger,
   WELLDashboard,
   badgeVariants,
-  buttonVariants$1 as buttonVariants,
+  buttonVariants,
   cn,
-  conceptColors,
   navigationMenuTriggerStyle,
   useIsMobile,
   useSegmentedControl,