analytica-frontend-lib 1.2.9 → 1.2.11

package/dist/NoSearchResult/index.d.mts

@@ -0,0 +1,37 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface NoSearchResultProps {
+    /**
+     * Image source for the illustration
+     */
+    image: string;
+    /**
+     * Title text to display
+     * @default "Nenhum resultado encontrado"
+     */
+    title?: string;
+    /**
+     * Description text to display below the title
+     * @default "Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave."
+     */
+    description?: string;
+}
+/**
+ * Component displayed when no search results are found
+ * Shows an illustration with customizable title and description in horizontal layout
+ *
+ * @example
+ * ```tsx
+ * import { NoSearchResult } from 'analytica-frontend-lib';
+ * import noSearchImage from './assets/no-search.png';
+ *
+ * <NoSearchResult
+ *   image={noSearchImage}
+ *   title="Nenhum resultado encontrado"
+ *   description="Tente usar outros filtros"
+ * />
+ * ```
+ */
+declare const NoSearchResult: ({ image, title, description }: NoSearchResultProps) => react_jsx_runtime.JSX.Element;
+
+export { type NoSearchResultProps, NoSearchResult as default };

package/dist/NoSearchResult/index.d.ts

@@ -0,0 +1,37 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface NoSearchResultProps {
+    /**
+     * Image source for the illustration
+     */
+    image: string;
+    /**
+     * Title text to display
+     * @default "Nenhum resultado encontrado"
+     */
+    title?: string;
+    /**
+     * Description text to display below the title
+     * @default "Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave."
+     */
+    description?: string;
+}
+/**
+ * Component displayed when no search results are found
+ * Shows an illustration with customizable title and description in horizontal layout
+ *
+ * @example
+ * ```tsx
+ * import { NoSearchResult } from 'analytica-frontend-lib';
+ * import noSearchImage from './assets/no-search.png';
+ *
+ * <NoSearchResult
+ *   image={noSearchImage}
+ *   title="Nenhum resultado encontrado"
+ *   description="Tente usar outros filtros"
+ * />
+ * ```
+ */
+declare const NoSearchResult: ({ image, title, description }: NoSearchResultProps) => react_jsx_runtime.JSX.Element;
+
+export { type NoSearchResultProps, NoSearchResult as default };

package/dist/NoSearchResult/index.js

@@ -0,0 +1,113 @@
+"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/NoSearchResult/NoSearchResult.tsx
+var NoSearchResult_exports = {};
+__export(NoSearchResult_exports, {
+  default: () => NoSearchResult_default
+});
+module.exports = __toCommonJS(NoSearchResult_exports);
+
+// 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/NoSearchResult/NoSearchResult.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var NoSearchResult = ({ image, title, description }) => {
+  const displayTitle = title || "Nenhum resultado encontrado";
+  const displayDescription = description || "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.";
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "w-72 h-72 flex-shrink-0 relative", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      "img",
+      {
+        src: image,
+        alt: "No search results",
+        className: "w-full h-full object-contain"
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col items-start w-full max-w-md", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex flex-row justify-between items-end px-6 pt-6 pb-4 w-full rounded-t-xl", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        Text_default,
+        {
+          as: "h2",
+          className: "text-text-950 font-semibold text-3xl leading-tight w-full flex items-center",
+          children: displayTitle
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex flex-row justify-center items-center px-6 gap-2 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Text_default, { className: "text-text-600 font-normal text-lg leading-relaxed w-full text-justify", children: displayDescription }) })
+    ] })
+  ] });
+};
+var NoSearchResult_default = NoSearchResult;
+//# sourceMappingURL=index.js.map

