@flowtomic/ui 0.1.2 → 0.1.5

package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.d.ts

@@ -33,21 +33,11 @@ export interface AuthNavigationLinkProps {
      * Classe CSS adicional
      */
     className?: string;
-    /**
-     * Se true, aplica efeito de texto animado (AnimatedShinyText) no linkText
-     * @default false
-     */
-    animated?: boolean;
-    /**
-     * Largura do shimmer para o efeito animado (apenas quando animated=true)
-     * @default 100
-     */
-    shimmerWidth?: number;
 }
 /**
  * Componente reutilizável para links de navegação entre páginas de autenticação
  *
  * Usado em Login e Register para navegação entre as páginas
  */
-export declare function AuthNavigationLink({ text, linkText, to, LinkComponent, className, animated, shimmerWidth, }: AuthNavigationLinkProps): import("react/jsx-runtime").JSX.Element;
+export declare function AuthNavigationLink({ text, linkText, to, LinkComponent, className, }: AuthNavigationLinkProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=auth-navigation-link.d.ts.map

package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auth-navigation-link.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/auth/auth-navigation-link/auth-navigation-link.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;OAGG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAClC,EAAE,EAAE,MAAM,CAAC;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;KAC3B,CAAC,CAAC;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,EAAE,EACF,aAAa,EACb,SAAc,EACd,QAAgB,EAChB,YAAkB,GACnB,EAAE,uBAAuB,2CAsCzB"}
+{"version":3,"file":"auth-navigation-link.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/auth/auth-navigation-link/auth-navigation-link.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,uBAAuB;IACtC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IACX;;;OAGG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAClC,EAAE,EAAE,MAAM,CAAC;QACX,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;KAC3B,CAAC,CAAC;IACH;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,QAAQ,EACR,EAAE,EACF,aAAa,EACb,SAAc,GACf,EAAE,uBAAuB,2CAkBzB"}

package/dist/components/molecules/auth/auth-navigation-link/auth-navigation-link.js

@@ -1,12 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { AnimatedShinyText } from "../../typography/animated-shiny-text";
 /**
  * Componente reutilizável para links de navegação entre páginas de autenticação
  *
  * Usado em Login e Register para navegação entre as páginas
  */
-export function AuthNavigationLink({ text, linkText, to, LinkComponent, className = "", animated = false, shimmerWidth = 100, }) {
+export function AuthNavigationLink({ text, linkText, to, LinkComponent, className = "", }) {
     const linkClassName = "text-[#5B5FED] dark:text-[#7B7FFF] hover:underline font-semibold";
-    const linkContent = animated ? (LinkComponent ? (_jsx(LinkComponent, { to: to, className: linkClassName, children: _jsx(AnimatedShinyText, { shimmerWidth: shimmerWidth, className: "bg-gradient-to-r from-[#5B5FED] from-0% via-white via-50% to-[#5B5FED] to-100% dark:from-[#7B7FFF] dark:via-white dark:to-[#7B7FFF]", children: linkText }) })) : (_jsx("a", { href: to, className: linkClassName, children: _jsx(AnimatedShinyText, { shimmerWidth: shimmerWidth, className: "bg-gradient-to-r from-[#5B5FED] from-0% via-white via-50% to-[#5B5FED] to-100% dark:from-[#7B7FFF] dark:via-white dark:to-[#7B7FFF]", children: linkText }) }))) : LinkComponent ? (_jsx(LinkComponent, { to: to, className: linkClassName, children: linkText })) : (_jsx("a", { href: to, className: linkClassName, children: linkText }));
+    const linkContent = LinkComponent ? (_jsx(LinkComponent, { to: to, className: linkClassName, children: linkText })) : (_jsx("a", { href: to, className: linkClassName, children: linkText }));
     return (_jsxs("p", { className: `text-center text-sm text-gray-600 dark:text-gray-300 ${className}`, children: [text, " ", linkContent] }));
 }

package/dist/components/molecules/forms/autocomplete/autocomplete-context.d.ts

@@ -0,0 +1,16 @@
+/**
+ * AutocompleteContext - Context para Compound Components
+ *
+ * Fornece estado e helpers do hook useAutocomplete para subcomponentes
+ */
+import { type UseAutocompleteReturn } from "flowtomic/logic";
+import * as React from "react";
+export interface AutocompleteContextValue extends UseAutocompleteReturn {
+    size?: "sm" | "default" | "lg";
+    disabled?: boolean;
+    maxListboxHeight?: string;
+    emptyMessage?: string;
+}
+export declare const AutocompleteContext: React.Context<AutocompleteContextValue | undefined>;
+export declare function useAutocompleteContext(): AutocompleteContextValue;
+//# sourceMappingURL=autocomplete-context.d.ts.map

package/dist/components/molecules/forms/autocomplete/autocomplete-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-context.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/autocomplete/autocomplete-context.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,wBAAyB,SAAQ,qBAAqB;IACrE,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,mBAAmB,qDAEpB,CAAC;AAEb,wBAAgB,sBAAsB,IAAI,wBAAwB,CAQjE"}

package/dist/components/molecules/forms/autocomplete/autocomplete-context.js

@@ -0,0 +1,14 @@
+/**
+ * AutocompleteContext - Context para Compound Components
+ *
+ * Fornece estado e helpers do hook useAutocomplete para subcomponentes
+ */
+import * as React from "react";
+export const AutocompleteContext = React.createContext(undefined);
+export function useAutocompleteContext() {
+    const context = React.useContext(AutocompleteContext);
+    if (!context) {
+        throw new Error("useAutocompleteContext must be used within Autocomplete component");
+    }
+    return context;
+}

package/dist/components/molecules/forms/autocomplete/autocomplete-item.d.ts

@@ -0,0 +1,23 @@
+/**
+ * AutocompleteItem - Item da lista de opções
+ *
+ * Subcomponente para modo composição
+ */
+import * as React from "react";
+export interface AutocompleteItemProps extends React.HTMLAttributes<HTMLLIElement> {
+    /**
+     * Valor do item
+     */
+    value: string;
+    /**
+     * Se o item está desabilitado
+     */
+    disabled?: boolean;
+    /**
+     * Conteúdo do item
+     */
+    children?: React.ReactNode;
+}
+declare const AutocompleteItem: React.ForwardRefExoticComponent<AutocompleteItemProps & React.RefAttributes<HTMLLIElement>>;
+export { AutocompleteItem };
+//# sourceMappingURL=autocomplete-item.d.ts.map

package/dist/components/molecules/forms/autocomplete/autocomplete-item.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-item.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/autocomplete/autocomplete-item.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;IAC3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,QAAA,MAAM,gBAAgB,6FAiDrB,CAAC;AAIF,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/components/molecules/forms/autocomplete/autocomplete-item.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "@/lib/utils";
+import { useAutocompleteContext } from "./autocomplete-context";
+const AutocompleteItem = React.forwardRef(({ className, value, disabled, children, ...props }, ref) => {
+    const context = useAutocompleteContext();
+    // Encontrar o item correspondente
+    const item = context.filteredItems.find((i) => i.value === value);
+    if (!item) {
+        // Se não encontrou, criar um item temporário para composição
+        const tempItem = {
+            value,
+            label: typeof children === "string" ? children : value,
+            disabled,
+        };
+        const itemProps = context.getItemProps(tempItem, {
+            ...props,
+            className,
+        });
+        return (_jsx("li", { ...itemProps, ref: ref, className: cn("cursor-pointer px-2 py-1.5", className), children: children || value }));
+    }
+    const itemProps = context.getItemProps(item, {
+        ...props,
+        className,
+    });
+    return (_jsx("li", { ...itemProps, ref: ref, className: cn("cursor-pointer rounded-sm px-2 py-1.5 text-sm outline-none transition-colors", "hover:bg-accent focus:bg-accent", item.disabled && "pointer-events-none opacity-50", className), children: children || item.label }));
+});
+AutocompleteItem.displayName = "AutocompleteItem";
+export { AutocompleteItem };

package/dist/components/molecules/forms/autocomplete/autocomplete-section.d.ts

@@ -0,0 +1,19 @@
+/**
+ * AutocompleteSection - Seção de agrupamento de items
+ *
+ * Subcomponente para modo composição
+ */
+import * as React from "react";
+export interface AutocompleteSectionProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Título da seção
+     */
+    title?: string;
+    /**
+     * Conteúdo da seção (items)
+     */
+    children?: React.ReactNode;
+}
+declare const AutocompleteSection: React.ForwardRefExoticComponent<AutocompleteSectionProps & React.RefAttributes<HTMLDivElement>>;
+export { AutocompleteSection };
+//# sourceMappingURL=autocomplete-section.d.ts.map

package/dist/components/molecules/forms/autocomplete/autocomplete-section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete-section.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/autocomplete/autocomplete-section.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,wBACf,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC5C;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,QAAA,MAAM,mBAAmB,iGAsBvB,CAAC;AAIH,OAAO,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/components/molecules/forms/autocomplete/autocomplete-section.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * AutocompleteSection - Seção de agrupamento de items
+ *
+ * Subcomponente para modo composição
+ */
+import * as React from "react";
+import { cn } from "@/lib/utils";
+const AutocompleteSection = React.forwardRef(({ className, title, children, ...props }, ref) => {
+    return (_jsxs("div", { ref: ref, ...props, className: cn("space-y-1", className), role: "group", "aria-label": title, children: [title && (_jsx("div", { className: "px-2 py-1.5 text-xs font-semibold text-muted-foreground", children: title })), _jsx("ul", { role: "group", className: "space-y-0.5", children: children })] }));
+});
+AutocompleteSection.displayName = "AutocompleteSection";
+export { AutocompleteSection };

package/dist/components/molecules/forms/autocomplete/autocomplete.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Autocomplete Component - Flowtomic UI
+ *
+ * Componente de autocomplete usando hook headless useAutocomplete
+ * Suporta API antiga (options) e composição (Compound Components)
+ */
+import * as React from "react";
+import { type AutocompleteOption } from "flowtomic/logic";
+export interface AutocompleteProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "onChange" | "defaultValue"> {
+    options?: AutocompleteOption[];
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string | undefined) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    size?: "sm" | "default" | "lg";
+    className?: string;
+    inputClassName?: string;
+    emptyMessage?: string;
+    filterFunction?: (option: AutocompleteOption, searchTerm: string) => boolean;
+    allowCustomValue?: boolean;
+    isLoading?: boolean;
+    maxListboxHeight?: string;
+    children?: React.ReactNode;
+}
+export declare const Autocomplete: React.ForwardRefExoticComponent<AutocompleteProps & React.RefAttributes<HTMLInputElement>> & {
+    List: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLUListElement> & React.RefAttributes<HTMLUListElement>>;
+    Empty: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Loading: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<import("./autocomplete-item").AutocompleteItemProps & React.RefAttributes<HTMLLIElement>>;
+    Section: React.ForwardRefExoticComponent<import("./autocomplete-section").AutocompleteSectionProps & React.RefAttributes<HTMLDivElement>>;
+};
+//# sourceMappingURL=autocomplete.d.ts.map

