// src/components/Support/components/TicketModal.tsx
import { useState as useState2, useEffect as useEffect3, useCallback } from "react";
import dayjs from "dayjs";
import "dayjs/locale/pt-br";

// src/components/Badge/Badge.tsx
import { Bell } from "phosphor-react";

// src/utils/utils.ts
import { clsx } from "clsx";
import { twMerge } from "tailwind-merge";
function cn(...inputs) {
  return twMerge(clsx(inputs));
}

// src/components/Badge/Badge.tsx
import { jsx, jsxs } from "react/jsx-runtime";
var VARIANT_ACTION_CLASSES = {
  solid: {
    error: "bg-error-background 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-700 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"
  },
  examsOutlined: {
    exam1: "bg-exam-1 text-info-700 border border-info-700 focus-visible:outline-none",
    exam2: "bg-exam-2 text-typography-1 border border-typography-1 focus-visible:outline-none",
    exam3: "bg-exam-3 text-typography-2 border border-typography-2 focus-visible:outline-none",
    exam4: "bg-exam-4 text-success-700 border border-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-normal gap-1 relative";
  const baseClassesIcon = "flex items-center";
  if (variant === "notification") {
    return /* @__PURE__ */ jsxs(
      "div",
      {
        className: cn(baseClasses, variantClasses, sizeClasses, className),
        ...props,
        children: [
          /* @__PURE__ */ jsx(Bell, { size: 24, className: "text-current", "aria-hidden": "true" }),
          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: cn(baseClasses, variantClasses, sizeClasses, className),
      ...props,
      children: [
        iconLeft && /* @__PURE__ */ jsx("span", { className: cn(baseClassesIcon, sizeClassesIcon), children: iconLeft }),
        children,
        iconRight && /* @__PURE__ */ jsx("span", { className: cn(baseClassesIcon, sizeClassesIcon), children: iconRight })
      ]
    }
  );
};
var Badge_default = Badge;

// src/components/Button/Button.tsx
import { forwardRef } from "react";
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
var VARIANT_ACTION_CLASSES2 = {
  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",
    secondary: "bg-text-950 text-text border border-text-800 hover:bg-text-800 hover:border-text-950 focus-visible:outline-none focus-visible:bg-text-900 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-text-700 active:border-text-700 disabled:bg-text-500 disabled:border-text-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",
    secondary: "bg-transparent text-text-950 border border-text-800 hover:bg-background-50 hover:text-text-700 hover:border-text-700 focus-visible:border-0 focus-visible:outline-none focus-visible:text-text-900 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-text-700 active:border-text-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",
    secondary: "bg-transparent text-text-950 hover:text-text-800 focus-visible:outline-none focus-visible:text-text-900 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-text-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_CLASSES2 = {
  "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 = forwardRef(
  ({
    children,
    iconLeft,
    iconRight,
    size = "medium",
    variant = "solid",
    action = "primary",
    className = "",
    disabled,
    type = "button",
    ...props
  }, ref) => {
    if (variant === "raw") {
      return /* @__PURE__ */ jsxs2(
        "button",
        {
          ref,
          className,
          disabled,
          type,
          ...props,
          children: [
            iconLeft && /* @__PURE__ */ jsx2("span", { className: "mr-2 flex items-center", children: iconLeft }),
            children,
            iconRight && /* @__PURE__ */ jsx2("span", { className: "ml-2 flex items-center", children: iconRight })
          ]
        }
      );
    }
    const sizeClasses = SIZE_CLASSES2[size];
    const variantClasses = VARIANT_ACTION_CLASSES2[variant][action];
    const baseClasses = "inline-flex items-center justify-center rounded-full cursor-pointer font-medium";
    return /* @__PURE__ */ jsxs2(
      "button",
      {
        ref,
        className: cn(baseClasses, variantClasses, sizeClasses, className),
        disabled,
        type,
        ...props,
        children: [
          iconLeft && /* @__PURE__ */ jsx2("span", { className: "mr-2 flex items-center", children: iconLeft }),
          children,
          iconRight && /* @__PURE__ */ jsx2("span", { className: "ml-2 flex items-center", children: iconRight })
        ]
      }
    );
  }
);
Button.displayName = "Button";
var Button_default = Button;

// src/components/Divider/Divider.tsx
import { jsx as jsx3 } from "react/jsx-runtime";
var Divider = ({
  orientation = "horizontal",
  className = "",
  ...props
}) => {
  const baseClasses = "bg-border-200 border-0";
  const orientationClasses = {
    horizontal: "w-full h-px",
    vertical: "h-full w-px"
  };
  return /* @__PURE__ */ jsx3(
    "hr",
    {
      className: cn(baseClasses, orientationClasses[orientation], className),
      "aria-orientation": orientation,
      ...props
    }
  );
};
var Divider_default = Divider;

// src/components/Modal/Modal.tsx
import { useEffect, useId } from "react";
import { X } from "phosphor-react";

// src/components/Modal/utils/videoUtils.ts
var isYouTubeUrl = (url) => {
  const youtubeRegex = /^(https?:\/\/)?((www|m|music)\.)?(youtube\.com|youtu\.be|youtube-nocookie\.com)\/.+/i;
  return youtubeRegex.test(url);
};
var isValidYouTubeHost = (host) => {
  if (host === "youtu.be") return "youtu.be";
  const isValidYouTubeCom = host === "youtube.com" || host.endsWith(".youtube.com") && /^(www|m|music)\.youtube\.com$/.test(host);
  if (isValidYouTubeCom) return "youtube";
  const isValidNoCookie = host === "youtube-nocookie.com" || host.endsWith(".youtube-nocookie.com") && /^(www|m|music)\.youtube-nocookie\.com$/.test(host);
  if (isValidNoCookie) return "nocookie";
  return null;
};
var extractYoutuBeId = (pathname) => {
  const firstSeg = pathname.split("/").filter(Boolean)[0];
  return firstSeg || null;
};
var extractYouTubeId = (pathname, searchParams) => {
  const parts = pathname.split("/").filter(Boolean);
  const [first, second] = parts;
  if (first === "embed" && second) return second;
  if (first === "shorts" && second) return second;
  if (first === "live" && second) return second;
  const v = searchParams.get("v");
  if (v) return v;
  return null;
};
var getYouTubeVideoId = (url) => {
  try {
    const u = new URL(url);
    const hostType = isValidYouTubeHost(u.hostname.toLowerCase());
    if (!hostType) return null;
    if (hostType === "youtu.be") {
      return extractYoutuBeId(u.pathname);
    }
    return extractYouTubeId(u.pathname, u.searchParams);
  } catch {
    return null;
  }
};
var getYouTubeEmbedUrl = (videoId) => {
  return `https://www.youtube-nocookie.com/embed/${videoId}?autoplay=0&rel=0&modestbranding=1`;
};

// src/components/Modal/Modal.tsx
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
var SIZE_CLASSES3 = {
  xs: "max-w-[360px]",
  sm: "max-w-[420px]",
  md: "max-w-[510px]",
  lg: "max-w-[640px]",
  xl: "max-w-[970px]"
};
var Modal = ({
  isOpen,
  onClose,
  title,
  children,
  size = "md",
  className = "",
  closeOnEscape = true,
  footer,
  hideCloseButton = false,
  variant = "default",
  description,
  image,
  imageAlt,
  actionLink,
  actionLabel,
  contentClassName = ""
}) => {
  const titleId = useId();
  useEffect(() => {
    if (!isOpen || !closeOnEscape) return;
    const handleEscape = (event) => {
      if (event.key === "Escape") {
        onClose();
      }
    };
    document.addEventListener("keydown", handleEscape);
    return () => document.removeEventListener("keydown", handleEscape);
  }, [isOpen, closeOnEscape, onClose]);
  useEffect(() => {
    if (!isOpen) return;
    const scrollbarWidth = window.innerWidth - document.documentElement.clientWidth;
    const originalOverflow = document.body.style.overflow;
    const originalPaddingRight = document.body.style.paddingRight;
    document.body.style.overflow = "hidden";
    if (scrollbarWidth > 0) {
      document.body.style.paddingRight = `${scrollbarWidth}px`;
      const overlay = document.createElement("div");
      overlay.id = "modal-scrollbar-overlay";
      overlay.style.cssText = `
        position: fixed;
        top: 0;
        right: 0;
        width: ${scrollbarWidth}px;
        height: 100vh;
        background-color: rgb(0 0 0 / 0.6);
        z-index: 40;
        pointer-events: none;
      `;
      document.body.appendChild(overlay);
    }
    return () => {
      document.body.style.overflow = originalOverflow;
      document.body.style.paddingRight = originalPaddingRight;
      const overlay = document.getElementById("modal-scrollbar-overlay");
      if (overlay) {
        overlay.remove();
      }
    };
  }, [isOpen]);
  if (!isOpen) return null;
  const sizeClasses = SIZE_CLASSES3[size];
  const baseClasses = "bg-secondary-50 rounded-3xl shadow-hard-shadow-2 border border-border-100 w-full mx-4 max-h-[calc(100dvh-2rem)] flex flex-col overflow-hidden";
  const dialogResetClasses = "p-0 m-0 border-none outline-none static";
  const modalClasses = cn(
    baseClasses,
    sizeClasses,
    dialogResetClasses,
    className
  );
  const normalizeUrl = (href) => /^https?:\/\//i.test(href) ? href : `https://${href}`;
  const handleActionClick = () => {
    if (actionLink) {
      window.open(normalizeUrl(actionLink), "_blank", "noopener,noreferrer");
    }
  };
  if (variant === "activity") {
    return /* @__PURE__ */ jsx4("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-xs border-none p-0 m-0 w-full cursor-default", children: /* @__PURE__ */ jsxs3(
      "dialog",
      {
        className: modalClasses,
        "aria-labelledby": titleId,
        "aria-modal": "true",
        open: true,
        children: [
          /* @__PURE__ */ jsx4("div", { className: "flex justify-end p-6 pb-0", children: !hideCloseButton && /* @__PURE__ */ jsx4(
            "button",
            {
              onClick: onClose,
              className: "p-1 text-text-500 hover:text-text-700 hover:bg-background-50 rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-indicator-info focus:ring-offset-2",
              "aria-label": "Fechar modal",
              children: /* @__PURE__ */ jsx4(X, { size: 18 })
            }
          ) }),
          /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center px-6 pb-6 gap-5 flex-1 min-h-0 overflow-y-auto", children: [
            image && /* @__PURE__ */ jsx4("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx4(
              "img",
              {
                src: image,
                alt: imageAlt ?? "",
                className: "w-[122px] h-[122px] object-contain"
              }
            ) }),
            /* @__PURE__ */ jsx4(
              "h2",
              {
                id: titleId,
                className: "text-lg font-semibold text-text-950 text-center",
                children: title
              }
            ),
            description && /* @__PURE__ */ jsx4("p", { className: "text-sm font-normal text-text-400 text-center max-w-md leading-[21px]", children: description }),
            actionLink && /* @__PURE__ */ jsxs3("div", { className: "w-full", children: [
              (() => {
                const normalized = normalizeUrl(actionLink);
                const isYT = isYouTubeUrl(normalized);
                if (!isYT) return null;
                const id = getYouTubeVideoId(normalized);
                if (!id) {
                  return /* @__PURE__ */ jsx4(
                    Button_default,
                    {
                      variant: "solid",
                      action: "primary",
                      size: "large",
                      className: "w-full",
                      onClick: handleActionClick,
                      children: actionLabel || "Iniciar Atividade"
                    }
                  );
                }
                return /* @__PURE__ */ jsx4(
                  "iframe",
                  {
                    src: getYouTubeEmbedUrl(id),
                    className: "w-full aspect-video rounded-lg",
                    allowFullScreen: true,
                    allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
                    title: "V\xEDdeo YouTube"
                  }
                );
              })(),
              !isYouTubeUrl(normalizeUrl(actionLink)) && /* @__PURE__ */ jsx4(
                Button_default,
                {
                  variant: "solid",
                  action: "primary",
                  size: "large",
                  className: "w-full",
                  onClick: handleActionClick,
                  children: actionLabel || "Iniciar Atividade"
                }
              )
            ] })
          ] })
        ]
      }
    ) });
  }
  return /* @__PURE__ */ jsx4("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 backdrop-blur-xs border-none p-0 m-0 w-full cursor-default", children: /* @__PURE__ */ jsxs3(
    "dialog",
    {
      className: modalClasses,
      "aria-labelledby": titleId,
      "aria-modal": "true",
      open: true,
      children: [
        /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between px-6 py-6", children: [
          /* @__PURE__ */ jsx4("h2", { id: titleId, className: "text-lg font-semibold text-text-950", children: title }),
          !hideCloseButton && /* @__PURE__ */ jsx4(
            "button",
            {
              onClick: onClose,
              className: "p-1 text-text-500 hover:text-text-700 hover:bg-background-50 rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-indicator-info focus:ring-offset-2",
              "aria-label": "Fechar modal",
              children: /* @__PURE__ */ jsx4(X, { size: 18 })
            }
          )
        ] }),
        children && /* @__PURE__ */ jsx4(
          "div",
          {
            className: cn(
              "px-6 pb-6 flex-1 min-h-0 overflow-y-auto",
              contentClassName
            ),
            children: /* @__PURE__ */ jsx4(
              "div",
              {
                className: cn(
                  "text-text-500 font-normal text-sm leading-6",
                  contentClassName?.includes("flex") && "flex flex-col flex-1 min-h-0"
                ),
                children
              }
            )
          }
        ),
        footer && /* @__PURE__ */ jsx4("div", { className: "flex justify-end gap-3 px-6 pb-6", children: footer })
      ]
    }
  ) });
};
var Modal_default = Modal;

