analytica-frontend-lib 1.0.22 → 1.0.24

package/dist/chunk-CETSS3RA.mjs

@@ -0,0 +1,52 @@
+// src/components/NavButton/NavButton.tsx
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var NavButton = forwardRef(
+  ({ icon, label, selected = false, className = "", disabled, ...props }, ref) => {
+    const baseClasses = [
+      "flex",
+      "flex-col",
+      "items-center",
+      "justify-center",
+      "gap-0.5",
+      "px-12",
+      "py-1",
+      "rounded-sm",
+      "cursor-pointer",
+      "text-text-950",
+      "text-xs",
+      "font-medium",
+      "hover:text-text",
+      "hover:bg-primary-600",
+      "focus-visible:outline-none",
+      "focus-visible:ring-2",
+      "focus-visible:ring-offset-0",
+      "focus-visible:ring-indicator-info",
+      "disabled:opacity-50",
+      "disabled:cursor-not-allowed",
+      "disabled:pointer-events-none"
+    ];
+    const stateClasses = selected ? ["bg-primary-50", "text-primary-950"] : [];
+    const allClasses = [...baseClasses, ...stateClasses].join(" ");
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: `${allClasses} ${className}`,
+        disabled,
+        "aria-pressed": selected,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center w-5 h-5", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap", children: label })
+        ]
+      }
+    );
+  }
+);
+NavButton.displayName = "NavButton";
+
+export {
+  NavButton
+};

package/dist/chunk-GSEO6POW.mjs

@@ -0,0 +1,93 @@
+// src/components/Badge/Badge.tsx
+import { Bell } from "phosphor-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var VARIANT_ACTION_CLASSES = {
+  solid: {
+    error: "bg-error text-error-700 focus-visible:outline-none",
+    warning: "bg-warning text-warning-800 focus-visible:outline-none",
+    success: "bg-success text-success-800 focus-visible:outline-none",
+    info: "bg-info text-info-800 focus-visible:outline-none",
+    muted: "bg-background-muted text-background-800 focus-visible:outline-none"
+  },
+  outlined: {
+    error: "bg-error text-error-700 border border-error-300 focus-visible:outline-none",
+    warning: "bg-warning text-warning-800 border border-warning-300 focus-visible:outline-none",
+    success: "bg-success text-success-800 border border-success-300 focus-visible:outline-none",
+    info: "bg-info text-info-800 border border-info-300 focus-visible:outline-none",
+    muted: "bg-background-muted text-background-800 border border-border-300 focus-visible:outline-none"
+  },
+  exams: {
+    exam1: "bg-exam-1 text-info-200 focus-visible:outline-none",
+    exam2: "bg-exam-2 text-typography-1 focus-visible:outline-none",
+    exam3: "bg-exam-3 text-typography-2 focus-visible:outline-none",
+    exam4: "bg-exam-4 text-success-700 focus-visible:outline-none"
+  },
+  resultStatus: {
+    negative: "bg-error text-error-800 focus-visible:outline-none",
+    positive: "bg-success text-success-800 focus-visible:outline-none"
+  },
+  notification: "text-primary"
+};
+var SIZE_CLASSES = {
+  small: "text-2xs px-2 py-1",
+  medium: "text-xs px-2 py-1",
+  large: "text-sm px-2 py-1"
+};
+var SIZE_CLASSES_ICON = {
+  small: "size-3",
+  medium: "size-3.5",
+  large: "size-4"
+};
+var Badge = ({
+  children,
+  iconLeft,
+  iconRight,
+  size = "medium",
+  variant = "solid",
+  action = "error",
+  className = "",
+  notificationActive = false,
+  ...props
+}) => {
+  const sizeClasses = SIZE_CLASSES[size];
+  const sizeClassesIcon = SIZE_CLASSES_ICON[size];
+  const variantActionMap = VARIANT_ACTION_CLASSES[variant] || {};
+  const variantClasses = typeof variantActionMap === "string" ? variantActionMap : variantActionMap[action] ?? variantActionMap.muted ?? "";
+  const baseClasses = "inline-flex items-center justify-center rounded-xs font-medium gap-1 relative";
+  const baseClassesIcon = "flex items-center";
+  if (variant === "notification") {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx(Bell, { size: 24, className: "text-primary-950" }),
+          notificationActive && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-testid": "notification-dot",
+              className: "absolute top-[5px] right-[10px] block h-2 w-2 rounded-full bg-indicator-error ring-2 ring-white"
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
+      ...props,
+      children: [
+        iconLeft && /* @__PURE__ */ jsx("span", { className: `${baseClassesIcon} ${sizeClassesIcon}`, children: iconLeft }),
+        children,
+        iconRight && /* @__PURE__ */ jsx("span", { className: `${baseClassesIcon} ${sizeClassesIcon}`, children: iconRight })
+      ]
+    }
+  );
+};
+
+export {
+  Badge
+};

