@flowtomic/ui 0.1.2 → 0.1.4

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.
Files changed (75) hide show
  1. package/dist/blocks/developer-panel/page.d.ts.map +1 -1
  2. package/dist/blocks/developer-panel/page.js +2 -2
  3. package/dist/components/atoms/actions/badge/badge.d.ts +2 -2
  4. package/dist/components/atoms/actions/button/button.d.ts +2 -2
  5. package/dist/components/atoms/animation/encrypted-text/encrypted-text.d.ts +57 -0
  6. package/dist/components/atoms/animation/encrypted-text/encrypted-text.d.ts.map +1 -0
  7. package/dist/components/atoms/animation/encrypted-text/encrypted-text.js +104 -0
  8. package/dist/components/atoms/animation/encrypted-text/index.d.ts +3 -0
  9. package/dist/components/atoms/animation/encrypted-text/index.d.ts.map +1 -0
  10. package/dist/components/atoms/animation/encrypted-text/index.js +1 -0
  11. package/dist/components/atoms/animation/index.d.ts +2 -0
  12. package/dist/components/atoms/animation/index.d.ts.map +1 -1
  13. package/dist/components/atoms/animation/index.js +1 -0
  14. package/dist/components/atoms/feedback/alert/alert.d.ts +1 -1
  15. package/dist/components/atoms/feedback/alert-dialog/alert-dialog.d.ts +2 -2
  16. package/dist/components/atoms/feedback/tooltip/index.d.ts +1 -1
  17. package/dist/components/atoms/feedback/tooltip/index.d.ts.map +1 -1
  18. package/dist/components/atoms/feedback/tooltip/index.js +1 -1
  19. package/dist/components/atoms/feedback/tooltip/tooltip.d.ts +42 -5
  20. package/dist/components/atoms/feedback/tooltip/tooltip.d.ts.map +1 -1
  21. package/dist/components/atoms/feedback/tooltip/tooltip.js +188 -5
  22. package/dist/components/atoms/forms/autocomplete/autocomplete-context.d.ts +29 -0
  23. package/dist/components/atoms/forms/autocomplete/autocomplete-context.d.ts.map +1 -0
  24. package/dist/components/atoms/forms/autocomplete/autocomplete-context.js +10 -0
  25. package/dist/components/atoms/forms/autocomplete/autocomplete-item.d.ts +16 -0
  26. package/dist/components/atoms/forms/autocomplete/autocomplete-item.d.ts.map +1 -0
  27. package/dist/components/atoms/forms/autocomplete/autocomplete-item.js +48 -0
  28. package/dist/components/atoms/forms/autocomplete/autocomplete-section.d.ts +14 -0
  29. package/dist/components/atoms/forms/autocomplete/autocomplete-section.d.ts.map +1 -0
  30. package/dist/components/atoms/forms/autocomplete/autocomplete-section.js +13 -0
  31. package/dist/components/atoms/forms/autocomplete/autocomplete.d.ts +13 -9
  32. package/dist/components/atoms/forms/autocomplete/autocomplete.d.ts.map +1 -1
  33. package/dist/components/atoms/forms/autocomplete/autocomplete.js +295 -87
  34. package/dist/components/atoms/forms/autocomplete/index.d.ts +6 -0
  35. package/dist/components/atoms/forms/autocomplete/index.d.ts.map +1 -1
  36. package/dist/components/atoms/forms/autocomplete/index.js +3 -0
  37. package/dist/components/atoms/forms/index.d.ts +0 -2
  38. package/dist/components/atoms/forms/index.d.ts.map +1 -1
  39. package/dist/components/atoms/forms/index.js +0 -1
  40. package/dist/components/atoms/forms/input/input.d.ts +2 -2
  41. package/dist/components/atoms/forms/toggle/toggle.d.ts +2 -2
  42. package/dist/components/atoms/layout/sidebar/sidebar.d.ts +2 -2
  43. package/dist/components/atoms/navigation/command/command.d.ts +7 -7
  44. package/dist/components/atoms/navigation/tabs/tabs.js +2 -2
  45. package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.d.ts +1 -11
  46. package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.d.ts.map +1 -1
  47. package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.js +2 -3
  48. package/dist/components/molecules/forms/autocomplete/autocomplete-context.d.ts +16 -0
  49. package/dist/components/molecules/forms/autocomplete/autocomplete-context.d.ts.map +1 -0
  50. package/dist/components/molecules/forms/autocomplete/autocomplete-context.js +14 -0
  51. package/dist/components/molecules/forms/autocomplete/autocomplete-item.d.ts +23 -0
  52. package/dist/components/molecules/forms/autocomplete/autocomplete-item.d.ts.map +1 -0
  53. package/dist/components/molecules/forms/autocomplete/autocomplete-item.js +29 -0
  54. package/dist/components/molecules/forms/autocomplete/autocomplete-section.d.ts +19 -0
  55. package/dist/components/molecules/forms/autocomplete/autocomplete-section.d.ts.map +1 -0
  56. package/dist/components/molecules/forms/autocomplete/autocomplete-section.js +13 -0
  57. package/dist/components/molecules/forms/autocomplete/autocomplete.d.ts +33 -0
  58. package/dist/components/molecules/forms/autocomplete/autocomplete.d.ts.map +1 -0
  59. package/dist/components/molecules/forms/autocomplete/autocomplete.js +101 -0
  60. package/dist/components/molecules/forms/autocomplete/index.d.ts +9 -0
  61. package/dist/components/molecules/forms/autocomplete/index.d.ts.map +1 -0
  62. package/dist/components/molecules/forms/autocomplete/index.js +4 -0
  63. package/dist/components/molecules/forms/item/item.d.ts +3 -3
  64. package/dist/components/molecules/index.d.ts +2 -2
  65. package/dist/components/molecules/index.d.ts.map +1 -1
  66. package/dist/components/molecules/index.js +1 -1
  67. package/dist/components/molecules/navigation/menu-dock/menu-dock.d.ts +5 -0
  68. package/dist/components/molecules/navigation/menu-dock/menu-dock.d.ts.map +1 -1
  69. package/dist/components/molecules/navigation/menu-dock/menu-dock.js +103 -10
  70. package/dist/components/molecules/typography/index.d.ts +0 -2
  71. package/dist/components/molecules/typography/index.d.ts.map +1 -1
  72. package/dist/components/molecules/typography/index.js +1 -1
  73. package/dist/components/organisms/model-selector/model-selector.d.ts +1 -1
  74. package/dist/index.js +460 -498
  75. package/package.json +28 -17