// src/components/Text/Text.tsx
import { jsx as jsx5 } from "react/jsx-runtime";
var Text = ({
  children,
  size = "md",
  weight = "normal",
  color = "text-text-950",
  as,
  className = "",
  ...props
}) => {
  let sizeClasses;
  let weightClasses;
  const sizeClassMap = {
    "2xs": "text-2xs",
    xs: "text-xs",
    sm: "text-sm",
    md: "text-md",
    lg: "text-lg",
    xl: "text-xl",
    "2xl": "text-2xl",
    "3xl": "text-3xl",
    "4xl": "text-4xl",
    "5xl": "text-5xl",
    "6xl": "text-6xl"
  };
  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
  const weightClassMap = {
    hairline: "font-hairline",
    light: "font-light",
    normal: "font-normal",
    medium: "font-medium",
    semibold: "font-semibold",
    bold: "font-bold",
    extrabold: "font-extrabold",
    black: "font-black"
  };
  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
  const baseClasses = "font-primary";
  const Component = as ?? "p";
  return /* @__PURE__ */ jsx5(
    Component,
    {
      className: cn(baseClasses, sizeClasses, weightClasses, color, className),
      ...props,
      children
    }
  );
};
var Text_default = Text;

// src/components/TextArea/TextArea.tsx
import {
  forwardRef as forwardRef2,
  useState,
  useId as useId2,
  useEffect as useEffect2,
  useRef,
  useImperativeHandle
} from "react";
import { WarningCircle } from "phosphor-react";
import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
var SIZE_CLASSES4 = {
  small: {
    textarea: "h-24 text-sm",
    // 96px height, 14px font
    textSize: "sm"
  },
  medium: {
    textarea: "h-24 text-base",
    // 96px height, 16px font
    textSize: "md"
  },
  large: {
    textarea: "h-24 text-lg",
    // 96px height, 18px font
    textSize: "lg"
  },
  extraLarge: {
    textarea: "h-24 text-xl",
    // 96px height, 20px font
    textSize: "xl"
  }
};
var BASE_TEXTAREA_CLASSES = "w-full box-border p-3 bg-background border border-solid rounded-[4px] resize-none focus:outline-none font-roboto font-normal leading-[150%] placeholder:text-text-600 transition-all duration-200";
var STATE_CLASSES = {
  default: {
    base: "border-border-300 bg-background text-text-600",
    hover: "hover:border-border-400",
    focus: "focus:border-border-500"
  },
  hovered: {
    base: "border-border-400 bg-background text-text-600",
    hover: "",
    focus: "focus:border-border-500"
  },
  focused: {
    base: "border-2 border-primary-950 bg-background text-text-900",
    hover: "",
    focus: ""
  },
  invalid: {
    base: "border-2 border-red-700 bg-white text-gray-800",
    hover: "hover:border-red-700",
    focus: "focus:border-red-700"
  },
  disabled: {
    base: "border-border-300 bg-background text-text-600 cursor-not-allowed opacity-40",
    hover: "",
    focus: ""
  }
};
var TextArea = forwardRef2(
  ({
    label,
    size = "medium",
    state = "default",
    errorMessage,
    helperMessage,
    className = "",
    labelClassName = "",
    disabled,
    id,
    onChange,
    placeholder,
    required,
    showCharacterCount = false,
    maxLength,
    value,
    autoResize = false,
    minHeight = 96,
    ...props
  }, ref) => {
    const generatedId = useId2();
    const inputId = id ?? `textarea-${generatedId}`;
    const internalRef = useRef(null);
    useImperativeHandle(ref, () => internalRef.current);
    const [isFocused, setIsFocused] = useState(false);
    const currentLength = typeof value === "string" ? value.length : 0;
    const isNearLimit = maxLength && currentLength >= maxLength * 0.8;
    useEffect2(() => {
      if (autoResize && internalRef.current) {
        const textarea = internalRef.current;
        textarea.style.height = "auto";
        textarea.style.height = `${Math.max(textarea.scrollHeight, minHeight)}px`;
      }
    }, [autoResize, minHeight, value]);
    const handleChange = (event) => {
      onChange?.(event);
    };
    const handleFocus = (event) => {
      setIsFocused(true);
      props.onFocus?.(event);
    };
    const handleBlur = (event) => {
      setIsFocused(false);
      props.onBlur?.(event);
    };
    let currentState = disabled ? "disabled" : state;
    if (isFocused && currentState !== "invalid" && currentState !== "disabled") {
      currentState = "focused";
    }
    const sizeClasses = SIZE_CLASSES4[size];
    const stateClasses = STATE_CLASSES[currentState];
    const heightClasses = autoResize ? "h-auto overflow-hidden" : sizeClasses.textarea;
    const fontSizeClass = sizeClasses.textarea.split(" ").find((c) => c.startsWith("text-")) ?? "text-base";
    const textareaClasses = cn(
      BASE_TEXTAREA_CLASSES,
      autoResize ? fontSizeClass : sizeClasses.textarea,
      heightClasses,
      stateClasses.base,
      stateClasses.hover,
      stateClasses.focus,
      className
    );
    return /* @__PURE__ */ jsxs4("div", { className: `flex flex-col`, children: [
      label && /* @__PURE__ */ jsxs4(
        Text_default,
        {
          as: "label",
          htmlFor: inputId,
          size: sizeClasses.textSize,
          weight: "medium",
          color: "text-text-950",
          className: cn("mb-1.5", labelClassName),
          children: [
            label,
            " ",
            required && /* @__PURE__ */ jsx6("span", { className: "text-indicator-error", children: "*" })
          ]
        }
      ),
      /* @__PURE__ */ jsx6(
        "textarea",
        {
          ref: internalRef,
          id: inputId,
          disabled,
          onChange: handleChange,
          onFocus: handleFocus,
          onBlur: handleBlur,
          className: textareaClasses,
          placeholder,
          required,
          maxLength,
          value,
          ...props
        }
      ),
      errorMessage && /* @__PURE__ */ jsxs4("p", { className: "flex gap-1 items-center text-sm text-indicator-error mt-1.5", children: [
        /* @__PURE__ */ jsx6(WarningCircle, { size: 16 }),
        " ",
        errorMessage
      ] }),
      !errorMessage && showCharacterCount && maxLength && /* @__PURE__ */ jsxs4(
        Text_default,
        {
          size: "sm",
          weight: "normal",
          className: `mt-1.5 ${isNearLimit ? "text-indicator-warning" : "text-text-500"}`,
          children: [
            currentLength,
            "/",
            maxLength,
            " caracteres"
          ]
        }
      ),
      !errorMessage && helperMessage && !(showCharacterCount && maxLength) && /* @__PURE__ */ jsx6(Text_default, { size: "sm", weight: "normal", className: "mt-1.5 text-text-500", children: helperMessage })
    ] });
  }
);
TextArea.displayName = "TextArea";
var TextArea_default = TextArea;