package/dist/components/molecules/forms/autocomplete/autocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/autocomplete/autocomplete.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAmB,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAoC3E,MAAM,WAAW,iBACf,SAAQ,IAAI,CACV,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,cAAc,CAC/C;IAED,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAEpD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,UAAU,EAAE,MAAM,KAAK,OAAO,CAAC;IAC7E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAoPD,eAAO,MAAM,YAAY;;;;;;CAMvB,CAAC"}

package/dist/components/molecules/forms/autocomplete/autocomplete.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * Autocomplete Component - Flowtomic UI
+ *
+ * Componente de autocomplete usando hook headless useAutocomplete
+ * Suporta API antiga (options) e composição (Compound Components)
+ */
+// React e types
+import * as React from "react";
+// Hooks Flowtomic
+import { useAutocomplete } from "flowtomic/logic";
+// Ícones
+import { ChevronDownIcon, XIcon } from "lucide-react";
+// Utils
+import { cn } from "@/lib/utils";
+import { inputVariants } from "../../../atoms/forms/input/input";
+import { Spinner } from "../../../atoms/animation/spinner/spinner";
+// Feedback/Overlay
+import { Popover, PopoverContent, PopoverTrigger, } from "../../../atoms/feedback/popover/popover";
+// Context/Composição
+import { AutocompleteContext, } from "./autocomplete-context";
+import { AutocompleteItem } from "./autocomplete-item";
+import { AutocompleteSection } from "./autocomplete-section";
+const AutocompleteRoot = React.forwardRef(({ options = [], value: controlledValue, defaultValue, onValueChange, placeholder = "Selecione uma opção...", disabled = false, size = "default", className, inputClassName, emptyMessage = "Nenhum resultado encontrado.", filterFunction, allowCustomValue = false, isLoading = false, maxListboxHeight = "300px", children, id, ...props }, ref) => {
+    // Determinar se está usando composição
+    const useComposition = children !== undefined;
+    // Hook headless
+    const hookReturn = useAutocomplete({
+        options: useComposition ? undefined : options,
+        value: controlledValue,
+        defaultValue,
+        onValueChange,
+        filterFunction,
+        allowCustomValue,
+        isLoading,
+        emptyMessage,
+        children: useComposition ? children : undefined,
+    });
+    const { inputValue, selectedValue, isOpen, filteredItems, getInputProps, getPopoverProps, getListProps, getItemProps, open, close, clear, } = hookReturn;
+    // Input props
+    const inputProps = getInputProps({
+        ...props,
+        id,
+        placeholder,
+        disabled,
+        className: cn(inputVariants({ size }), "pr-8", inputClassName),
+    });
+    // Context value
+    const contextValue = {
+        ...hookReturn,
+        size,
+        disabled,
+        maxListboxHeight,
+        emptyMessage,
+    };
+    return (_jsx(AutocompleteContext.Provider, { value: contextValue, children: _jsx("div", { className: cn("relative w-full", className), children: _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("div", { className: "relative", children: [_jsx("input", { ...inputProps, ref: ref }), _jsxs("div", { className: "absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1 pointer-events-none", children: [selectedValue && !disabled && (_jsxs("button", { type: "button", onClick: (e) => {
+                                                e.stopPropagation();
+                                                e.preventDefault();
+                                                clear();
+                                            }, onMouseDown: (e) => {
+                                                e.preventDefault();
+                                                e.stopPropagation();
+                                            }, className: "text-muted-foreground hover:text-foreground rounded-sm p-1 opacity-70 hover:opacity-100 transition-opacity focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-events-auto", children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Limpar" })] })), _jsx(ChevronDownIcon, { className: cn("size-4 text-muted-foreground transition-transform", isOpen && "rotate-180") })] })] }) }), _jsx(PopoverContent, { ...getPopoverProps(), className: cn("bg-popover text-popover-foreground", "data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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", "relative z-50", "min-w-[var(--radix-popover-trigger-width)] w-full", "overflow-hidden rounded-md border shadow-md p-0"), align: "start", sideOffset: 4, onOpenAutoFocus: (e) => {
+                            e.preventDefault();
+                        }, children: _jsx("div", { style: { maxHeight: maxListboxHeight }, className: "overflow-auto", children: isLoading ? (_jsxs("div", { className: "py-6 text-center text-sm text-muted-foreground", children: [_jsx(Spinner, { className: "mx-auto mb-2" }), "Carregando..."] })) : useComposition ? (children) : filteredItems.length > 0 ? (_jsx("ul", { ...getListProps(), className: "p-1 outline-none", children: filteredItems.map((item) => {
+                                    const itemProps = getItemProps(item);
+                                    return (_jsx("li", { ...itemProps, className: cn("cursor-pointer rounded-sm px-2 py-1.5 text-sm outline-none transition-colors", "hover:bg-accent focus:bg-accent", item.disabled && "pointer-events-none opacity-50", itemProps.className), children: item.label }, item.value));
+                                }) })) : (_jsx("div", { className: "py-6 text-center text-sm text-muted-foreground", children: emptyMessage })) }) })] }) }) }));
+});
+AutocompleteRoot.displayName = "Autocomplete";
+// Subcomponentes para composição
+const AutocompleteList = React.forwardRef(({ className, children, ...props }, ref) => {
+    const context = React.useContext(AutocompleteContext);
+    if (!context) {
+        throw new Error("AutocompleteList must be used within Autocomplete component");
+    }
+    const { getListProps } = context;
+    return (_jsx("ul", { ...getListProps(), ...props, ref: ref, className: cn("p-1 outline-none", className), children: children }));
+});
+AutocompleteList.displayName = "AutocompleteList";
+const AutocompleteEmpty = React.forwardRef(({ className, children, ...props }, ref) => {
+    const context = React.useContext(AutocompleteContext);
+    if (!context) {
+        throw new Error("AutocompleteEmpty must be used within Autocomplete component");
+    }
+    const { emptyMessage } = context;
+    return (_jsx("div", { ref: ref, ...props, className: cn("py-6 text-center text-sm text-muted-foreground", className), children: children || emptyMessage }));
+});
+AutocompleteEmpty.displayName = "AutocompleteEmpty";
+const AutocompleteLoading = React.forwardRef(({ className, children, ...props }, ref) => {
+    return (_jsx("div", { ref: ref, ...props, className: cn("py-6 text-center text-sm text-muted-foreground", className), children: children || (_jsxs(_Fragment, { children: [_jsx(Spinner, { className: "mx-auto mb-2" }), "Carregando..."] })) }));
+});
+AutocompleteLoading.displayName = "AutocompleteLoading";
+// Exportar componente composto
+export const Autocomplete = Object.assign(AutocompleteRoot, {
+    List: AutocompleteList,
+    Empty: AutocompleteEmpty,
+    Loading: AutocompleteLoading,
+    Item: AutocompleteItem,
+    Section: AutocompleteSection,
+});

package/dist/components/molecules/forms/autocomplete/index.d.ts

@@ -0,0 +1,9 @@
+export type { AutocompleteProps } from "./autocomplete";
+export { Autocomplete } from "./autocomplete";
+export type { AutocompleteItemProps } from "./autocomplete-item";
+export { AutocompleteItem } from "./autocomplete-item";
+export type { AutocompleteSectionProps } from "./autocomplete-section";
+export { AutocompleteSection } from "./autocomplete-section";
+export type { AutocompleteContextValue } from "./autocomplete-context";
+export { useAutocompleteContext } from "./autocomplete-context";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/forms/autocomplete/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/autocomplete/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,YAAY,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,YAAY,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/molecules/forms/autocomplete/index.js

@@ -0,0 +1,4 @@
+export { Autocomplete } from "./autocomplete";
+export { AutocompleteItem } from "./autocomplete-item";
+export { AutocompleteSection } from "./autocomplete-section";
+export { useAutocompleteContext } from "./autocomplete-context";

package/dist/components/molecules/forms/item/item.d.ts

@@ -24,7 +24,7 @@ declare namespace Item {
     var displayName: string;
 }
 declare const itemMediaVariants: (props?: ({
-    variant?: "default" | "icon" | "image" | null | undefined;
+    variant?: "image" | "default" | "icon" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface ItemMediaProps extends React.ComponentProps<"div">, VariantProps<typeof itemMediaVariants> {
 }

package/dist/components/molecules/forms/text-editor/index.d.ts

@@ -0,0 +1,3 @@
+export type { TextEditorMode, TextEditorProps, TextEditorToolbarAction } from "./text-editor";
+export { TextEditor } from "./text-editor";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/forms/text-editor/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/text-editor/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,uBAAuB,EAAE,MAAM,eAAe,CAAC;AAC9F,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/molecules/forms/text-editor/index.js

@@ -0,0 +1 @@
+export { TextEditor } from "./text-editor";

package/dist/components/molecules/forms/text-editor/text-editor.d.ts

@@ -0,0 +1,33 @@
+/**
+ * TextEditor - Flowtomic UI
+ *
+ * Editor de texto rico com TipTap + modos opcionais Markdown e Preview.
+ * Regras de modo:
+ * - Somente 'rich' => sem abas, apenas editor rico
+ * - Somente 'markdown' => textarea markdown + (preview opcional)
+ * - Somente 'preview' => somente visualização
+ * - Múltiplos modos => abas para cada modo disponível
+ */
+import * as React from "react";
+export type TextEditorMode = "rich" | "markdown" | "preview";
+export type TextEditorToolbarAction = "bold" | "italic" | "strike" | "code" | "h1" | "h2" | "h3" | "bulletList" | "orderedList" | "blockquote" | "alignLeft" | "alignCenter" | "alignRight" | "textColor" | "image";
+declare const DEFAULT_ACTIONS: TextEditorToolbarAction[];
+type BaseDivProps = Omit<React.HTMLAttributes<HTMLDivElement>, "onChange">;
+export interface TextEditorProps extends BaseDivProps {
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    placeholder?: string;
+    editable?: boolean;
+    mode?: TextEditorMode;
+    onModeChange?: (mode: TextEditorMode) => void;
+    toolbar?: boolean;
+    allowedActions?: TextEditorToolbarAction[];
+    onUploadImage?: (file: File) => Promise<string> | string;
+    outputFormat?: "markdown" | "text";
+    /** Modos disponíveis. 'markdown' sempre inclui 'preview' automaticamente */
+    availableModes?: ("rich" | "markdown")[];
+}
+export declare const TextEditor: React.ForwardRefExoticComponent<TextEditorProps & React.RefAttributes<HTMLDivElement>>;
+export { DEFAULT_ACTIONS };
+//# sourceMappingURL=text-editor.d.ts.map

package/dist/components/molecules/forms/text-editor/text-editor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-editor.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/forms/text-editor/text-editor.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AA+C/B,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,UAAU,GAAG,SAAS,CAAC;AAE7D,MAAM,MAAM,uBAAuB,GAC/B,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,MAAM,GACrC,IAAI,GAAG,IAAI,GAAG,IAAI,GAClB,YAAY,GAAG,aAAa,GAAG,YAAY,GAC3C,WAAW,GAAG,aAAa,GAAG,YAAY,GAC1C,WAAW,GACX,OAAO,CAAC;AAEZ,QAAA,MAAM,eAAe,EAAE,uBAAuB,EAgB7C,CAAC;AA2DF,KAAK,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAE3E,MAAM,WAAW,eAAgB,SAAQ,YAAY;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,uBAAuB,EAAE,CAAC;IAC3C,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IACzD,YAAY,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC;IACnC,4EAA4E;IAC5E,cAAc,CAAC,EAAE,CAAC,MAAM,GAAG,UAAU,CAAC,EAAE,CAAC;CAC1C;AAED,eAAO,MAAM,UAAU,wFAmUtB,CAAC;AA8BF,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/dist/components/molecules/forms/text-editor/text-editor.js

@@ -0,0 +1,211 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * TextEditor - Flowtomic UI
+ *
+ * Editor de texto rico com TipTap + modos opcionais Markdown e Preview.
+ * Regras de modo:
+ * - Somente 'rich' => sem abas, apenas editor rico
+ * - Somente 'markdown' => textarea markdown + (preview opcional)
+ * - Somente 'preview' => somente visualização
+ * - Múltiplos modos => abas para cada modo disponível
+ */
+import * as React from "react";
+import { useEditor, EditorContent } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import Placeholder from "@tiptap/extension-placeholder";
+import TextStyle from "@tiptap/extension-text-style";
+import Color from "@tiptap/extension-color";
+import TextAlign from "@tiptap/extension-text-align";
+import Image from "@tiptap/extension-image";
+import { Markdown } from "tiptap-markdown";
+import { Bold, Code, Heading1, Heading2, Heading3, ImageIcon, Italic, ListOrdered, List as ListIcon, Quote, Strikethrough, AlignLeft, AlignCenter, AlignRight, Eye, FileText, Palette, } from "lucide-react";
+import { Streamdown } from "streamdown";
+import { cn } from "@/lib/utils";
+import { Button, Separator, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, Popover, PopoverContent, PopoverTrigger, } from "../../../atoms";
+const DEFAULT_ACTIONS = [
+    "bold",
+    "italic",
+    "strike",
+    "code",
+    "h1",
+    "h2",
+    "h3",
+    "bulletList",
+    "orderedList",
+    "blockquote",
+    "alignLeft",
+    "alignCenter",
+    "alignRight",
+    "textColor",
+    "image",
+];
+const PRESET_COLORS = [
+    { label: "Preto", value: "#000000" },
+    { label: "Cinza escuro", value: "#374151" },
+    { label: "Cinza", value: "#6B7280" },
+    { label: "Cinza claro", value: "#9CA3AF" },
+    { label: "Vermelho", value: "#EF4444" },
+    { label: "Laranja", value: "#F97316" },
+    { label: "Amarelo", value: "#EAB308" },
+    { label: "Verde", value: "#10B981" },
+    { label: "Azul", value: "#3B82F6" },
+    { label: "Índigo", value: "#6366F1" },
+    { label: "Roxo", value: "#A855F7" },
+    { label: "Rosa", value: "#EC4899" },
+    { label: "Vermelho escuro", value: "#991B1B" },
+    { label: "Laranja escuro", value: "#9A3412" },
+    { label: "Amarelo escuro", value: "#854D0E" },
+    { label: "Verde escuro", value: "#065F46" },
+    { label: "Azul escuro", value: "#1E40AF" },
+    { label: "Índigo escuro", value: "#3730A3" },
+    { label: "Roxo escuro", value: "#6B21A8" },
+    { label: "Rosa escuro", value: "#9F1239" },
+    { label: "Vermelho claro", value: "#FCA5A5" },
+    { label: "Laranja claro", value: "#FDBA74" },
+    { label: "Amarelo claro", value: "#FDE047" },
+    { label: "Verde claro", value: "#6EE7B7" },
+    { label: "Azul claro", value: "#93C5FD" },
+    { label: "Índigo claro", value: "#A5B4FC" },
+    { label: "Roxo claro", value: "#D8B4FE" },
+    { label: "Rosa claro", value: "#F9A8D4" },
+];
+function useMarkdownState(controlled, initial) {
+    const isControlled = controlled !== undefined;
+    const [value, setValue] = React.useState(initial);
+    React.useEffect(() => {
+        if (isControlled)
+            setValue(controlled);
+    }, [controlled, isControlled]);
+    return { value, setValue, isControlled };
+}
+function stripMarkdown(md) {
+    return md
+        .replace(/`{1,3}[^`]*`/g, (m) => m.replace(/`/g, ""))
+        .replace(/^#{1,6}\s+/gm, "")
+        .replace(/\*\*([^*]+)\*\*/g, "$1")
+        .replace(/\*([^*]+)\*/g, "$1")
+        .replace(/~~([^~]+)~~/g, "$1")
+        .replace(/>\s+/g, "")
+        .replace(/`([^`]+)`/g, "$1")
+        .replace(/^\s*[-*+]\s+/gm, "")
+        .replace(/^\s*\d+\.\s+/gm, "")
+        .replace(/!\[[^\]]*\]\([^)]*\)/g, "")
+        .replace(/\[[^\]]*\]\([^)]*\)/g, (m) => m.match(/\[([^\]]+)\]/)?.[1] || "")
+        .replace(/\n{3,}/g, "\n\n")
+        .trim();
+}
+export const TextEditor = React.forwardRef(({ className, value: controlledValue, defaultValue, onChange, placeholder = "Escreva algo...", editable = true, mode: controlledMode, onModeChange, toolbar = true, allowedActions = DEFAULT_ACTIONS, onUploadImage, outputFormat = "markdown", availableModes = ["rich", "markdown"], ...props }, ref) => {
+    const initial = controlledValue ?? defaultValue ?? "";
+    const { value: internalMarkdown, setValue: setInternalMarkdown, isControlled } = useMarkdownState(controlledValue, initial);
+    // Expandir modos: se markdown está presente, adicionar preview automaticamente
+    const effectiveModes = React.useMemo(() => {
+        const unique = availableModes.filter((m, i, arr) => arr.indexOf(m) === i);
+        const expanded = [];
+        if (unique.includes("rich"))
+            expanded.push("rich");
+        if (unique.includes("markdown")) {
+            expanded.push("markdown");
+            expanded.push("preview"); // markdown sempre vem com preview
+        }
+        return expanded.length > 0 ? expanded : ["rich"];
+    }, [availableModes]);
+    const [mode, setMode] = React.useState(controlledMode && effectiveModes.includes(controlledMode) ? controlledMode : effectiveModes[0]);
+    const setModeSafe = React.useCallback((m) => {
+        if (!effectiveModes.includes(m))
+            return;
+        setMode(m);
+        onModeChange?.(m);
+    }, [effectiveModes, onModeChange]);
+    const editor = useEditor({
+        editable,
+        extensions: [
+            Markdown.configure({ html: false, transformPastedText: true, transformCopiedText: true }),
+            StarterKit.configure({ heading: { levels: [1, 2, 3] } }),
+            TextStyle,
+            Color,
+            TextAlign.configure({ types: ["heading", "paragraph"] }),
+            Placeholder.configure({ placeholder }),
+            Image,
+        ],
+        content: internalMarkdown ? undefined : "",
+        onUpdate: ({ editor }) => {
+            try {
+                // @ts-expect-error acesso ao storage markdown da extensão
+                const md = editor?.storage?.markdown?.getMarkdown?.() ?? editor.commands.getMarkdown?.();
+                if (typeof md === "string") {
+                    if (!isControlled)
+                        setInternalMarkdown(md);
+                    if (outputFormat === "text") {
+                        onChange?.(editor.getText());
+                    }
+                    else {
+                        onChange?.(md);
+                    }
+                }
+            }
+            catch {
+                /* silencioso */
+            }
+        },
+    });
+    React.useEffect(() => {
+        if (!editor)
+            return;
+        if (controlledValue === undefined)
+            return;
+        const nextMarkdown = controlledValue; // já é markdown ou texto; se texto não temos conversão -> usar direto
+        // @ts-expect-error comando da extensão markdown
+        if (editor.commands?.setMarkdown) {
+            // @ts-expect-error
+            editor.commands.setMarkdown(nextMarkdown);
+        }
+        else {
+            editor.commands.setContent(nextMarkdown);
+        }
+    }, [editor, controlledValue]);
+    const handleImageInsert = React.useCallback(async () => {
+        if (!editor)
+            return;
+        const input = document.createElement("input");
+        input.type = "file";
+        input.accept = "image/*";
+        input.onchange = async () => {
+            const file = input.files?.[0];
+            if (!file)
+                return;
+            const url = onUploadImage ? await onUploadImage(file) : URL.createObjectURL(file);
+            editor.chain().focus().setImage({ src: url, alt: file.name }).run();
+        };
+        input.click();
+    }, [editor, onUploadImage]);
+    const Toolbar = React.useMemo(() => {
+        if (!toolbar)
+            return null;
+        const e = editor;
+        const run = (cb) => () => e && cb(e);
+        return (_jsxs("div", { className: "flex flex-wrap items-center gap-1 rounded-md border bg-muted/40 p-1", children: [allowedActions.includes("bold") && (_jsx(ToolbarButton, { label: "Negrito", active: e?.isActive("bold"), onClick: run((ed) => ed.chain().focus().toggleBold().run()), children: _jsx(Bold, { size: 14 }) })), allowedActions.includes("italic") && (_jsx(ToolbarButton, { label: "It\u00E1lico", active: e?.isActive("italic"), onClick: run((ed) => ed.chain().focus().toggleItalic().run()), children: _jsx(Italic, { size: 14 }) })), allowedActions.includes("strike") && (_jsx(ToolbarButton, { label: "Tachado", active: e?.isActive("strike"), onClick: run((ed) => ed.chain().focus().toggleStrike().run()), children: _jsx(Strikethrough, { size: 14 }) })), allowedActions.includes("code") && (_jsx(ToolbarButton, { label: "C\u00F3digo inline", active: e?.isActive("code"), onClick: run((ed) => ed.chain().focus().toggleCode().run()), children: _jsx(Code, { size: 14 }) })), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" }), allowedActions.includes("h1") && (_jsx(ToolbarButton, { label: "T\u00EDtulo H1", active: e?.isActive("heading", { level: 1 }), onClick: run((ed) => ed.chain().focus().toggleHeading({ level: 1 }).run()), children: _jsx(Heading1, { size: 14 }) })), allowedActions.includes("h2") && (_jsx(ToolbarButton, { label: "T\u00EDtulo H2", active: e?.isActive("heading", { level: 2 }), onClick: run((ed) => ed.chain().focus().toggleHeading({ level: 2 }).run()), children: _jsx(Heading2, { size: 14 }) })), allowedActions.includes("h3") && (_jsx(ToolbarButton, { label: "T\u00EDtulo H3", active: e?.isActive("heading", { level: 3 }), onClick: run((ed) => ed.chain().focus().toggleHeading({ level: 3 }).run()), children: _jsx(Heading3, { size: 14 }) })), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" }), allowedActions.includes("bulletList") && (_jsx(ToolbarButton, { label: "Lista n\u00E3o ordenada", active: e?.isActive("bulletList"), onClick: run((ed) => ed.chain().focus().toggleBulletList().run()), children: _jsx(ListIcon, { size: 14 }) })), allowedActions.includes("orderedList") && (_jsx(ToolbarButton, { label: "Lista ordenada", active: e?.isActive("orderedList"), onClick: run((ed) => ed.chain().focus().toggleOrderedList().run()), children: _jsx(ListOrdered, { size: 14 }) })), allowedActions.includes("blockquote") && (_jsx(ToolbarButton, { label: "Cita\u00E7\u00E3o", active: e?.isActive("blockquote"), onClick: run((ed) => ed.chain().focus().toggleBlockquote().run()), children: _jsx(Quote, { size: 14 }) })), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" }), allowedActions.includes("alignLeft") && (_jsx(ToolbarButton, { label: "Alinhar \u00E0 esquerda", active: e?.isActive({ textAlign: "left" }), onClick: run((ed) => ed.chain().focus().setTextAlign("left").run()), children: _jsx(AlignLeft, { size: 14 }) })), allowedActions.includes("alignCenter") && (_jsx(ToolbarButton, { label: "Centralizar", active: e?.isActive({ textAlign: "center" }), onClick: run((ed) => ed.chain().focus().setTextAlign("center").run()), children: _jsx(AlignCenter, { size: 14 }) })), allowedActions.includes("alignRight") && (_jsx(ToolbarButton, { label: "Alinhar \u00E0 direita", active: e?.isActive({ textAlign: "right" }), onClick: run((ed) => ed.chain().focus().setTextAlign("right").run()), children: _jsx(AlignRight, { size: 14 }) })), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" }), allowedActions.includes("textColor") && (_jsxs(Popover, { children: [_jsx(TooltipProvider, { delayDuration: 300, skipDelayDuration: 0, children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "h-7 w-7 p-0", children: _jsx(Palette, { size: 14 }) }) }) }), _jsx(TooltipContent, { sideOffset: 4, children: "Cor do texto" })] }) }), _jsx(PopoverContent, { className: "w-auto p-2", children: _jsxs("div", { className: "grid grid-cols-6 gap-1", children: [PRESET_COLORS.map((color) => (_jsx("button", { type: "button", onClick: () => e?.chain().focus().setColor(color.value).run(), className: "size-6 rounded border border-border hover:scale-110 transition-transform", style: { backgroundColor: color.value }, title: color.label }, color.value))), _jsx("button", { type: "button", onClick: () => e?.chain().focus().unsetColor().run(), className: "size-6 rounded border border-border hover:scale-110 transition-transform bg-background flex items-center justify-center text-xs", title: "Remover cor", children: "\u2715" })] }) })] })), _jsx(Separator, { orientation: "vertical", className: "mx-1 h-6" }), allowedActions.includes("image") && (_jsx(ToolbarButton, { label: "Inserir imagem", onClick: handleImageInsert, children: _jsx(ImageIcon, { size: 14 }) }))] }));
+    }, [editor, toolbar, allowedActions, handleImageInsert]);
+    const richView = (_jsxs("div", { className: "grid gap-2", children: [Toolbar, _jsx("div", { className: cn("prose dark:prose-invert prose-sm max-w-none rounded-md border bg-background p-3", "focus-within:ring-ring/50 focus-within:ring-[3px]"), children: _jsx(EditorContent, { editor: editor, className: "min-h-40" }) })] }));
+    const markdownEditor = (_jsx(Textarea, { className: "font-mono text-sm", rows: 14, value: internalMarkdown, onChange: (e) => {
+            const next = e.target.value;
+            setInternalMarkdown(next);
+            if (outputFormat === "text") {
+                onChange?.(stripMarkdown(next));
+            }
+            else {
+                onChange?.(next);
+            }
+        }, placeholder: placeholder }));
+    const previewView = (_jsx("div", { className: "rounded-md border bg-background p-3", children: _jsx(Streamdown, { children: internalMarkdown }) }));
+    // Renderização sem abas (apenas rich sozinho)
+    if (effectiveModes.length === 1 && effectiveModes[0] === "rich") {
+        return (_jsx("div", { ref: ref, className: cn("grid gap-2", className), ...props, children: richView }));
+    }
+    // Com abas (markdown sempre inclui preview automaticamente)
+    return (_jsx("div", { ref: ref, className: cn("grid gap-2", className), ...props, children: _jsxs(Tabs, { value: mode, onValueChange: (v) => setModeSafe(v), children: [_jsxs(TabsList, { className: "w-fit", children: [effectiveModes.includes("rich") && (_jsx(TabsTrigger, { value: "rich", children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(Eye, { className: "size-3.5" }), " Rich"] }) })), effectiveModes.includes("markdown") && (_jsx(TabsTrigger, { value: "markdown", children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(FileText, { className: "size-3.5" }), " Markdown"] }) })), effectiveModes.includes("preview") && (_jsx(TabsTrigger, { value: "preview", children: _jsxs("span", { className: "flex items-center gap-2", children: [_jsx(Eye, { className: "size-3.5" }), " Preview"] }) }))] }), effectiveModes.includes("rich") && (_jsx(TabsContent, { value: "rich", className: "mt-2", children: richView })), effectiveModes.includes("markdown") && (_jsx(TabsContent, { value: "markdown", className: "mt-2", children: markdownEditor })), effectiveModes.includes("preview") && (_jsx(TabsContent, { value: "preview", className: "mt-2", children: previewView }))] }) }));
+});
+TextEditor.displayName = "TextEditor";
+function ToolbarButton({ label, active, className, children, ...rest }) {
+    return (_jsx(TooltipProvider, { delayDuration: 300, skipDelayDuration: 0, children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", className: cn("h-7 w-7 p-0", active && "bg-accent text-accent-foreground", className), ...rest, children: children }) }), _jsx(TooltipContent, { sideOffset: 4, children: label })] }) }));
+}
+export { DEFAULT_ACTIONS };