@@ -1 +1 @@
1
- {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../src/blocks/developer-panel/page.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAM5E,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAE/B;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEzC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAE/B;;OAEG;IACH,iBAAiB,CAAC,EAAE;QAClB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,qBAAqB,CAAC,CAAC;QACnE,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;QACxC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;KAClC,CAAC;CACH;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,IAAI,EACJ,MAAM,EACN,UAAU,EACV,eAAe,EACf,OAAe,EACf,KAAY,EACZ,UAAe,EACf,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,iBAAiB,GAClB,EAAE,mBAAmB,2CAiSrB"}
1
+ {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../src/blocks/developer-panel/page.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAIH,OAAO,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAkB5E,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,QAAQ;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,UAAU,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAE/B;;OAEG;IACH,eAAe,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEzC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEtB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,IAAI,CAAC;IAE/B;;OAEG;IACH,iBAAiB,CAAC,EAAE;QAClB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,qBAAqB,CAAC,CAAC;QACnE,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;QACxC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;KAClC,CAAC;CACH;AAED,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,IAAI,EACJ,MAAM,EACN,UAAU,EACV,eAAe,EACf,OAAe,EACf,KAAY,EACZ,UAAe,EACf,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,iBAAiB,GAClB,EAAE,mBAAmB,2CAySrB"}
@@ -6,10 +6,10 @@
6
6
  */
7
7
  "use client";
8
8
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
9
- import { ScriptEditor } from "@/components/organisms";
10
- import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/atoms";
11
9
  import { Code, Info } from "lucide-react";
12
10
  import { useState } from "react";
11
+ import { Badge, Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Tabs, TabsContent, TabsList, TabsTrigger, } from "@/components/atoms";
12
+ import { ScriptEditor } from "@/components/organisms";
13
13
  export default function DeveloperPanel({ user, health, systemInfo, environmentInfo, loading = false, error = null, apiBaseUrl = "", onOpenSwagger, onOpenApiDocs, onOpenHealthCheck, scriptEditorProps, }) {
14
14
  const [copiedText, setCopiedText] = useState(null);
15
15
  const copyToClipboard = (text, label) => {
@@ -1,8 +1,8 @@
1
1
  import { type VariantProps } from "class-variance-authority";
2
2
  import React from "react";
3
3
  declare const badgeVariants: (props?: ({
4
- variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "warning" | "info" | null | undefined;
5
- size?: "sm" | "md" | "lg" | null | undefined;
4
+ variant?: "outline" | "default" | "success" | "secondary" | "destructive" | "warning" | "info" | null | undefined;
5
+ size?: "sm" | "lg" | "md" | null | undefined;
6
6
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
7
7
  export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
8
8
  children: React.ReactNode;
@@ -2,8 +2,8 @@ import { type VariantProps } from "class-variance-authority";
2
2
  import { type Transition } from "motion/react";
3
3
  import * as React from "react";
4
4
  declare const buttonVariants: (props?: ({
5
- variant?: "default" | "secondary" | "destructive" | "outline" | "success" | "info" | "link" | "ghost" | "natural" | null | undefined;
6
- size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
5
+ variant?: "link" | "outline" | "default" | "success" | "secondary" | "destructive" | "info" | "ghost" | "natural" | null | undefined;
6
+ size?: "sm" | "default" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
7
7
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
8
8
  export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "transition">, VariantProps<typeof buttonVariants> {
9
9
  asChild?: boolean;
@@ -0,0 +1,57 @@
1
+ /**
2
+ * EncryptedText Component - Flowtomic UI
3
+ *
4
+ * Componente de texto que revela o texto gradualmente com efeito de texto criptografado/gibberish.
5
+ * Baseado em Aceternity UI - https://ui.aceternity.com/components/encrypted-text
6
+ * Usa motion/react para detecção de viewport e animações suaves
7
+ */
8
+ import type React from "react";
9
+ export interface EncryptedTextProps {
10
+ /**
11
+ * O texto a ser criptografado e revelado
12
+ */
13
+ text: string;
14
+ /**
15
+ * Classe CSS adicional
16
+ */
17
+ className?: string;
18
+ /**
19
+ * Tempo em milissegundos entre revelar cada caractere real subsequente.
20
+ * Menor é mais rápido. Padrão: 50ms por caractere.
21
+ * @default 50
22
+ */
23
+ revealDelayMs?: number;
24
+ /**
25
+ * Conjunto de caracteres customizado para usar no efeito gibberish.
26
+ * @default "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?"
27
+ */
28
+ charset?: string;
29
+ /**
30
+ * Tempo em milissegundos entre flips de gibberish para caracteres não revelados.
31
+ * Menor é mais jittery. Padrão: 50ms.
32
+ * @default 50
33
+ */
34
+ flipDelayMs?: number;
35
+ /**
36
+ * Classe CSS para estilizar caracteres criptografados/scrambled
37
+ */
38
+ encryptedClassName?: string;
39
+ /**
40
+ * Classe CSS para estilizar caracteres revelados
41
+ */
42
+ revealedClassName?: string;
43
+ }
44
+ /**
45
+ * EncryptedText - Componente de texto com efeito de revelação gradual
46
+ *
47
+ * @example
48
+ * ```tsx
49
+ * <EncryptedText
50
+ * text="Texto secreto"
51
+ * revealDelayMs={30}
52
+ * flipDelayMs={50}
53
+ * />
54
+ * ```
55
+ */
56
+ export declare const EncryptedText: React.FC<EncryptedTextProps>;
57
+ //# sourceMappingURL=encrypted-text.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"encrypted-text.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/animation/encrypted-text/encrypted-text.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAKH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAoBD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAgGtD,CAAC"}
@@ -0,0 +1,104 @@
1
+ /**
2
+ * EncryptedText Component - Flowtomic UI
3
+ *
4
+ * Componente de texto que revela o texto gradualmente com efeito de texto criptografado/gibberish.
5
+ * Baseado em Aceternity UI - https://ui.aceternity.com/components/encrypted-text
6
+ * Usa motion/react para detecção de viewport e animações suaves
7
+ */
8
+ "use client";
9
+ import { jsx as _jsx } from "react/jsx-runtime";
10
+ import { motion, useInView } from "motion/react";
11
+ import { useEffect, useRef, useState } from "react";
12
+ import { cn } from "@/lib/utils";
13
+ const DEFAULT_CHARSET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-={}[];:,.<>/?";
14
+ function generateRandomCharacter(charset) {
15
+ const index = Math.floor(Math.random() * charset.length);
16
+ return charset.charAt(index);
17
+ }
18
+ function generateGibberishPreservingSpaces(original, charset) {
19
+ if (!original)
20
+ return "";
21
+ let result = "";
22
+ for (let i = 0; i < original.length; i += 1) {
23
+ const ch = original[i];
24
+ result += ch === " " ? " " : generateRandomCharacter(charset);
25
+ }
26
+ return result;
27
+ }
28
+ /**
29
+ * EncryptedText - Componente de texto com efeito de revelação gradual
30
+ *
31
+ * @example
32
+ * ```tsx
33
+ * <EncryptedText
34
+ * text="Texto secreto"
35
+ * revealDelayMs={30}
36
+ * flipDelayMs={50}
37
+ * />
38
+ * ```
39
+ */
40
+ export const EncryptedText = ({ text, className, revealDelayMs = 50, charset = DEFAULT_CHARSET, flipDelayMs = 50, encryptedClassName, revealedClassName, }) => {
41
+ const ref = useRef(null);
42
+ const isInView = useInView(ref, { once: true });
43
+ const [revealCount, setRevealCount] = useState(0);
44
+ const animationFrameRef = useRef(null);
45
+ const startTimeRef = useRef(0);
46
+ const lastFlipTimeRef = useRef(0);
47
+ const scrambleCharsRef = useRef(text ? generateGibberishPreservingSpaces(text, charset).split("") : []);
48
+ useEffect(() => {
49
+ if (!isInView)
50
+ return;
51
+ // Reset state for a fresh animation whenever dependencies change
52
+ const initial = text ? generateGibberishPreservingSpaces(text, charset) : "";
53
+ scrambleCharsRef.current = initial.split("");
54
+ startTimeRef.current = performance.now();
55
+ lastFlipTimeRef.current = startTimeRef.current;
56
+ setRevealCount(0);
57
+ let isCancelled = false;
58
+ const update = (now) => {
59
+ if (isCancelled)
60
+ return;
61
+ const elapsedMs = now - startTimeRef.current;
62
+ const totalLength = text.length;
63
+ const currentRevealCount = Math.min(totalLength, Math.floor(elapsedMs / Math.max(1, revealDelayMs)));
64
+ setRevealCount(currentRevealCount);
65
+ if (currentRevealCount >= totalLength) {
66
+ return;
67
+ }
68
+ // Re-randomize unrevealed scramble characters on an interval
69
+ const timeSinceLastFlip = now - lastFlipTimeRef.current;
70
+ if (timeSinceLastFlip >= Math.max(0, flipDelayMs)) {
71
+ for (let index = 0; index < totalLength; index += 1) {
72
+ if (index >= currentRevealCount) {
73
+ if (text[index] !== " ") {
74
+ scrambleCharsRef.current[index] = generateRandomCharacter(charset);
75
+ }
76
+ else {
77
+ scrambleCharsRef.current[index] = " ";
78
+ }
79
+ }
80
+ }
81
+ lastFlipTimeRef.current = now;
82
+ }
83
+ animationFrameRef.current = requestAnimationFrame(update);
84
+ };
85
+ animationFrameRef.current = requestAnimationFrame(update);
86
+ return () => {
87
+ isCancelled = true;
88
+ if (animationFrameRef.current !== null) {
89
+ cancelAnimationFrame(animationFrameRef.current);
90
+ }
91
+ };
92
+ }, [isInView, text, revealDelayMs, charset, flipDelayMs]);
93
+ if (!text)
94
+ return null;
95
+ return (_jsx(motion.span, { ref: ref, className: cn(className), "aria-label": text, role: "text", children: text.split("").map((char, index) => {
96
+ const isRevealed = index < revealCount;
97
+ const displayChar = isRevealed
98
+ ? char
99
+ : char === " "
100
+ ? " "
101
+ : (scrambleCharsRef.current[index] ?? generateRandomCharacter(charset));
102
+ return (_jsx("span", { className: cn(isRevealed ? revealedClassName : encryptedClassName), children: displayChar }, index));
103
+ }) }));
104
+ };
@@ -0,0 +1,3 @@
1
+ export type { EncryptedTextProps } from "./encrypted-text";
2
+ export { EncryptedText } from "./encrypted-text";
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/animation/encrypted-text/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC"}
@@ -0,0 +1 @@
1
+ export { EncryptedText } from "./encrypted-text";
@@ -6,6 +6,8 @@ export type { Animated3DProps } from "./animated-3d";
6
6
  export { Animated3D } from "./animated-3d";
7
7
  export type { BackdropBlurProps } from "./backdrop-blur";
8
8
  export { BackdropBlur } from "./backdrop-blur";
9
+ export type { EncryptedTextProps } from "./encrypted-text";
10
+ export { EncryptedText } from "./encrypted-text";
9
11
  export type { LoaderProps } from "./loader";
10
12
  export { Loader } from "./loader";
11
13
  export type { ProgressProps } from "./progress";
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/animation/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/animation/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,YAAY,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAChD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,YAAY,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,YAAY,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,YAAY,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC"}
@@ -4,6 +4,7 @@
4
4
  */
5
5
  export { Animated3D } from "./animated-3d";
6
6
  export { BackdropBlur } from "./backdrop-blur";
7
+ export { EncryptedText } from "./encrypted-text";
7
8
  export { Loader } from "./loader";
8
9
  export { Progress } from "./progress";
9
10
  export { Shimmer } from "./shimmer";
@@ -14,7 +14,7 @@
14
14
  import { type VariantProps } from "class-variance-authority";
15
15
  import * as React from "react";
16
16
  declare const alertVariants: (props?: ({
17
- variant?: "default" | "destructive" | "success" | "warning" | "info" | null | undefined;
17
+ variant?: "default" | "success" | "destructive" | "warning" | "info" | null | undefined;
18
18
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
19
19
  export interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
20
20
  }
@@ -19,7 +19,7 @@ export type AlertDialogTriggerProps = React.ComponentPropsWithoutRef<typeof Aler
19
19
  * Variantes de animação para AlertDialogContent
20
20
  */
21
21
  declare const alertDialogContentVariants: (props?: ({
22
- animation?: "bottom" | "left" | "right" | "top" | "center" | "depth" | "3d" | null | undefined;
22
+ animation?: "center" | "bottom" | "left" | "right" | "top" | "depth" | "3d" | null | undefined;
23
23
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
24
24
  export type AlertDialogContentProps = React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content> & VariantProps<typeof alertDialogContentVariants> & {
25
25
  /**
@@ -61,7 +61,7 @@ declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<AlertDial
61
61
  * Suporta animações 3D quando animation="3d"
62
62
  */
63
63
  declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
64
- animation?: "bottom" | "left" | "right" | "top" | "center" | "depth" | "3d" | null | undefined;
64
+ animation?: "center" | "bottom" | "left" | "right" | "top" | "depth" | "3d" | null | undefined;
65
65
  } & import("class-variance-authority/types").ClassProp) | undefined) => string> & {
66
66
  /**
67
67
  * Habilita backdrop blur (apenas para animation="3d")
@@ -1,3 +1,3 @@
1
1
  export type { TooltipContentProps, TooltipProps, TooltipTriggerProps, } from "./tooltip";
2
- export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, } from "./tooltip";
2
+ export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, TooltipWithMouseFollow, } from "./tooltip";
3
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/feedback/tooltip/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,mBAAmB,EACnB,YAAY,EACZ,mBAAmB,GACpB,MAAM,WAAW,CAAC;AACnB,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,cAAc,GACf,MAAM,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/feedback/tooltip/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,mBAAmB,EACnB,YAAY,EACZ,mBAAmB,GACpB,MAAM,WAAW,CAAC;AACnB,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,eAAe,EACf,cAAc,EACd,sBAAsB,GACvB,MAAM,WAAW,CAAC"}
@@ -1 +1 @@
1
- export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, } from "./tooltip";
1
+ export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, TooltipWithMouseFollow, } from "./tooltip";
@@ -1,13 +1,26 @@
1
1
  /**
2
2
  * Tooltip Component - Flowtomic UI
3
3
  *
4
- * Componente Tooltip baseado em Radix UI
4
+ * Componente Tooltip baseado em Radix UI (padrão) ou React Aria (followMouse)
5
+ * com seguimento do mouse e posicionamento inteligente
6
+ * Baseado no Aceternity UI Tooltip Card para animações
5
7
  */
6
8
  import * as TooltipPrimitive from "@radix-ui/react-tooltip";
7
9
  import * as React from "react";
8
10
  export type TooltipProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Root>;
9
11
  export type TooltipTriggerProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Trigger>;
10
- export type TooltipContentProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>;
12
+ export type TooltipContentProps = React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {
13
+ /**
14
+ * Se o tooltip deve seguir o mouse
15
+ * @default false
16
+ */
17
+ followMouse?: boolean;
18
+ /**
19
+ * Largura mínima do tooltip quando seguir o mouse
20
+ * @default 240 (15rem)
21
+ */
22
+ minWidth?: number;
23
+ };
11
24
  /**
12
25
  * TooltipProvider - Provider do tooltip
13
26
  */
@@ -19,14 +32,38 @@ declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
19
32
  /**
20
33
  * TooltipTrigger - Trigger do tooltip
21
34
  */
22
- declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
35
+ declare const TooltipTrigger: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
36
+ "data-follow-mouse"?: boolean;
37
+ } & React.RefAttributes<HTMLButtonElement>>;
23
38
  /**
24
39
  * TooltipPortal - Portal do tooltip
25
40
  */
26
41
  declare const TooltipPortal: React.FC<TooltipPrimitive.TooltipPortalProps>;
27
42
  /**
28
- * TooltipContent - Conteúdo do tooltip
43
+ * TooltipContent - Conteúdo do tooltip com suporte a seguimento do mouse
29
44
  */
30
- declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
45
+ declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
46
+ /**
47
+ * Se o tooltip deve seguir o mouse
48
+ * @default false
49
+ */
50
+ followMouse?: boolean;
51
+ /**
52
+ * Largura mínima do tooltip quando seguir o mouse
53
+ * @default 240 (15rem)
54
+ */
55
+ minWidth?: number;
56
+ } & React.RefAttributes<HTMLDivElement>>;
57
+ /**
58
+ * TooltipWithMouseFollow - Wrapper completo para tooltip com seguimento do mouse
59
+ * Implementação baseada no Aceternity UI, sem Radix
60
+ */
61
+ export declare function TooltipWithMouseFollow({ content, children, containerClassName, className, minWidth, }: {
62
+ content: string | React.ReactNode;
63
+ children: React.ReactNode;
64
+ containerClassName?: string;
65
+ className?: string;
66
+ minWidth?: number;
67
+ }): import("react/jsx-runtime").JSX.Element;
31
68
  export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider, TooltipPortal };
32
69
  //# sourceMappingURL=tooltip.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/feedback/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACxF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAClG,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAElG;;GAEG;AACH,QAAA,MAAM,eAAe,iDAA4B,CAAC;AAGlD;;GAEG;AACH,QAAA,MAAM,OAAO,yCAAwB,CAAC;AAGtC;;GAEG;AACH,QAAA,MAAM,cAAc,gHAA2B,CAAC;AAGhD;;GAEG;AACH,QAAA,MAAM,aAAa,+CAA0B,CAAC;AAG9C;;GAEG;AACH,QAAA,MAAM,cAAc,gKAalB,CAAC;AAGH,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC"}
1
+ {"version":3,"file":"tooltip.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/feedback/tooltip/tooltip.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAIH,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAI5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,IAAI,CAAC,CAAC;AACxF,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAClG,MAAM,MAAM,mBAAmB,GAAG,KAAK,CAAC,wBAAwB,CAC9D,OAAO,gBAAgB,CAAC,OAAO,CAChC,GAAG;IACF;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF;;GAEG;AACH,QAAA,MAAM,eAAe,iDAA4B,CAAC;AAGlD;;GAEG;AACH,QAAA,MAAM,OAAO,yCAAwB,CAAC;AAGtC;;GAEG;AACH,QAAA,MAAM,cAAc;0BAGM,OAAO;2CAW/B,CAAC;AAGH;;GAEG;AACH,QAAA,MAAM,aAAa,+CAA0B,CAAC;AAG9C;;GAEG;AACH,QAAA,MAAM,cAAc;IArDlB;;;OAGG;kBACW,OAAO;IACrB;;;OAGG;eACQ,MAAM;wCA6EjB,CAAC;AAmBH;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,EACP,QAAQ,EACR,kBAAkB,EAClB,SAAS,EACT,QAAc,GACf,EAAE;IACD,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,2CA0NA;AAED,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC"}
@@ -1,10 +1,16 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
1
  /**
3
2
  * Tooltip Component - Flowtomic UI
4
3
  *
5
- * Componente Tooltip baseado em Radix UI
4
+ * Componente Tooltip baseado em Radix UI (padrão) ou React Aria (followMouse)
5
+ * com seguimento do mouse e posicionamento inteligente
6
+ * Baseado no Aceternity UI Tooltip Card para animações
6
7
  */
8
+ "use client";
9
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
7
10
  import * as TooltipPrimitive from "@radix-ui/react-tooltip";
11
+ import { useTooltip } from "@react-aria/tooltip";
12
+ import { useTooltipTriggerState } from "@react-stately/tooltip";
13
+ import { AnimatePresence, motion } from "motion/react";
8
14
  import * as React from "react";
9
15
  import { cn } from "@/lib/utils";
10
16
  /**
@@ -20,7 +26,9 @@ Tooltip.displayName = "Tooltip";
20
26
  /**
21
27
  * TooltipTrigger - Trigger do tooltip
22
28
  */
23
- const TooltipTrigger = TooltipPrimitive.Trigger;
29
+ const TooltipTrigger = React.forwardRef(({ "data-follow-mouse": followMouse, ...props }, ref) => {
30
+ return (_jsx(TooltipPrimitive.Trigger, { ref: ref, "data-radix-tooltip-trigger": "", "data-follow-mouse": followMouse, ...props }));
31
+ });
24
32
  TooltipTrigger.displayName = "TooltipTrigger";
25
33
  /**
26
34
  * TooltipPortal - Portal do tooltip
@@ -28,8 +36,183 @@ TooltipTrigger.displayName = "TooltipTrigger";
28
36
  const TooltipPortal = TooltipPrimitive.Portal;
29
37
  TooltipPortal.displayName = "TooltipPortal";
30
38
  /**
31
- * TooltipContent - Conteúdo do tooltip
39
+ * TooltipContent - Conteúdo do tooltip com suporte a seguimento do mouse
32
40
  */
33
- const TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (_jsx(TooltipPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn("z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props })));
41
+ const TooltipContent = React.forwardRef(({ className, sideOffset = 4, followMouse = false, minWidth = 240, children, ...props }, ref) => {
42
+ // Se não seguir o mouse, usar comportamento padrão do Radix
43
+ if (!followMouse) {
44
+ return (_jsx(TooltipPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn("z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props, children: children }));
45
+ }
46
+ // Comportamento com seguimento do mouse - implementação customizada baseada no Aceternity
47
+ return (_jsx(TooltipContentWithMouseFollow, { ref: ref, sideOffset: sideOffset, className: className, minWidth: minWidth, ...props, children: children }));
48
+ });
34
49
  TooltipContent.displayName = TooltipPrimitive.Content.displayName;
50
+ /**
51
+ * TooltipContentWithMouseFollow - Versão com seguimento do mouse
52
+ * Este componente não renderiza nada - o tooltip é renderizado via portal
53
+ * O estado é gerenciado pelo TooltipWithMouseFollowWrapper
54
+ */
55
+ const TooltipContentWithMouseFollow = React.forwardRef(({ className, minWidth, children, ...props }, ref) => {
56
+ // Este componente não renderiza - o tooltip é gerenciado pelo wrapper
57
+ return null;
58
+ });
59
+ TooltipContentWithMouseFollow.displayName = "TooltipContentWithMouseFollow";
60
+ /**
61
+ * TooltipWithMouseFollow - Wrapper completo para tooltip com seguimento do mouse
62
+ * Implementação baseada no Aceternity UI, sem Radix
63
+ */
64
+ export function TooltipWithMouseFollow({ content, children, containerClassName, className, minWidth = 240, }) {
65
+ const [isVisible, setIsVisible] = React.useState(false);
66
+ const [mouse, setMouse] = React.useState({ x: 0, y: 0 });
67
+ const [height, setHeight] = React.useState(0);
68
+ const [position, setPosition] = React.useState({ x: 0, y: 0 });
69
+ const contentRef = React.useRef(null);
70
+ const containerRef = React.useRef(null);
71
+ // Usar React Aria para acessibilidade
72
+ const state = useTooltipTriggerState({ delay: 0 });
73
+ const { tooltipProps } = useTooltip({}, state);
74
+ // Sincronizar estado do React Aria com estado local
75
+ React.useEffect(() => {
76
+ setIsVisible(state.isOpen);
77
+ }, [state.isOpen]);
78
+ React.useEffect(() => {
79
+ if (isVisible && contentRef.current) {
80
+ // Usar múltiplos requestAnimationFrame para garantir que o DOM foi totalmente renderizado
81
+ const rafId1 = requestAnimationFrame(() => {
82
+ const rafId2 = requestAnimationFrame(() => {
83
+ if (contentRef.current) {
84
+ // scrollHeight do conteúdo interno
85
+ const contentScrollHeight = contentRef.current.scrollHeight;
86
+ // py-1.5 = 0.375rem = 6px top + 6px bottom = 12px total
87
+ // Adicionar buffer extra para garantir que não corte
88
+ setHeight(contentScrollHeight + 16);
89
+ }
90
+ });
91
+ return () => cancelAnimationFrame(rafId2);
92
+ });
93
+ return () => cancelAnimationFrame(rafId1);
94
+ }
95
+ }, [isVisible, content]);
96
+ const calculatePosition = React.useCallback((mouseX, mouseY) => {
97
+ if (!contentRef.current || !containerRef.current) {
98
+ return { x: mouseX + 12, y: mouseY + 12 };
99
+ }
100
+ const tooltip = contentRef.current;
101
+ const container = containerRef.current;
102
+ const containerRect = container.getBoundingClientRect();
103
+ const viewportWidth = window.innerWidth;
104
+ const viewportHeight = window.innerHeight;
105
+ // Dimensões do tooltip
106
+ const tooltipWidth = minWidth;
107
+ const tooltipHeight = tooltip.scrollHeight;
108
+ // Calcular posição absoluta relativa ao viewport
109
+ const absoluteX = containerRect.left + mouseX;
110
+ const absoluteY = containerRect.top + mouseY;
111
+ // Posição inicial relativa ao container (como no original)
112
+ let finalX = mouseX + 12;
113
+ let finalY = mouseY + 12;
114
+ // Verificar se ultrapassa a borda direita
115
+ if (absoluteX + 12 + tooltipWidth > viewportWidth) {
116
+ finalX = mouseX - tooltipWidth - 12;
117
+ }
118
+ // Verificar se ultrapassa a borda esquerda
119
+ if (absoluteX + finalX < 0) {
120
+ finalX = -containerRect.left + 12;
121
+ }
122
+ // Verificar se ultrapassa a borda inferior
123
+ if (absoluteY + 12 + tooltipHeight > viewportHeight) {
124
+ finalY = mouseY - tooltipHeight - 12;
125
+ }
126
+ // Verificar se ultrapassa a borda superior
127
+ if (absoluteY + finalY < 0) {
128
+ finalY = -containerRect.top + 12;
129
+ }
130
+ return { x: finalX, y: finalY };
131
+ }, [minWidth]);
132
+ const updateMousePosition = React.useCallback((mouseX, mouseY) => {
133
+ setMouse({ x: mouseX, y: mouseY });
134
+ const newPosition = calculatePosition(mouseX, mouseY);
135
+ setPosition(newPosition);
136
+ }, [calculatePosition]);
137
+ const handleMouseEnter = (e) => {
138
+ state.open();
139
+ const rect = e.currentTarget.getBoundingClientRect();
140
+ // Usar coordenadas relativas ao container para cálculo
141
+ const mouseX = e.clientX - rect.left;
142
+ const mouseY = e.clientY - rect.top;
143
+ updateMousePosition(mouseX, mouseY);
144
+ };
145
+ const handleMouseLeave = () => {
146
+ state.close();
147
+ setMouse({ x: 0, y: 0 });
148
+ setPosition({ x: 0, y: 0 });
149
+ };
150
+ const handleMouseMove = (e) => {
151
+ if (!isVisible)
152
+ return;
153
+ const rect = e.currentTarget.getBoundingClientRect();
154
+ const mouseX = e.clientX - rect.left;
155
+ const mouseY = e.clientY - rect.top;
156
+ updateMousePosition(mouseX, mouseY);
157
+ };
158
+ const handleTouchStart = (e) => {
159
+ const touch = e.touches[0];
160
+ const rect = e.currentTarget.getBoundingClientRect();
161
+ const mouseX = touch.clientX - rect.left;
162
+ const mouseY = touch.clientY - rect.top;
163
+ updateMousePosition(mouseX, mouseY);
164
+ state.open();
165
+ };
166
+ const handleTouchEnd = () => {
167
+ setTimeout(() => {
168
+ state.close();
169
+ setMouse({ x: 0, y: 0 });
170
+ setPosition({ x: 0, y: 0 });
171
+ }, 2000);
172
+ };
173
+ const handleClick = (e) => {
174
+ if (window.matchMedia("(hover: none)").matches) {
175
+ e.preventDefault();
176
+ if (isVisible) {
177
+ state.close();
178
+ setMouse({ x: 0, y: 0 });
179
+ setPosition({ x: 0, y: 0 });
180
+ }
181
+ else {
182
+ const rect = e.currentTarget.getBoundingClientRect();
183
+ const mouseX = e.clientX - rect.left;
184
+ const mouseY = e.clientY - rect.top;
185
+ updateMousePosition(mouseX, mouseY);
186
+ state.open();
187
+ }
188
+ }
189
+ };
190
+ // Recalcular posição quando altura mudar ou tooltip ficar visível
191
+ React.useEffect(() => {
192
+ if (isVisible && mouse.x !== 0 && mouse.y !== 0) {
193
+ // Usar requestAnimationFrame para garantir que o DOM foi atualizado
194
+ requestAnimationFrame(() => {
195
+ const newPosition = calculatePosition(mouse.x, mouse.y);
196
+ setPosition(newPosition);
197
+ });
198
+ }
199
+ }, [isVisible, height, mouse.x, mouse.y, calculatePosition]);
200
+ return (_jsxs("div", { ref: containerRef, className: cn("relative inline-block", containerClassName), onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, onMouseMove: handleMouseMove, onTouchStart: handleTouchStart, onTouchEnd: handleTouchEnd, onClick: handleClick, children: [children, _jsx(AnimatePresence, { children: isVisible && (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height, opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: {
201
+ type: "spring",
202
+ stiffness: 200,
203
+ damping: 20,
204
+ }, role: "tooltip", id: tooltipProps.id, className: cn("pointer-events-none absolute z-50 rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md", className), style: {
205
+ top: position.y,
206
+ left: position.x,
207
+ minWidth: `${minWidth}px`,
208
+ zIndex: 9999,
209
+ overflow: "visible",
210
+ wordWrap: "break-word",
211
+ whiteSpace: "normal",
212
+ }, children: _jsx("div", { ref: contentRef, className: "overflow-visible", style: {
213
+ whiteSpace: "normal",
214
+ wordWrap: "break-word",
215
+ overflowWrap: "break-word",
216
+ }, children: content }) }, String(isVisible))) })] }));
217
+ }
35
218
  export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider, TooltipPortal };
@@ -0,0 +1,29 @@
1
+ import type { ComboBoxState } from "@react-stately/combobox";
2
+ import type { ListState } from "@react-stately/list";
3
+ import * as React from "react";
4
+ export interface AutocompleteOption {
5
+ value: string;
6
+ label: string;
7
+ disabled?: boolean;
8
+ }
9
+ export interface AutocompleteContextValue {
10
+ state: ComboBoxState<unknown>;
11
+ listState: ListState<unknown>;
12
+ inputRef: React.RefObject<HTMLInputElement | null>;
13
+ listBoxRef: React.RefObject<HTMLUListElement | null>;
14
+ popoverRef: React.RefObject<HTMLDivElement | null>;
15
+ inputProps: React.InputHTMLAttributes<HTMLInputElement>;
16
+ listBoxProps: React.HTMLAttributes<HTMLUListElement>;
17
+ popoverProps: React.HTMLAttributes<HTMLDivElement>;
18
+ handleClear: (e: React.MouseEvent<HTMLButtonElement>) => void;
19
+ size: "sm" | "default" | "lg";
20
+ disabled: boolean;
21
+ maxListboxHeight: string;
22
+ isLoading: boolean;
23
+ emptyMessage: string;
24
+ options?: AutocompleteOption[];
25
+ }
26
+ declare const AutocompleteContext: React.Context<AutocompleteContextValue | null>;
27
+ export declare const useAutocompleteContext: () => AutocompleteContextValue;
28
+ export { AutocompleteContext };
29
+ //# sourceMappingURL=autocomplete-context.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"autocomplete-context.d.ts","sourceRoot":"","sources":["../../../../../src/components/atoms/forms/autocomplete/autocomplete-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,wBAAwB;IACvC,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC9B,SAAS,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC9B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACnD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IACrD,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACnD,UAAU,EAAE,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,CAAC;IACxD,YAAY,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,CAAC;IACrD,YAAY,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;IACnD,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC9D,IAAI,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;IAC9B,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;CAChC;AAED,QAAA,MAAM,mBAAmB,gDAA6D,CAAC;AAEvF,eAAO,MAAM,sBAAsB,gCAMlC,CAAC;AAEF,OAAO,EAAE,mBAAmB,EAAE,CAAC"}
@@ -0,0 +1,10 @@
1
+ import * as React from "react";
2
+ const AutocompleteContext = React.createContext(null);
3
+ export const useAutocompleteContext = () => {
4
+ const context = React.useContext(AutocompleteContext);
5
+ if (!context) {
6
+ throw new Error("Autocomplete components must be used within Autocomplete");
7
+ }
8
+ return context;
9
+ };
10
+ export { AutocompleteContext };