analytica-frontend-lib 1.2.79 → 1.2.80

package/dist/StudentRanking/index.d.ts

@@ -0,0 +1,69 @@
+import { HTMLAttributes } from 'react';
+/**
+ * Student data item for the ranking
+ */
+export interface StudentRankingItem {
+    /** Student position in the ranking */
+    position: number;
+    /** Student name */
+    name: string;
+    /** Performance percentage (0-100) */
+    percentage: number;
+}
+/**
+ * Card variant type
+ */
+export type StudentRankingVariant = 'highlight' | 'attention';
+/**
+ * Props for a single ranking card
+ */
+export interface RankingCardProps extends HTMLAttributes<HTMLDivElement> {
+    /** Card title */
+    title: string;
+    /** Card variant: highlight (best students) or attention (needs attention) */
+    variant: StudentRankingVariant;
+    /** List of students to display */
+    students: StudentRankingItem[];
+}
+/**
+ * Single ranking card component (can be used independently)
+ */
+export declare const RankingCard: ({ title, variant, students, className, ...props }: RankingCardProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Props for the StudentRanking component
+ */
+export interface StudentRankingProps extends HTMLAttributes<HTMLDivElement> {
+    /** Title for the highlight (best students) card */
+    highlightTitle?: string;
+    /** Title for the attention (needs attention) card */
+    attentionTitle?: string;
+    /** List of highlighted (best performing) students */
+    highlightStudents: StudentRankingItem[];
+    /** List of students needing attention (lowest performing) */
+    attentionStudents: StudentRankingItem[];
+}
+/**
+ * StudentRanking component - displays two cards side by side showing
+ * the best performing students and students that need attention.
+ *
+ * @example
+ * ```tsx
+ * <StudentRanking
+ *   highlightTitle="Estudantes em destaque"
+ *   attentionTitle="Estudantes precisando de atenção"
+ *   highlightStudents={[
+ *     { position: 1, name: 'Valentina Ribeiro', percentage: 100 },
+ *     { position: 2, name: 'Lucas Almeida', percentage: 100 },
+ *     { position: 3, name: 'Fernanda Costa', percentage: 100 },
+ *   ]}
+ *   attentionStudents={[
+ *     { position: 1, name: 'Ricardo Silva', percentage: 80 },
+ *     { position: 2, name: 'Juliana Santos', percentage: 50 },
+ *     { position: 3, name: 'Gabriel Oliveira', percentage: 40 },
+ *   ]}
+ * />
+ * ```
+ */
+export declare const StudentRanking: ({ highlightTitle, attentionTitle, highlightStudents, attentionStudents, className, ...props }: StudentRankingProps) => import("react/jsx-runtime").JSX.Element;
+export default StudentRanking;
+//# sourceMappingURL=StudentRanking.d.ts.map

package/dist/StudentRanking/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StudentRanking.d.ts","sourceRoot":"","sources":["../../../src/components/StudentRanking/StudentRanking.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAKvC;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,sCAAsC;IACtC,QAAQ,EAAE,MAAM,CAAC;IACjB,mBAAmB;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,UAAU,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,WAAW,GAAG,WAAW,CAAC;AAmH9D;;GAEG;AACH,MAAM,WAAW,gBAAiB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtE,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,OAAO,EAAE,qBAAqB,CAAC;IAC/B,kCAAkC;IAClC,QAAQ,EAAE,kBAAkB,EAAE,CAAC;CAChC;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,GAAI,mDAMzB,gBAAgB,4CAiDlB,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACzE,mDAAmD;IACnD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,qDAAqD;IACrD,iBAAiB,EAAE,kBAAkB,EAAE,CAAC;IACxC,6DAA6D;IAC7D,iBAAiB,EAAE,kBAAkB,EAAE,CAAC;CACzC;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,cAAc,GAAI,+FAO5B,mBAAmB,4CAkBrB,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/StudentRanking/index.js

@@ -0,0 +1,270 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/StudentRanking/StudentRanking.tsx
+var StudentRanking_exports = {};
+__export(StudentRanking_exports, {
+  RankingCard: () => RankingCard,
+  StudentRanking: () => StudentRanking,
+  default: () => StudentRanking_default
+});
+module.exports = __toCommonJS(StudentRanking_exports);
+var import_phosphor_react = require("phosphor-react");
+
+// src/utils/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/Text/Text.tsx
+var import_jsx_runtime = require("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__ */ (0, import_jsx_runtime.jsx)(
+    Component,
+    {
+      className: cn(baseClasses, sizeClasses, weightClasses, color, className),
+      ...props,
+      children
+    }
+  );
+};
+var Text_default = Text;
+
+// src/components/StudentRanking/StudentRanking.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var CARD_BACKGROUND_CLASSES = {
+  highlight: {
+    1: "bg-success-200",
+    2: "bg-success-100",
+    3: "bg-success-background"
+  },
+  attention: {
+    1: "bg-error-200",
+    2: "bg-error-100",
+    3: "bg-error-background"
+  }
+};
+var BADGE_BACKGROUND_CLASSES = {
+  highlight: "bg-indicator-positive",
+  attention: "bg-indicator-negative"
+};
+var PERCENTAGE_BADGE_CLASSES = {
+  highlight: "bg-success-700",
+  attention: "bg-indicator-negative"
+};
+var HEADER_BADGE_CLASSES = {
+  highlight: "bg-indicator-positive",
+  attention: "bg-indicator-negative"
+};
+var getPositionBackgroundClass = (variant, position) => {
+  const positionKey = Math.max(1, Math.min(position, 3));
+  return CARD_BACKGROUND_CLASSES[variant][positionKey];
+};
+var StudentCard = ({ student, variant }) => {
+  const TrendIcon = variant === "highlight" ? import_phosphor_react.TrendUp : import_phosphor_react.TrendDown;
+  const backgroundClass = getPositionBackgroundClass(variant, student.position);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: cn(
+        "flex flex-row items-center w-full p-4 gap-2 rounded-xl",
+        backgroundClass
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          Text_default,
+          {
+            size: "xs",
+            weight: "bold",
+            "aria-label": `Posi\xE7\xE3o ${student.position}`,
+            className: cn(
+              "w-5 h-5 rounded-full flex items-center justify-center text-text",
+              BADGE_BACKGROUND_CLASSES[variant]
+            ),
+            children: student.position
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          Text_default,
+          {
+            size: "sm",
+            weight: "bold",
+            className: "flex-1 min-w-0 text-text-950 tracking-[0.2px] truncate",
+            children: student.name
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          Text_default,
+          {
+            size: "xs",
+            weight: "bold",
+            "aria-label": `Desempenho ${student.percentage}%`,
+            className: cn(
+              "flex flex-row items-center h-[22px] px-2 gap-1 rounded text-text",
+              PERCENTAGE_BADGE_CLASSES[variant]
+            ),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(TrendIcon, { size: 16, weight: "bold", "aria-hidden": "true" }),
+              student.percentage,
+              "%"
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+var RankingCard = ({
+  title,
+  variant,
+  students,
+  className,
+  ...props
+}) => {
+  const HeaderIcon = variant === "highlight" ? import_phosphor_react.Trophy : import_phosphor_react.Warning;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: cn(
+        "flex flex-col flex-1 min-h-[254px] p-5 gap-4 bg-background border border-border-50 rounded-xl",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-row justify-between items-center h-6 gap-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            Text_default,
+            {
+              as: "h3",
+              size: "lg",
+              weight: "bold",
+              className: "text-text-950 tracking-[0.2px]",
+              children: title
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "span",
+            {
+              className: cn(
+                "w-6 h-6 rounded-full flex items-center justify-center",
+                HEADER_BADGE_CLASSES[variant]
+              ),
+              children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                HeaderIcon,
+                {
+                  size: 14,
+                  weight: "fill",
+                  className: variant === "highlight" ? "text-text-950" : "text-text"
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex flex-col gap-2", children: students.map((student, index) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          StudentCard,
+          {
+            student,
+            variant
+          },
+          `${variant}-${index}-${student.position}`
+        )) })
+      ]
+    }
+  );
+};
+var StudentRanking = ({
+  highlightTitle = "Estudantes em destaque",
+  attentionTitle = "Estudantes precisando de aten\xE7\xE3o",
+  highlightStudents,
+  attentionStudents,
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: cn("flex flex-col md:flex-row w-full gap-4", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          RankingCard,
+          {
+            title: highlightTitle,
+            variant: "highlight",
+            students: highlightStudents
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          RankingCard,
+          {
+            title: attentionTitle,
+            variant: "attention",
+            students: attentionStudents
+          }
+        )
+      ]
+    }
+  );
+};
+var StudentRanking_default = StudentRanking;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  RankingCard,
+  StudentRanking
+});
+//# sourceMappingURL=index.js.map