// src/components/Skeleton/Skeleton.tsx
import { forwardRef as forwardRef3 } from "react";
import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
var SKELETON_ANIMATION_CLASSES = {
  pulse: "animate-pulse",
  none: ""
};
var SKELETON_VARIANT_CLASSES = {
  text: "h-4 bg-background-200 rounded",
  circular: "bg-background-200 rounded-full",
  rectangular: "bg-background-200",
  rounded: "bg-background-200 rounded-lg"
};
var SPACING_CLASSES = {
  none: "",
  small: "space-y-1",
  medium: "space-y-2",
  large: "space-y-3"
};
var Skeleton = forwardRef3(
  ({
    variant = "text",
    width,
    height,
    animation = "pulse",
    lines = 1,
    spacing = "none",
    className = "",
    children,
    ...props
  }, ref) => {
    const animationClass = SKELETON_ANIMATION_CLASSES[animation];
    const variantClass = SKELETON_VARIANT_CLASSES[variant];
    const spacingClass = SPACING_CLASSES[spacing];
    const style = {
      width: typeof width === "number" ? `${width}px` : width,
      height: typeof height === "number" ? `${height}px` : height
    };
    if (variant === "text" && lines > 1) {
      return /* @__PURE__ */ jsx7(
        "div",
        {
          ref,
          className: cn("flex flex-col", spacingClass, className),
          ...props,
          children: Array.from({ length: lines }, (_, index) => /* @__PURE__ */ jsx7(
            "div",
            {
              className: cn(variantClass, animationClass),
              style: index === lines - 1 ? { width: "60%" } : void 0
            },
            index
          ))
        }
      );
    }
    return /* @__PURE__ */ jsx7(
      "div",
      {
        ref,
        className: cn(variantClass, animationClass, className),
        style,
        ...props,
        children
      }
    );
  }
);
var SkeletonText = forwardRef3(
  (props, ref) => /* @__PURE__ */ jsx7(Skeleton, { ref, variant: "text", ...props })
);
var SkeletonCircle = forwardRef3((props, ref) => /* @__PURE__ */ jsx7(Skeleton, { ref, variant: "circular", ...props }));
var SkeletonRectangle = forwardRef3((props, ref) => /* @__PURE__ */ jsx7(Skeleton, { ref, variant: "rectangular", ...props }));
var SkeletonRounded = forwardRef3((props, ref) => /* @__PURE__ */ jsx7(Skeleton, { ref, variant: "rounded", ...props }));
var SkeletonCard = forwardRef3(
  ({
    showAvatar = true,
    showTitle = true,
    showDescription = true,
    showActions = true,
    lines = 2,
    className = "",
    ...props
  }, ref) => {
    return /* @__PURE__ */ jsxs5(
      "div",
      {
        ref,
        className: cn(
          "w-full p-4 bg-background border border-border-200 rounded-lg",
          className
        ),
        ...props,
        children: [
          /* @__PURE__ */ jsxs5("div", { className: "flex items-start space-x-3", children: [
            showAvatar && /* @__PURE__ */ jsx7(SkeletonCircle, { width: 40, height: 40 }),
            /* @__PURE__ */ jsxs5("div", { className: "flex-1 space-y-2", children: [
              showTitle && /* @__PURE__ */ jsx7(SkeletonText, { width: "60%", height: 20 }),
              showDescription && /* @__PURE__ */ jsx7(SkeletonText, { lines, spacing: "small" })
            ] })
          ] }),
          showActions && /* @__PURE__ */ jsxs5("div", { className: "flex justify-end space-x-2 mt-4", children: [
            /* @__PURE__ */ jsx7(SkeletonRectangle, { width: 80, height: 32 }),
            /* @__PURE__ */ jsx7(SkeletonRectangle, { width: 80, height: 32 })
          ] })
        ]
      }
    );
  }
);
var SkeletonList = forwardRef3(
  ({
    items = 3,
    showAvatar = true,
    showTitle = true,
    showDescription = true,
    lines = 1,
    className = "",
    ...props
  }, ref) => {
    return /* @__PURE__ */ jsx7("div", { ref, className: cn("space-y-3", className), ...props, children: Array.from({ length: items }, (_, index) => /* @__PURE__ */ jsxs5("div", { className: "flex items-start space-x-3 p-3", children: [
      showAvatar && /* @__PURE__ */ jsx7(SkeletonCircle, { width: 32, height: 32 }),
      /* @__PURE__ */ jsxs5("div", { className: "flex-1 space-y-2", children: [
        showTitle && /* @__PURE__ */ jsx7(SkeletonText, { width: "40%", height: 16 }),
        showDescription && /* @__PURE__ */ jsx7(SkeletonText, { lines, spacing: "small" })
      ] })
    ] }, index)) });
  }
);
var SkeletonTable = forwardRef3(
  ({ rows = 5, columns = 4, showHeader = true, className = "", ...props }, ref) => {
    return /* @__PURE__ */ jsxs5("div", { ref, className: cn("w-full", className), ...props, children: [
      showHeader && /* @__PURE__ */ jsx7("div", { className: "flex space-x-2 mb-3", children: Array.from({ length: columns }, (_, index) => /* @__PURE__ */ jsx7(
        SkeletonText,
        {
          width: `${100 / columns}%`,
          height: 20
        },
        index
      )) }),
      /* @__PURE__ */ jsx7("div", { className: "space-y-2", children: Array.from({ length: rows }, (_, rowIndex) => /* @__PURE__ */ jsx7("div", { className: "flex space-x-2", children: Array.from({ length: columns }, (_2, colIndex) => /* @__PURE__ */ jsx7(
        SkeletonText,
        {
          width: `${100 / columns}%`,
          height: 16
        },
        colIndex
      )) }, rowIndex)) })
    ] });
  }
);

