@flowtomic/logic 0.1.2 → 0.1.4

package/dist/hooks/useAnimatedIndicator/useAnimatedIndicator.d.ts

@@ -34,6 +34,11 @@ export interface UseAnimatedIndicatorOptions {
      * @default true
      */
     updateOnResize?: boolean;
+    /**
+     * Valor ativo controlado externamente.
+     * Se fornecido, o hook não tentará detectar o elemento ativo via DOM.
+     */
+    value?: string;
 }
 export interface UseAnimatedIndicatorReturn {
     /**

package/dist/hooks/useAnimatedIndicator/useAnimatedIndicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimatedIndicator.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAnimatedIndicator/useAnimatedIndicator.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,MAAM,CAAC;IACnD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,cAAc,EAAE,cAAc,CAAC;IAC/B;;OAEG;IACH,eAAe,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE;;OAEG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C;;OAEG;IACH,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B;;OAEG;IACH,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,2BAA2B,GACnC,0BAA0B,CA+N5B"}
+{"version":3,"file":"useAnimatedIndicator.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAnimatedIndicator/useAnimatedIndicator.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAIH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,2BAA2B;IAC1C;;OAEG;IACH,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAC3C;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;OAGG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,MAAM,CAAC;IACnD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,0BAA0B;IACzC;;OAEG;IACH,cAAc,EAAE,cAAc,CAAC;IAC/B;;OAEG;IACH,eAAe,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE;;OAEG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C;;OAEG;IACH,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B;;OAEG;IACH,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,2BAA2B,GACnC,0BAA0B,CAgP5B"}

package/dist/hooks/useAnimatedIndicator/useAnimatedIndicator.js

@@ -42,7 +42,7 @@ import { useCallback, useEffect, useRef, useState } from "react";
  * ```
  */
 export function useAnimatedIndicator(options) {
-    const { containerRef, activeSelector = '[data-state="active"]', getElementValue, updateOnResize = true, } = options;
+    const { containerRef, activeSelector = '[data-state="active"]', getElementValue, updateOnResize = true, value: controlledValue, } = options;
     const elementsRef = useRef(new Map());
     const updateTimeoutRef = useRef(null);
     const activeValueRef = useRef(undefined);
@@ -58,6 +58,12 @@ export function useAnimatedIndicator(options) {
     useEffect(() => {
         activeValueRef.current = activeValue;
     }, [activeValue]);
+    // Sincronizar valor controlado
+    useEffect(() => {
+        if (controlledValue !== undefined) {
+            setActiveValue(controlledValue);
+        }
+    }, [controlledValue]);
     const updateIndicator = useCallback(() => {
         const currentActiveValue = activeValueRef.current;
         if (!currentActiveValue) {
@@ -117,7 +123,7 @@ export function useAnimatedIndicator(options) {
     // Atualizar quando activeValue mudar
     useEffect(() => {
         scheduleUpdate();
-    }, [activeValue, scheduleUpdate]);
+    }, [scheduleUpdate]);
     // Listener de resize
     useEffect(() => {
         if (!updateOnResize)
@@ -166,12 +172,20 @@ export function useAnimatedIndicator(options) {
         activeSelectorRef.current = activeSelector;
         getElementValueRef.current = getElementValue;
     }, [activeSelector, getElementValue]);
+    // Ref para valor controlado
+    const controlledValueRef = useRef(controlledValue);
+    useEffect(() => {
+        controlledValueRef.current = controlledValue;
+    }, [controlledValue]);
     // Observar mudanças no elemento ativo
     useEffect(() => {
         const container = containerRef.current;
         if (!container)
             return;
         const findActiveValue = () => {
+            // Se estiver em modo controlado, ignorar detecção DOM
+            if (controlledValueRef.current !== undefined)
+                return;
             const activeElement = container.querySelector(activeSelectorRef.current);
             if (activeElement) {
                 let value;

package/dist/hooks/useAutocomplete/index.d.ts

@@ -0,0 +1,3 @@
+export type { AutocompleteOption, UseAutocompleteOptions, UseAutocompleteReturn, } from "./useAutocomplete";
+export { useAutocomplete } from "./useAutocomplete";
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/useAutocomplete/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAutocomplete/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,kBAAkB,EAClB,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC"}

package/dist/hooks/useAutocomplete/index.js

@@ -0,0 +1 @@
+export { useAutocomplete } from "./useAutocomplete";

package/dist/hooks/useAutocomplete/useAutocomplete.d.ts

@@ -0,0 +1,197 @@
+/**
+ * useAutocomplete - Headless UI Hook
+ *
+ * Fornece apenas: lógica, estado, processamento e API
+ * NÃO fornece: markup, styles ou implementações pré-construídas
+ *
+ * Padrão Headless UI: você controla o markup e styles
+ *
+ * @example
+ * ```tsx
+ * function MyCustomAutocomplete() {
+ *   const {
+ *     inputValue,
+ *     selectedValue,
+ *     isOpen,
+ *     filteredItems,
+ *     getInputProps,
+ *     getPopoverProps,
+ *     getListProps,
+ *     getItemProps,
+ *     open,
+ *     close,
+ *     select,
+ *     clear,
+ *   } = useAutocomplete({
+ *     options: [
+ *       { value: "1", label: "Option 1" },
+ *       { value: "2", label: "Option 2" },
+ *     ],
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <input {...getInputProps()} />
+ *       {isOpen && (
+ *         <div {...getPopoverProps()}>
+ *           <ul {...getListProps()}>
+ *             {filteredItems.map((item) => (
+ *               <li key={item.value} {...getItemProps(item)}>
+ *                 {item.label}
+ *               </li>
+ *             ))}
+ *           </ul>
+ *         </div>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+import * as React from "react";
+export interface AutocompleteOption {
+    value: string;
+    label: string;
+    disabled?: boolean;
+}
+export interface UseAutocompleteOptions {
+    /**
+     * Opções para seleção (API antiga)
+     */
+    options?: AutocompleteOption[];
+    /**
+     * Valor selecionado (controlado)
+     */
+    value?: string;
+    /**
+     * Valor padrão (não controlado)
+     */
+    defaultValue?: string;
+    /**
+     * Callback quando o valor muda
+     */
+    onValueChange?: (value: string | undefined) => void;
+    /**
+     * Função de filtro customizada
+     */
+    filterFunction?: (option: AutocompleteOption, searchTerm: string) => boolean;
+    /**
+     * Permite valores customizados (não presentes nas opções)
+     */
+    allowCustomValue?: boolean;
+    /**
+     * Estado de loading
+     */
+    isLoading?: boolean;
+    /**
+     * Mensagem quando não há resultados
+     */
+    emptyMessage?: string;
+    /**
+     * Children para composição (modo compound components)
+     */
+    children?: React.ReactNode;
+}
+export interface UseAutocompleteReturn {
+    /**
+     * Valor atual do input
+     */
+    inputValue: string;
+    /**
+     * Valor selecionado
+     */
+    selectedValue: string | undefined;
+    /**
+     * Se o popover está aberto
+     */
+    isOpen: boolean;
+    /**
+     * Items filtrados baseado no inputValue
+     */
+    filteredItems: AutocompleteOption[];
+    /**
+     * Índice do item destacado (para navegação por teclado)
+     */
+    highlightedIndex: number;
+    /**
+     * Estado de loading
+     */
+    isLoading: boolean;
+    /**
+     * Se não há items para exibir
+     */
+    isEmpty: boolean;
+    /**
+     * Abre o popover
+     */
+    open: () => void;
+    /**
+     * Fecha o popover
+     */
+    close: () => void;
+    /**
+     * Seleciona um valor
+     */
+    select: (value: string) => void;
+    /**
+     * Limpa a seleção
+     */
+    clear: () => void;
+    /**
+     * Define o valor do input
+     */
+    setInputValue: (value: string) => void;
+    /**
+     * Helper para props do input
+     */
+    getInputProps: (props?: React.InputHTMLAttributes<HTMLInputElement>) => Omit<React.InputHTMLAttributes<HTMLInputElement>, "value" | "onChange" | "onFocus" | "onBlur" | "onKeyDown" | "aria-expanded" | "aria-autocomplete" | "aria-controls" | "aria-activedescendant" | "role"> & {
+        value: string;
+        onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+        onFocus: React.FocusEventHandler<HTMLInputElement>;
+        onBlur: React.FocusEventHandler<HTMLInputElement>;
+        onKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+        "aria-expanded": boolean;
+        "aria-autocomplete": "list";
+        "aria-controls": string;
+        "aria-activedescendant": string | undefined;
+        role: "combobox";
+    };
+    /**
+     * Helper para props do popover
+     */
+    getPopoverProps: (props?: React.ComponentProps<"div">) => React.ComponentProps<"div"> & {
+        "aria-label": string;
+        role: "listbox";
+    };
+    /**
+     * Helper para props da lista
+     */
+    getListProps: (props?: React.HTMLAttributes<HTMLUListElement>) => React.HTMLAttributes<HTMLUListElement> & {
+        id: string;
+        role: "listbox";
+        "aria-label": string;
+    };
+    /**
+     * Helper para props de um item
+     */
+    getItemProps: (item: AutocompleteOption, props?: React.HTMLAttributes<HTMLLIElement>) => Omit<React.HTMLAttributes<HTMLLIElement>, "role" | "aria-selected" | "aria-disabled" | "id" | "onClick" | "onMouseEnter"> & {
+        role: "option";
+        "aria-selected": boolean;
+        "aria-disabled": boolean;
+        id: string;
+        onClick: (e: React.MouseEvent<HTMLLIElement>) => void;
+        onMouseEnter: (e: React.MouseEvent<HTMLLIElement>) => void;
+    };
+    /**
+     * Extrai items dos children (para modo composição)
+     */
+    extractItemsFromChildren: (children: React.ReactNode) => AutocompleteOption[];
+}
+/**
+ * Hook Headless UI para Autocomplete
+ *
+ * Fornece apenas a lógica e API, sem markup ou styles.
+ * Você é responsável por criar o visual.
+ */
+export declare function useAutocomplete(options?: UseAutocompleteOptions): UseAutocompleteReturn;
+//# sourceMappingURL=useAutocomplete.d.ts.map

package/dist/hooks/useAutocomplete/useAutocomplete.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutocomplete.d.ts","sourceRoot":"","sources":["../../../src/hooks/useAutocomplete/useAutocomplete.ts"],"names":[],"mappings":"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"}

package/dist/hooks/useAutocomplete/useAutocomplete.js

@@ -0,0 +1,379 @@
+/**
+ * useAutocomplete - Headless UI Hook
+ *
+ * Fornece apenas: lógica, estado, processamento e API
+ * NÃO fornece: markup, styles ou implementações pré-construídas
+ *
+ * Padrão Headless UI: você controla o markup e styles
+ *
+ * @example
+ * ```tsx
+ * function MyCustomAutocomplete() {
+ *   const {
+ *     inputValue,
+ *     selectedValue,
+ *     isOpen,
+ *     filteredItems,
+ *     getInputProps,
+ *     getPopoverProps,
+ *     getListProps,
+ *     getItemProps,
+ *     open,
+ *     close,
+ *     select,
+ *     clear,
+ *   } = useAutocomplete({
+ *     options: [
+ *       { value: "1", label: "Option 1" },
+ *       { value: "2", label: "Option 2" },
+ *     ],
+ *   });
+ *
+ *   return (
+ *     <div>
+ *       <input {...getInputProps()} />
+ *       {isOpen && (
+ *         <div {...getPopoverProps()}>
+ *           <ul {...getListProps()}>
+ *             {filteredItems.map((item) => (
+ *               <li key={item.value} {...getItemProps(item)}>
+ *                 {item.label}
+ *               </li>
+ *             ))}
+ *           </ul>
+ *         </div>
+ *       )}
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import * as React from "react";
+/**
+ * Função de filtro padrão (case-insensitive)
+ */
+function defaultFilter(option, searchTerm) {
+    return option.label.toLowerCase().includes(searchTerm.toLowerCase());
+}
+/**
+ * Extrai items dos children em modo composição
+ */
+function extractItemsFromChildren(children) {
+    const items = [];
+    const processChild = (child) => {
+        if (!React.isValidElement(child)) {
+            return;
+        }
+        const props = child.props;
+        // Se tiver prop 'value', é um Autocomplete.Item
+        if (props.value !== undefined) {
+            const value = String(props.value);
+            let label = value;
+            // Extrair o texto dos children
+            if (props.children !== undefined && props.children !== null) {
+                if (typeof props.children === "string") {
+                    label = props.children;
+                }
+                else if (typeof props.children === "number") {
+                    label = String(props.children);
+                }
+                else if (React.isValidElement(props.children)) {
+                    const childProps = props.children.props;
+                    if (typeof childProps?.children === "string") {
+                        label = childProps.children;
+                    }
+                    else {
+                        label = String(props.children);
+                    }
+                }
+                else if (Array.isArray(props.children)) {
+                    React.Children.forEach(props.children, (c) => {
+                        if (typeof c === "string" && label === value) {
+                            label = c;
+                        }
+                    });
+                }
+                else {
+                    label = String(props.children);
+                }
+            }
+            items.push({
+                value,
+                label,
+                disabled: props.disabled,
+            });
+            return;
+        }
+        // Se tiver prop 'title', é um AutocompleteSection - processar seus children
+        if (props.title !== undefined) {
+            if (props.children) {
+                React.Children.forEach(props.children, processChild);
+            }
+            return;
+        }
+        // Se tiver children mas não é Item nem Section, processar recursivamente
+        if (props.children !== undefined && props.children !== null) {
+            if (typeof props.children === "string" ||
+                typeof props.children === "number" ||
+                typeof props.children === "boolean") {
+                return;
+            }
+            if (Array.isArray(props.children) || React.isValidElement(props.children)) {
+                React.Children.forEach(props.children, processChild);
+            }
+            else if (typeof props.children === "object") {
+                React.Children.forEach(props.children, processChild);
+            }
+        }
+    };
+    React.Children.forEach(children, processChild);
+    return items;
+}
+/**
+ * Hook Headless UI para Autocomplete
+ *
+ * Fornece apenas a lógica e API, sem markup ou styles.
+ * Você é responsável por criar o visual.
+ */
+export function useAutocomplete(options = {}) {
+    const { options: providedOptions = [], value: controlledValue, defaultValue, onValueChange, filterFunction = defaultFilter, allowCustomValue = false, isLoading = false, emptyMessage = "Nenhum resultado encontrado.", children, } = options;
+    // Determinar se está usando composição ou API antiga
+    const useComposition = children !== undefined;
+    // Estado interno
+    const [inputValue, setInputValueState] = useState("");
+    const [selectedValue, setSelectedValue] = useState(controlledValue ?? defaultValue);
+    const [isOpen, setIsOpen] = useState(false);
+    const [highlightedIndex, setHighlightedIndex] = useState(-1);
+    // Determinar se é controlado
+    const isControlled = controlledValue !== undefined;
+    // Extrair items dos children se em modo composição
+    const itemsFromChildren = useMemo(() => {
+        if (!useComposition)
+            return [];
+        return extractItemsFromChildren(children);
+    }, [useComposition, children]);
+    // Items disponíveis (API antiga ou composição)
+    const allItems = useMemo(() => {
+        if (useComposition) {
+            return itemsFromChildren;
+        }
+        return providedOptions;
+    }, [useComposition, itemsFromChildren, providedOptions]);
+    // Filtrar items baseado no inputValue
+    const filteredItems = useMemo(() => {
+        if (!inputValue.trim()) {
+            return allItems;
+        }
+        return allItems.filter((item) => filterFunction(item, inputValue));
+    }, [allItems, inputValue, filterFunction]);
+    // Estado derivado
+    const isEmpty = filteredItems.length === 0 && !isLoading;
+    // IDs para acessibilidade
+    const listIdRef = useRef(`autocomplete-list-${React.useId()}`);
+    const listId = listIdRef.current;
+    // Sincronizar com valor controlado
+    useEffect(() => {
+        if (isControlled && controlledValue !== undefined) {
+            const option = allItems.find((opt) => opt.value === controlledValue);
+            if (option) {
+                setSelectedValue(controlledValue);
+                setInputValueState(option.label);
+            }
+            else {
+                setSelectedValue(undefined);
+                setInputValueState(controlledValue);
+            }
+        }
+    }, [isControlled, controlledValue, allItems]);
+    // Sincronizar inputValue quando seleção muda (apenas para API antiga)
+    useEffect(() => {
+        if (!useComposition && selectedValue) {
+            const option = allItems.find((opt) => opt.value === selectedValue);
+            if (option && inputValue !== option.label) {
+                setInputValueState(option.label);
+            }
+        }
+    }, [selectedValue, allItems, useComposition, inputValue]);
+    // Controles
+    const open = useCallback(() => {
+        if (filteredItems.length > 0 || isLoading) {
+            setIsOpen(true);
+        }
+    }, [filteredItems.length, isLoading]);
+    const close = useCallback(() => {
+        setIsOpen(false);
+        setHighlightedIndex(-1);
+    }, []);
+    const select = useCallback((value) => {
+        const option = allItems.find((opt) => opt.value === value);
+        if (option) {
+            setSelectedValue(value);
+            setInputValueState(option.label);
+            onValueChange?.(value);
+            close();
+        }
+        else if (allowCustomValue) {
+            setSelectedValue(value);
+            setInputValueState(value);
+            onValueChange?.(value);
+            close();
+        }
+    }, [allItems, allowCustomValue, onValueChange, close]);
+    const clear = useCallback(() => {
+        setSelectedValue(undefined);
+        setInputValueState("");
+        onValueChange?.(undefined);
+        close();
+    }, [onValueChange, close]);
+    const setInputValue = useCallback((value) => {
+        setInputValueState(value);
+        if (value.trim() && (filteredItems.length > 0 || isLoading)) {
+            setIsOpen(true);
+        }
+        else if (!value.trim()) {
+            setIsOpen(false);
+        }
+    }, [filteredItems.length, isLoading]);
+    // Helpers de props
+    const getInputProps = useCallback((props = {}) => {
+        const highlightedItem = filteredItems[highlightedIndex];
+        const activeDescendant = highlightedItem
+            ? `${listId}-item-${highlightedItem.value}`
+            : undefined;
+        const handleFocus = (e) => {
+            open();
+            props.onFocus?.(e);
+        };
+        const handleBlur = (e) => {
+            // Delay para permitir cliques nos items
+            setTimeout(() => {
+                // Não fechar o popover no onBlur - deixar o Popover gerenciar o fechamento
+                // O Popover do Radix UI já gerencia o fechamento quando você clica fora
+                // via onOpenChange. Fechar aqui causa conflito e comportamento inconsistente.
+                props.onBlur?.(e);
+            }, 200);
+        };
+        return {
+            ...props,
+            value: inputValue,
+            onChange: (e) => {
+                setInputValue(e.target.value);
+                props.onChange?.(e);
+            },
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+            onKeyDown: (e) => {
+                if (e.key === "ArrowDown") {
+                    e.preventDefault();
+                    if (isOpen) {
+                        setHighlightedIndex((prev) => prev < filteredItems.length - 1 ? prev + 1 : prev);
+                    }
+                    else {
+                        open();
+                    }
+                }
+                else if (e.key === "ArrowUp") {
+                    e.preventDefault();
+                    if (isOpen) {
+                        setHighlightedIndex((prev) => (prev > 0 ? prev - 1 : -1));
+                    }
+                }
+                else if (e.key === "Enter") {
+                    e.preventDefault();
+                    if (isOpen && highlightedItem) {
+                        select(highlightedItem.value);
+                    }
+                    else if (isOpen && filteredItems.length === 1) {
+                        select(filteredItems[0].value);
+                    }
+                    else if (allowCustomValue && inputValue.trim()) {
+                        select(inputValue);
+                    }
+                }
+                else if (e.key === "Escape") {
+                    e.preventDefault();
+                    close();
+                }
+                props.onKeyDown?.(e);
+            },
+            "aria-expanded": isOpen,
+            "aria-autocomplete": "list",
+            "aria-controls": listId,
+            "aria-activedescendant": activeDescendant,
+            role: "combobox",
+        };
+    }, [
+        inputValue,
+        isOpen,
+        filteredItems,
+        highlightedIndex,
+        listId,
+        open,
+        close,
+        select,
+        allowCustomValue,
+    ]);
+    const getPopoverProps = useCallback((props = {}) => {
+        return {
+            ...props,
+            "aria-label": "Lista de opções",
+            role: "listbox",
+        };
+    }, []);
+    const getListProps = useCallback((props = {}) => {
+        return {
+            ...props,
+            id: listId,
+            role: "listbox",
+            "aria-label": "Opções disponíveis",
+        };
+    }, [listId]);
+    const getItemProps = useCallback((item, props = {}) => {
+        const itemId = `${listId}-item-${item.value}`;
+        const isSelected = selectedValue === item.value;
+        const isHighlighted = filteredItems[highlightedIndex]?.value === item.value;
+        const handleClick = (e) => {
+            if (!item.disabled) {
+                select(item.value);
+            }
+            props.onClick?.(e);
+        };
+        const handleMouseEnter = (e) => {
+            const index = filteredItems.findIndex((i) => i.value === item.value);
+            if (index >= 0) {
+                setHighlightedIndex(index);
+            }
+            props.onMouseEnter?.(e);
+        };
+        return {
+            ...props,
+            role: "option",
+            "aria-selected": isSelected,
+            "aria-disabled": item.disabled ?? false,
+            id: itemId,
+            onClick: handleClick,
+            onMouseEnter: handleMouseEnter,
+            className: `${props.className || ""} ${isHighlighted ? "bg-accent" : ""} ${isSelected ? "font-semibold" : ""}`.trim(),
+        };
+    }, [listId, selectedValue, filteredItems, highlightedIndex, select]);
+    return {
+        inputValue,
+        selectedValue,
+        isOpen,
+        filteredItems,
+        highlightedIndex,
+        isLoading,
+        isEmpty,
+        open,
+        close,
+        select,
+        clear,
+        setInputValue,
+        getInputProps,
+        getPopoverProps,
+        getListProps,
+        getItemProps,
+        extractItemsFromChildren,
+    };
+}

package/dist/hooks/useDashboardLayout/index.d.ts

@@ -0,0 +1,3 @@
+export type { UseDashboardLayoutProps, UseDashboardLayoutReturn, WidgetLayout, GridConfig, } from "./useDashboardLayout";
+export { useDashboardLayout } from "./useDashboardLayout";
+//# sourceMappingURL=index.d.ts.map

package/dist/hooks/useDashboardLayout/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/useDashboardLayout/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACX,uBAAuB,EACvB,wBAAwB,EACxB,YAAY,EACZ,UAAU,GACV,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/hooks/useDashboardLayout/index.js

@@ -0,0 +1 @@
+export { useDashboardLayout } from "./useDashboardLayout";