package/dist/StudentRanking/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/StudentRanking/StudentRanking.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\nimport { Trophy, Warning, TrendUp, TrendDown } from 'phosphor-react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Student data item for the ranking\n */\nexport interface StudentRankingItem {\n  /** Student position in the ranking */\n  position: number;\n  /** Student name */\n  name: string;\n  /** Performance percentage (0-100) */\n  percentage: number;\n}\n\n/**\n * Card variant type\n */\nexport type StudentRankingVariant = 'highlight' | 'attention';\n\n/**\n * Props for individual student card\n */\ninterface StudentCardProps {\n  student: StudentRankingItem;\n  variant: StudentRankingVariant;\n}\n\n/**\n * Lookup table for card background colors by position\n * Position 1 = most intense, Position 3+ = lightest\n */\nconst CARD_BACKGROUND_CLASSES = {\n  highlight: {\n    1: 'bg-success-200',\n    2: 'bg-success-100',\n    3: 'bg-success-background',\n  },\n  attention: {\n    1: 'bg-error-200',\n    2: 'bg-error-100',\n    3: 'bg-error-background',\n  },\n} as const;\n\n/**\n * Lookup table for badge background colors\n */\nconst BADGE_BACKGROUND_CLASSES = {\n  highlight: 'bg-indicator-positive',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Lookup table for percentage badge background colors\n */\nconst PERCENTAGE_BADGE_CLASSES = {\n  highlight: 'bg-success-700',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Lookup table for header badge background colors\n */\nconst HEADER_BADGE_CLASSES = {\n  highlight: 'bg-indicator-positive',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Get background class based on position (1, 2, or 3+)\n */\nconst getPositionBackgroundClass = (\n  variant: StudentRankingVariant,\n  position: number\n): string => {\n  const positionKey = Math.max(1, Math.min(position, 3)) as 1 | 2 | 3;\n  return CARD_BACKGROUND_CLASSES[variant][positionKey];\n};\n\n/**\n * Individual student card component\n */\nconst StudentCard = ({ student, variant }: StudentCardProps) => {\n  const TrendIcon = variant === 'highlight' ? TrendUp : TrendDown;\n  const backgroundClass = getPositionBackgroundClass(variant, student.position);\n\n  return (\n    <div\n      className={cn(\n        'flex flex-row items-center w-full p-4 gap-2 rounded-xl',\n        backgroundClass\n      )}\n    >\n      {/* Position badge */}\n      <Text\n        size=\"xs\"\n        weight=\"bold\"\n        aria-label={`Posição ${student.position}`}\n        className={cn(\n          'w-5 h-5 rounded-full flex items-center justify-center text-text',\n          BADGE_BACKGROUND_CLASSES[variant]\n        )}\n      >\n        {student.position}\n      </Text>\n\n      {/* Student name */}\n      <Text\n        size=\"sm\"\n        weight=\"bold\"\n        className=\"flex-1 min-w-0 text-text-950 tracking-[0.2px] truncate\"\n      >\n        {student.name}\n      </Text>\n\n      {/* Percentage badge */}\n      <Text\n        size=\"xs\"\n        weight=\"bold\"\n        aria-label={`Desempenho ${student.percentage}%`}\n        className={cn(\n          'flex flex-row items-center h-[22px] px-2 gap-1 rounded text-text',\n          PERCENTAGE_BADGE_CLASSES[variant]\n        )}\n      >\n        <TrendIcon size={16} weight=\"bold\" aria-hidden=\"true\" />\n        {student.percentage}%\n      </Text>\n    </div>\n  );\n};\n\n/**\n * Props for a single ranking card\n */\nexport interface RankingCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Card title */\n  title: string;\n  /** Card variant: highlight (best students) or attention (needs attention) */\n  variant: StudentRankingVariant;\n  /** List of students to display */\n  students: StudentRankingItem[];\n}\n\n/**\n * Single ranking card component (can be used independently)\n */\nexport const RankingCard = ({\n  title,\n  variant,\n  students,\n  className,\n  ...props\n}: RankingCardProps) => {\n  const HeaderIcon = variant === 'highlight' ? Trophy : Warning;\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col flex-1 min-h-[254px] p-5 gap-4 bg-background border border-border-50 rounded-xl',\n        className\n      )}\n      {...props}\n    >\n      {/* Header */}\n      <div className=\"flex flex-row justify-between items-center h-6 gap-4\">\n        <Text\n          as=\"h3\"\n          size=\"lg\"\n          weight=\"bold\"\n          className=\"text-text-950 tracking-[0.2px]\"\n        >\n          {title}\n        </Text>\n\n        {/* Header badge with icon */}\n        <span\n          className={cn(\n            'w-6 h-6 rounded-full flex items-center justify-center',\n            HEADER_BADGE_CLASSES[variant]\n          )}\n        >\n          <HeaderIcon\n            size={14}\n            weight=\"fill\"\n            className={variant === 'highlight' ? 'text-text-950' : 'text-text'}\n          />\n        </span>\n      </div>\n\n      {/* Students list */}\n      <div className=\"flex flex-col gap-2\">\n        {students.map((student, index) => (\n          <StudentCard\n            key={`${variant}-${index}-${student.position}`}\n            student={student}\n            variant={variant}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n\n/**\n * Props for the StudentRanking component\n */\nexport interface StudentRankingProps extends HTMLAttributes<HTMLDivElement> {\n  /** Title for the highlight (best students) card */\n  highlightTitle?: string;\n  /** Title for the attention (needs attention) card */\n  attentionTitle?: string;\n  /** List of highlighted (best performing) students */\n  highlightStudents: StudentRankingItem[];\n  /** List of students needing attention (lowest performing) */\n  attentionStudents: StudentRankingItem[];\n}\n\n/**\n * StudentRanking component - displays two cards side by side showing\n * the best performing students and students that need attention.\n *\n * @example\n * ```tsx\n * <StudentRanking\n *   highlightTitle=\"Estudantes em destaque\"\n *   attentionTitle=\"Estudantes precisando de atenção\"\n *   highlightStudents={[\n *     { position: 1, name: 'Valentina Ribeiro', percentage: 100 },\n *     { position: 2, name: 'Lucas Almeida', percentage: 100 },\n *     { position: 3, name: 'Fernanda Costa', percentage: 100 },\n *   ]}\n *   attentionStudents={[\n *     { position: 1, name: 'Ricardo Silva', percentage: 80 },\n *     { position: 2, name: 'Juliana Santos', percentage: 50 },\n *     { position: 3, name: 'Gabriel Oliveira', percentage: 40 },\n *   ]}\n * />\n * ```\n */\nexport const StudentRanking = ({\n  highlightTitle = 'Estudantes em destaque',\n  attentionTitle = 'Estudantes precisando de atenção',\n  highlightStudents,\n  attentionStudents,\n  className,\n  ...props\n}: StudentRankingProps) => {\n  return (\n    <div\n      className={cn('flex flex-col md:flex-row w-full gap-4', className)}\n      {...props}\n    >\n      <RankingCard\n        title={highlightTitle}\n        variant=\"highlight\"\n        students={highlightStudents}\n      />\n      <RankingCard\n        title={attentionTitle}\n        variant=\"attention\"\n        students={attentionStudents}\n      />\n    </div>\n  );\n};\n\nexport default StudentRanking;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n  areFiltersEqual,\n} from './activityFilters';\nexport {\n  mapQuestionTypeToEnum,\n  mapQuestionTypeToEnumRequired,\n} from './questionTypeUtils';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["import_jsx_runtime"]}