package/dist/chunk-IB4IJ3GF.mjs

@@ -0,0 +1,60 @@
+// src/components/Button/Button.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var VARIANT_ACTION_CLASSES = {
+  solid: {
+    primary: "bg-primary-950 text-text border border-primary-950 hover:bg-primary-800 hover:border-primary-800 focus-visible:outline-none focus-visible:bg-primary-950 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-primary-700 active:border-primary-700 disabled:bg-primary-500 disabled:border-primary-500 disabled:opacity-40 disabled:cursor-not-allowed",
+    positive: "bg-success-500 text-text border border-success-500 hover:bg-success-600 hover:border-success-600 focus-visible:outline-none focus-visible:bg-success-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-success-700 active:border-success-700 disabled:bg-success-500 disabled:border-success-500 disabled:opacity-40 disabled:cursor-not-allowed",
+    negative: "bg-error-500 text-text border border-error-500 hover:bg-error-600 hover:border-error-600 focus-visible:outline-none focus-visible:bg-error-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-error-700 active:border-error-700 disabled:bg-error-500 disabled:border-error-500 disabled:opacity-40 disabled:cursor-not-allowed"
+  },
+  outline: {
+    primary: "bg-transparent text-primary-950 border border-primary-950 hover:bg-background-50 hover:text-primary-400 hover:border-primary-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 active:border-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
+    positive: "bg-transparent text-success-500 border border-success-300 hover:bg-background-50 hover:text-success-400 hover:border-success-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 active:border-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
+    negative: "bg-transparent text-error-500 border border-error-300 hover:bg-background-50 hover:text-error-400 hover:border-error-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 active:border-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
+  },
+  link: {
+    primary: "bg-transparent text-primary-950 hover:text-primary-400 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
+    positive: "bg-transparent text-success-500 hover:text-success-400 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
+    negative: "bg-transparent text-error-500 hover:text-error-400 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
+  }
+};
+var SIZE_CLASSES = {
+  "extra-small": "text-xs px-3.5 py-2",
+  small: "text-sm px-4 py-2.5",
+  medium: "text-md px-5 py-2.5",
+  large: "text-lg px-6 py-3",
+  "extra-large": "text-lg px-7 py-3.5"
+};
+var Button = ({
+  children,
+  iconLeft,
+  iconRight,
+  size = "medium",
+  variant = "solid",
+  action = "primary",
+  className = "",
+  disabled,
+  type = "button",
+  ...props
+}) => {
+  const sizeClasses = SIZE_CLASSES[size];
+  const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
+  const baseClasses = "inline-flex items-center justify-center rounded-full cursor-pointer font-medium";
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      className: `${baseClasses} ${variantClasses} ${sizeClasses} ${className}`,
+      disabled,
+      type,
+      ...props,
+      children: [
+        iconLeft && /* @__PURE__ */ jsx("span", { className: "mr-2 flex items-center", children: iconLeft }),
+        children,
+        iconRight && /* @__PURE__ */ jsx("span", { className: "ml-2 flex items-center", children: iconRight })
+      ]
+    }
+  );
+};
+
+export {
+  Button
+};

package/dist/chunk-IH5TEC64.mjs

@@ -0,0 +1,35 @@
+import {
+  Toast
+} from "./chunk-MI5FIRHM.mjs";
+import {
+  useToastStore
+} from "./chunk-WIOCQOM7.mjs";
+
+// src/components/Toast/utils/Toaster.tsx
+import { Fragment, jsx } from "react/jsx-runtime";
+var Toaster = () => {
+  const toasts = useToastStore((state) => state.toasts);
+  const removeToast = useToastStore((state) => state.removeToast);
+  return /* @__PURE__ */ jsx(Fragment, { children: toasts.map((toast) => /* @__PURE__ */ jsx(
+    Toast,
+    {
+      title: toast.title,
+      description: toast.description,
+      variant: toast.variant,
+      action: toast.action,
+      position: toast.position,
+      onClose: () => removeToast(toast.id)
+    },
+    toast.id
+  )) });
+};
+var useToast = () => {
+  const addToast = useToastStore((state) => state.addToast);
+  const removeToast = useToastStore((state) => state.removeToast);
+  return { addToast, removeToast };
+};
+
+export {
+  Toaster,
+  useToast
+};

package/dist/chunk-JNPCNN67.mjs

