analytica-frontend-lib 1.2.10 → 1.2.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,37 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ interface NoSearchResultProps {
4
+ /**
5
+ * Image source for the illustration
6
+ */
7
+ image: string;
8
+ /**
9
+ * Title text to display
10
+ * @default "Nenhum resultado encontrado"
11
+ */
12
+ title?: string;
13
+ /**
14
+ * Description text to display below the title
15
+ * @default "Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave."
16
+ */
17
+ description?: string;
18
+ }
19
+ /**
20
+ * Component displayed when no search results are found
21
+ * Shows an illustration with customizable title and description in horizontal layout
22
+ *
23
+ * @example
24
+ * ```tsx
25
+ * import { NoSearchResult } from 'analytica-frontend-lib';
26
+ * import noSearchImage from './assets/no-search.png';
27
+ *
28
+ * <NoSearchResult
29
+ * image={noSearchImage}
30
+ * title="Nenhum resultado encontrado"
31
+ * description="Tente usar outros filtros"
32
+ * />
33
+ * ```
34
+ */
35
+ declare const NoSearchResult: ({ image, title, description }: NoSearchResultProps) => react_jsx_runtime.JSX.Element;
36
+
37
+ export { type NoSearchResultProps, NoSearchResult as default };
@@ -0,0 +1,37 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+
3
+ interface NoSearchResultProps {
4
+ /**
5
+ * Image source for the illustration
6
+ */
7
+ image: string;
8
+ /**
9
+ * Title text to display
10
+ * @default "Nenhum resultado encontrado"
11
+ */
12
+ title?: string;
13
+ /**
14
+ * Description text to display below the title
15
+ * @default "Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave."
16
+ */
17
+ description?: string;
18
+ }
19
+ /**
20
+ * Component displayed when no search results are found
21
+ * Shows an illustration with customizable title and description in horizontal layout
22
+ *
23
+ * @example
24
+ * ```tsx
25
+ * import { NoSearchResult } from 'analytica-frontend-lib';
26
+ * import noSearchImage from './assets/no-search.png';
27
+ *
28
+ * <NoSearchResult
29
+ * image={noSearchImage}
30
+ * title="Nenhum resultado encontrado"
31
+ * description="Tente usar outros filtros"
32
+ * />
33
+ * ```
34
+ */
35
+ declare const NoSearchResult: ({ image, title, description }: NoSearchResultProps) => react_jsx_runtime.JSX.Element;
36
+
37
+ export { type NoSearchResultProps, NoSearchResult as default };
@@ -0,0 +1,113 @@
1
+ "use strict";
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __export = (target, all) => {
7
+ for (var name in all)
8
+ __defProp(target, name, { get: all[name], enumerable: true });
9
+ };
10
+ var __copyProps = (to, from, except, desc) => {
11
+ if (from && typeof from === "object" || typeof from === "function") {
12
+ for (let key of __getOwnPropNames(from))
13
+ if (!__hasOwnProp.call(to, key) && key !== except)
14
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
+ }
16
+ return to;
17
+ };
18
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
+
20
+ // src/components/NoSearchResult/NoSearchResult.tsx
21
+ var NoSearchResult_exports = {};
22
+ __export(NoSearchResult_exports, {
23
+ default: () => NoSearchResult_default
24
+ });
25
+ module.exports = __toCommonJS(NoSearchResult_exports);
26
+
27
+ // src/utils/utils.ts
28
+ var import_clsx = require("clsx");
29
+ var import_tailwind_merge = require("tailwind-merge");
30
+ function cn(...inputs) {
31
+ return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
32
+ }
33
+
34
+ // src/components/Text/Text.tsx
35
+ var import_jsx_runtime = require("react/jsx-runtime");
36
+ var Text = ({
37
+ children,
38
+ size = "md",
39
+ weight = "normal",
40
+ color = "text-text-950",
41
+ as,
42
+ className = "",
43
+ ...props
44
+ }) => {
45
+ let sizeClasses = "";
46
+ let weightClasses = "";
47
+ const sizeClassMap = {
48
+ "2xs": "text-2xs",
49
+ xs: "text-xs",
50
+ sm: "text-sm",
51
+ md: "text-md",
52
+ lg: "text-lg",
53
+ xl: "text-xl",
54
+ "2xl": "text-2xl",
55
+ "3xl": "text-3xl",
56
+ "4xl": "text-4xl",
57
+ "5xl": "text-5xl",
58
+ "6xl": "text-6xl"
59
+ };
60
+ sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
61
+ const weightClassMap = {
62
+ hairline: "font-hairline",
63
+ light: "font-light",
64
+ normal: "font-normal",
65
+ medium: "font-medium",
66
+ semibold: "font-semibold",
67
+ bold: "font-bold",
68
+ extrabold: "font-extrabold",
69
+ black: "font-black"
70
+ };
71
+ weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
72
+ const baseClasses = "font-primary";
73
+ const Component = as ?? "p";
74
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
75
+ Component,
76
+ {
77
+ className: cn(baseClasses, sizeClasses, weightClasses, color, className),
78
+ ...props,
79
+ children
80
+ }
81
+ );
82
+ };
83
+ var Text_default = Text;
84
+
85
+ // src/components/NoSearchResult/NoSearchResult.tsx
86
+ var import_jsx_runtime2 = require("react/jsx-runtime");
87
+ var NoSearchResult = ({ image, title, description }) => {
88
+ const displayTitle = title || "Nenhum resultado encontrado";
89
+ const displayDescription = description || "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.";
90
+ 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: [
91
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "w-72 h-72 flex-shrink-0 relative", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
92
+ "img",
93
+ {
94
+ src: image,
95
+ alt: "No search results",
96
+ className: "w-full h-full object-contain"
97
+ }
98
+ ) }),
99
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex flex-col items-start w-full max-w-md", children: [
100
+ /* @__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)(
101
+ Text_default,
102
+ {
103
+ as: "h2",
104
+ className: "text-text-950 font-semibold text-3xl leading-tight w-full flex items-center",
105
+ children: displayTitle
106
+ }
107
+ ) }),
108
+ /* @__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 }) })
109
+ ] })
110
+ ] });
111
+ };
112
+ var NoSearchResult_default = NoSearchResult;
113
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
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"]}
@@ -0,0 +1,90 @@
1
+ // src/utils/utils.ts
2
+ import { clsx } from "clsx";
3
+ import { twMerge } from "tailwind-merge";
4
+ function cn(...inputs) {
5
+ return twMerge(clsx(inputs));
6
+ }
7
+
8
+ // src/components/Text/Text.tsx
9
+ import { jsx } from "react/jsx-runtime";
10
+ var Text = ({
11
+ children,
12
+ size = "md",
13
+ weight = "normal",
14
+ color = "text-text-950",
15
+ as,
16
+ className = "",
17
+ ...props
18
+ }) => {
19
+ let sizeClasses = "";
20
+ let weightClasses = "";
21
+ const sizeClassMap = {
22
+ "2xs": "text-2xs",
23
+ xs: "text-xs",
24
+ sm: "text-sm",
25
+ md: "text-md",
26
+ lg: "text-lg",
27
+ xl: "text-xl",
28
+ "2xl": "text-2xl",
29
+ "3xl": "text-3xl",
30
+ "4xl": "text-4xl",
31
+ "5xl": "text-5xl",
32
+ "6xl": "text-6xl"
33
+ };
34
+ sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
35
+ const weightClassMap = {
36
+ hairline: "font-hairline",
37
+ light: "font-light",
38
+ normal: "font-normal",
39
+ medium: "font-medium",
40
+ semibold: "font-semibold",
41
+ bold: "font-bold",
42
+ extrabold: "font-extrabold",
43
+ black: "font-black"
44
+ };
45
+ weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
46
+ const baseClasses = "font-primary";
47
+ const Component = as ?? "p";
48
+ return /* @__PURE__ */ jsx(
49
+ Component,
50
+ {
51
+ className: cn(baseClasses, sizeClasses, weightClasses, color, className),
52
+ ...props,
53
+ children
54
+ }
55
+ );
56
+ };
57
+ var Text_default = Text;
58
+
59
+ // src/components/NoSearchResult/NoSearchResult.tsx
60
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
61
+ var NoSearchResult = ({ image, title, description }) => {
62
+ const displayTitle = title || "Nenhum resultado encontrado";
63
+ const displayDescription = description || "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.";
64
+ return /* @__PURE__ */ jsxs("div", { className: "flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96", children: [
65
+ /* @__PURE__ */ jsx2("div", { className: "w-72 h-72 flex-shrink-0 relative", children: /* @__PURE__ */ jsx2(
66
+ "img",
67
+ {
68
+ src: image,
69
+ alt: "No search results",
70
+ className: "w-full h-full object-contain"
71
+ }
72
+ ) }),
73
+ /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start w-full max-w-md", children: [
74
+ /* @__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(
75
+ Text_default,
76
+ {
77
+ as: "h2",
78
+ className: "text-text-950 font-semibold text-3xl leading-tight w-full flex items-center",
79
+ children: displayTitle
80
+ }
81
+ ) }),
82
+ /* @__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 }) })
83
+ ] })
84
+ ] });
85
+ };
86
+ var NoSearchResult_default = NoSearchResult;
87
+ export {
88
+ NoSearchResult_default as default
89
+ };
90
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1 @@
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/index.css CHANGED
@@ -114,6 +114,7 @@
114
114
  --tracking-wide: 0.025em;
115
115
  --leading-tight: 1.25;
116
116
  --leading-normal: 1.5;
117
+ --leading-relaxed: 1.625;
117
118
  --radius-xs: 0.125rem;
118
119
  --radius-sm: 0.25rem;
119
120
  --radius-md: 0.375rem;
@@ -852,6 +853,9 @@
852
853
  .h-24 {
853
854
  height: calc(var(--spacing) * 24);
854
855
  }
856
+ .h-72 {
857
+ height: calc(var(--spacing) * 72);
858
+ }
855
859
  .h-\[1em\] {
856
860
  height: 1em;
857
861
  }
@@ -966,6 +970,9 @@
966
970
  .min-h-24 {
967
971
  min-height: calc(var(--spacing) * 24);
968
972
  }
973
+ .min-h-96 {
974
+ min-height: calc(var(--spacing) * 96);
975
+ }
969
976
  .min-h-\[50px\] {
970
977
  min-height: 50px;
971
978
  }
@@ -1053,6 +1060,9 @@
1053
1060
  .w-20 {
1054
1061
  width: calc(var(--spacing) * 20);
1055
1062
  }
1063
+ .w-72 {
1064
+ width: calc(var(--spacing) * 72);
1065
+ }
1056
1066
  .w-\[1em\] {
1057
1067
  width: 1em;
1058
1068
  }
@@ -3014,6 +3024,9 @@
3014
3024
  .text-center {
3015
3025
  text-align: center;
3016
3026
  }
3027
+ .text-justify {
3028
+ text-align: justify;
3029
+ }
3017
3030
  .text-left {
3018
3031
  text-align: left;
3019
3032
  }
@@ -3137,6 +3150,10 @@
3137
3150
  --tw-leading: var(--leading-normal);
3138
3151
  line-height: var(--leading-normal);
3139
3152
  }
3153
+ .leading-relaxed {
3154
+ --tw-leading: var(--leading-relaxed);
3155
+ line-height: var(--leading-relaxed);
3156
+ }
3140
3157
  .leading-tight {
3141
3158
  --tw-leading: var(--leading-tight);
3142
3159
  line-height: var(--leading-tight);