analytica-frontend-lib 1.2.13 → 1.2.14
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.
- package/dist/AlertManager/index.css +3 -0
- package/dist/AlertManager/index.css.map +1 -1
- package/dist/AlertManagerView/index.js +210 -70
- package/dist/AlertManagerView/index.js.map +1 -1
- package/dist/AlertManagerView/index.mjs +214 -71
- package/dist/AlertManagerView/index.mjs.map +1 -1
- package/dist/Table/index.d.mts +14 -0
- package/dist/Table/index.d.ts +14 -0
- package/dist/Table/index.js +279 -30
- package/dist/Table/index.js.map +1 -1
- package/dist/Table/index.mjs +284 -32
- package/dist/Table/index.mjs.map +1 -1
- package/dist/index.css +3 -0
- package/dist/index.css.map +1 -1
- package/dist/index.js +763 -652
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +803 -689
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +3 -0
- package/dist/styles.css.map +1 -1
- package/package.json +1 -1
package/dist/Table/index.mjs
CHANGED
|
@@ -3,7 +3,10 @@ import {
|
|
|
3
3
|
forwardRef,
|
|
4
4
|
useState,
|
|
5
5
|
useMemo,
|
|
6
|
-
useEffect
|
|
6
|
+
useEffect,
|
|
7
|
+
Children,
|
|
8
|
+
isValidElement,
|
|
9
|
+
cloneElement
|
|
7
10
|
} from "react";
|
|
8
11
|
|
|
9
12
|
// src/utils/utils.ts
|
|
@@ -15,7 +18,147 @@ function cn(...inputs) {
|
|
|
15
18
|
|
|
16
19
|
// src/components/Table/Table.tsx
|
|
17
20
|
import { CaretUp, CaretDown } from "phosphor-react";
|
|
18
|
-
|
|
21
|
+
|
|
22
|
+
// src/components/Text/Text.tsx
|
|
23
|
+
import { jsx } from "react/jsx-runtime";
|
|
24
|
+
var Text = ({
|
|
25
|
+
children,
|
|
26
|
+
size = "md",
|
|
27
|
+
weight = "normal",
|
|
28
|
+
color = "text-text-950",
|
|
29
|
+
as,
|
|
30
|
+
className = "",
|
|
31
|
+
...props
|
|
32
|
+
}) => {
|
|
33
|
+
let sizeClasses = "";
|
|
34
|
+
let weightClasses = "";
|
|
35
|
+
const sizeClassMap = {
|
|
36
|
+
"2xs": "text-2xs",
|
|
37
|
+
xs: "text-xs",
|
|
38
|
+
sm: "text-sm",
|
|
39
|
+
md: "text-md",
|
|
40
|
+
lg: "text-lg",
|
|
41
|
+
xl: "text-xl",
|
|
42
|
+
"2xl": "text-2xl",
|
|
43
|
+
"3xl": "text-3xl",
|
|
44
|
+
"4xl": "text-4xl",
|
|
45
|
+
"5xl": "text-5xl",
|
|
46
|
+
"6xl": "text-6xl"
|
|
47
|
+
};
|
|
48
|
+
sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
|
|
49
|
+
const weightClassMap = {
|
|
50
|
+
hairline: "font-hairline",
|
|
51
|
+
light: "font-light",
|
|
52
|
+
normal: "font-normal",
|
|
53
|
+
medium: "font-medium",
|
|
54
|
+
semibold: "font-semibold",
|
|
55
|
+
bold: "font-bold",
|
|
56
|
+
extrabold: "font-extrabold",
|
|
57
|
+
black: "font-black"
|
|
58
|
+
};
|
|
59
|
+
weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
|
|
60
|
+
const baseClasses = "font-primary";
|
|
61
|
+
const Component = as ?? "p";
|
|
62
|
+
return /* @__PURE__ */ jsx(
|
|
63
|
+
Component,
|
|
64
|
+
{
|
|
65
|
+
className: cn(baseClasses, sizeClasses, weightClasses, color, className),
|
|
66
|
+
...props,
|
|
67
|
+
children
|
|
68
|
+
}
|
|
69
|
+
);
|
|
70
|
+
};
|
|
71
|
+
var Text_default = Text;
|
|
72
|
+
|
|
73
|
+
// src/components/NoSearchResult/NoSearchResult.tsx
|
|
74
|
+
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
75
|
+
var NoSearchResult = ({ image, title, description }) => {
|
|
76
|
+
const displayTitle = title || "Nenhum resultado encontrado";
|
|
77
|
+
const displayDescription = description || "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.";
|
|
78
|
+
return /* @__PURE__ */ jsxs("div", { className: "flex flex-row justify-center items-center gap-8 w-full max-w-4xl min-h-96", children: [
|
|
79
|
+
/* @__PURE__ */ jsx2("div", { className: "w-72 h-72 flex-shrink-0 relative", children: /* @__PURE__ */ jsx2(
|
|
80
|
+
"img",
|
|
81
|
+
{
|
|
82
|
+
src: image,
|
|
83
|
+
alt: "No search results",
|
|
84
|
+
className: "w-full h-full object-contain"
|
|
85
|
+
}
|
|
86
|
+
) }),
|
|
87
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-start w-full max-w-md", children: [
|
|
88
|
+
/* @__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(
|
|
89
|
+
Text_default,
|
|
90
|
+
{
|
|
91
|
+
as: "h2",
|
|
92
|
+
className: "text-text-950 font-semibold text-3xl leading-tight w-full flex items-center",
|
|
93
|
+
children: displayTitle
|
|
94
|
+
}
|
|
95
|
+
) }),
|
|
96
|
+
/* @__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 }) })
|
|
97
|
+
] })
|
|
98
|
+
] });
|
|
99
|
+
};
|
|
100
|
+
var NoSearchResult_default = NoSearchResult;
|
|
101
|
+
|
|
102
|
+
// src/components/Button/Button.tsx
|
|
103
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
104
|
+
var VARIANT_ACTION_CLASSES = {
|
|
105
|
+
solid: {
|
|
106
|
+
primary: "bg-primary-950 text-text border border-primary-950 hover:bg-primary-800 hover:border-primary-800 focus-visible:outline-none focus-visible:bg-primary-950 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-primary-700 active:border-primary-700 disabled:bg-primary-500 disabled:border-primary-500 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
107
|
+
positive: "bg-success-500 text-text border border-success-500 hover:bg-success-600 hover:border-success-600 focus-visible:outline-none focus-visible:bg-success-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-success-700 active:border-success-700 disabled:bg-success-500 disabled:border-success-500 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
108
|
+
negative: "bg-error-500 text-text border border-error-500 hover:bg-error-600 hover:border-error-600 focus-visible:outline-none focus-visible:bg-error-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-error-700 active:border-error-700 disabled:bg-error-500 disabled:border-error-500 disabled:opacity-40 disabled:cursor-not-allowed"
|
|
109
|
+
},
|
|
110
|
+
outline: {
|
|
111
|
+
primary: "bg-transparent text-primary-950 border border-primary-950 hover:bg-background-50 hover:text-primary-400 hover:border-primary-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 active:border-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
112
|
+
positive: "bg-transparent text-success-500 border border-success-300 hover:bg-background-50 hover:text-success-400 hover:border-success-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 active:border-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
113
|
+
negative: "bg-transparent text-error-500 border border-error-300 hover:bg-background-50 hover:text-error-400 hover:border-error-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 active:border-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
|
|
114
|
+
},
|
|
115
|
+
link: {
|
|
116
|
+
primary: "bg-transparent text-primary-950 hover:text-primary-400 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
117
|
+
positive: "bg-transparent text-success-500 hover:text-success-400 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 disabled:opacity-40 disabled:cursor-not-allowed",
|
|
118
|
+
negative: "bg-transparent text-error-500 hover:text-error-400 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 disabled:opacity-40 disabled:cursor-not-allowed"
|
|
119
|
+
}
|
|
120
|
+
};
|
|
121
|
+
var SIZE_CLASSES = {
|
|
122
|
+
"extra-small": "text-xs px-3.5 py-2",
|
|
123
|
+
small: "text-sm px-4 py-2.5",
|
|
124
|
+
medium: "text-md px-5 py-2.5",
|
|
125
|
+
large: "text-lg px-6 py-3",
|
|
126
|
+
"extra-large": "text-lg px-7 py-3.5"
|
|
127
|
+
};
|
|
128
|
+
var Button = ({
|
|
129
|
+
children,
|
|
130
|
+
iconLeft,
|
|
131
|
+
iconRight,
|
|
132
|
+
size = "medium",
|
|
133
|
+
variant = "solid",
|
|
134
|
+
action = "primary",
|
|
135
|
+
className = "",
|
|
136
|
+
disabled,
|
|
137
|
+
type = "button",
|
|
138
|
+
...props
|
|
139
|
+
}) => {
|
|
140
|
+
const sizeClasses = SIZE_CLASSES[size];
|
|
141
|
+
const variantClasses = VARIANT_ACTION_CLASSES[variant][action];
|
|
142
|
+
const baseClasses = "inline-flex items-center justify-center rounded-full cursor-pointer font-medium";
|
|
143
|
+
return /* @__PURE__ */ jsxs2(
|
|
144
|
+
"button",
|
|
145
|
+
{
|
|
146
|
+
className: cn(baseClasses, variantClasses, sizeClasses, className),
|
|
147
|
+
disabled,
|
|
148
|
+
type,
|
|
149
|
+
...props,
|
|
150
|
+
children: [
|
|
151
|
+
iconLeft && /* @__PURE__ */ jsx3("span", { className: "mr-2 flex items-center", children: iconLeft }),
|
|
152
|
+
children,
|
|
153
|
+
iconRight && /* @__PURE__ */ jsx3("span", { className: "ml-2 flex items-center", children: iconRight })
|
|
154
|
+
]
|
|
155
|
+
}
|
|
156
|
+
);
|
|
157
|
+
};
|
|
158
|
+
var Button_default = Button;
|
|
159
|
+
|
|
160
|
+
// src/components/Table/Table.tsx
|
|
161
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
19
162
|
function useTableSort(data, options = {}) {
|
|
20
163
|
const { syncWithUrl = false } = options;
|
|
21
164
|
const getInitialState = () => {
|
|
@@ -86,33 +229,142 @@ function useTableSort(data, options = {}) {
|
|
|
86
229
|
return { sortedData, sortColumn, sortDirection, handleSort };
|
|
87
230
|
}
|
|
88
231
|
var Table = forwardRef(
|
|
89
|
-
({
|
|
90
|
-
"
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
232
|
+
({
|
|
233
|
+
variant = "default",
|
|
234
|
+
className,
|
|
235
|
+
children,
|
|
236
|
+
searchTerm,
|
|
237
|
+
noSearchResultImage,
|
|
238
|
+
noSearchResultTitle = "Nenhum resultado encontrado",
|
|
239
|
+
noSearchResultDescription = "N\xE3o encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.",
|
|
240
|
+
emptyStateMessage = "Nenhum dado dispon\xEDvel no momento.",
|
|
241
|
+
emptyStateButtonText = "Adicionar item",
|
|
242
|
+
onEmptyStateButtonClick,
|
|
243
|
+
...props
|
|
244
|
+
}, ref) => {
|
|
245
|
+
const isTableBodyEmpty = useMemo(() => {
|
|
246
|
+
let foundBody = false;
|
|
247
|
+
let empty = true;
|
|
248
|
+
Children.forEach(children, (child) => {
|
|
249
|
+
if (isValidElement(child) && child.type === TableBody) {
|
|
250
|
+
foundBody = true;
|
|
251
|
+
const bodyProps = child.props;
|
|
252
|
+
if (Children.count(bodyProps?.children) > 0) {
|
|
253
|
+
empty = false;
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
});
|
|
257
|
+
return foundBody ? empty : false;
|
|
258
|
+
}, [children]);
|
|
259
|
+
const columnCount = useMemo(() => {
|
|
260
|
+
let count = 0;
|
|
261
|
+
Children.forEach(children, (child) => {
|
|
262
|
+
if (isValidElement(child) && child.type === TableHeader) {
|
|
263
|
+
const headerProps = child.props;
|
|
264
|
+
Children.forEach(headerProps.children, (row) => {
|
|
265
|
+
if (isValidElement(row) && row.type === TableRow) {
|
|
266
|
+
const rowProps = row.props;
|
|
267
|
+
count = Children.count(rowProps.children);
|
|
268
|
+
}
|
|
269
|
+
});
|
|
270
|
+
}
|
|
271
|
+
});
|
|
272
|
+
return count || 1;
|
|
273
|
+
}, [children]);
|
|
274
|
+
const hasSearchTerm = searchTerm && searchTerm.trim() !== "";
|
|
275
|
+
const showNoSearchResult = hasSearchTerm && isTableBodyEmpty;
|
|
276
|
+
const showEmptyState = !hasSearchTerm && isTableBodyEmpty;
|
|
277
|
+
if (showNoSearchResult) {
|
|
278
|
+
return /* @__PURE__ */ jsxs3(
|
|
279
|
+
"div",
|
|
98
280
|
{
|
|
99
|
-
ref,
|
|
100
281
|
className: cn(
|
|
101
|
-
"
|
|
102
|
-
|
|
282
|
+
"relative w-full overflow-x-auto",
|
|
283
|
+
variant === "default" && "border border-border-200 rounded-xl"
|
|
103
284
|
),
|
|
104
|
-
...props,
|
|
105
285
|
children: [
|
|
106
|
-
/* @__PURE__ */
|
|
107
|
-
|
|
286
|
+
/* @__PURE__ */ jsx4(
|
|
287
|
+
"table",
|
|
288
|
+
{
|
|
289
|
+
ref,
|
|
290
|
+
className: cn(
|
|
291
|
+
"analytica-table w-full caption-bottom text-sm border-separate border-spacing-0",
|
|
292
|
+
className
|
|
293
|
+
),
|
|
294
|
+
...props,
|
|
295
|
+
children: Children.map(children, (child) => {
|
|
296
|
+
if (isValidElement(child) && (child.type === TableCaption || child.type === TableHeader)) {
|
|
297
|
+
return child;
|
|
298
|
+
}
|
|
299
|
+
return null;
|
|
300
|
+
})
|
|
301
|
+
}
|
|
302
|
+
),
|
|
303
|
+
/* @__PURE__ */ jsx4("div", { className: "py-8 flex justify-center", children: noSearchResultImage ? /* @__PURE__ */ jsx4(
|
|
304
|
+
NoSearchResult_default,
|
|
305
|
+
{
|
|
306
|
+
image: noSearchResultImage,
|
|
307
|
+
title: noSearchResultTitle,
|
|
308
|
+
description: noSearchResultDescription
|
|
309
|
+
}
|
|
310
|
+
) : /* @__PURE__ */ jsxs3("div", { className: "text-center", children: [
|
|
311
|
+
/* @__PURE__ */ jsx4("p", { className: "text-text-600 text-lg font-semibold mb-2", children: noSearchResultTitle }),
|
|
312
|
+
/* @__PURE__ */ jsx4("p", { className: "text-text-500 text-sm", children: noSearchResultDescription })
|
|
313
|
+
] }) })
|
|
108
314
|
]
|
|
109
315
|
}
|
|
110
|
-
)
|
|
316
|
+
);
|
|
111
317
|
}
|
|
112
|
-
|
|
318
|
+
const modifiedChildren = Children.map(children, (child) => {
|
|
319
|
+
if (isValidElement(child) && child.type === TableBody && showEmptyState) {
|
|
320
|
+
return cloneElement(child, {
|
|
321
|
+
children: /* @__PURE__ */ jsx4(TableRow, { variant, children: /* @__PURE__ */ jsx4(TableCell, { colSpan: columnCount, children: /* @__PURE__ */ jsxs3("div", { className: "flex flex-col items-center justify-center py-12 gap-4", children: [
|
|
322
|
+
/* @__PURE__ */ jsx4("p", { className: "text-text-600 text-base font-normal", children: emptyStateMessage }),
|
|
323
|
+
onEmptyStateButtonClick && /* @__PURE__ */ jsx4(
|
|
324
|
+
Button_default,
|
|
325
|
+
{
|
|
326
|
+
variant: "solid",
|
|
327
|
+
action: "primary",
|
|
328
|
+
size: "medium",
|
|
329
|
+
onClick: onEmptyStateButtonClick,
|
|
330
|
+
children: emptyStateButtonText
|
|
331
|
+
}
|
|
332
|
+
)
|
|
333
|
+
] }) }) })
|
|
334
|
+
});
|
|
335
|
+
}
|
|
336
|
+
return child;
|
|
337
|
+
});
|
|
338
|
+
return /* @__PURE__ */ jsx4(
|
|
339
|
+
"div",
|
|
340
|
+
{
|
|
341
|
+
className: cn(
|
|
342
|
+
"relative w-full overflow-x-auto",
|
|
343
|
+
variant === "default" && "border border-border-200 rounded-xl"
|
|
344
|
+
),
|
|
345
|
+
children: /* @__PURE__ */ jsxs3(
|
|
346
|
+
"table",
|
|
347
|
+
{
|
|
348
|
+
ref,
|
|
349
|
+
className: cn(
|
|
350
|
+
"analytica-table w-full caption-bottom text-sm border-separate border-spacing-0",
|
|
351
|
+
className
|
|
352
|
+
),
|
|
353
|
+
...props,
|
|
354
|
+
children: [
|
|
355
|
+
!Children.toArray(children).some(
|
|
356
|
+
(child) => isValidElement(child) && child.type === TableCaption
|
|
357
|
+
) && /* @__PURE__ */ jsx4("caption", { className: "sr-only", children: "My Table" }),
|
|
358
|
+
modifiedChildren
|
|
359
|
+
]
|
|
360
|
+
}
|
|
361
|
+
)
|
|
362
|
+
}
|
|
363
|
+
);
|
|
364
|
+
}
|
|
113
365
|
);
|
|
114
366
|
Table.displayName = "Table";
|
|
115
|
-
var TableHeader = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
367
|
+
var TableHeader = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
|
|
116
368
|
"thead",
|
|
117
369
|
{
|
|
118
370
|
ref,
|
|
@@ -122,7 +374,7 @@ var TableHeader = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ j
|
|
|
122
374
|
));
|
|
123
375
|
TableHeader.displayName = "TableHeader";
|
|
124
376
|
var TableBody = forwardRef(
|
|
125
|
-
({ className, ...props }, ref) => /* @__PURE__ */
|
|
377
|
+
({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
|
|
126
378
|
"tbody",
|
|
127
379
|
{
|
|
128
380
|
ref,
|
|
@@ -133,7 +385,7 @@ var TableBody = forwardRef(
|
|
|
133
385
|
);
|
|
134
386
|
TableBody.displayName = "TableBody";
|
|
135
387
|
var TableFooter = forwardRef(
|
|
136
|
-
({ variant = "default", className, ...props }, ref) => /* @__PURE__ */
|
|
388
|
+
({ variant = "default", className, ...props }, ref) => /* @__PURE__ */ jsx4(
|
|
137
389
|
"tfoot",
|
|
138
390
|
{
|
|
139
391
|
ref,
|
|
@@ -173,14 +425,14 @@ var TableRow = forwardRef(
|
|
|
173
425
|
className,
|
|
174
426
|
...props
|
|
175
427
|
}, ref) => {
|
|
176
|
-
return /* @__PURE__ */
|
|
428
|
+
return /* @__PURE__ */ jsx4(
|
|
177
429
|
"tr",
|
|
178
430
|
{
|
|
179
431
|
ref,
|
|
180
432
|
className: cn(
|
|
181
433
|
"transition-colors",
|
|
182
|
-
state
|
|
183
|
-
|
|
434
|
+
state === "disabled" ? "" : "hover:bg-muted/50",
|
|
435
|
+
state === "disabled" || !clickable ? "" : "cursor-pointer",
|
|
184
436
|
VARIANT_STATES_ROW[state][variant],
|
|
185
437
|
className
|
|
186
438
|
),
|
|
@@ -205,7 +457,7 @@ var TableHead = forwardRef(
|
|
|
205
457
|
onSort();
|
|
206
458
|
}
|
|
207
459
|
};
|
|
208
|
-
return /* @__PURE__ */
|
|
460
|
+
return /* @__PURE__ */ jsx4(
|
|
209
461
|
"th",
|
|
210
462
|
{
|
|
211
463
|
ref,
|
|
@@ -216,11 +468,11 @@ var TableHead = forwardRef(
|
|
|
216
468
|
),
|
|
217
469
|
onClick: handleClick,
|
|
218
470
|
...props,
|
|
219
|
-
children: /* @__PURE__ */
|
|
471
|
+
children: /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2", children: [
|
|
220
472
|
children,
|
|
221
|
-
sortable && /* @__PURE__ */
|
|
222
|
-
sortDirection === "asc" && /* @__PURE__ */
|
|
223
|
-
sortDirection === "desc" && /* @__PURE__ */
|
|
473
|
+
sortable && /* @__PURE__ */ jsxs3("div", { className: "flex flex-col", children: [
|
|
474
|
+
sortDirection === "asc" && /* @__PURE__ */ jsx4(CaretUp, { size: 16, weight: "fill", className: "text-text-800" }),
|
|
475
|
+
sortDirection === "desc" && /* @__PURE__ */ jsx4(CaretDown, { size: 16, weight: "fill", className: "text-text-800" })
|
|
224
476
|
] })
|
|
225
477
|
] })
|
|
226
478
|
}
|
|
@@ -228,7 +480,7 @@ var TableHead = forwardRef(
|
|
|
228
480
|
}
|
|
229
481
|
);
|
|
230
482
|
TableHead.displayName = "TableHead";
|
|
231
|
-
var TableCell = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
483
|
+
var TableCell = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
|
|
232
484
|
"td",
|
|
233
485
|
{
|
|
234
486
|
ref,
|
|
@@ -240,7 +492,7 @@ var TableCell = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx
|
|
|
240
492
|
}
|
|
241
493
|
));
|
|
242
494
|
TableCell.displayName = "TableCell";
|
|
243
|
-
var TableCaption = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
495
|
+
var TableCaption = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
|
|
244
496
|
"caption",
|
|
245
497
|
{
|
|
246
498
|
ref,
|
package/dist/Table/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/Table/Table.tsx","../../src/utils/utils.ts"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n TdHTMLAttributes,\n ThHTMLAttributes,\n useState,\n useMemo,\n useEffect,\n} from 'react';\nimport { cn } from '../../utils/utils';\nimport { CaretUp, CaretDown } from 'phosphor-react';\n\ntype TableVariant = 'default' | 'borderless';\ntype TableRowState = 'default' | 'selected' | 'invalid' | 'disabled';\nexport type SortDirection = 'asc' | 'desc' | null;\n\nexport interface UseTableSortOptions {\n /** Se true, sincroniza o estado de ordenação com os parâmetros da URL */\n syncWithUrl?: boolean;\n}\n\n/**\n * Hook para gerenciar ordenação de dados da tabela\n *\n * @param data - Array de dados a serem ordenados\n * @param options - Opções de configuração do hook\n * @returns Objeto com dados ordenados, coluna/direção atual e função de sort\n *\n * @example\n * ```tsx\n * const activities = [\n * { id: 1, name: 'Task A', date: '2024-01-01' },\n * { id: 2, name: 'Task B', date: '2024-01-02' },\n * ];\n *\n * // Sem sincronização com URL\n * const { sortedData, sortColumn, sortDirection, handleSort } = useTableSort(activities);\n *\n * // Com sincronização com URL\n * const { sortedData, sortColumn, sortDirection, handleSort } = useTableSort(activities, { syncWithUrl: true });\n *\n * <TableHead\n * sortDirection={sortColumn === 'name' ? sortDirection : null}\n * onSort={() => handleSort('name')}\n * >\n * Name\n * </TableHead>\n * ```\n */\nexport function useTableSort<T extends Record<string, unknown>>(\n data: T[],\n options: UseTableSortOptions = {}\n) {\n const { syncWithUrl = false } = options;\n\n // Inicializar estado a partir da URL se syncWithUrl estiver habilitado\n const getInitialState = () => {\n if (!syncWithUrl || globalThis.window === undefined) {\n return { column: null, direction: null };\n }\n\n const params = new URLSearchParams(globalThis.location.search);\n const sortBy = params.get('sortBy');\n const sort = params.get('sort');\n\n if (sortBy && sort && (sort === 'ASC' || sort === 'DESC')) {\n return {\n column: sortBy,\n direction: sort.toLowerCase() as SortDirection,\n };\n }\n\n return { column: null, direction: null };\n };\n\n const initialState = getInitialState();\n const [sortColumn, setSortColumn] = useState<string | null>(\n initialState.column\n );\n const [sortDirection, setSortDirection] = useState<SortDirection>(\n initialState.direction\n );\n\n // Atualizar URL quando o estado de ordenação mudar\n useEffect(() => {\n if (!syncWithUrl || globalThis.window === undefined) return;\n\n const url = new URL(globalThis.location.href);\n const params = url.searchParams;\n\n if (sortColumn && sortDirection) {\n params.set('sortBy', sortColumn);\n params.set('sort', sortDirection.toUpperCase());\n } else {\n params.delete('sortBy');\n params.delete('sort');\n }\n\n // Atualizar URL sem recarregar a página\n globalThis.history.replaceState({}, '', url.toString());\n }, [sortColumn, sortDirection, syncWithUrl]);\n\n const handleSort = (column: string) => {\n if (sortColumn === column) {\n if (sortDirection === 'asc') {\n setSortDirection('desc');\n } else if (sortDirection === 'desc') {\n setSortColumn(null);\n setSortDirection(null);\n }\n } else {\n setSortColumn(column);\n setSortDirection('asc');\n }\n };\n\n const sortedData = useMemo(() => {\n if (!sortColumn || !sortDirection) {\n return data;\n }\n\n return [...data].sort((a, b) => {\n const aValue = a[sortColumn as keyof T];\n const bValue = b[sortColumn as keyof T];\n\n if (typeof aValue === 'string' && typeof bValue === 'string') {\n const comparison = aValue.localeCompare(bValue);\n return sortDirection === 'asc' ? comparison : -comparison;\n }\n\n if (typeof aValue === 'number' && typeof bValue === 'number') {\n return sortDirection === 'asc' ? aValue - bValue : bValue - aValue;\n }\n\n return 0;\n });\n }, [data, sortColumn, sortDirection]);\n\n return { sortedData, sortColumn, sortDirection, handleSort };\n}\n\ninterface TableProps extends HTMLAttributes<HTMLTableElement> {\n variant?: TableVariant;\n}\n\ninterface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {\n state?: TableRowState;\n}\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n ({ variant = 'default', className, children, ...props }, ref) => (\n <div\n className={cn(\n 'relative w-full overflow-x-auto',\n variant === 'default' && 'border border-border-200 rounded-xl'\n )}\n >\n <table\n ref={ref}\n className={cn(\n 'analytica-table w-full caption-bottom text-sm border-separate border-spacing-0',\n className\n )}\n {...props}\n >\n {/* Fix Sonnar */}\n <caption className=\"sr-only\">My Table</caption>\n {children}\n </table>\n </div>\n )\n);\n\nTable.displayName = 'Table';\n\nconst TableHeader = forwardRef<\n HTMLTableSectionElement,\n HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <thead\n ref={ref}\n className={cn('[&_tr:first-child]:border-0', className)}\n {...props}\n />\n));\nTableHeader.displayName = 'TableHeader';\n\ninterface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n variant?: TableVariant;\n}\n\nconst TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(\n ({ className, ...props }, ref) => (\n <tbody\n ref={ref}\n className={cn('[&_tr:last-child]:border-border-200', className)}\n {...props}\n />\n )\n);\nTableBody.displayName = 'TableBody';\n\ninterface TableFooterProps extends HTMLAttributes<HTMLTableSectionElement> {\n variant?: TableVariant;\n}\n\nconst TableFooter = forwardRef<HTMLTableSectionElement, TableFooterProps>(\n ({ variant = 'default', className, ...props }, ref) => (\n <tfoot\n ref={ref}\n className={cn(\n 'bg-background-50 font-medium [&>tr]:last:border-b-0 px-6 py-3.5',\n variant === 'default' && 'border-t border-border-200',\n className\n )}\n {...props}\n />\n )\n);\nTableFooter.displayName = 'TableFooter';\n\nconst VARIANT_STATES_ROW = {\n default: {\n default: 'border border-border-200',\n borderless: '',\n },\n selected: {\n default: 'border-b-2 border-indicator-primary',\n borderless: 'bg-indicator-primary/10',\n },\n invalid: {\n default: 'border-b-2 border-indicator-error',\n borderless: 'bg-indicator-error/10',\n },\n disabled: {\n default:\n 'border-b border-border-100 bg-background-50 opacity-50 cursor-not-allowed',\n borderless: 'bg-background-50 opacity-50 cursor-not-allowed',\n },\n} as const;\n\ninterface TableRowPropsExtended extends TableRowProps {\n variant?: TableVariant;\n clickable?: boolean;\n}\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowPropsExtended>(\n (\n {\n variant = 'default',\n state = 'default',\n clickable = false,\n className,\n ...props\n },\n ref\n ) => {\n return (\n <tr\n ref={ref}\n className={cn(\n 'transition-colors',\n state !== 'disabled' ? 'hover:bg-muted/50' : '',\n clickable && state !== 'disabled' ? 'cursor-pointer' : '',\n VARIANT_STATES_ROW[state][variant],\n className\n )}\n aria-disabled={state === 'disabled'}\n {...props}\n />\n );\n }\n);\nTableRow.displayName = 'TableRow';\n\ninterface TableHeadProps extends ThHTMLAttributes<HTMLTableCellElement> {\n /** Enable sorting on this column (default: true) */\n sortable?: boolean;\n /** Current sort direction for this column */\n sortDirection?: SortDirection;\n /** Callback when column header is clicked */\n onSort?: () => void;\n}\n\nconst TableHead = forwardRef<HTMLTableCellElement, TableHeadProps>(\n (\n {\n className,\n sortable = true,\n sortDirection = null,\n onSort,\n children,\n ...props\n },\n ref\n ) => {\n const handleClick = () => {\n if (sortable && onSort) {\n onSort();\n }\n };\n\n return (\n <th\n ref={ref}\n className={cn(\n 'h-10 px-6 py-3.5 text-left align-middle font-bold text-base text-text-800 tracking-[0.2px] leading-none [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] whitespace-nowrap',\n sortable && 'cursor-pointer select-none hover:bg-muted/30',\n className\n )}\n onClick={handleClick}\n {...props}\n >\n <div className=\"flex items-center gap-2\">\n {children}\n {sortable && (\n <div className=\"flex flex-col\">\n {sortDirection === 'asc' && (\n <CaretUp size={16} weight=\"fill\" className=\"text-text-800\" />\n )}\n {sortDirection === 'desc' && (\n <CaretDown size={16} weight=\"fill\" className=\"text-text-800\" />\n )}\n </div>\n )}\n </div>\n </th>\n );\n }\n);\nTableHead.displayName = 'TableHead';\n\nconst TableCell = forwardRef<\n HTMLTableCellElement,\n TdHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <td\n ref={ref}\n className={cn(\n 'p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] text-base font-normal text-text-800 leading-[150%] tracking-normal px-6 py-3.5 whitespace-nowrap',\n className\n )}\n {...props}\n />\n));\nTableCell.displayName = 'TableCell';\n\nconst TableCaption = forwardRef<\n HTMLTableCaptionElement,\n HTMLAttributes<HTMLTableCaptionElement>\n>(({ className, ...props }, ref) => (\n <caption\n ref={ref}\n className={cn(\n 'border-t border-border-200 text-sm text-text-800 px-6 py-3.5',\n className\n )}\n {...props}\n />\n));\nTableCaption.displayName = 'TableCaption';\n\nexport default Table;\nexport {\n TableHeader,\n TableBody,\n TableFooter,\n TableHead,\n TableRow,\n TableCell,\n TableCaption,\n};\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"],"mappings":";AAAA;AAAA,EACE;AAAA,EAIA;AAAA,EACA;AAAA,EACA;AAAA,OACK;;;ACRP,SAAS,YAA6B;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADKA,SAAS,SAAS,iBAAiB;AAmJ7B,SASE,KATF;AA5GC,SAAS,aACd,MACA,UAA+B,CAAC,GAChC;AACA,QAAM,EAAE,cAAc,MAAM,IAAI;AAGhC,QAAM,kBAAkB,MAAM;AAC5B,QAAI,CAAC,eAAe,WAAW,WAAW,QAAW;AACnD,aAAO,EAAE,QAAQ,MAAM,WAAW,KAAK;AAAA,IACzC;AAEA,UAAM,SAAS,IAAI,gBAAgB,WAAW,SAAS,MAAM;AAC7D,UAAM,SAAS,OAAO,IAAI,QAAQ;AAClC,UAAM,OAAO,OAAO,IAAI,MAAM;AAE9B,QAAI,UAAU,SAAS,SAAS,SAAS,SAAS,SAAS;AACzD,aAAO;AAAA,QACL,QAAQ;AAAA,QACR,WAAW,KAAK,YAAY;AAAA,MAC9B;AAAA,IACF;AAEA,WAAO,EAAE,QAAQ,MAAM,WAAW,KAAK;AAAA,EACzC;AAEA,QAAM,eAAe,gBAAgB;AACrC,QAAM,CAAC,YAAY,aAAa,IAAI;AAAA,IAClC,aAAa;AAAA,EACf;AACA,QAAM,CAAC,eAAe,gBAAgB,IAAI;AAAA,IACxC,aAAa;AAAA,EACf;AAGA,YAAU,MAAM;AACd,QAAI,CAAC,eAAe,WAAW,WAAW,OAAW;AAErD,UAAM,MAAM,IAAI,IAAI,WAAW,SAAS,IAAI;AAC5C,UAAM,SAAS,IAAI;AAEnB,QAAI,cAAc,eAAe;AAC/B,aAAO,IAAI,UAAU,UAAU;AAC/B,aAAO,IAAI,QAAQ,cAAc,YAAY,CAAC;AAAA,IAChD,OAAO;AACL,aAAO,OAAO,QAAQ;AACtB,aAAO,OAAO,MAAM;AAAA,IACtB;AAGA,eAAW,QAAQ,aAAa,CAAC,GAAG,IAAI,IAAI,SAAS,CAAC;AAAA,EACxD,GAAG,CAAC,YAAY,eAAe,WAAW,CAAC;AAE3C,QAAM,aAAa,CAAC,WAAmB;AACrC,QAAI,eAAe,QAAQ;AACzB,UAAI,kBAAkB,OAAO;AAC3B,yBAAiB,MAAM;AAAA,MACzB,WAAW,kBAAkB,QAAQ;AACnC,sBAAc,IAAI;AAClB,yBAAiB,IAAI;AAAA,MACvB;AAAA,IACF,OAAO;AACL,oBAAc,MAAM;AACpB,uBAAiB,KAAK;AAAA,IACxB;AAAA,EACF;AAEA,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,CAAC,cAAc,CAAC,eAAe;AACjC,aAAO;AAAA,IACT;AAEA,WAAO,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,GAAG,MAAM;AAC9B,YAAM,SAAS,EAAE,UAAqB;AACtC,YAAM,SAAS,EAAE,UAAqB;AAEtC,UAAI,OAAO,WAAW,YAAY,OAAO,WAAW,UAAU;AAC5D,cAAM,aAAa,OAAO,cAAc,MAAM;AAC9C,eAAO,kBAAkB,QAAQ,aAAa,CAAC;AAAA,MACjD;AAEA,UAAI,OAAO,WAAW,YAAY,OAAO,WAAW,UAAU;AAC5D,eAAO,kBAAkB,QAAQ,SAAS,SAAS,SAAS;AAAA,MAC9D;AAEA,aAAO;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,YAAY,aAAa,CAAC;AAEpC,SAAO,EAAE,YAAY,YAAY,eAAe,WAAW;AAC7D;AAUA,IAAM,QAAQ;AAAA,EACZ,CAAC,EAAE,UAAU,WAAW,WAAW,UAAU,GAAG,MAAM,GAAG,QACvD;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,YAAY,aAAa;AAAA,MAC3B;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAW;AAAA,YACT;AAAA,YACA;AAAA,UACF;AAAA,UACC,GAAG;AAAA,UAGJ;AAAA,gCAAC,aAAQ,WAAU,WAAU,sBAAQ;AAAA,YACpC;AAAA;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,cAAc;AAEpB,IAAM,cAAc,WAGlB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW,GAAG,+BAA+B,SAAS;AAAA,IACrD,GAAG;AAAA;AACN,CACD;AACD,YAAY,cAAc;AAM1B,IAAM,YAAY;AAAA,EAChB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QACxB;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,uCAAuC,SAAS;AAAA,MAC7D,GAAG;AAAA;AAAA,EACN;AAEJ;AACA,UAAU,cAAc;AAMxB,IAAM,cAAc;AAAA,EAClB,CAAC,EAAE,UAAU,WAAW,WAAW,GAAG,MAAM,GAAG,QAC7C;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW;AAAA,QACT;AAAA,QACA,YAAY,aAAa;AAAA,QACzB;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AACA,YAAY,cAAc;AAE1B,IAAM,qBAAqB;AAAA,EACzB,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,UAAU;AAAA,IACR,SACE;AAAA,IACF,YAAY;AAAA,EACd;AACF;AAOA,IAAM,WAAW;AAAA,EACf,CACE;AAAA,IACE,UAAU;AAAA,IACV,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,UAAU,aAAa,sBAAsB;AAAA,UAC7C,aAAa,UAAU,aAAa,mBAAmB;AAAA,UACvD,mBAAmB,KAAK,EAAE,OAAO;AAAA,UACjC;AAAA,QACF;AAAA,QACA,iBAAe,UAAU;AAAA,QACxB,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AACA,SAAS,cAAc;AAWvB,IAAM,YAAY;AAAA,EAChB,CACE;AAAA,IACE;AAAA,IACA,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,cAAc,MAAM;AACxB,UAAI,YAAY,QAAQ;AACtB,eAAO;AAAA,MACT;AAAA,IACF;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,UACZ;AAAA,QACF;AAAA,QACA,SAAS;AAAA,QACR,GAAG;AAAA,QAEJ,+BAAC,SAAI,WAAU,2BACZ;AAAA;AAAA,UACA,YACC,qBAAC,SAAI,WAAU,iBACZ;AAAA,8BAAkB,SACjB,oBAAC,WAAQ,MAAM,IAAI,QAAO,QAAO,WAAU,iBAAgB;AAAA,YAE5D,kBAAkB,UACjB,oBAAC,aAAU,MAAM,IAAI,QAAO,QAAO,WAAU,iBAAgB;AAAA,aAEjE;AAAA,WAEJ;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AACA,UAAU,cAAc;AAExB,IAAM,YAAY,WAGhB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,UAAU,cAAc;AAExB,IAAM,eAAe,WAGnB,CAAC,EAAE,WAAW,GAAG,MAAM,GAAG,QAC1B;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,aAAa,cAAc;AAE3B,IAAO,gBAAQ;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/Table/Table.tsx","../../src/utils/utils.ts","../../src/components/Text/Text.tsx","../../src/components/NoSearchResult/NoSearchResult.tsx","../../src/components/Button/Button.tsx"],"sourcesContent":["import {\n forwardRef,\n HTMLAttributes,\n TdHTMLAttributes,\n ThHTMLAttributes,\n useState,\n useMemo,\n useEffect,\n Children,\n isValidElement,\n cloneElement,\n ReactElement,\n ReactNode,\n} from 'react';\nimport { cn } from '../../utils/utils';\nimport { CaretUp, CaretDown } from 'phosphor-react';\nimport NoSearchResult from '../NoSearchResult/NoSearchResult';\nimport Button from '../Button/Button';\n\ntype TableVariant = 'default' | 'borderless';\ntype TableRowState = 'default' | 'selected' | 'invalid' | 'disabled';\nexport type SortDirection = 'asc' | 'desc' | null;\n\nexport interface UseTableSortOptions {\n /** Se true, sincroniza o estado de ordenação com os parâmetros da URL */\n syncWithUrl?: boolean;\n}\n\n/**\n * Hook para gerenciar ordenação de dados da tabela\n *\n * @param data - Array de dados a serem ordenados\n * @param options - Opções de configuração do hook\n * @returns Objeto com dados ordenados, coluna/direção atual e função de sort\n *\n * @example\n * ```tsx\n * const activities = [\n * { id: 1, name: 'Task A', date: '2024-01-01' },\n * { id: 2, name: 'Task B', date: '2024-01-02' },\n * ];\n *\n * // Sem sincronização com URL\n * const { sortedData, sortColumn, sortDirection, handleSort } = useTableSort(activities);\n *\n * // Com sincronização com URL\n * const { sortedData, sortColumn, sortDirection, handleSort } = useTableSort(activities, { syncWithUrl: true });\n *\n * <TableHead\n * sortDirection={sortColumn === 'name' ? sortDirection : null}\n * onSort={() => handleSort('name')}\n * >\n * Name\n * </TableHead>\n * ```\n */\nexport function useTableSort<T extends Record<string, unknown>>(\n data: T[],\n options: UseTableSortOptions = {}\n) {\n const { syncWithUrl = false } = options;\n\n // Inicializar estado a partir da URL se syncWithUrl estiver habilitado\n const getInitialState = () => {\n if (!syncWithUrl || globalThis.window === undefined) {\n return { column: null, direction: null };\n }\n\n const params = new URLSearchParams(globalThis.location.search);\n const sortBy = params.get('sortBy');\n const sort = params.get('sort');\n\n if (sortBy && sort && (sort === 'ASC' || sort === 'DESC')) {\n return {\n column: sortBy,\n direction: sort.toLowerCase() as SortDirection,\n };\n }\n\n return { column: null, direction: null };\n };\n\n const initialState = getInitialState();\n const [sortColumn, setSortColumn] = useState<string | null>(\n initialState.column\n );\n const [sortDirection, setSortDirection] = useState<SortDirection>(\n initialState.direction\n );\n\n // Atualizar URL quando o estado de ordenação mudar\n useEffect(() => {\n if (!syncWithUrl || globalThis.window === undefined) return;\n\n const url = new URL(globalThis.location.href);\n const params = url.searchParams;\n\n if (sortColumn && sortDirection) {\n params.set('sortBy', sortColumn);\n params.set('sort', sortDirection.toUpperCase());\n } else {\n params.delete('sortBy');\n params.delete('sort');\n }\n\n // Atualizar URL sem recarregar a página\n globalThis.history.replaceState({}, '', url.toString());\n }, [sortColumn, sortDirection, syncWithUrl]);\n\n const handleSort = (column: string) => {\n if (sortColumn === column) {\n if (sortDirection === 'asc') {\n setSortDirection('desc');\n } else if (sortDirection === 'desc') {\n setSortColumn(null);\n setSortDirection(null);\n }\n } else {\n setSortColumn(column);\n setSortDirection('asc');\n }\n };\n\n const sortedData = useMemo(() => {\n if (!sortColumn || !sortDirection) {\n return data;\n }\n\n return [...data].sort((a, b) => {\n const aValue = a[sortColumn as keyof T];\n const bValue = b[sortColumn as keyof T];\n\n if (typeof aValue === 'string' && typeof bValue === 'string') {\n const comparison = aValue.localeCompare(bValue);\n return sortDirection === 'asc' ? comparison : -comparison;\n }\n\n if (typeof aValue === 'number' && typeof bValue === 'number') {\n return sortDirection === 'asc' ? aValue - bValue : bValue - aValue;\n }\n\n return 0;\n });\n }, [data, sortColumn, sortDirection]);\n\n return { sortedData, sortColumn, sortDirection, handleSort };\n}\n\ninterface TableProps extends HTMLAttributes<HTMLTableElement> {\n variant?: TableVariant;\n /** Search term to detect if search is active */\n searchTerm?: string;\n /** Image source for no search result state */\n noSearchResultImage?: string;\n /** Title for no search result state */\n noSearchResultTitle?: string;\n /** Description for no search result state */\n noSearchResultDescription?: string;\n /** Message displayed when table is empty (no search active) */\n emptyStateMessage?: string;\n /** Text for the action button in empty state */\n emptyStateButtonText?: string;\n /** Callback when empty state button is clicked */\n onEmptyStateButtonClick?: () => void;\n}\n\ninterface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {\n state?: TableRowState;\n}\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n (\n {\n variant = 'default',\n className,\n children,\n searchTerm,\n noSearchResultImage,\n noSearchResultTitle = 'Nenhum resultado encontrado',\n noSearchResultDescription = 'Não encontramos nenhum resultado com esse nome. Tente revisar a busca ou usar outra palavra-chave.',\n emptyStateMessage = 'Nenhum dado disponível no momento.',\n emptyStateButtonText = 'Adicionar item',\n onEmptyStateButtonClick,\n ...props\n },\n ref\n ) => {\n // Detect if TableBody is empty\n const isTableBodyEmpty = useMemo(() => {\n let foundBody = false;\n let empty = true;\n Children.forEach(children, (child) => {\n if (isValidElement(child) && child.type === TableBody) {\n foundBody = true;\n const bodyProps = child.props as { children?: ReactNode };\n if (Children.count(bodyProps?.children) > 0) {\n empty = false;\n }\n }\n });\n return foundBody ? empty : false;\n }, [children]);\n\n // Calculate column count for colspan\n const columnCount = useMemo(() => {\n let count = 0;\n Children.forEach(children, (child) => {\n if (isValidElement(child) && child.type === TableHeader) {\n const headerProps = child.props as { children?: ReactNode };\n Children.forEach(headerProps.children, (row) => {\n if (isValidElement(row) && row.type === TableRow) {\n const rowProps = row.props as { children?: ReactNode };\n count = Children.count(rowProps.children);\n }\n });\n }\n });\n return count || 1;\n }, [children]);\n\n // Determine which state to show\n const hasSearchTerm = searchTerm && searchTerm.trim() !== '';\n const showNoSearchResult = hasSearchTerm && isTableBodyEmpty;\n const showEmptyState = !hasSearchTerm && isTableBodyEmpty;\n\n // Render NoSearchResult outside table\n if (showNoSearchResult) {\n return (\n <div\n className={cn(\n 'relative w-full overflow-x-auto',\n variant === 'default' && 'border border-border-200 rounded-xl'\n )}\n >\n <table\n ref={ref}\n className={cn(\n 'analytica-table w-full caption-bottom text-sm border-separate border-spacing-0',\n className\n )}\n {...props}\n >\n {/* Render existing TableCaption (if any) and TableHeader */}\n {Children.map(children, (child) => {\n if (\n isValidElement(child) &&\n (child.type === TableCaption || child.type === TableHeader)\n ) {\n return child;\n }\n return null;\n })}\n </table>\n {/* NoSearchResult outside table structure */}\n <div className=\"py-8 flex justify-center\">\n {noSearchResultImage ? (\n <NoSearchResult\n image={noSearchResultImage}\n title={noSearchResultTitle}\n description={noSearchResultDescription}\n />\n ) : (\n <div className=\"text-center\">\n <p className=\"text-text-600 text-lg font-semibold mb-2\">\n {noSearchResultTitle}\n </p>\n <p className=\"text-text-500 text-sm\">\n {noSearchResultDescription}\n </p>\n </div>\n )}\n </div>\n </div>\n );\n }\n\n // Render Empty State inside TableBody\n const modifiedChildren = Children.map(children, (child) => {\n if (isValidElement(child) && child.type === TableBody && showEmptyState) {\n return cloneElement(child as ReactElement<TableBodyProps>, {\n children: (\n <TableRow variant={variant}>\n <TableCell colSpan={columnCount}>\n <div className=\"flex flex-col items-center justify-center py-12 gap-4\">\n <p className=\"text-text-600 text-base font-normal\">\n {emptyStateMessage}\n </p>\n {onEmptyStateButtonClick && (\n <Button\n variant=\"solid\"\n action=\"primary\"\n size=\"medium\"\n onClick={onEmptyStateButtonClick}\n >\n {emptyStateButtonText}\n </Button>\n )}\n </div>\n </TableCell>\n </TableRow>\n ),\n });\n }\n return child;\n });\n\n return (\n <div\n className={cn(\n 'relative w-full overflow-x-auto',\n variant === 'default' && 'border border-border-200 rounded-xl'\n )}\n >\n <table\n ref={ref}\n className={cn(\n 'analytica-table w-full caption-bottom text-sm border-separate border-spacing-0',\n className\n )}\n {...props}\n >\n {/* Render fallback caption only if no TableCaption provided */}\n {!Children.toArray(children).some(\n (child) => isValidElement(child) && child.type === TableCaption\n ) && <caption className=\"sr-only\">My Table</caption>}\n {modifiedChildren}\n </table>\n </div>\n );\n }\n);\n\nTable.displayName = 'Table';\n\nconst TableHeader = forwardRef<\n HTMLTableSectionElement,\n HTMLAttributes<HTMLTableSectionElement>\n>(({ className, ...props }, ref) => (\n <thead\n ref={ref}\n className={cn('[&_tr:first-child]:border-0', className)}\n {...props}\n />\n));\nTableHeader.displayName = 'TableHeader';\n\ninterface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n variant?: TableVariant;\n}\n\nconst TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(\n ({ className, ...props }, ref) => (\n <tbody\n ref={ref}\n className={cn('[&_tr:last-child]:border-border-200', className)}\n {...props}\n />\n )\n);\nTableBody.displayName = 'TableBody';\n\ninterface TableFooterProps extends HTMLAttributes<HTMLTableSectionElement> {\n variant?: TableVariant;\n}\n\nconst TableFooter = forwardRef<HTMLTableSectionElement, TableFooterProps>(\n ({ variant = 'default', className, ...props }, ref) => (\n <tfoot\n ref={ref}\n className={cn(\n 'bg-background-50 font-medium [&>tr]:last:border-b-0 px-6 py-3.5',\n variant === 'default' && 'border-t border-border-200',\n className\n )}\n {...props}\n />\n )\n);\nTableFooter.displayName = 'TableFooter';\n\nconst VARIANT_STATES_ROW = {\n default: {\n default: 'border border-border-200',\n borderless: '',\n },\n selected: {\n default: 'border-b-2 border-indicator-primary',\n borderless: 'bg-indicator-primary/10',\n },\n invalid: {\n default: 'border-b-2 border-indicator-error',\n borderless: 'bg-indicator-error/10',\n },\n disabled: {\n default:\n 'border-b border-border-100 bg-background-50 opacity-50 cursor-not-allowed',\n borderless: 'bg-background-50 opacity-50 cursor-not-allowed',\n },\n} as const;\n\ninterface TableRowPropsExtended extends TableRowProps {\n variant?: TableVariant;\n clickable?: boolean;\n}\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowPropsExtended>(\n (\n {\n variant = 'default',\n state = 'default',\n clickable = false,\n className,\n ...props\n },\n ref\n ) => {\n return (\n <tr\n ref={ref}\n className={cn(\n 'transition-colors',\n state === 'disabled' ? '' : 'hover:bg-muted/50',\n state === 'disabled' || !clickable ? '' : 'cursor-pointer',\n VARIANT_STATES_ROW[state][variant],\n className\n )}\n aria-disabled={state === 'disabled'}\n {...props}\n />\n );\n }\n);\nTableRow.displayName = 'TableRow';\n\ninterface TableHeadProps extends ThHTMLAttributes<HTMLTableCellElement> {\n /** Enable sorting on this column (default: true) */\n sortable?: boolean;\n /** Current sort direction for this column */\n sortDirection?: SortDirection;\n /** Callback when column header is clicked */\n onSort?: () => void;\n}\n\nconst TableHead = forwardRef<HTMLTableCellElement, TableHeadProps>(\n (\n {\n className,\n sortable = true,\n sortDirection = null,\n onSort,\n children,\n ...props\n },\n ref\n ) => {\n const handleClick = () => {\n if (sortable && onSort) {\n onSort();\n }\n };\n\n return (\n <th\n ref={ref}\n className={cn(\n 'h-10 px-6 py-3.5 text-left align-middle font-bold text-base text-text-800 tracking-[0.2px] leading-none [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] whitespace-nowrap',\n sortable && 'cursor-pointer select-none hover:bg-muted/30',\n className\n )}\n onClick={handleClick}\n {...props}\n >\n <div className=\"flex items-center gap-2\">\n {children}\n {sortable && (\n <div className=\"flex flex-col\">\n {sortDirection === 'asc' && (\n <CaretUp size={16} weight=\"fill\" className=\"text-text-800\" />\n )}\n {sortDirection === 'desc' && (\n <CaretDown size={16} weight=\"fill\" className=\"text-text-800\" />\n )}\n </div>\n )}\n </div>\n </th>\n );\n }\n);\nTableHead.displayName = 'TableHead';\n\nconst TableCell = forwardRef<\n HTMLTableCellElement,\n TdHTMLAttributes<HTMLTableCellElement>\n>(({ className, ...props }, ref) => (\n <td\n ref={ref}\n className={cn(\n 'p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px] text-base font-normal text-text-800 leading-[150%] tracking-normal px-6 py-3.5 whitespace-nowrap',\n className\n )}\n {...props}\n />\n));\nTableCell.displayName = 'TableCell';\n\nconst TableCaption = forwardRef<\n HTMLTableCaptionElement,\n HTMLAttributes<HTMLTableCaptionElement>\n>(({ className, ...props }, ref) => (\n <caption\n ref={ref}\n className={cn(\n 'border-t border-border-200 text-sm text-text-800 px-6 py-3.5',\n className\n )}\n {...props}\n />\n));\nTableCaption.displayName = 'TableCaption';\n\nexport default Table;\nexport {\n TableHeader,\n TableBody,\n TableFooter,\n TableHead,\n TableRow,\n TableCell,\n TableCaption,\n};\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","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 { ButtonHTMLAttributes, ReactNode } from 'react';\nimport { cn } from '../../utils/utils';\n\n/**\n * Lookup table for variant and action class combinations\n */\nconst VARIANT_ACTION_CLASSES = {\n solid: {\n primary:\n 'bg-primary-950 text-text border border-primary-950 hover:bg-primary-800 hover:border-primary-800 focus-visible:outline-none focus-visible:bg-primary-950 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-primary-700 active:border-primary-700 disabled:bg-primary-500 disabled:border-primary-500 disabled:opacity-40 disabled:cursor-not-allowed',\n positive:\n 'bg-success-500 text-text border border-success-500 hover:bg-success-600 hover:border-success-600 focus-visible:outline-none focus-visible:bg-success-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-success-700 active:border-success-700 disabled:bg-success-500 disabled:border-success-500 disabled:opacity-40 disabled:cursor-not-allowed',\n negative:\n 'bg-error-500 text-text border border-error-500 hover:bg-error-600 hover:border-error-600 focus-visible:outline-none focus-visible:bg-error-500 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:bg-error-700 active:border-error-700 disabled:bg-error-500 disabled:border-error-500 disabled:opacity-40 disabled:cursor-not-allowed',\n },\n outline: {\n primary:\n 'bg-transparent text-primary-950 border border-primary-950 hover:bg-background-50 hover:text-primary-400 hover:border-primary-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 active:border-primary-700 disabled:opacity-40 disabled:cursor-not-allowed',\n positive:\n 'bg-transparent text-success-500 border border-success-300 hover:bg-background-50 hover:text-success-400 hover:border-success-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 active:border-success-700 disabled:opacity-40 disabled:cursor-not-allowed',\n negative:\n 'bg-transparent text-error-500 border border-error-300 hover:bg-background-50 hover:text-error-400 hover:border-error-400 focus-visible:border-0 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 active:border-error-700 disabled:opacity-40 disabled:cursor-not-allowed',\n },\n link: {\n primary:\n 'bg-transparent text-primary-950 hover:text-primary-400 focus-visible:outline-none focus-visible:text-primary-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-primary-700 disabled:opacity-40 disabled:cursor-not-allowed',\n positive:\n 'bg-transparent text-success-500 hover:text-success-400 focus-visible:outline-none focus-visible:text-success-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-success-700 disabled:opacity-40 disabled:cursor-not-allowed',\n negative:\n 'bg-transparent text-error-500 hover:text-error-400 focus-visible:outline-none focus-visible:text-error-600 focus-visible:ring-2 focus-visible:ring-offset-0 focus-visible:ring-indicator-info active:text-error-700 disabled:opacity-40 disabled:cursor-not-allowed',\n },\n} as const;\n\n/**\n * Lookup table for size classes\n */\nconst SIZE_CLASSES = {\n 'extra-small': 'text-xs px-3.5 py-2',\n small: 'text-sm px-4 py-2.5',\n medium: 'text-md px-5 py-2.5',\n large: 'text-lg px-6 py-3',\n 'extra-large': 'text-lg px-7 py-3.5',\n} as const;\n\n/**\n * Button component props interface\n */\ntype ButtonProps = {\n /** Content to be displayed inside the button */\n children: ReactNode;\n /** Ícone à esquerda do texto */\n iconLeft?: ReactNode;\n /** Ícone à direita do texto */\n iconRight?: ReactNode;\n /** Size of the button */\n size?: 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large';\n /** Visual variant of the button */\n variant?: 'solid' | 'outline' | 'link';\n /** Action type of the button */\n action?: 'primary' | 'positive' | 'negative';\n /** Additional CSS classes to apply */\n className?: string;\n} & ButtonHTMLAttributes<HTMLButtonElement>;\n\n/**\n * Button component for Analytica Ensino platforms\n *\n * A flexible button component with multiple variants, sizes and actions.\n *\n * @param children - The content to display inside the button\n * @param size - The size variant (extra-small, small, medium, large, extra-large)\n * @param variant - The visual style variant (solid, outline, link)\n * @param action - The action type (primary, positive, negative)\n * @param className - Additional CSS classes\n * @param props - All other standard button HTML attributes\n * @returns A styled button element\n *\n * @example\n * ```tsx\n * <Button variant=\"solid\" action=\"primary\" size=\"medium\" onClick={() => console.log('clicked')}>\n * Click me\n * </Button>\n * ```\n */\nconst Button = ({\n children,\n iconLeft,\n iconRight,\n size = 'medium',\n variant = 'solid',\n action = 'primary',\n className = '',\n disabled,\n type = 'button',\n ...props\n}: ButtonProps) => {\n // Get classes from lookup tables\n const sizeClasses = SIZE_CLASSES[size];\n const variantClasses = VARIANT_ACTION_CLASSES[variant][action];\n\n const baseClasses =\n 'inline-flex items-center justify-center rounded-full cursor-pointer font-medium';\n\n return (\n <button\n className={cn(baseClasses, variantClasses, sizeClasses, className)}\n disabled={disabled}\n type={type}\n {...props}\n >\n {iconLeft && <span className=\"mr-2 flex items-center\">{iconLeft}</span>}\n {children}\n {iconRight && <span className=\"ml-2 flex items-center\">{iconRight}</span>}\n </button>\n );\n};\n\nexport default Button;\n"],"mappings":"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","names":["jsx","jsx","jsxs","jsx","jsxs"]}
|