// src/types/support.ts
var getStatusBadgeAction = (status) => {
  switch (status) {
    case "aberto" /* ABERTO */:
      return "success";
    case "respondido" /* RESPONDIDO */:
      return "warning";
    case "encerrado" /* ENCERRADO */:
      return "info";
    default:
      return "info";
  }
};
var getStatusText = (status) => {
  switch (status) {
    case "aberto" /* ABERTO */:
      return "Aberto";
    case "respondido" /* RESPONDIDO */:
      return "Respondido";
    case "encerrado" /* ENCERRADO */:
      return "Encerrado";
    default:
      return status;
  }
};
var getCategoryText = (category) => {
  if (!category) return "";
  switch (category) {
    case "acesso" /* ACESSO */:
      return "Acesso";
    case "tecnico" /* TECNICO */:
      return "T\xE9cnico";
    case "outros" /* OUTROS */:
      return "Outros";
    default:
      return category;
  }
};

// src/components/Support/utils/supportUtils.tsx
import { KeyIcon, BugIcon, InfoIcon } from "@phosphor-icons/react";
import { jsx as jsx8 } from "react/jsx-runtime";
var getCategoryIcon = (category, size = 16) => {
  if (!category) return null;
  switch (category) {
    case "acesso" /* ACESSO */:
      return /* @__PURE__ */ jsx8(KeyIcon, { size });
    case "tecnico" /* TECNICO */:
      return /* @__PURE__ */ jsx8(BugIcon, { size });
    case "outros" /* OUTROS */:
      return /* @__PURE__ */ jsx8(InfoIcon, { size });
    default:
      return /* @__PURE__ */ jsx8(InfoIcon, { size });
  }
};

// src/components/Support/components/TicketModal.tsx
import { Fragment, jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
dayjs.locale("pt-br");
var AnswerSkeleton = () => /* @__PURE__ */ jsxs6("div", { className: "bg-background p-4 space-y-6 rounded-xl", children: [
  /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
    /* @__PURE__ */ jsx9(SkeletonText, { width: "80px", height: 16 }),
    /* @__PURE__ */ jsx9(SkeletonText, { width: "200px", height: 16 })
  ] }),
  /* @__PURE__ */ jsx9(Divider_default, {}),
  /* @__PURE__ */ jsxs6("div", { className: "flex items-start space-x-6", children: [
    /* @__PURE__ */ jsx9(SkeletonText, { width: "80px", height: 16 }),
    /* @__PURE__ */ jsxs6("div", { className: "flex-1 space-y-2", children: [
      /* @__PURE__ */ jsx9(SkeletonText, { width: "100%", height: 16 }),
      /* @__PURE__ */ jsx9(SkeletonText, { width: "80%", height: 16 }),
      /* @__PURE__ */ jsx9(SkeletonText, { width: "60%", height: 16 })
    ] })
  ] })
] });
var TicketModal = ({
  ticket,
  isOpen,
  onClose,
  onTicketClose,
  apiClient,
  userId
}) => {
  const [showCloseConfirmation, setShowCloseConfirmation] = useState2(false);
  const [responseText, setResponseText] = useState2("");
  const [answers, setAnswers] = useState2([]);
  const [isSubmittingAnswer, setIsSubmittingAnswer] = useState2(false);
  const [isLoadingAnswers, setIsLoadingAnswers] = useState2(false);
  const handleCloseTicket = () => {
    onTicketClose?.(ticket.id);
    setShowCloseConfirmation(false);
    onClose();
  };
  const fetchAnswers = useCallback(async () => {
    if (!ticket.id || ticket.status !== "respondido" /* RESPONDIDO */) return;
    setIsLoadingAnswers(true);
    try {
      const response = await apiClient.get(
        `/support/answer/${ticket.id}`
      );
      setAnswers(response.data.data || []);
    } catch (error) {
      console.error("Erro ao buscar respostas:", error);
      setAnswers([]);
    } finally {
      setIsLoadingAnswers(false);
    }
  }, [ticket.id, ticket.status, apiClient]);
  const handleSubmitAnswer = async () => {
    if (!responseText.trim() || !userId || !ticket.id) {
      return;
    }
    setIsSubmittingAnswer(true);
    try {
      const requestData = {
        userId,
        supportId: ticket.id,
        answer: responseText.trim()
      };
      await apiClient.post(
        "/support/answer",
        requestData
      );
      setResponseText("");
      await fetchAnswers();
    } catch (error) {
      console.error("Erro ao enviar resposta:", error);
    } finally {
      setIsSubmittingAnswer(false);
    }
  };
  const canCloseTicket = ticket.status !== "encerrado" /* ENCERRADO */;
  useEffect3(() => {
    if (isOpen) {
      setResponseText("");
      (async () => {
        await fetchAnswers();
      })().catch((error) => {
        console.error("Erro ao carregar respostas:", error);
      });
    } else {
      setAnswers([]);
    }
  }, [isOpen, fetchAnswers]);
  return /* @__PURE__ */ jsxs6(Fragment, { children: [
    /* @__PURE__ */ jsx9(
      Modal_default,
      {
        isOpen,
        onClose,
        title: `Pedido: ${ticket.title}`,
        size: "lg",
        hideCloseButton: false,
        closeOnEscape: true,
        "data-testid": "ticket-modal",
        children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col h-full max-h-[80vh]", children: [
          /* @__PURE__ */ jsxs6("div", { className: "flex justify-between items-center mb-3", children: [
            /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "bold", className: "text-text-950", children: "Detalhes" }),
            canCloseTicket && /* @__PURE__ */ jsx9(
              Button_default,
              {
                variant: "outline",
                size: "small",
                action: "negative",
                onClick: () => setShowCloseConfirmation(true),
                children: "Encerrar Pedido"
              }
            )
          ] }),
          /* @__PURE__ */ jsxs6("div", { className: "flex-1 overflow-y-auto pr-2 space-y-6", children: [
            /* @__PURE__ */ jsxs6("div", { className: "bg-background p-4 space-y-6 rounded-xl", children: [
              /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                /* @__PURE__ */ jsx9(
                  Text_default,
                  {
                    size: "md",
                    weight: "semibold",
                    className: "text-text-700 w-20",
                    children: "ID"
                  }
                ),
                /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "normal", className: "text-text-600", children: ticket.id })
              ] }),
              /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                /* @__PURE__ */ jsx9(
                  Text_default,
                  {
                    size: "md",
                    weight: "semibold",
                    className: "text-text-700 w-20",
                    children: "Aberto em"
                  }
                ),
                /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "normal", className: "text-text-600", children: dayjs(ticket.createdAt).format("DD MMMM YYYY, [\xE0s] HH[h]") })
              ] }),
              /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                /* @__PURE__ */ jsx9(
                  Text_default,
                  {
                    size: "md",
                    weight: "semibold",
                    className: "text-text-700 w-20",
                    children: "Status"
                  }
                ),
                /* @__PURE__ */ jsx9(
                  Badge_default,
                  {
                    variant: "solid",
                    size: "small",
                    action: getStatusBadgeAction(ticket.status),
                    className: "w-fit",
                    children: getStatusText(ticket.status)
                  }
                )
              ] }),
              /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                /* @__PURE__ */ jsx9(
                  Text_default,
                  {
                    size: "md",
                    weight: "semibold",
                    className: "text-text-700 w-20",
                    children: "Tipo"
                  }
                ),
                /* @__PURE__ */ jsxs6(
                  Badge_default,
                  {
                    variant: "solid",
                    size: "small",
                    action: "muted",
                    className: "w-fit",
                    children: [
                      getCategoryIcon(ticket.category),
                      getCategoryText(ticket.category)
                    ]
                  }
                )
              ] }),
              /* @__PURE__ */ jsx9(Divider_default, {}),
              /* @__PURE__ */ jsxs6("div", { className: "flex items-start space-x-6", children: [
                /* @__PURE__ */ jsx9(
                  Text_default,
                  {
                    size: "md",
                    weight: "semibold",
                    className: "text-text-700 w-20",
                    children: "Descri\xE7\xE3o"
                  }
                ),
                ticket.description && /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "normal", className: "text-text-600", children: ticket.description })
              ] })
            ] }),
            ticket.status === "respondido" /* RESPONDIDO */ && isLoadingAnswers && /* @__PURE__ */ jsxs6(Fragment, { children: [
              /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "bold", className: "text-text-950 my-6", children: "Resposta de Suporte T\xE9cnico" }),
              /* @__PURE__ */ jsx9(AnswerSkeleton, {})
            ] }),
            !isLoadingAnswers && answers.some((answer) => answer.userId !== userId) && /* @__PURE__ */ jsxs6(Fragment, { children: [
              /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "bold", className: "text-text-950 my-6", children: "Resposta de Suporte T\xE9cnico" }),
              answers.filter((answer) => answer.userId !== userId).sort(
                (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
              ).slice(0, 1).map((answer) => /* @__PURE__ */ jsxs6(
                "div",
                {
                  className: "bg-background p-4 space-y-6 rounded-xl",
                  children: [
                    /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "semibold",
                          className: "text-text-700 w-20",
                          children: "Recebido"
                        }
                      ),
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "normal",
                          className: "text-text-600",
                          children: dayjs(answer.createdAt).format(
                            "DD MMMM YYYY, [\xE0s] HH[h]"
                          )
                        }
                      )
                    ] }),
                    /* @__PURE__ */ jsx9(Divider_default, {}),
                    /* @__PURE__ */ jsxs6("div", { className: "flex items-start space-x-6", children: [
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "semibold",
                          className: "text-text-700 w-20",
                          children: "Resposta"
                        }
                      ),
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "normal",
                          className: "text-text-600",
                          children: answer.answer
                        }
                      )
                    ] })
                  ]
                },
                answer.id
              ))
            ] }),
            !isLoadingAnswers && answers.some((answer) => answer.userId === userId) && /* @__PURE__ */ jsxs6(Fragment, { children: [
              /* @__PURE__ */ jsx9(Text_default, { size: "md", weight: "bold", className: "text-text-950 my-6", children: "Resposta enviada" }),
              answers.filter((answer) => answer.userId === userId).sort(
                (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
              ).slice(0, 1).map((answer) => /* @__PURE__ */ jsxs6(
                "div",
                {
                  className: "bg-background p-4 space-y-6 rounded-xl",
                  children: [
                    /* @__PURE__ */ jsxs6("div", { className: "flex items-center space-x-6", children: [
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "semibold",
                          className: "text-text-700 w-20",
                          children: "Enviada"
                        }
                      ),
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "normal",
                          className: "text-text-600",
                          children: dayjs(answer.createdAt).format(
                            "DD MMMM YYYY, [\xE0s] HH[h]"
                          )
                        }
                      )
                    ] }),
                    /* @__PURE__ */ jsx9(Divider_default, {}),
                    /* @__PURE__ */ jsxs6("div", { className: "flex items-start space-x-6", children: [
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "semibold",
                          className: "text-text-700 w-20",
                          children: "Resposta"
                        }
                      ),
                      /* @__PURE__ */ jsx9(
                        Text_default,
                        {
                          size: "md",
                          weight: "normal",
                          className: "text-text-600",
                          children: answer.answer
                        }
                      )
                    ] })
                  ]
                },
                answer.id
              ))
            ] }),
            !isLoadingAnswers && answers.some((answer) => answer.userId !== userId) && /* @__PURE__ */ jsxs6(Fragment, { children: [
              /* @__PURE__ */ jsx9(Text_default, { size: "lg", weight: "bold", className: "text-text-950 my-6", children: "Responder" }),
              /* @__PURE__ */ jsxs6("div", { className: "space-y-4", children: [
                /* @__PURE__ */ jsx9(
                  TextArea_default,
                  {
                    placeholder: "Detalhe o problema aqui.",
                    rows: 4,
                    className: "w-full",
                    value: responseText,
                    onChange: (e) => setResponseText(e.target.value)
                  }
                ),
                responseText.trim().length > 0 && /* @__PURE__ */ jsx9("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx9(
                  Button_default,
                  {
                    variant: "solid",
                    size: "medium",
                    onClick: handleSubmitAnswer,
                    disabled: isSubmittingAnswer,
                    children: isSubmittingAnswer ? "Enviando..." : "Enviar"
                  }
                ) })
              ] })
            ] })
          ] })
        ] })
      }
    ),
    /* @__PURE__ */ jsx9(
      Modal_default,
      {
        isOpen: showCloseConfirmation,
        onClose: () => setShowCloseConfirmation(false),
        title: "Encerrar pedido?",
        size: "md",
        hideCloseButton: false,
        closeOnEscape: true,
        "data-testid": "close-ticket-modal",
        children: /* @__PURE__ */ jsxs6("div", { className: "space-y-6", children: [
          /* @__PURE__ */ jsx9(Text_default, { size: "sm", weight: "normal", className: "text-text-700", children: "Ao encerrar este pedido, ele ser\xE1 fechado e n\xE3o poder\xE1 mais ser atualizado." }),
          /* @__PURE__ */ jsxs6("div", { className: "flex gap-3 justify-end", children: [
            /* @__PURE__ */ jsx9(
              Button_default,
              {
                variant: "outline",
                size: "medium",
                onClick: () => setShowCloseConfirmation(false),
                children: "Cancelar"
              }
            ),
            /* @__PURE__ */ jsx9(
              Button_default,
              {
                variant: "solid",
                size: "medium",
                action: "negative",
                onClick: handleCloseTicket,
                children: "Encerrar"
              }
            )
          ] })
        ] })
      }
    )
  ] });
};
export {
  TicketModal
};
//# sourceMappingURL=index.mjs.map