package/dist/NoSearchResult/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/NoSearchResult/NoSearchResult.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx"],"sourcesContent":["import Text from '../Text/Text';\n\nexport interface NoSearchResultProps {\n  /**\n   * Image source for the illustration\n   */\n  image: string;\n  /**\n   * Title text to display\n   * @default \"Nenhum resultado encontrado\"\n   */\n  title?: string;\n  /**\n   * Description text to display below the title\n   * @default \"Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.\"\n   */\n  description?: string;\n}\n\n/**\n * Component displayed when no search results are found\n * Shows an illustration with customizable title and description in horizontal layout\n *\n * @example\n * ```tsx\n * import { NoSearchResult } from 'analytica-frontend-lib';\n * import noSearchImage from './assets/no-search.png';\n *\n * <NoSearchResult\n *   image={noSearchImage}\n *   title=\"Nenhum resultado encontrado\"\n *   description=\"Tente usar outros filtros\"\n * />\n * ```\n */\nconst NoSearchResult = ({ image, title, description }: NoSearchResultProps) => {\n  const displayTitle = title || 'Nenhum resultado encontrado';\n  const displayDescription =\n    description ||\n    'Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.';\n\n  return (\n    <div className=\"flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96\">\n      {/* Illustration */}\n      <div className=\"w-72 h-72 flex-shrink-0 relative\">\n        <img\n          src={image}\n          alt=\"No search results\"\n          className=\"w-full h-full object-contain\"\n        />\n      </div>\n\n      {/* Text Content */}\n      <div className=\"flex flex-col items-start w-full max-w-md\">\n        {/* Header Container */}\n        <div className=\"flex flex-row justify-between items-end px-6 pt-6 pb-4 w-full rounded-t-xl\">\n          {/* Title */}\n          <Text\n            as=\"h2\"\n            className=\"text-text-950 font-semibold text-3xl leading-tight w-full flex items-center\"\n          >\n            {displayTitle}\n          </Text>\n        </div>\n\n        {/* Description Container */}\n        <div className=\"flex flex-row justify-center items-center px-6 gap-2 w-full\">\n          {/* Description */}\n          <Text className=\"text-text-600 font-normal text-lg leading-relaxed w-full text-justify\">\n            {displayDescription}\n          </Text>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default NoSearchResult;\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';\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":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ACsHI;AA/CJ,IAAM,OAAO,CAA8B;AAAA,EACzC;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA,YAAY;AAAA,EACZ,GAAG;AACL,MAAoB;AAClB,MAAI,cAAc;AAClB,MAAI,gBAAgB;AAGpB,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,IACP,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAEA,gBAAc,aAAa,IAAI,KAAK,aAAa;AAGjD,QAAM,iBAAiB;AAAA,IACrB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,WAAW;AAAA,IACX,OAAO;AAAA,EACT;AAEA,kBAAgB,eAAe,MAAM,KAAK,eAAe;AAEzD,QAAM,cAAc;AACpB,QAAM,YAAY,MAAO;AAEzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,aAAa,aAAa,eAAe,OAAO,SAAS;AAAA,MACtE,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,eAAQ;;;AFvFP,IAAAA,sBAAA;AAVR,IAAM,iBAAiB,CAAC,EAAE,OAAO,OAAO,YAAY,MAA2B;AAC7E,QAAM,eAAe,SAAS;AAC9B,QAAM,qBACJ,eACA;AAEF,SACE,8CAAC,SAAI,WAAU,6EAEb;AAAA,iDAAC,SAAI,WAAU,oCACb;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAI;AAAA,QACJ,WAAU;AAAA;AAAA,IACZ,GACF;AAAA,IAGA,8CAAC,SAAI,WAAU,6CAEb;AAAA,mDAAC,SAAI,WAAU,8EAEb;AAAA,QAAC;AAAA;AAAA,UACC,IAAG;AAAA,UACH,WAAU;AAAA,UAET;AAAA;AAAA,MACH,GACF;AAAA,MAGA,6CAAC,SAAI,WAAU,+DAEb,uDAAC,gBAAK,WAAU,yEACb,8BACH,GACF;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,IAAO,yBAAQ;","names":["import_jsx_runtime"]}

package/dist/NoSearchResult/index.mjs

@@ -0,0 +1,90 @@
+// 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/NoSearchResult/NoSearchResult.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var NoSearchResult = ({ image, title, description }) => {
+  const displayTitle = title || "Nenhum resultado encontrado";
+  const displayDescription = description || "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.";
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96", children: [
+    /* @__PURE__ */ jsx2("div", { className: "w-72 h-72 flex-shrink-0 relative", children: /* @__PURE__ */ jsx2(
+      "img",
+      {
+        src: image,
+        alt: "No search results",
+        className: "w-full h-full object-contain"
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start w-full max-w-md", children: [
+      /* @__PURE__ */ jsx2("div", { className: "flex flex-row justify-between items-end px-6 pt-6 pb-4 w-full rounded-t-xl", children: /* @__PURE__ */ jsx2(
+        Text_default,
+        {
+          as: "h2",
+          className: "text-text-950 font-semibold text-3xl leading-tight w-full flex items-center",
+          children: displayTitle
+        }
+      ) }),
+      /* @__PURE__ */ jsx2("div", { className: "flex flex-row justify-center items-center px-6 gap-2 w-full", children: /* @__PURE__ */ jsx2(Text_default, { className: "text-text-600 font-normal text-lg leading-relaxed w-full text-justify", children: displayDescription }) })
+    ] })
+  ] });
+};
+var NoSearchResult_default = NoSearchResult;
+export {
+  NoSearchResult_default as default
+};
+//# sourceMappingURL=index.mjs.map