@@ -0,0 +1,86 @@
+import {
+  Text
+} from "./chunk-TT3VCQGR.mjs";
+
+// src/components/Alert/Alert.tsx
+import { CheckCircle, Info, WarningCircle, XCircle } from "phosphor-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var VARIANT_ACTION_CLASSES = {
+  solid: {
+    default: "bg-background-50 border-transparent",
+    info: "bg-info border-transparent",
+    success: "bg-success border-transparent",
+    warning: "bg-warning border-transparent",
+    error: "bg-error border-transparent"
+  },
+  outline: {
+    default: "bg-background border border-border-100",
+    info: "bg-background border border-border-100",
+    success: "bg-background border border-border-100",
+    warning: "bg-background border border-border-100",
+    error: "bg-background border border-border-100"
+  }
+};
+var COLOR_CLASSES = {
+  default: "text-text-950",
+  info: "text-info-800",
+  success: "text-success-800",
+  warning: "text-warning-800",
+  error: "text-error-800"
+};
+var ICONS = {
+  default: /* @__PURE__ */ jsx(CheckCircle, { size: 18 }),
+  info: /* @__PURE__ */ jsx(Info, { size: 18 }),
+  success: /* @__PURE__ */ jsx(CheckCircle, { size: 18 }),
+  warning: /* @__PURE__ */ jsx(WarningCircle, { size: 18 }),
+  error: /* @__PURE__ */ jsx(XCircle, { size: 18 })
+};
+var Alert = ({
+  variant = "solid",
+  title,
+  description,
+  action = "default",
+  className,
+  ...props
+}) => {
+  const baseClasses = "alert-wrapper flex items-start gap-2 w-[384px] py-3 px-4 font-inherit rounded-md";
+  const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
+  const variantColor = COLOR_CLASSES[action];
+  const variantIcon = ICONS[action];
+  const hasHeading = Boolean(title);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `${baseClasses} ${variantClasses} ${className ?? ""}`,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: `mt-0.5 ${variantColor}`, children: variantIcon }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          hasHeading && /* @__PURE__ */ jsx(
+            Text,
+            {
+              size: "md",
+              weight: "medium",
+              color: variantColor,
+              className: "mb-0.5",
+              children: title
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Text,
+            {
+              size: hasHeading ? "sm" : "md",
+              weight: "normal",
+              color: !hasHeading ? variantColor : "text-text-700",
+              children: description
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+
+export {
+  Alert
+};

package/dist/chunk-KT6HNGRV.mjs

@@ -0,0 +1,241 @@
+// src/components/DropdownMenu/DropdownMenu.tsx
+import {
+  createContext,
+  useState,
+  useCallback,
+  useContext,
+  forwardRef,
+  useEffect,
+  useRef,
+  useMemo
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DropdownMenuContext = createContext(
+  void 0
+);
+var DropdownMenu = ({ children, open, onOpenChange }) => {
+  const [internalOpen, setInternalOpen] = useState(false);
+  const isControlled = open !== void 0;
+  const currentOpen = isControlled ? open : internalOpen;
+  const setOpen = useCallback(
+    (newOpen) => {
+      if (onOpenChange) onOpenChange(newOpen);
+      if (!isControlled) setInternalOpen(newOpen);
+    },
+    [isControlled, onOpenChange]
+  );
+  const menuRef = useRef(null);
+  const handleArrowDownOrArrowUp = (event) => {
+    const menuContent = menuRef.current?.querySelector('[role="menu"]');
+    if (menuContent) {
+      event.preventDefault();
+      const items = Array.from(
+        menuContent.querySelectorAll(
+          '[role="menuitem"]:not([aria-disabled="true"])'
+        )
+      ).filter((el) => el instanceof HTMLElement);
+      if (items.length === 0) return;
+      const focusedItem = document.activeElement;
+      const currentIndex = items.findIndex((item) => item === focusedItem);
+      let nextIndex;
+      if (event.key === "ArrowDown") {
+        nextIndex = currentIndex === -1 ? 0 : (currentIndex + 1) % items.length;
+      } else {
+        nextIndex = currentIndex === -1 ? items.length - 1 : (currentIndex - 1 + items.length) % items.length;
+      }
+      items[nextIndex]?.focus();
+    }
+  };
+  const handleDownkey = (event) => {
+    if (event.key === "Escape") {
+      setOpen(false);
+    } else if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      handleArrowDownOrArrowUp(event);
+    }
+  };
+  const handleClickOutside = (event) => {
+    if (menuRef.current && !menuRef.current.contains(event.target)) {
+      setOpen(false);
+    }
+  };
+  useEffect(() => {
+    if (currentOpen) {
+      document.addEventListener("mousedown", handleClickOutside);
+      document.addEventListener("keydown", handleDownkey);
+    }
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleDownkey);
+    };
+  }, [currentOpen]);
+  const value = useMemo(
+    () => ({ open: currentOpen, setOpen }),
+    [currentOpen, setOpen]
+  );
+  return /* @__PURE__ */ jsx(DropdownMenuContext.Provider, { value, children: /* @__PURE__ */ jsx("div", { className: "relative", ref: menuRef, children }) });
+};
+var DropdownMenuTrigger = forwardRef(({ className, children, onClick, ...props }, ref) => {
+  const context = useContext(DropdownMenuContext);
+  if (!context)
+    throw new Error("DropdownMenuTrigger must be used within a DropdownMenu");
+  const { open, setOpen } = context;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ref,
+      className: `border border-border-200 cursor-pointer bg-background-muted hover:bg-background-200 transition-colors px-4 py-2 rounded-sm ${className}`,
+      onClick: (e) => {
+        e.stopPropagation();
+        setOpen(!open);
+        if (onClick) onClick(e);
+      },
+      "aria-expanded": open,
+      ...props,
+      children
+    }
+  );
+});
+DropdownMenuTrigger.displayName = "DropdownMenuTrigger";
+var ITEM_SIZE_CLASSES = {
+  small: "text-sm",
+  medium: "text-md"
+};
+var SIDE_CLASSES = {
+  top: "bottom-full",
+  right: "top-full",
+  bottom: "top-full",
+  left: "top-full"
+};
+var ALIGN_CLASSES = {
+  start: "left-0",
+  center: "left-1/2 -translate-x-1/2",
+  end: "right-0"
+};
+var MenuLabel = forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
+  "fieldset",
+  {
+    ref,
+    role: "group",
+    className: `text-sm w-full ${inset ? "pl-8" : ""} ${className ?? ""}`,
+    ...props
+  }
+));
+MenuLabel.displayName = "MenuLabel";
+var MenuContent = forwardRef(
+  ({
+    className,
+    align = "start",
+    side = "bottom",
+    sideOffset = 4,
+    children,
+    ...props
+  }, ref) => {
+    const { open } = useContext(DropdownMenuContext);
+    const [isVisible, setIsVisible] = useState(open);
+    useEffect(() => {
+      if (open) {
+        setIsVisible(true);
+      } else {
+        const timer = setTimeout(() => setIsVisible(false), 200);
+        return () => clearTimeout(timer);
+      }
+    }, [open]);
+    if (!isVisible) return null;
+    const getPositionClasses = () => {
+      const vertical = SIDE_CLASSES[side];
+      const horizontal = ALIGN_CLASSES[align];
+      return `absolute ${vertical} ${horizontal}`;
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "menu",
+        className: `
+        bg-background z-50 min-w-[210px] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md border-border-100
+        ${open ? "animate-in fade-in-0 zoom-in-95" : "animate-out fade-out-0 zoom-out-95"}
+        ${getPositionClasses()}
+        ${className}
+      `,
+        style: {
+          marginTop: side === "bottom" ? sideOffset : void 0,
+          marginBottom: side === "top" ? sideOffset : void 0,
+          marginLeft: side === "right" ? sideOffset : void 0,
+          marginRight: side === "left" ? sideOffset : void 0
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+MenuContent.displayName = "MenuContent";
+var MenuItem = forwardRef(
+  ({
+    className,
+    inset,
+    size = "small",
+    children,
+    iconRight,
+    iconLeft,
+    disabled = false,
+    onClick,
+    ...props
+  }, ref) => {
+    const sizeClasses = ITEM_SIZE_CLASSES[size];
+    const handleClick = (e) => {
+      if (disabled) {
+        e.preventDefault();
+        e.stopPropagation();
+        return;
+      }
+      onClick?.(e);
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        role: "menuitem",
+        "aria-disabled": disabled,
+        className: `
+          focus-visible:bg-background-50
+          relative flex select-none items-center gap-2 rounded-sm p-3 text-sm outline-none transition-colors [&>svg]:size-4 [&>svg]:shrink-0
+          ${inset && "pl-8"}
+          ${sizeClasses}
+          ${className}
+          ${disabled ? "cursor-not-allowed text-text-400" : "cursor-pointer hover:bg-background-50 text-text-700 focus:bg-accent focus:text-accent-foreground hover:bg-accent hover:text-accent-foreground"}
+        `,
+        onClick: handleClick,
+        onKeyDown: (e) => {
+          if (e.key === "Enter" || e.key === " ") handleClick(e);
+        },
+        tabIndex: disabled ? -1 : 0,
+        ...props,
+        children: [
+          iconLeft,
+          children,
+          iconRight
+        ]
+      }
+    );
+  }
+);
+MenuItem.displayName = "MenuItem";
+var MenuSeparator = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    className: `my-1 h-px bg-border-200 ${className}`,
+    ...props
+  }
+));
+MenuSeparator.displayName = "MenuSeparator";
+
+export {
+  DropdownMenu,
+  DropdownMenuTrigger,
+  MenuLabel,
+  MenuContent,
+  MenuItem,
+  MenuSeparator
+};