package/dist/StudentRanking/index.mjs

@@ -0,0 +1,244 @@
+// src/components/StudentRanking/StudentRanking.tsx
+import { Trophy, Warning, TrendUp, TrendDown } 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/Text/Text.tsx
+import { jsx } 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__ */ jsx(
+    Component,
+    {
+      className: cn(baseClasses, sizeClasses, weightClasses, color, className),
+      ...props,
+      children
+    }
+  );
+};
+var Text_default = Text;
+
+// src/components/StudentRanking/StudentRanking.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var CARD_BACKGROUND_CLASSES = {
+  highlight: {
+    1: "bg-success-200",
+    2: "bg-success-100",
+    3: "bg-success-background"
+  },
+  attention: {
+    1: "bg-error-200",
+    2: "bg-error-100",
+    3: "bg-error-background"
+  }
+};
+var BADGE_BACKGROUND_CLASSES = {
+  highlight: "bg-indicator-positive",
+  attention: "bg-indicator-negative"
+};
+var PERCENTAGE_BADGE_CLASSES = {
+  highlight: "bg-success-700",
+  attention: "bg-indicator-negative"
+};
+var HEADER_BADGE_CLASSES = {
+  highlight: "bg-indicator-positive",
+  attention: "bg-indicator-negative"
+};
+var getPositionBackgroundClass = (variant, position) => {
+  const positionKey = Math.max(1, Math.min(position, 3));
+  return CARD_BACKGROUND_CLASSES[variant][positionKey];
+};
+var StudentCard = ({ student, variant }) => {
+  const TrendIcon = variant === "highlight" ? TrendUp : TrendDown;
+  const backgroundClass = getPositionBackgroundClass(variant, student.position);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-row items-center w-full p-4 gap-2 rounded-xl",
+        backgroundClass
+      ),
+      children: [
+        /* @__PURE__ */ jsx2(
+          Text_default,
+          {
+            size: "xs",
+            weight: "bold",
+            "aria-label": `Posi\xE7\xE3o ${student.position}`,
+            className: cn(
+              "w-5 h-5 rounded-full flex items-center justify-center text-text",
+              BADGE_BACKGROUND_CLASSES[variant]
+            ),
+            children: student.position
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          Text_default,
+          {
+            size: "sm",
+            weight: "bold",
+            className: "flex-1 min-w-0 text-text-950 tracking-[0.2px] truncate",
+            children: student.name
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Text_default,
+          {
+            size: "xs",
+            weight: "bold",
+            "aria-label": `Desempenho ${student.percentage}%`,
+            className: cn(
+              "flex flex-row items-center h-[22px] px-2 gap-1 rounded text-text",
+              PERCENTAGE_BADGE_CLASSES[variant]
+            ),
+            children: [
+              /* @__PURE__ */ jsx2(TrendIcon, { size: 16, weight: "bold", "aria-hidden": "true" }),
+              student.percentage,
+              "%"
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+var RankingCard = ({
+  title,
+  variant,
+  students,
+  className,
+  ...props
+}) => {
+  const HeaderIcon = variant === "highlight" ? Trophy : Warning;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col flex-1 min-h-[254px] p-5 gap-4 bg-background border border-border-50 rounded-xl",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-row justify-between items-center h-6 gap-4", children: [
+          /* @__PURE__ */ jsx2(
+            Text_default,
+            {
+              as: "h3",
+              size: "lg",
+              weight: "bold",
+              className: "text-text-950 tracking-[0.2px]",
+              children: title
+            }
+          ),
+          /* @__PURE__ */ jsx2(
+            "span",
+            {
+              className: cn(
+                "w-6 h-6 rounded-full flex items-center justify-center",
+                HEADER_BADGE_CLASSES[variant]
+              ),
+              children: /* @__PURE__ */ jsx2(
+                HeaderIcon,
+                {
+                  size: 14,
+                  weight: "fill",
+                  className: variant === "highlight" ? "text-text-950" : "text-text"
+                }
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-2", children: students.map((student, index) => /* @__PURE__ */ jsx2(
+          StudentCard,
+          {
+            student,
+            variant
+          },
+          `${variant}-${index}-${student.position}`
+        )) })
+      ]
+    }
+  );
+};
+var StudentRanking = ({
+  highlightTitle = "Estudantes em destaque",
+  attentionTitle = "Estudantes precisando de aten\xE7\xE3o",
+  highlightStudents,
+  attentionStudents,
+  className,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex flex-col md:flex-row w-full gap-4", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx2(
+          RankingCard,
+          {
+            title: highlightTitle,
+            variant: "highlight",
+            students: highlightStudents
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          RankingCard,
+          {
+            title: attentionTitle,
+            variant: "attention",
+            students: attentionStudents
+          }
+        )
+      ]
+    }
+  );
+};
+var StudentRanking_default = StudentRanking;
+export {
+  RankingCard,
+  StudentRanking,
+  StudentRanking_default as default
+};
+//# sourceMappingURL=index.mjs.map

package/dist/StudentRanking/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/StudentRanking/StudentRanking.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\nimport { Trophy, Warning, TrendUp, TrendDown } from 'phosphor-react';\nimport Text from '../Text/Text';\nimport { cn } from '../../utils/utils';\n\n/**\n * Student data item for the ranking\n */\nexport interface StudentRankingItem {\n  /** Student position in the ranking */\n  position: number;\n  /** Student name */\n  name: string;\n  /** Performance percentage (0-100) */\n  percentage: number;\n}\n\n/**\n * Card variant type\n */\nexport type StudentRankingVariant = 'highlight' | 'attention';\n\n/**\n * Props for individual student card\n */\ninterface StudentCardProps {\n  student: StudentRankingItem;\n  variant: StudentRankingVariant;\n}\n\n/**\n * Lookup table for card background colors by position\n * Position 1 = most intense, Position 3+ = lightest\n */\nconst CARD_BACKGROUND_CLASSES = {\n  highlight: {\n    1: 'bg-success-200',\n    2: 'bg-success-100',\n    3: 'bg-success-background',\n  },\n  attention: {\n    1: 'bg-error-200',\n    2: 'bg-error-100',\n    3: 'bg-error-background',\n  },\n} as const;\n\n/**\n * Lookup table for badge background colors\n */\nconst BADGE_BACKGROUND_CLASSES = {\n  highlight: 'bg-indicator-positive',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Lookup table for percentage badge background colors\n */\nconst PERCENTAGE_BADGE_CLASSES = {\n  highlight: 'bg-success-700',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Lookup table for header badge background colors\n */\nconst HEADER_BADGE_CLASSES = {\n  highlight: 'bg-indicator-positive',\n  attention: 'bg-indicator-negative',\n} as const;\n\n/**\n * Get background class based on position (1, 2, or 3+)\n */\nconst getPositionBackgroundClass = (\n  variant: StudentRankingVariant,\n  position: number\n): string => {\n  const positionKey = Math.max(1, Math.min(position, 3)) as 1 | 2 | 3;\n  return CARD_BACKGROUND_CLASSES[variant][positionKey];\n};\n\n/**\n * Individual student card component\n */\nconst StudentCard = ({ student, variant }: StudentCardProps) => {\n  const TrendIcon = variant === 'highlight' ? TrendUp : TrendDown;\n  const backgroundClass = getPositionBackgroundClass(variant, student.position);\n\n  return (\n    <div\n      className={cn(\n        'flex flex-row items-center w-full p-4 gap-2 rounded-xl',\n        backgroundClass\n      )}\n    >\n      {/* Position badge */}\n      <Text\n        size=\"xs\"\n        weight=\"bold\"\n        aria-label={`Posição ${student.position}`}\n        className={cn(\n          'w-5 h-5 rounded-full flex items-center justify-center text-text',\n          BADGE_BACKGROUND_CLASSES[variant]\n        )}\n      >\n        {student.position}\n      </Text>\n\n      {/* Student name */}\n      <Text\n        size=\"sm\"\n        weight=\"bold\"\n        className=\"flex-1 min-w-0 text-text-950 tracking-[0.2px] truncate\"\n      >\n        {student.name}\n      </Text>\n\n      {/* Percentage badge */}\n      <Text\n        size=\"xs\"\n        weight=\"bold\"\n        aria-label={`Desempenho ${student.percentage}%`}\n        className={cn(\n          'flex flex-row items-center h-[22px] px-2 gap-1 rounded text-text',\n          PERCENTAGE_BADGE_CLASSES[variant]\n        )}\n      >\n        <TrendIcon size={16} weight=\"bold\" aria-hidden=\"true\" />\n        {student.percentage}%\n      </Text>\n    </div>\n  );\n};\n\n/**\n * Props for a single ranking card\n */\nexport interface RankingCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Card title */\n  title: string;\n  /** Card variant: highlight (best students) or attention (needs attention) */\n  variant: StudentRankingVariant;\n  /** List of students to display */\n  students: StudentRankingItem[];\n}\n\n/**\n * Single ranking card component (can be used independently)\n */\nexport const RankingCard = ({\n  title,\n  variant,\n  students,\n  className,\n  ...props\n}: RankingCardProps) => {\n  const HeaderIcon = variant === 'highlight' ? Trophy : Warning;\n\n  return (\n    <div\n      className={cn(\n        'flex flex-col flex-1 min-h-[254px] p-5 gap-4 bg-background border border-border-50 rounded-xl',\n        className\n      )}\n      {...props}\n    >\n      {/* Header */}\n      <div className=\"flex flex-row justify-between items-center h-6 gap-4\">\n        <Text\n          as=\"h3\"\n          size=\"lg\"\n          weight=\"bold\"\n          className=\"text-text-950 tracking-[0.2px]\"\n        >\n          {title}\n        </Text>\n\n        {/* Header badge with icon */}\n        <span\n          className={cn(\n            'w-6 h-6 rounded-full flex items-center justify-center',\n            HEADER_BADGE_CLASSES[variant]\n          )}\n        >\n          <HeaderIcon\n            size={14}\n            weight=\"fill\"\n            className={variant === 'highlight' ? 'text-text-950' : 'text-text'}\n          />\n        </span>\n      </div>\n\n      {/* Students list */}\n      <div className=\"flex flex-col gap-2\">\n        {students.map((student, index) => (\n          <StudentCard\n            key={`${variant}-${index}-${student.position}`}\n            student={student}\n            variant={variant}\n          />\n        ))}\n      </div>\n    </div>\n  );\n};\n\n/**\n * Props for the StudentRanking component\n */\nexport interface StudentRankingProps extends HTMLAttributes<HTMLDivElement> {\n  /** Title for the highlight (best students) card */\n  highlightTitle?: string;\n  /** Title for the attention (needs attention) card */\n  attentionTitle?: string;\n  /** List of highlighted (best performing) students */\n  highlightStudents: StudentRankingItem[];\n  /** List of students needing attention (lowest performing) */\n  attentionStudents: StudentRankingItem[];\n}\n\n/**\n * StudentRanking component - displays two cards side by side showing\n * the best performing students and students that need attention.\n *\n * @example\n * ```tsx\n * <StudentRanking\n *   highlightTitle=\"Estudantes em destaque\"\n *   attentionTitle=\"Estudantes precisando de atenção\"\n *   highlightStudents={[\n *     { position: 1, name: 'Valentina Ribeiro', percentage: 100 },\n *     { position: 2, name: 'Lucas Almeida', percentage: 100 },\n *     { position: 3, name: 'Fernanda Costa', percentage: 100 },\n *   ]}\n *   attentionStudents={[\n *     { position: 1, name: 'Ricardo Silva', percentage: 80 },\n *     { position: 2, name: 'Juliana Santos', percentage: 50 },\n *     { position: 3, name: 'Gabriel Oliveira', percentage: 40 },\n *   ]}\n * />\n * ```\n */\nexport const StudentRanking = ({\n  highlightTitle = 'Estudantes em destaque',\n  attentionTitle = 'Estudantes precisando de atenção',\n  highlightStudents,\n  attentionStudents,\n  className,\n  ...props\n}: StudentRankingProps) => {\n  return (\n    <div\n      className={cn('flex flex-col md:flex-row w-full gap-4', className)}\n      {...props}\n    >\n      <RankingCard\n        title={highlightTitle}\n        variant=\"highlight\"\n        students={highlightStudents}\n      />\n      <RankingCard\n        title={attentionTitle}\n        variant=\"attention\"\n        students={attentionStudents}\n      />\n    </div>\n  );\n};\n\nexport default StudentRanking;\n","import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\nexport { syncDropdownState } from './dropdown';\nexport {\n  getSelectedIdsFromCategories,\n  toggleArrayItem,\n  toggleSingleValue,\n  areFiltersEqual,\n} from './activityFilters';\nexport {\n  mapQuestionTypeToEnum,\n  mapQuestionTypeToEnumRequired,\n} from './questionTypeUtils';\nexport {\n  getStatusBadgeConfig,\n  formatTimeSpent,\n  formatQuestionNumbers,\n  formatDateToBrazilian,\n} from './activityDetailsUtils';\n\n/**\n * Retorna a cor hexadecimal com opacidade 0.3 (4d) se não estiver em dark mode.\n * Se estiver em dark mode, retorna a cor original.\n *\n * @param hexColor - Cor hexadecimal (ex: \"#0066b8\" ou \"0066b8\")\n * @param isDark - booleano indicando se está em dark mode\n * @returns string - cor hexadecimal com opacidade se necessário\n */\nexport function getSubjectColorWithOpacity(\n  hexColor: string | undefined,\n  isDark: boolean\n): string | undefined {\n  if (!hexColor) return undefined;\n  // Remove o '#' se existir\n  let color = hexColor.replace(/^#/, '').toLowerCase();\n\n  if (isDark) {\n    // Se está em dark mode, sempre remove opacidade se existir\n    if (color.length === 8) {\n      color = color.slice(0, 6);\n    }\n    return `#${color}`;\n  } else {\n    // Se não está em dark mode (light mode)\n    let resultColor: string;\n    if (color.length === 6) {\n      // Adiciona opacidade 0.3 (4D) para cores de 6 dígitos\n      resultColor = `#${color}4d`;\n    } else if (color.length === 8) {\n      // Já tem opacidade, retorna como está\n      resultColor = `#${color}`;\n    } else {\n      // Para outros tamanhos (3, 4, 5 dígitos), retorna como está\n      resultColor = `#${color}`;\n    }\n    return resultColor;\n  }\n}\n","import { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Base text component props\n */\ntype BaseTextProps = {\n  /** Content to be displayed */\n  children?: ReactNode;\n  /** Text size variant */\n  size?:\n    | '2xs'\n    | 'xs'\n    | 'sm'\n    | 'md'\n    | 'lg'\n    | 'xl'\n    | '2xl'\n    | '3xl'\n    | '4xl'\n    | '5xl'\n    | '6xl';\n  /** Font weight variant */\n  weight?:\n    | 'hairline'\n    | 'light'\n    | 'normal'\n    | 'medium'\n    | 'semibold'\n    | 'bold'\n    | 'extrabold'\n    | 'black';\n  /** Color variant - white for light backgrounds, black for dark backgrounds */\n  color?: string;\n  /** Additional CSS classes to apply */\n  className?: string;\n};\n\n/**\n * Polymorphic text component props that ensures type safety based on the 'as' prop\n */\ntype TextProps<T extends ElementType = 'p'> = BaseTextProps & {\n  /** HTML tag to render */\n  as?: T;\n} & Omit<ComponentPropsWithoutRef<T>, keyof BaseTextProps>;\n\n/**\n * Text component for Analytica Ensino platforms\n *\n * A flexible polymorphic text component with multiple sizes, weights, and colors.\n * Automatically adapts to dark and light themes with full type safety.\n *\n * @param children - The content to display\n * @param size - The text size variant (2xs, xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl)\n * @param weight - The font weight variant (hairline, light, normal, medium, semibold, bold, extrabold, black)\n * @param color - The color variant - adapts to theme\n * @param as - The HTML tag to render - determines allowed attributes via TypeScript\n * @param className - Additional CSS classes\n * @param props - HTML attributes valid for the chosen tag only\n * @returns A styled text element with type-safe attributes\n *\n * @example\n * ```tsx\n * <Text size=\"lg\" weight=\"bold\" color=\"text-info-800\">\n *   This is a large, bold text\n * </Text>\n *\n * <Text as=\"a\" href=\"/link\" target=\"_blank\">\n *   Link with type-safe anchor attributes\n * </Text>\n *\n * <Text as=\"button\" onClick={handleClick} disabled>\n *   Button with type-safe button attributes\n * </Text>\n * ```\n */\nconst Text = <T extends ElementType = 'p'>({\n  children,\n  size = 'md',\n  weight = 'normal',\n  color = 'text-text-950',\n  as,\n  className = '',\n  ...props\n}: TextProps<T>) => {\n  let sizeClasses = '';\n  let weightClasses = '';\n\n  // Text size classes mapping\n  const sizeClassMap = {\n    '2xs': 'text-2xs',\n    xs: 'text-xs',\n    sm: 'text-sm',\n    md: 'text-md',\n    lg: 'text-lg',\n    xl: 'text-xl',\n    '2xl': 'text-2xl',\n    '3xl': 'text-3xl',\n    '4xl': 'text-4xl',\n    '5xl': 'text-5xl',\n    '6xl': 'text-6xl',\n  } as const;\n\n  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;\n\n  // Font weight classes mapping\n  const weightClassMap = {\n    hairline: 'font-hairline',\n    light: 'font-light',\n    normal: 'font-normal',\n    medium: 'font-medium',\n    semibold: 'font-semibold',\n    bold: 'font-bold',\n    extrabold: 'font-extrabold',\n    black: 'font-black',\n  } as const;\n\n  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;\n\n  const baseClasses = 'font-primary';\n  const Component = as ?? ('p' as ElementType);\n\n  return (\n    <Component\n      className={cn(baseClasses, sizeClasses, weightClasses, color, className)}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n};\n\nexport default Text;\n"],"mappings":"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","names":["jsx"]}