package/dist/NoSearchResult/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/NoSearchResult/NoSearchResult.tsx"],"sourcesContent":["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';\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","import Text from '../Text/Text';\n\nexport interface NoSearchResultProps {\n  /**\n   * Image source for the illustration\n   */\n  image: string;\n  /**\n   * Title text to display\n   * @default \"Nenhum resultado encontrado\"\n   */\n  title?: string;\n  /**\n   * Description text to display below the title\n   * @default \"Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.\"\n   */\n  description?: string;\n}\n\n/**\n * Component displayed when no search results are found\n * Shows an illustration with customizable title and description in horizontal layout\n *\n * @example\n * ```tsx\n * import { NoSearchResult } from 'analytica-frontend-lib';\n * import noSearchImage from './assets/no-search.png';\n *\n * <NoSearchResult\n *   image={noSearchImage}\n *   title=\"Nenhum resultado encontrado\"\n *   description=\"Tente usar outros filtros\"\n * />\n * ```\n */\nconst NoSearchResult = ({ image, title, description }: NoSearchResultProps) => {\n  const displayTitle = title || 'Nenhum resultado encontrado';\n  const displayDescription =\n    description ||\n    'Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.';\n\n  return (\n    <div className=\"flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96\">\n      {/* Illustration */}\n      <div className=\"w-72 h-72 flex-shrink-0 relative\">\n        <img\n          src={image}\n          alt=\"No search results\"\n          className=\"w-full h-full object-contain\"\n        />\n      </div>\n\n      {/* Text Content */}\n      <div className=\"flex flex-col items-start w-full max-w-md\">\n        {/* Header Container */}\n        <div className=\"flex flex-row justify-between items-end px-6 pt-6 pb-4 w-full rounded-t-xl\">\n          {/* Title */}\n          <Text\n            as=\"h2\"\n            className=\"text-text-950 font-semibold text-3xl leading-tight w-full flex items-center\"\n          >\n            {displayTitle}\n          </Text>\n        </div>\n\n        {/* Description Container */}\n        <div className=\"flex flex-row justify-center items-center px-6 gap-2 w-full\">\n          {/* Description */}\n          <Text className=\"text-text-600 font-normal text-lg leading-relaxed w-full text-justify\">\n            {displayDescription}\n          </Text>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default NoSearchResult;\n"],"mappings":";AAAA,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACsHI;AA/CJ,IAAM,OAAO,CAA8B;AAAA,EACzC;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR;AAAA,EACA,YAAY;AAAA,EACZ,GAAG;AACL,MAAoB;AAClB,MAAI,cAAc;AAClB,MAAI,gBAAgB;AAGpB,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,IACP,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,EACT;AAEA,gBAAc,aAAa,IAAI,KAAK,aAAa;AAGjD,QAAM,iBAAiB;AAAA,IACrB,UAAU;AAAA,IACV,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,IACV,MAAM;AAAA,IACN,WAAW;AAAA,IACX,OAAO;AAAA,EACT;AAEA,kBAAgB,eAAe,MAAM,KAAK,eAAe;AAEzD,QAAM,cAAc;AACpB,QAAM,YAAY,MAAO;AAEzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,aAAa,aAAa,eAAe,OAAO,SAAS;AAAA,MACtE,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,eAAQ;;;ACvFP,gBAAAA,MAQF,YARE;AAVR,IAAM,iBAAiB,CAAC,EAAE,OAAO,OAAO,YAAY,MAA2B;AAC7E,QAAM,eAAe,SAAS;AAC9B,QAAM,qBACJ,eACA;AAEF,SACE,qBAAC,SAAI,WAAU,6EAEb;AAAA,oBAAAA,KAAC,SAAI,WAAU,oCACb,0BAAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAI;AAAA,QACJ,WAAU;AAAA;AAAA,IACZ,GACF;AAAA,IAGA,qBAAC,SAAI,WAAU,6CAEb;AAAA,sBAAAA,KAAC,SAAI,WAAU,8EAEb,0BAAAA;AAAA,QAAC;AAAA;AAAA,UACC,IAAG;AAAA,UACH,WAAU;AAAA,UAET;AAAA;AAAA,MACH,GACF;AAAA,MAGA,gBAAAA,KAAC,SAAI,WAAU,+DAEb,0BAAAA,KAAC,gBAAK,WAAU,yEACb,8BACH,GACF;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,IAAO,yBAAQ;","names":["jsx"]}

package/dist/Quiz/index.js

@@ -1031,6 +1031,7 @@ var useQuizStore = (0, import_zustand2.create)()(
         userId: "",
         variant: "default",
         minuteCallback: null,
+        dissertativeCharLimit: void 0,
         questionsResult: null,
         currentQuestionResult: null,
         // Setters
@@ -1040,6 +1041,8 @@ var useQuizStore = (0, import_zustand2.create)()(
         getUserId: () => get().userId,
         setVariant: (variant) => set({ variant }),
         setQuestionResult: (questionsResult) => set({ questionsResult }),
+        setDissertativeCharLimit: (limit) => set({ dissertativeCharLimit: limit }),
+        getDissertativeCharLimit: () => get().dissertativeCharLimit,
         // Navigation
         goToNextQuestion: () => {
           const { currentQuestionIndex, getTotalQuestions } = get();
@@ -1129,7 +1132,7 @@ var useQuizStore = (0, import_zustand2.create)()(
           });
         },
         selectDissertativeAnswer: (questionId, answer) => {
-          const { quiz, userAnswers } = get();
+          const { quiz, userAnswers, dissertativeCharLimit } = get();
           if (!quiz) return;
           const activityId = quiz.id;
           const userId = get().getUserId();
@@ -1140,6 +1143,10 @@ var useQuizStore = (0, import_zustand2.create)()(
           if (!question || question.questionType !== "DISSERTATIVA" /* DISSERTATIVA */) {
             return;
           }
+          let validatedAnswer = answer;
+          if (dissertativeCharLimit !== void 0 && answer.length > dissertativeCharLimit) {
+            validatedAnswer = answer.substring(0, dissertativeCharLimit);
+          }
           const existingAnswerIndex = userAnswers.findIndex(
             (answerItem) => answerItem.questionId === questionId
           );
@@ -1147,7 +1154,7 @@ var useQuizStore = (0, import_zustand2.create)()(
             questionId,
             activityId,
             userId,
-            answer,
+            answer: validatedAnswer,
             optionId: null,
             questionType: "DISSERTATIVA" /* DISSERTATIVA */,
             answerStatus: "PENDENTE_AVALIACAO" /* PENDENTE_AVALIACAO */
@@ -1260,6 +1267,7 @@ var useQuizStore = (0, import_zustand2.create)()(
             userId: "",
             variant: "default",
             minuteCallback: null,
+            dissertativeCharLimit: void 0,
             questionsResult: null,
             currentQuestionResult: null
           });
@@ -2299,11 +2307,16 @@ var TextArea = (0, import_react7.forwardRef)(
     onChange,
     placeholder,
     required,
+    showCharacterCount = false,
+    maxLength,
+    value,
     ...props
   }, ref) => {
     const generatedId = (0, import_react7.useId)();
     const inputId = id ?? `textarea-${generatedId}`;
     const [isFocused, setIsFocused] = (0, import_react7.useState)(false);
+    const currentLength = typeof value === "string" ? value.length : 0;
+    const isNearLimit = maxLength && currentLength >= maxLength * 0.8;
     const handleChange = (event) => {
       onChange?.(event);
     };
@@ -2358,6 +2371,8 @@ var TextArea = (0, import_react7.forwardRef)(
           className: textareaClasses,
           placeholder,
           required,
+          maxLength,
+          value,
           ...props
         }
       ),
@@ -2366,7 +2381,21 @@ var TextArea = (0, import_react7.forwardRef)(
         " ",
         errorMessage
       ] }),
-      helperMessage && !errorMessage && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Text_default, { size: "sm", weight: "normal", className: "mt-1.5 text-text-500", children: helperMessage })
+      !errorMessage && showCharacterCount && maxLength && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+        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__ */ (0, import_jsx_runtime10.jsx)(Text_default, { size: "sm", weight: "normal", className: "mt-1.5 text-text-500", children: helperMessage })
     ] });
   }
 );
@@ -3060,7 +3089,8 @@ var QuizDissertative = ({ paddingBottom }) => {
     getCurrentAnswer,
     selectDissertativeAnswer,
     getQuestionResultByQuestionId,
-    variant
+    variant,
+    getDissertativeCharLimit
   } = useQuizStore();
   const currentQuestion = getCurrentQuestion();
   const currentQuestionResult = getQuestionResultByQuestionId(
@@ -3068,6 +3098,7 @@ var QuizDissertative = ({ paddingBottom }) => {
   );
   const currentAnswer = getCurrentAnswer();
   const textareaRef = (0, import_react11.useRef)(null);
+  const charLimit = getDissertativeCharLimit();
   const handleAnswerChange = (value) => {
     if (currentQuestion) {
       selectDissertativeAnswer(currentQuestion.id, value);
@@ -3100,7 +3131,9 @@ var QuizDissertative = ({ paddingBottom }) => {
         value: localAnswer,
         onChange: (e) => handleAnswerChange(e.target.value),
         rows: 4,
-        className: "min-h-[120px] max-h-[400px] resize-none overflow-y-auto"
+        className: "min-h-[120px] max-h-[400px] resize-none overflow-y-auto",
+        maxLength: charLimit,
+        showCharacterCount: !!charLimit
       }
     ) }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "space-y-4", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-text-600 text-md whitespace-pre-wrap", children: localAnswer || "Nenhuma resposta fornecida" }) }) }) }),
     variant === "result" && currentQuestionResult?.answerStatus == "RESPOSTA_INCORRETA" /* RESPOSTA_INCORRETA */ && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [