@rio-cloud/rio-uikit 2.5.0 → 3.0.0-beta.1

package/hooks/useTableSelection.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTableSelection.js","sources":["../../src/hooks/useTableSelection.ts"],"sourcesContent":["import { useState, useRef, useCallback, useEffect } from 'react';\n\n/**\n * CSS class applied to the currently active row.\n */\nexport const ACTIVE_CLASS = 'active';\n\n/**\n * Default HTML data attribute name used to store the unique ID on table row elements.\n */\nexport const DEFAULT_DATA_ATTRIBUTE = 'data-id';\n\n// Default classes for the checkbox and action cells\nexport const DEFAULT_TABLE_CHECKBOX_CELL_CLASS = '.table-checkbox';\nexport const DEFAULT_TABLE_ACTION_CELL_CLASS = '.table-action';\n\n/**\n * Options for the `useTableSelection` hook.\n */\nexport type UseTableSelectionOptions<TData extends Record<string, any>> = {\n    /**\n     * The array of data items to be displayed in the table.\n     * The hook uses this to determine all possible row IDs for \"select all\" functionality.\n     */\n    tableData: TData[];\n\n    /**\n     * The key in `TData` objects that serves as the unique identifier for each row.\n     */\n    idKey: keyof TData;\n\n    /**\n     * Optional array of row IDs that should be initially selected.\n     */\n    initialSelectedRowIds?: string[];\n\n    /**\n     * Optional ID of the row that should be initially marked as active.\n     */\n    initialActiveRowId?: string;\n\n    // customize reference values\n\n    /**\n     * Optional CSS query selector to find the checkbox input element within each table row.\n     * @default '.table-checkbox input[type=\"checkbox\"]'\n     */\n    checkboxQuerySelector?: string;\n\n    /**\n     * Optional name of the HTML data attribute on `<tr>` elements that holds the unique row ID.\n     * @default 'data-id' (matches DEFAULT_DATA_ATTRIBUTE)\n     */\n    dataAttributeName?: string;\n\n    /**\n     * Optional external ref for the table element. If not provided, the hook creates its own.\n     * Useful if the parent component needs direct access to the table DOM element for other purposes.\n     */\n    ref?: React.RefObject<HTMLTableElement>;\n};\n\n/**\n * Return value of the `useTableSelection` hook.\n */\nexport type UseTableSelectionReturn = {\n    /**\n     * React ref attached to the `<table>` HTML element.\n     * Ensure this ref is assigned to your table element to enable DOM manipulations.\n     */\n    tableRef: React.RefObject<HTMLTableElement>;\n\n    /**\n     * An array of strings, where each string is the ID of a currently selected row.\n     */\n    selectedRowIds: string[];\n\n    /**\n     * The ID of the currently active row. An empty string signifies no row is active.\n     */\n    activeRowId: string;\n\n    /**\n     * Callback handler to be attached to the click/change event of individual row selection UI elements (e.g., checkboxes).\n     * It expects the clicked element to be within a `<tr>` that has the specified `dataAttributeName`.\n     * Manages the selection state of a single row.\n     *\n     * @param event The React mouse event from the selection UI element.\n     */\n    onSelection: (event: React.MouseEvent<HTMLElement>) => void;\n\n    /**\n     * Callback handler to be attached to the click event of table row (`<tr>`) elements.\n     * Manages the active row state.\n     * @param event The React mouse event from the `<tr>` element.\n     */\n    onActiveRowChange: (event: React.MouseEvent<HTMLTableRowElement>) => void;\n\n    /**\n     * Callback handler to select or deselect all rows.\n     * @param shouldSelect If true, all rows in `tableData` will be selected; otherwise, all selections will be cleared.\n     */\n    onToggleAll: (shouldSelect: boolean) => void;\n\n    /**\n     * Function to update row selection and active highlighting. This is useful when the row data changes due to a search value\n     * or any other filter.\n     *\n     * @returns\n     */\n    updateRowSelection: () => void;\n\n    /**\n     * Setter function to change selected rows from the outside in a controlled manner.\n     *\n     * @param rowIds\n     * @returns\n     */\n    setSelectedRowIds: (rowIds: string[]) => void;\n\n    /**\n     * Setter function to change the active row from the outside in a controlled manner.\n     * Use this to deselect an active row.\n     *\n     * @param activeRowId\n     * @returns\n     */\n    setActiveRowId: (activeRowId: string | undefined) => void;\n\n    /**\n     * A boolean indicating whether at least one row is currently selected.\n     */\n    hasSelection: boolean;\n\n    /**\n     * A boolean indicating whether all rows in the current `tableData` are selected.\n     */\n    isAllSelected: boolean;\n};\n\n/**\n * A React hook to manage row selection and active row state for an HTML table,\n * including DOM manipulations for visual feedback to optimize performance by\n * preventing individual row re-renders.\n *\n * @param {UseTableSelectionOptions<TData>} options The configuration properties for the hook.\n * @returns {UseTableSelectionReturn} The state and handlers for managing table selection and active row.\n */\nconst useTableSelection = <TData extends Record<string, any>>(\n    props: UseTableSelectionOptions<TData>\n): UseTableSelectionReturn => {\n    const {\n        tableData,\n        idKey,\n        initialSelectedRowIds = [],\n        initialActiveRowId = '',\n        checkboxQuerySelector = '.table-checkbox input[type=\"checkbox\"]',\n        dataAttributeName = DEFAULT_DATA_ATTRIBUTE,\n        ref,\n    } = props;\n\n    const [selectedRowIds, setSelectedRowIds] = useState<string[]>(initialSelectedRowIds);\n    const [activeRowId, setActiveRowId] = useState<string>(initialActiveRowId);\n    const [lastActiveRowId, setLastActiveRowId] = useState<string>(initialActiveRowId);\n\n    const internalTableRef = useRef<HTMLTableElement>(null);\n    const tableRef = ref ?? internalTableRef;\n\n    // --- DOM Manipulation Effect (The performance workaround) ---\n    /**\n     * Effect to handle DOM manipulations for active row highlighting and ensuring\n     * checkboxes for selected rows are visually checked.\n     * This effect runs when active row state or selection state changes.\n     * Note: This effect currently only *selects* rows based on `selectedRowIds`.\n     * Deselection in the DOM is handled directly by `onSelection` and `onToggleAll` handlers.\n     * For a more centralized DOM update, this effect could be expanded to handle deselection as well.\n     */\n    useEffect(() => {\n        updateRowSelection();\n    }, [activeRowId, lastActiveRowId, selectedRowIds]); // Rerun when these change\n\n    const updateRowSelection = () => {\n        if (!tableRef.current) {\n            return;\n        }\n\n        const rows = [...tableRef.current.rows] as HTMLTableRowElement[];\n\n        if (lastActiveRowId !== activeRowId) {\n            // Due to performance reasons the individual rows should not re-render when the\n            // selected driver changes, hence we need to avoid passing that information as props\n            // to the row component otherwise it would re-render as the props have changed.\n            // Instead, we check here which row to highlight.\n            removeHighlightFromRow(rows, lastActiveRowId, dataAttributeName);\n            highlightRow(rows, activeRowId, dataAttributeName);\n        }\n\n        // handle multi-selection\n        selectedRowIds.forEach(rowId => {\n            selectRow(rows, rowId, dataAttributeName, checkboxQuerySelector);\n        });\n    };\n\n    const handleActiveRowChange = useCallback((event: React.MouseEvent<HTMLTableRowElement>) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        const targetRow = event.currentTarget;\n        const rowId = targetRow.getAttribute(dataAttributeName) ?? '';\n\n        // Avoid activation if click is on checkbox/action area (more robust check needed if complex row structure)\n        const clickedElement = event.target as HTMLElement;\n        const isCheckboxCell = clickedElement.closest(DEFAULT_TABLE_CHECKBOX_CELL_CLASS);\n        const isActionCell = clickedElement.closest(DEFAULT_TABLE_ACTION_CELL_CLASS);\n        if (isCheckboxCell || isActionCell) {\n            return;\n        }\n\n        changeActiveRow(rowId);\n    }, []);\n\n    const changeActiveRow = (rowId = '') => {\n        setActiveRowId(currentActiveRow => {\n            const newActiveRowId = currentActiveRow === rowId ? '' : rowId;\n            setLastActiveRowId(currentActiveRow); // Update lastActive for the effect\n            return newActiveRowId;\n        });\n    };\n\n    const handleSelection = useCallback((event: React.MouseEvent<HTMLElement>) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        // Find the correct row element containing the data attribute\n        const rowElement = (event.target as HTMLElement).closest(`tr[${dataAttributeName}]`);\n        const selectedRowId = rowElement?.getAttribute(dataAttributeName);\n\n        if (!selectedRowId) {\n            console.warn('Could not find row ID for selection event.');\n            return;\n        }\n\n        setSelectedRowIds(prevSelectedRowIds => {\n            if (prevSelectedRowIds.includes(selectedRowId)) {\n                deselectRows([selectedRowId]);\n                return prevSelectedRowIds.filter(id => id !== selectedRowId);\n            }\n            return [...prevSelectedRowIds, selectedRowId];\n        });\n    }, []);\n\n    const handleToggleAll = useCallback(\n        (shouldSelect: boolean) => {\n            const allRowIds = tableData.map(row => `${row[idKey]}`);\n            setSelectedRowIds(shouldSelect ? allRowIds : []);\n\n            // Deselect all rows when there is at least one row selected, else select all rows\n            if (shouldSelect) {\n                setSelectedRowIds(allRowIds);\n            } else {\n                setSelectedRowIds([]);\n                deselectRows(allRowIds);\n\n                for (const id in allRowIds) {\n                    const rows = tableRef.current ? [...tableRef.current.rows] : [];\n                    deselectRow([...rows] as HTMLTableRowElement[], id, dataAttributeName, checkboxQuerySelector);\n                }\n            }\n            // DOM updates are handled by useEffect -> updateRowsDOM\n        },\n        [tableData]\n    );\n\n    const deselectRows = (rowIds: string[]) => {\n        const rows = tableRef.current ? [...tableRef.current.rows] : [];\n        rowIds.forEach(rowId => {\n            deselectRow(rows, rowId, dataAttributeName, checkboxQuerySelector);\n        });\n    };\n\n    const hasSelection = selectedRowIds.length > 0;\n    const isAllSelected = hasSelection && selectedRowIds.length === tableData.length && tableData.length > 0;\n\n    // --- Return hook state and handlers ---\n    return {\n        tableRef,\n        selectedRowIds,\n        activeRowId,\n        onSelection: handleSelection,\n        onActiveRowChange: handleActiveRowChange,\n        onToggleAll: handleToggleAll,\n        updateRowSelection,\n        setSelectedRowIds: (rowIds: string[]) => setSelectedRowIds(rowIds),\n        setActiveRowId: (activeRowId: string | undefined) => changeActiveRow(activeRowId),\n        hasSelection,\n        isAllSelected,\n    };\n};\n\n/**\n * Finds a table row element by its data attribute value.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param value The value of the data attribute to find.\n * @param attribute The name of the data attribute (e.g., 'data-id').\n * @returns The found HTMLTableRowElement or undefined.\n */\nexport const getRowByDataAttribute = (\n    rows: HTMLTableRowElement[],\n    value: string | null | undefined,\n    attribute: string\n): HTMLTableRowElement | undefined => {\n    if (!value) {\n        return;\n    }\n    return rows.find(row => row.getAttribute(attribute) === value);\n};\n\n/**\n * Adds an \"active\" class to a specified table row.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to highlight.\n * @param dataAttributeName The data attribute used to identify the row.\n */\nexport const highlightRow = (rows: HTMLTableRowElement[], rowId: string | null, dataAttributeName: string) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttributeName);\n    row?.classList.add(ACTIVE_CLASS);\n};\n\n/**\n * Removes the \"active\" class from a specified table row.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to unhighlight.\n * @param dataAttributeName The data attribute used to identify the row.\n */\nexport const removeHighlightFromRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string | null,\n    dataAttributeName: string\n) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttributeName);\n    row?.classList.remove(ACTIVE_CLASS);\n};\n\n// Helper to get the checkbox input for a single row\nconst getCheckboxFromRow = (row: HTMLTableRowElement, checkboxQuerySelector: string): HTMLInputElement | null =>\n    row.querySelector(checkboxQuerySelector);\n\n/**\n * Sets the checked state of a checkbox within a specific table row.\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to target (value of dataAttribute).\n * @param dataAttribute The data attribute used to identify the row.\n * @param checkboxQuerySelector A CSS selector to find the checkbox input within the row.\n * @param isChecked The desired checked state (true for checked, false for unchecked).\n */\nexport const setRowCheckboxState = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string,\n    isChecked: boolean\n) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttribute);\n    if (row) {\n        const checkbox = getCheckboxFromRow(row, checkboxQuerySelector);\n        if (checkbox) {\n            checkbox.checked = isChecked;\n        }\n    }\n};\n\n/**\n * Marks a specific row as selected by checking its checkbox.\n */\nexport const selectRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string\n) => {\n    setRowCheckboxState(rows, rowId, dataAttribute, checkboxQuerySelector, true);\n};\n\n/**\n * Marks a specific row as deselected by unchecking its checkbox.\n */\nexport const deselectRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string\n) => {\n    setRowCheckboxState(rows, rowId, dataAttribute, checkboxQuerySelector, false);\n};\n\nexport default useTableSelection;\n"],"names":["ACTIVE_CLASS","DEFAULT_DATA_ATTRIBUTE","DEFAULT_TABLE_CHECKBOX_CELL_CLASS","DEFAULT_TABLE_ACTION_CELL_CLASS","useTableSelection","props","tableData","idKey","initialSelectedRowIds","initialActiveRowId","checkboxQuerySelector","dataAttributeName","ref","selectedRowIds","setSelectedRowIds","useState","activeRowId","setActiveRowId","lastActiveRowId","setLastActiveRowId","internalTableRef","useRef","tableRef","useEffect","updateRowSelection","rows","removeHighlightFromRow","highlightRow","rowId","selectRow","handleActiveRowChange","useCallback","event","clickedElement","isCheckboxCell","isActionCell","changeActiveRow","currentActiveRow","newActiveRowId","handleSelection","selectedRowId","prevSelectedRowIds","deselectRows","id","handleToggleAll","shouldSelect","allRowIds","row","deselectRow","rowIds","hasSelection","isAllSelected","getRowByDataAttribute","value","attribute","getCheckboxFromRow","setRowCheckboxState","dataAttribute","isChecked","checkbox"],"mappings":"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"}
+{"version":3,"file":"useTableSelection.js","names":[],"sources":["../../src/hooks/useTableSelection.ts"],"sourcesContent":["import { useState, useRef, useCallback, useEffect } from 'react';\n\n/**\n * CSS class applied to the currently active row.\n */\nexport const ACTIVE_CLASS = 'active';\n\n/**\n * Default HTML data attribute name used to store the unique ID on table row elements.\n */\nexport const DEFAULT_DATA_ATTRIBUTE = 'data-id';\n\n// Default classes for the checkbox and action cells\nexport const DEFAULT_TABLE_CHECKBOX_CELL_CLASS = '.table-checkbox';\nexport const DEFAULT_TABLE_ACTION_CELL_CLASS = '.table-action';\n\n/**\n * Options for the `useTableSelection` hook.\n */\nexport type UseTableSelectionOptions<TData extends Record<string, any>> = {\n    /**\n     * The array of data items to be displayed in the table.\n     * The hook uses this to determine all possible row IDs for \"select all\" functionality.\n     */\n    tableData: TData[];\n\n    /**\n     * The key in `TData` objects that serves as the unique identifier for each row.\n     */\n    idKey: keyof TData;\n\n    /**\n     * Optional array of row IDs that should be initially selected.\n     */\n    initialSelectedRowIds?: string[];\n\n    /**\n     * Optional ID of the row that should be initially marked as active.\n     */\n    initialActiveRowId?: string;\n\n    // customize reference values\n\n    /**\n     * Optional CSS query selector to find the checkbox input element within each table row.\n     * @default '.table-checkbox input[type=\"checkbox\"]'\n     */\n    checkboxQuerySelector?: string;\n\n    /**\n     * Optional name of the HTML data attribute on `<tr>` elements that holds the unique row ID.\n     * @default 'data-id' (matches DEFAULT_DATA_ATTRIBUTE)\n     */\n    dataAttributeName?: string;\n\n    /**\n     * Optional external ref for the table element. If not provided, the hook creates its own.\n     * Useful if the parent component needs direct access to the table DOM element for other purposes.\n     */\n    ref?: React.RefObject<HTMLTableElement | null>;\n};\n\n/**\n * Return value of the `useTableSelection` hook.\n */\nexport type UseTableSelectionReturn = {\n    /**\n     * React ref attached to the `<table>` HTML element.\n     * Ensure this ref is assigned to your table element to enable DOM manipulations.\n     */\n    tableRef: React.RefObject<HTMLTableElement | null>;\n\n    /**\n     * An array of strings, where each string is the ID of a currently selected row.\n     */\n    selectedRowIds: string[];\n\n    /**\n     * The ID of the currently active row. An empty string signifies no row is active.\n     */\n    activeRowId: string;\n\n    /**\n     * Callback handler to be attached to the click/change event of individual row selection UI elements (e.g., checkboxes).\n     * It expects the clicked element to be within a `<tr>` that has the specified `dataAttributeName`.\n     * Manages the selection state of a single row.\n     *\n     * @param event The React mouse event from the selection UI element.\n     */\n    onSelection: (event: React.MouseEvent<HTMLElement>) => void;\n\n    /**\n     * Callback handler to be attached to the click event of table row (`<tr>`) elements.\n     * Manages the active row state.\n     * @param event The React mouse event from the `<tr>` element.\n     */\n    onActiveRowChange: (event: React.MouseEvent<HTMLTableRowElement>) => void;\n\n    /**\n     * Callback handler to select or deselect all rows.\n     * @param shouldSelect If true, all rows in `tableData` will be selected; otherwise, all selections will be cleared.\n     */\n    onToggleAll: (shouldSelect: boolean) => void;\n\n    /**\n     * Function to update row selection and active highlighting. This is useful when the row data changes due to a search value\n     * or any other filter.\n     *\n     * @returns\n     */\n    updateRowSelection: () => void;\n\n    /**\n     * Setter function to change selected rows from the outside in a controlled manner.\n     *\n     * @param rowIds\n     * @returns\n     */\n    setSelectedRowIds: (rowIds: string[]) => void;\n\n    /**\n     * Setter function to change the active row from the outside in a controlled manner.\n     * Use this to deselect an active row.\n     *\n     * @param activeRowId\n     * @returns\n     */\n    setActiveRowId: (activeRowId: string | undefined) => void;\n\n    /**\n     * A boolean indicating whether at least one row is currently selected.\n     */\n    hasSelection: boolean;\n\n    /**\n     * A boolean indicating whether all rows in the current `tableData` are selected.\n     */\n    isAllSelected: boolean;\n};\n\n/**\n * A React hook to manage row selection and active row state for an HTML table,\n * including DOM manipulations for visual feedback to optimize performance by\n * preventing individual row re-renders.\n *\n * @param {UseTableSelectionOptions<TData>} options The configuration properties for the hook.\n * @returns {UseTableSelectionReturn} The state and handlers for managing table selection and active row.\n */\nconst useTableSelection = <TData extends Record<string, any>>(\n    props: UseTableSelectionOptions<TData>\n): UseTableSelectionReturn => {\n    const {\n        tableData,\n        idKey,\n        initialSelectedRowIds = [],\n        initialActiveRowId = '',\n        checkboxQuerySelector = '.table-checkbox input[type=\"checkbox\"]',\n        dataAttributeName = DEFAULT_DATA_ATTRIBUTE,\n        ref,\n    } = props;\n\n    const [selectedRowIds, setSelectedRowIds] = useState<string[]>(initialSelectedRowIds);\n    const [activeRowId, setActiveRowId] = useState<string>(initialActiveRowId);\n    const [lastActiveRowId, setLastActiveRowId] = useState<string>(initialActiveRowId);\n\n    const internalTableRef = useRef<HTMLTableElement>(null);\n    const tableRef = ref ?? internalTableRef;\n\n    // --- DOM Manipulation Effect (The performance workaround) ---\n    /**\n     * Effect to handle DOM manipulations for active row highlighting and ensuring\n     * checkboxes for selected rows are visually checked.\n     * This effect runs when active row state or selection state changes.\n     * Note: This effect currently only *selects* rows based on `selectedRowIds`.\n     * Deselection in the DOM is handled directly by `onSelection` and `onToggleAll` handlers.\n     * For a more centralized DOM update, this effect could be expanded to handle deselection as well.\n     */\n    useEffect(() => {\n        updateRowSelection();\n    }, [activeRowId, lastActiveRowId, selectedRowIds]); // Rerun when these change\n\n    const updateRowSelection = () => {\n        if (!tableRef.current) {\n            return;\n        }\n\n        const rows = [...tableRef.current.rows] as HTMLTableRowElement[];\n\n        if (lastActiveRowId !== activeRowId) {\n            // Due to performance reasons the individual rows should not re-render when the\n            // selected driver changes, hence we need to avoid passing that information as props\n            // to the row component otherwise it would re-render as the props have changed.\n            // Instead, we check here which row to highlight.\n            removeHighlightFromRow(rows, lastActiveRowId, dataAttributeName);\n            highlightRow(rows, activeRowId, dataAttributeName);\n        }\n\n        // handle multi-selection\n        selectedRowIds.forEach(rowId => {\n            selectRow(rows, rowId, dataAttributeName, checkboxQuerySelector);\n        });\n    };\n\n    const handleActiveRowChange = useCallback((event: React.MouseEvent<HTMLTableRowElement>) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        const targetRow = event.currentTarget;\n        const rowId = targetRow.getAttribute(dataAttributeName) ?? '';\n\n        // Avoid activation if click is on checkbox/action area (more robust check needed if complex row structure)\n        const clickedElement = event.target as HTMLElement;\n        const isCheckboxCell = clickedElement.closest(DEFAULT_TABLE_CHECKBOX_CELL_CLASS);\n        const isActionCell = clickedElement.closest(DEFAULT_TABLE_ACTION_CELL_CLASS);\n        if (isCheckboxCell || isActionCell) {\n            return;\n        }\n\n        changeActiveRow(rowId);\n    }, []);\n\n    const changeActiveRow = (rowId = '') => {\n        setActiveRowId(currentActiveRow => {\n            const newActiveRowId = currentActiveRow === rowId ? '' : rowId;\n            setLastActiveRowId(currentActiveRow); // Update lastActive for the effect\n            return newActiveRowId;\n        });\n    };\n\n    const handleSelection = useCallback((event: React.MouseEvent<HTMLElement>) => {\n        event.preventDefault();\n        event.stopPropagation();\n\n        // Find the correct row element containing the data attribute\n        const rowElement = (event.target as HTMLElement).closest(`tr[${dataAttributeName}]`);\n        const selectedRowId = rowElement?.getAttribute(dataAttributeName);\n\n        if (!selectedRowId) {\n            console.warn('Could not find row ID for selection event.');\n            return;\n        }\n\n        setSelectedRowIds(prevSelectedRowIds => {\n            if (prevSelectedRowIds.includes(selectedRowId)) {\n                deselectRows([selectedRowId]);\n                return prevSelectedRowIds.filter(id => id !== selectedRowId);\n            }\n            return [...prevSelectedRowIds, selectedRowId];\n        });\n    }, []);\n\n    const handleToggleAll = useCallback(\n        (shouldSelect: boolean) => {\n            const allRowIds = tableData.map(row => `${row[idKey]}`);\n            setSelectedRowIds(shouldSelect ? allRowIds : []);\n\n            // Deselect all rows when there is at least one row selected, else select all rows\n            if (shouldSelect) {\n                setSelectedRowIds(allRowIds);\n            } else {\n                setSelectedRowIds([]);\n                deselectRows(allRowIds);\n\n                for (const id in allRowIds) {\n                    const rows = tableRef.current ? [...tableRef.current.rows] : [];\n                    deselectRow([...rows] as HTMLTableRowElement[], id, dataAttributeName, checkboxQuerySelector);\n                }\n            }\n            // DOM updates are handled by useEffect -> updateRowsDOM\n        },\n        [tableData]\n    );\n\n    const deselectRows = (rowIds: string[]) => {\n        const rows = tableRef.current ? [...tableRef.current.rows] : [];\n        rowIds.forEach(rowId => {\n            deselectRow(rows, rowId, dataAttributeName, checkboxQuerySelector);\n        });\n    };\n\n    const hasSelection = selectedRowIds.length > 0;\n    const isAllSelected = hasSelection && selectedRowIds.length === tableData.length && tableData.length > 0;\n\n    // --- Return hook state and handlers ---\n    return {\n        tableRef,\n        selectedRowIds,\n        activeRowId,\n        onSelection: handleSelection,\n        onActiveRowChange: handleActiveRowChange,\n        onToggleAll: handleToggleAll,\n        updateRowSelection,\n        setSelectedRowIds: (rowIds: string[]) => setSelectedRowIds(rowIds),\n        setActiveRowId: (activeRowId: string | undefined) => changeActiveRow(activeRowId),\n        hasSelection,\n        isAllSelected,\n    };\n};\n\n/**\n * Finds a table row element by its data attribute value.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param value The value of the data attribute to find.\n * @param attribute The name of the data attribute (e.g., 'data-id').\n * @returns The found HTMLTableRowElement or undefined.\n */\nexport const getRowByDataAttribute = (\n    rows: HTMLTableRowElement[],\n    value: string | null | undefined,\n    attribute: string\n): HTMLTableRowElement | undefined => {\n    if (!value) {\n        return;\n    }\n    return rows.find(row => row.getAttribute(attribute) === value);\n};\n\n/**\n * Adds an \"active\" class to a specified table row.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to highlight.\n * @param dataAttributeName The data attribute used to identify the row.\n */\nexport const highlightRow = (rows: HTMLTableRowElement[], rowId: string | null, dataAttributeName: string) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttributeName);\n    row?.classList.add(ACTIVE_CLASS);\n};\n\n/**\n * Removes the \"active\" class from a specified table row.\n *\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to unhighlight.\n * @param dataAttributeName The data attribute used to identify the row.\n */\nexport const removeHighlightFromRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string | null,\n    dataAttributeName: string\n) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttributeName);\n    row?.classList.remove(ACTIVE_CLASS);\n};\n\n// Helper to get the checkbox input for a single row\nconst getCheckboxFromRow = (row: HTMLTableRowElement, checkboxQuerySelector: string): HTMLInputElement | null =>\n    row.querySelector(checkboxQuerySelector);\n\n/**\n * Sets the checked state of a checkbox within a specific table row.\n * @param rows Array of HTMLTableRowElements to search within.\n * @param rowId The ID of the row to target (value of dataAttribute).\n * @param dataAttribute The data attribute used to identify the row.\n * @param checkboxQuerySelector A CSS selector to find the checkbox input within the row.\n * @param isChecked The desired checked state (true for checked, false for unchecked).\n */\nexport const setRowCheckboxState = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string,\n    isChecked: boolean\n) => {\n    const row = getRowByDataAttribute(rows, rowId, dataAttribute);\n    if (row) {\n        const checkbox = getCheckboxFromRow(row, checkboxQuerySelector);\n        if (checkbox) {\n            checkbox.checked = isChecked;\n        }\n    }\n};\n\n/**\n * Marks a specific row as selected by checking its checkbox.\n */\nexport const selectRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string\n) => {\n    setRowCheckboxState(rows, rowId, dataAttribute, checkboxQuerySelector, true);\n};\n\n/**\n * Marks a specific row as deselected by unchecking its checkbox.\n */\nexport const deselectRow = (\n    rows: HTMLTableRowElement[],\n    rowId: string,\n    dataAttribute: string,\n    checkboxQuerySelector: string\n) => {\n    setRowCheckboxState(rows, rowId, dataAttribute, checkboxQuerySelector, false);\n};\n\nexport default useTableSelection;\n"],"mappings":"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"}

package/hooks/useTimeout.js

@@ -1,41 +1,37 @@
-import { useRef as m, useMemo as T, useEffect as l } from "react";
-const f = (s, t) => {
-  const e = m(null), c = m(s);
-  return l(() => {
-    c.current = s;
-  }, [s]), l(() => {
-    const n = () => c.current();
-    if (typeof t == "number")
-      return e.current = setTimeout(n, t), () => {
-        e.current !== null && clearTimeout(e.current);
-      };
-  }, [t]), e;
-}, _ = () => {
-  const t = (u, i, o) => {
-    const r = o - Date.now();
-    u.current = r <= 2147483647 ? setTimeout(i, r) : setTimeout(() => t(u, i, o), 2147483647);
-  }, e = m(null), { set: c, clear: n } = T(() => {
-    const u = () => clearTimeout(e.current);
-    return {
-      set: (o, r = 0) => {
-        u(), r <= 2147483647 ? e.current = setTimeout(o, r) : t(e, o, Date.now() + r);
-      },
-      clear: u
-    };
-  }, []);
-  return l(
-    () => () => {
-      n();
-    },
-    [n]
-  ), {
-    set: c,
-    clear: n,
-    handleRef: e
-  };
+import { useEffect as e, useMemo as t, useRef as n } from "react";
+//#region src/hooks/useTimeout.ts
+var r = (t, r) => {
+	let i = n(null), a = n(t);
+	return e(() => {
+		a.current = t;
+	}, [t]), e(() => {
+		let e = () => a.current();
+		if (typeof r == "number") return i.current = setTimeout(e, r), () => {
+			i.current !== null && clearTimeout(i.current);
+		};
+	}, [r]), i;
+}, i = () => {
+	let r = 2 ** 31 - 1, i = (e, t, n) => {
+		let a = n - Date.now();
+		e.current = a <= r ? setTimeout(t, a) : setTimeout(() => i(e, t, n), r);
+	}, a = n(null), { set: o, clear: s } = t(() => {
+		let e = () => clearTimeout(a.current);
+		return {
+			set: (t, n = 0) => {
+				e(), n <= r ? a.current = setTimeout(t, n) : i(a, t, Date.now() + n);
+			},
+			clear: e
+		};
+	}, []);
+	return e(() => () => {
+		s();
+	}, [s]), {
+		set: o,
+		clear: s,
+		handleRef: a
+	};
 };
-export {
-  f as default,
-  _ as useChainedTimeout
-};
-//# sourceMappingURL=useTimeout.js.map
+//#endregion
+export { r as default, i as useChainedTimeout };
+
+//# sourceMappingURL=useTimeout.js.map

package/hooks/useTimeout.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTimeout.js","sources":["../../src/hooks/useTimeout.ts"],"sourcesContent":["import type React from 'react';\nimport { useEffect, useMemo, useRef } from 'react';\n\n// See www.joshwcomeau.com/snippets/react-hooks/use-timeout/\n\n/**\n * A custom hook for handling timeout events.\n *\n * @param callback The callback function to execute after the timeout.\n * @param delay The duration of the timeout in milliseconds. Pass `null` to cancel the timeout.\n *\n * @returns A mutable ref object to manage the timeout ID.\n */\nconst useTimeout = (callback: () => void, delay: number | null): React.MutableRefObject<number | null> => {\n    const timeoutRef = useRef<number | null>(null);\n    const savedCallback = useRef<() => void>(callback);\n\n    // Update the saved callback when the callback prop changes\n    useEffect(() => {\n        savedCallback.current = callback;\n    }, [callback]);\n\n    // Set up the timeout when the delay changes\n    useEffect(() => {\n        const tick = () => savedCallback.current();\n\n        // If delay is a number, set up the timeout\n        if (typeof delay === 'number') {\n            timeoutRef.current = setTimeout(tick, delay) as unknown as number;\n\n            // Cleanup function to clear the timeout when delay changes or component unmounts\n            return () => {\n                if (timeoutRef.current !== null) {\n                    clearTimeout(timeoutRef.current);\n                }\n            };\n        }\n    }, [delay]);\n\n    return timeoutRef;\n};\n\nexport const useChainedTimeout = () => {\n    const MAX_DELAY_MS = 2 ** 31 - 1;\n\n    const setChainedTimeout = (ref: React.MutableRefObject<any>, fn: () => void, timeoutAtMs: number) => {\n        const delayMs = timeoutAtMs - Date.now();\n\n        ref.current =\n            delayMs <= MAX_DELAY_MS\n                ? setTimeout(fn, delayMs)\n                : setTimeout(() => setChainedTimeout(ref, fn, timeoutAtMs), MAX_DELAY_MS);\n    };\n\n    const handleRef = useRef<any>(null);\n\n    const { set, clear } = useMemo(() => {\n        const clear = () => clearTimeout(handleRef.current);\n\n        const set = (fn: () => void, delayMs = 0): void => {\n            clear();\n\n            if (delayMs <= MAX_DELAY_MS) {\n                // For simplicity, if the timeout is short, just set a normal timeout.\n                handleRef.current = setTimeout(fn, delayMs);\n            } else {\n                setChainedTimeout(handleRef, fn, Date.now() + delayMs);\n            }\n        };\n\n        return {\n            set,\n            clear,\n        };\n    }, []);\n\n    useEffect(\n        () => () => {\n            clear();\n        },\n        [clear]\n    );\n\n    return {\n        set,\n        clear,\n        handleRef,\n    };\n};\n\nexport default useTimeout;\n"],"names":["useTimeout","callback","delay","timeoutRef","useRef","savedCallback","useEffect","tick","useChainedTimeout","setChainedTimeout","ref","fn","timeoutAtMs","delayMs","handleRef","set","clear","useMemo"],"mappings":";AAaA,MAAMA,IAAa,CAACC,GAAsBC,MAAgE;AACtG,QAAMC,IAAaC,EAAsB,IAAI,GACvCC,IAAgBD,EAAmBH,CAAQ;AAGjD,SAAAK,EAAU,MAAM;AACZ,IAAAD,EAAc,UAAUJ;AAAA,EAC5B,GAAG,CAACA,CAAQ,CAAC,GAGbK,EAAU,MAAM;AACZ,UAAMC,IAAO,MAAMF,EAAc,QAAA;AAGjC,QAAI,OAAOH,KAAU;AACjB,aAAAC,EAAW,UAAU,WAAWI,GAAML,CAAK,GAGpC,MAAM;AACT,QAAIC,EAAW,YAAY,QACvB,aAAaA,EAAW,OAAO;AAAA,MAEvC;AAAA,EAER,GAAG,CAACD,CAAK,CAAC,GAEHC;AACX,GAEaK,IAAoB,MAAM;AAGnC,QAAMC,IAAoB,CAACC,GAAkCC,GAAgBC,MAAwB;AACjG,UAAMC,IAAUD,IAAc,KAAK,IAAA;AAEnC,IAAAF,EAAI,UACAG,KAAW,aACL,WAAWF,GAAIE,CAAO,IACtB,WAAW,MAAMJ,EAAkBC,GAAKC,GAAIC,CAAW,GAAG,UAAY;AAAA,EACpF,GAEME,IAAYV,EAAY,IAAI,GAE5B,EAAE,KAAAW,GAAK,OAAAC,EAAA,IAAUC,EAAQ,MAAM;AACjC,UAAMD,IAAQ,MAAM,aAAaF,EAAU,OAAO;AAalD,WAAO;AAAA,MACH,KAZQ,CAACH,GAAgBE,IAAU,MAAY;AAC/CG,QAAAA,EAAAA,GAEIH,KAAW,aAEXC,EAAU,UAAU,WAAWH,GAAIE,CAAO,IAE1CJ,EAAkBK,GAAWH,GAAI,KAAK,IAAA,IAAQE,CAAO;AAAA,MAE7D;AAAA,MAII,OAAAG;AAAAA,IAAA;AAAA,EAER,GAAG,CAAA,CAAE;AAEL,SAAAV;AAAA,IACI,MAAM,MAAM;AACR,MAAAU,EAAA;AAAA,IACJ;AAAA,IACA,CAACA,CAAK;AAAA,EAAA,GAGH;AAAA,IACH,KAAAD;AAAA,IACA,OAAAC;AAAA,IACA,WAAAF;AAAA,EAAA;AAER;"}
+{"version":3,"file":"useTimeout.js","names":[],"sources":["../../src/hooks/useTimeout.ts"],"sourcesContent":["import type React from 'react';\nimport { useEffect, useMemo, useRef } from 'react';\n\n// See www.joshwcomeau.com/snippets/react-hooks/use-timeout/\n\n/**\n * A custom hook for handling timeout events.\n *\n * @param callback The callback function to execute after the timeout.\n * @param delay The duration of the timeout in milliseconds. Pass `null` to cancel the timeout.\n *\n * @returns A mutable ref object to manage the timeout ID.\n */\nconst useTimeout = (callback: () => void, delay: number | null): React.MutableRefObject<number | null> => {\n    const timeoutRef = useRef<number | null>(null);\n    const savedCallback = useRef<() => void>(callback);\n\n    // Update the saved callback when the callback prop changes\n    useEffect(() => {\n        savedCallback.current = callback;\n    }, [callback]);\n\n    // Set up the timeout when the delay changes\n    useEffect(() => {\n        const tick = () => savedCallback.current();\n\n        // If delay is a number, set up the timeout\n        if (typeof delay === 'number') {\n            timeoutRef.current = setTimeout(tick, delay) as unknown as number;\n\n            // Cleanup function to clear the timeout when delay changes or component unmounts\n            return () => {\n                if (timeoutRef.current !== null) {\n                    clearTimeout(timeoutRef.current);\n                }\n            };\n        }\n    }, [delay]);\n\n    return timeoutRef;\n};\n\nexport const useChainedTimeout = () => {\n    const MAX_DELAY_MS = 2 ** 31 - 1;\n\n    const setChainedTimeout = (ref: React.MutableRefObject<any>, fn: () => void, timeoutAtMs: number) => {\n        const delayMs = timeoutAtMs - Date.now();\n\n        ref.current =\n            delayMs <= MAX_DELAY_MS\n                ? setTimeout(fn, delayMs)\n                : setTimeout(() => setChainedTimeout(ref, fn, timeoutAtMs), MAX_DELAY_MS);\n    };\n\n    const handleRef = useRef<any>(null);\n\n    const { set, clear } = useMemo(() => {\n        const clear = () => clearTimeout(handleRef.current);\n\n        const set = (fn: () => void, delayMs = 0): void => {\n            clear();\n\n            if (delayMs <= MAX_DELAY_MS) {\n                // For simplicity, if the timeout is short, just set a normal timeout.\n                handleRef.current = setTimeout(fn, delayMs);\n            } else {\n                setChainedTimeout(handleRef, fn, Date.now() + delayMs);\n            }\n        };\n\n        return {\n            set,\n            clear,\n        };\n    }, []);\n\n    useEffect(\n        () => () => {\n            clear();\n        },\n        [clear]\n    );\n\n    return {\n        set,\n        clear,\n        handleRef,\n    };\n};\n\nexport default useTimeout;\n"],"mappings":";;AAaA,IAAM,KAAc,GAAsB,MAAgE;CACtG,IAAM,IAAa,EAAsB,IAAI,GACvC,IAAgB,EAAmB,CAAQ;CAwBjD,OArBA,QAAgB;EACZ,EAAc,UAAU;CAC5B,GAAG,CAAC,CAAQ,CAAC,GAGb,QAAgB;EACZ,IAAM,UAAa,EAAc,QAAQ;EAGzC,IAAI,OAAO,KAAU,UAIjB,OAHA,EAAW,UAAU,WAAW,GAAM,CAAK,SAG9B;GACT,AAAI,EAAW,YAAY,QACvB,aAAa,EAAW,OAAO;EAEvC;CAER,GAAG,CAAC,CAAK,CAAC,GAEH;AACX,GAEa,UAA0B;CACnC,IAAM,IAAe,KAAK,KAAK,GAEzB,KAAqB,GAAkC,GAAgB,MAAwB;EACjG,IAAM,IAAU,IAAc,KAAK,IAAI;EAEvC,EAAI,UACA,KAAW,IACL,WAAW,GAAI,CAAO,IACtB,iBAAiB,EAAkB,GAAK,GAAI,CAAW,GAAG,CAAY;CACpF,GAEM,IAAY,EAAY,IAAI,GAE5B,EAAE,QAAK,aAAU,QAAc;EACjC,IAAM,UAAc,aAAa,EAAU,OAAO;EAalD,OAAO;GACH,MAZS,GAAgB,IAAU,MAAY;IAG/C,AAFA,EAAM,GAEF,KAAW,IAEX,EAAU,UAAU,WAAW,GAAI,CAAO,IAE1C,EAAkB,GAAW,GAAI,KAAK,IAAI,IAAI,CAAO;GAE7D;GAII;EACJ;CACJ,GAAG,CAAC,CAAC;CASL,OAPA,cACgB;EACR,EAAM;CACV,GACA,CAAC,CAAK,CACV,GAEO;EACH;EACA;EACA;CACJ;AACJ"}

package/hooks/useToggle.js

@@ -1,19 +1,20 @@
-import { useState as r, useCallback as t } from "react";
-const i = (l = !1) => {
-  const [n, e] = r(l), u = t((s) => {
-    e((f) => {
-      const o = !f;
-      return typeof s == "function" && s(o), o;
-    });
-  }, []), a = t(() => e(!0), []), c = t(() => e(!1), []);
-  return {
-    isToggled: n,
-    toggle: u,
-    enable: a,
-    disable: c
-  };
+import { useCallback as e, useState as t } from "react";
+//#region src/hooks/useToggle.ts
+var n = (n = !1) => {
+	let [r, i] = t(n);
+	return {
+		isToggled: r,
+		toggle: e((e) => {
+			i((t) => {
+				let n = !t;
+				return typeof e == "function" && e(n), n;
+			});
+		}, []),
+		enable: e(() => i(!0), []),
+		disable: e(() => i(!1), [])
+	};
 };
-export {
-  i as default
-};
-//# sourceMappingURL=useToggle.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useToggle.js.map

package/hooks/useToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"useToggle.js","sources":["../../src/hooks/useToggle.ts"],"sourcesContent":["import { useState, useCallback } from 'react';\n\n/**\n * Custom hook to handle toggle states.\n *\n * @param initialValue - The initial state of the toggle (default: false)\n * @returns An object with the current value, toggle function, and control functions\n */\nconst useToggle = (initialValue = false) => {\n    const [value, setValue] = useState<boolean>(initialValue);\n\n    // Handle actual custom callbacks functions and\n    // events when assigning this function to a button directly\n    const toggle = useCallback((eventOrCallback?: React.SyntheticEvent | ((newValue: boolean) => void)) => {\n        setValue(prev => {\n            const newValue = !prev;\n\n            if (typeof eventOrCallback === 'function') {\n                // Call the callback with the new value\n                eventOrCallback(newValue);\n            }\n\n            return newValue;\n        });\n    }, []);\n\n    const enable = useCallback(() => setValue(true), []);\n    const disable = useCallback(() => setValue(false), []);\n\n    return {\n        isToggled: value,\n        toggle,\n        enable,\n        disable,\n    };\n};\n\nexport default useToggle;\n"],"names":["useToggle","initialValue","value","setValue","useState","toggle","useCallback","eventOrCallback","prev","newValue","enable","disable"],"mappings":";AAQA,MAAMA,IAAY,CAACC,IAAe,OAAU;AACxC,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAkBH,CAAY,GAIlDI,IAASC,EAAY,CAACC,MAA2E;AACnG,IAAAJ,EAAS,CAAAK,MAAQ;AACb,YAAMC,IAAW,CAACD;AAElB,aAAI,OAAOD,KAAoB,cAE3BA,EAAgBE,CAAQ,GAGrBA;AAAA,IACX,CAAC;AAAA,EACL,GAAG,CAAA,CAAE,GAECC,IAASJ,EAAY,MAAMH,EAAS,EAAI,GAAG,CAAA,CAAE,GAC7CQ,IAAUL,EAAY,MAAMH,EAAS,EAAK,GAAG,CAAA,CAAE;AAErD,SAAO;AAAA,IACH,WAAWD;AAAA,IACX,QAAAG;AAAA,IACA,QAAAK;AAAA,IACA,SAAAC;AAAA,EAAA;AAER;"}
+{"version":3,"file":"useToggle.js","names":[],"sources":["../../src/hooks/useToggle.ts"],"sourcesContent":["import { useState, useCallback } from 'react';\n\n/**\n * Custom hook to handle toggle states.\n *\n * @param initialValue - The initial state of the toggle (default: false)\n * @returns An object with the current value, toggle function, and control functions\n */\nconst useToggle = (initialValue = false) => {\n    const [value, setValue] = useState<boolean>(initialValue);\n\n    // Handle actual custom callbacks functions and\n    // events when assigning this function to a button directly\n    const toggle = useCallback((eventOrCallback?: React.SyntheticEvent | ((newValue: boolean) => void)) => {\n        setValue(prev => {\n            const newValue = !prev;\n\n            if (typeof eventOrCallback === 'function') {\n                // Call the callback with the new value\n                eventOrCallback(newValue);\n            }\n\n            return newValue;\n        });\n    }, []);\n\n    const enable = useCallback(() => setValue(true), []);\n    const disable = useCallback(() => setValue(false), []);\n\n    return {\n        isToggled: value,\n        toggle,\n        enable,\n        disable,\n    };\n};\n\nexport default useToggle;\n"],"mappings":";;AAQA,IAAM,KAAa,IAAe,OAAU;CACxC,IAAM,CAAC,GAAO,KAAY,EAAkB,CAAY;CAoBxD,OAAO;EACH,WAAW;EACX,QAlBW,GAAa,MAA2E;GACnG,GAAS,MAAQ;IACb,IAAM,IAAW,CAAC;IAOlB,OALI,OAAO,KAAoB,cAE3B,EAAgB,CAAQ,GAGrB;GACX,CAAC;EACL,GAAG,CAAC,CAOA;EACA,QANW,QAAkB,EAAS,EAAI,GAAG,CAAC,CAM9C;EACA,SANY,QAAkB,EAAS,EAAK,GAAG,CAAC,CAMhD;CACJ;AACJ"}

package/hooks/useUncontrollable.js

@@ -1,18 +1,13 @@
-import { useRef as v, useState as m, useCallback as p } from "react";
-function R(t, o, s) {
-  const e = v(t !== void 0), [n, c] = m(o), r = t !== void 0, i = e.current;
-  return e.current = r, !r && i && n !== o && c(o), [
-    r ? t : n,
-    p(
-      (...P) => {
-        const [u, ...a] = P, f = s?.(u, ...a);
-        return c(u), f;
-      },
-      [s]
-    )
-  ];
+import { useCallback as e, useRef as t, useState as n } from "react";
+//#region src/hooks/useUncontrollable.ts
+function r(r, i, a) {
+	let o = t(r !== void 0), [s, c] = n(i), l = r !== void 0, u = o.current;
+	return o.current = l, !l && u && s !== i && c(i), [l ? r : s, e((...e) => {
+		let [t, ...n] = e, r = a?.(t, ...n);
+		return c(t), r;
+	}, [a])];
 }
-export {
-  R as useUncontrolledProp
-};
-//# sourceMappingURL=useUncontrollable.js.map
+//#endregion
+export { r as useUncontrolledProp };
+
+//# sourceMappingURL=useUncontrollable.js.map

package/hooks/useUncontrollable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUncontrollable.js","sources":["../../src/hooks/useUncontrollable.ts"],"sourcesContent":["/* eslint-disable prefer-arrow/prefer-arrow-functions */\n// forked from https://github.com/jquense/uncontrollable/blob/master/src/index.ts\nimport { useCallback, useRef, useState } from 'react';\n\n// biome-ignore lint/suspicious/noExplicitAny: unknown types\nexport type Handler = (value: any, ...args: any[]) => any;\n\nexport function defaultKey(key: string) {\n    return `default${key.charAt(0).toUpperCase()}${key.substr(1)}`;\n}\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue: TProp,\n    handler?: THandler\n): readonly [TProp, THandler];\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue?: TProp | undefined,\n    handler?: THandler\n): readonly [TProp | undefined, (...args: Parameters<THandler>) => ReturnType<THandler> | undefined];\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue: TProp | undefined,\n    handler?: THandler\n) {\n    const wasPropRef = useRef<boolean>(propValue !== undefined);\n    const [stateValue, setState] = useState<TProp | undefined>(defaultValue);\n\n    const isProp = propValue !== undefined;\n    const wasProp = wasPropRef.current;\n\n    wasPropRef.current = isProp;\n\n    /**\n     * If a prop switches from controlled to Uncontrolled\n     * reset its value to the defaultValue\n     */\n    if (!isProp && wasProp && stateValue !== defaultValue) {\n        setState(defaultValue);\n    }\n\n    return [\n        isProp ? propValue : stateValue,\n        useCallback(\n            (...args: Parameters<THandler>): ReturnType<THandler> | undefined => {\n                const [value, ...rest] = args;\n                const returnValue = handler?.(value, ...rest);\n                setState(value);\n                return returnValue;\n            },\n            [handler]\n        ),\n    ] as const;\n}\n\nexport { useUncontrolledProp };\n\ntype FilterFlags<Base, Condition> = {\n    [Key in keyof Base]: NonNullable<Base[Key]> extends Condition ? Key : never;\n};\n\ntype AllowedNames<Base, Condition> = FilterFlags<Base, Condition>[keyof Base];\n\ntype ConfigMap<TProps extends object> = {\n    // biome-ignore lint/complexity/noBannedTypes: any function\n    [p in keyof TProps]?: AllowedNames<TProps, Function>;\n};\n\nexport function useUncontrolled<TProps extends object, TDefaults extends string = never>(\n    props: TProps,\n    config: ConfigMap<TProps>\n): Omit<TProps, TDefaults> {\n    return Object.keys(config).reduce((result: TProps, fieldName: string) => {\n        // biome-ignore lint/suspicious/noExplicitAny: any result\n        const { [defaultKey(fieldName)]: defaultValue, [fieldName]: propsValue, ...rest } = result as any;\n\n        // @ts-expect-error-next-line\n        const handlerName = config[fieldName];\n        // @ts-expect-error-next-line\n        const [value, handler] = useUncontrolledProp(propsValue, defaultValue, props[handlerName]);\n\n        return {\n            ...rest,\n            [fieldName]: value,\n            [handlerName]: handler,\n        };\n    }, props);\n}\n"],"names":["useUncontrolledProp","propValue","defaultValue","handler","wasPropRef","useRef","stateValue","setState","useState","isProp","wasProp","useCallback","args","value","rest","returnValue"],"mappings":";AAuBA,SAASA,EACLC,GACAC,GACAC,GACF;AACE,QAAMC,IAAaC,EAAgBJ,MAAc,MAAS,GACpD,CAACK,GAAYC,CAAQ,IAAIC,EAA4BN,CAAY,GAEjEO,IAASR,MAAc,QACvBS,IAAUN,EAAW;AAE3B,SAAAA,EAAW,UAAUK,GAMjB,CAACA,KAAUC,KAAWJ,MAAeJ,KACrCK,EAASL,CAAY,GAGlB;AAAA,IACHO,IAASR,IAAYK;AAAA,IACrBK;AAAA,MACI,IAAIC,MAAiE;AACjE,cAAM,CAACC,GAAO,GAAGC,CAAI,IAAIF,GACnBG,IAAcZ,IAAUU,GAAO,GAAGC,CAAI;AAC5C,eAAAP,EAASM,CAAK,GACPE;AAAA,MACX;AAAA,MACA,CAACZ,CAAO;AAAA,IAAA;AAAA,EACZ;AAER;"}
+{"version":3,"file":"useUncontrollable.js","names":[],"sources":["../../src/hooks/useUncontrollable.ts"],"sourcesContent":["/* eslint-disable prefer-arrow/prefer-arrow-functions */\n// forked from https://github.com/jquense/uncontrollable/blob/master/src/index.ts\nimport { useCallback, useRef, useState } from 'react';\n\n// biome-ignore lint/suspicious/noExplicitAny: unknown types\nexport type Handler = (value: any, ...args: any[]) => any;\n\nexport function defaultKey(key: string) {\n    return `default${key.charAt(0).toUpperCase()}${key.substr(1)}`;\n}\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue: TProp,\n    handler?: THandler\n): readonly [TProp, THandler];\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue?: TProp | undefined,\n    handler?: THandler\n): readonly [TProp | undefined, (...args: Parameters<THandler>) => ReturnType<THandler> | undefined];\n\nfunction useUncontrolledProp<TProp, THandler extends Handler = Handler>(\n    propValue: TProp | undefined,\n    defaultValue: TProp | undefined,\n    handler?: THandler\n) {\n    const wasPropRef = useRef<boolean>(propValue !== undefined);\n    const [stateValue, setState] = useState<TProp | undefined>(defaultValue);\n\n    const isProp = propValue !== undefined;\n    const wasProp = wasPropRef.current;\n\n    wasPropRef.current = isProp;\n\n    /**\n     * If a prop switches from controlled to Uncontrolled\n     * reset its value to the defaultValue\n     */\n    if (!isProp && wasProp && stateValue !== defaultValue) {\n        setState(defaultValue);\n    }\n\n    return [\n        isProp ? propValue : stateValue,\n        useCallback(\n            (...args: Parameters<THandler>): ReturnType<THandler> | undefined => {\n                const [value, ...rest] = args;\n                const returnValue = handler?.(value, ...rest);\n                setState(value);\n                return returnValue;\n            },\n            [handler]\n        ),\n    ] as const;\n}\n\nexport { useUncontrolledProp };\n\ntype FilterFlags<Base, Condition> = {\n    [Key in keyof Base]: NonNullable<Base[Key]> extends Condition ? Key : never;\n};\n\ntype AllowedNames<Base, Condition> = FilterFlags<Base, Condition>[keyof Base];\n\ntype ConfigMap<TProps extends object> = {\n    // biome-ignore lint/complexity/noBannedTypes: any function\n    [p in keyof TProps]?: AllowedNames<TProps, Function>;\n};\n\nexport function useUncontrolled<TProps extends object, TDefaults extends string = never>(\n    props: TProps,\n    config: ConfigMap<TProps>\n): Omit<TProps, TDefaults> {\n    return Object.keys(config).reduce((result: TProps, fieldName: string) => {\n        // biome-ignore lint/suspicious/noExplicitAny: any result\n        const { [defaultKey(fieldName)]: defaultValue, [fieldName]: propsValue, ...rest } = result as any;\n\n        // @ts-expect-error-next-line\n        const handlerName = config[fieldName];\n        // @ts-expect-error-next-line\n        const [value, handler] = useUncontrolledProp(propsValue, defaultValue, props[handlerName]);\n\n        return {\n            ...rest,\n            [fieldName]: value,\n            [handlerName]: handler,\n        };\n    }, props);\n}\n"],"mappings":";;AAuBA,SAAS,EACL,GACA,GACA,GACF;CACE,IAAM,IAAa,EAAgB,MAAc,KAAA,CAAS,GACpD,CAAC,GAAY,KAAY,EAA4B,CAAY,GAEjE,IAAS,MAAc,KAAA,GACvB,IAAU,EAAW;CAY3B,OAVA,EAAW,UAAU,GAMjB,CAAC,KAAU,KAAW,MAAe,KACrC,EAAS,CAAY,GAGlB,CACH,IAAS,IAAY,GACrB,GACK,GAAG,MAAiE;EACjE,IAAM,CAAC,GAAO,GAAG,KAAQ,GACnB,IAAc,IAAU,GAAO,GAAG,CAAI;EAE5C,OADA,EAAS,CAAK,GACP;CACX,GACA,CAAC,CAAO,CACZ,CACJ;AACJ"}

package/hooks/useUpdatingRef.js

@@ -1,11 +1,12 @@
-import { useRef as t, useEffect as f } from "react";
-const o = (e) => {
-  const r = t(e);
-  return f(() => {
-    r.current = e;
-  }, [e]), r;
+import { useEffect as e, useRef as t } from "react";
+//#region src/hooks/useUpdatingRef.ts
+var n = (n) => {
+	let r = t(n);
+	return e(() => {
+		r.current = n;
+	}, [n]), r;
 };
-export {
-  o as useUpdatingRef
-};
-//# sourceMappingURL=useUpdatingRef.js.map
+//#endregion
+export { n as useUpdatingRef };
+
+//# sourceMappingURL=useUpdatingRef.js.map

package/hooks/useUpdatingRef.js.map

@@ -1 +1 @@
-{"version":3,"file":"useUpdatingRef.js","sources":["../../src/hooks/useUpdatingRef.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\n/**\n * Used to create a self-updating ref that can be utilized in tasks that are happening outside React's render loop.\n *\n * Event listeners for 'message' events, for example: they define a singular, never-changing handler but this handler\n * needs always-up-to-date access to the latest callbacks that got passed in by the user.\n *\n * @param value The value to be stored (and updated) in the ref's `current` property.\n *\n * @return A read-only ref that always contains the latest value.\n */\nexport const useUpdatingRef = <T extends NonNullable<unknown>>(value: T): { readonly current: T } => {\n    // Please note that we're deliberately not returning a `RefObject<T>`, because its value could be null.\n    // Also note that we're deliberately not returning a `MutableRefObject<T>`, because we don't want the `current`\n    // property to be writable.\n    const ref = useRef(value);\n\n    useEffect(() => {\n        ref.current = value;\n    }, [value]);\n\n    return ref;\n};\n"],"names":["useUpdatingRef","value","ref","useRef","useEffect"],"mappings":";AAYO,MAAMA,IAAiB,CAAiCC,MAAsC;AAIjG,QAAMC,IAAMC,EAAOF,CAAK;AAExB,SAAAG,EAAU,MAAM;AACZ,IAAAF,EAAI,UAAUD;AAAA,EAClB,GAAG,CAACA,CAAK,CAAC,GAEHC;AACX;"}
+{"version":3,"file":"useUpdatingRef.js","names":[],"sources":["../../src/hooks/useUpdatingRef.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\n/**\n * Used to create a self-updating ref that can be utilized in tasks that are happening outside React's render loop.\n *\n * Event listeners for 'message' events, for example: they define a singular, never-changing handler but this handler\n * needs always-up-to-date access to the latest callbacks that got passed in by the user.\n *\n * @param value The value to be stored (and updated) in the ref's `current` property.\n *\n * @return A read-only ref that always contains the latest value.\n */\nexport const useUpdatingRef = <T extends NonNullable<unknown>>(value: T): { readonly current: T } => {\n    // Please note that we're deliberately not returning a `RefObject<T>`, because its value could be null.\n    // Also note that we're deliberately not returning a `MutableRefObject<T>`, because we don't want the `current`\n    // property to be writable.\n    const ref = useRef(value);\n\n    useEffect(() => {\n        ref.current = value;\n    }, [value]);\n\n    return ref;\n};\n"],"mappings":";;AAYA,IAAa,KAAkD,MAAsC;CAIjG,IAAM,IAAM,EAAO,CAAK;CAMxB,OAJA,QAAgB;EACZ,EAAI,UAAU;CAClB,GAAG,CAAC,CAAK,CAAC,GAEH;AACX"}

package/hooks/useUrlState.js

@@ -1,137 +1,114 @@
-import { useRef as R, useEffect as D } from "react";
-import { isNil as z, isEqual as v } from "es-toolkit";
-import { toQueryString as T, deserializeValue as M, serializeValue as A } from "../utils/routeUtils.js";
-import E from "./useAfterMount.js";
-import U from "./useLatest.js";
-const C = (r) => {
-  const e = r.replace(/^\?/, "");
-  return new URLSearchParams(e).toString();
-}, L = (r, e) => r.customDeserialize ? r.customDeserialize(e) : M(e, r.type ?? "string"), N = (r, e) => r ?? e, I = (r) => {
-  const { valueToApply: e, currentStoreValue: t, urlRawValue: a, defaultValue: d } = r;
-  if (typeof e > "u" || v(e, t))
-    return !1;
-  const l = z(a), n = v(t, d);
-  return !(l && n);
-}, O = (r, e, t) => t ? null : r.customSerialize ? r.customSerialize(e) : A(e, r.type ?? "string"), x = (r) => {
-  const { nextParams: e, key: t, serializedValue: a } = r;
-  return z(a) ? e.has(t) ? (e.delete(t), !0) : !1 : (e.set(t, a), !0);
-}, K = (r, e) => {
-  if (z(e))
-    return !0;
-  const t = L(r, e), a = N(t, r.defaultValue);
-  return v(a, r.defaultValue);
-}, F = ({
-  config: r,
-  searchString: e,
-  storeValues: t,
-  navigationType: a,
-  onUpdateStore: d,
-  lastWrittenNormalizedSearchRef: l,
-  isRestoringRef: n,
-  hasCheckedStorageRef: g
-}) => {
-  const h = U(r), p = U(t), y = U(d);
-  D(() => {
-    if (!g.current)
-      return;
-    const s = C(e);
-    if (l.current === s && (l.current = null), n.current)
-      return;
-    const P = new URLSearchParams(e);
-    h.current.forEach((c) => {
-      const u = P.get(c.key), i = L(c, u), f = N(i, c.defaultValue), S = p.current[c.key];
-      if (I({
-        valueToApply: f,
-        currentStoreValue: S,
-        urlRawValue: u,
-        defaultValue: c.defaultValue
-      })) {
-        if (z(u) && a !== "POP")
-          return;
-        y.current(c.action(f));
-      }
-    });
-  }, [e, l, n, g]);
-}, q = (r) => {
-  const {
-    config: e,
-    searchString: t,
-    storeValues: a,
-    onNavigate: d,
-    lastWrittenNormalizedSearchRef: l,
-    localStorageKey: n,
-    navigationType: g
-  } = r, h = U(d), p = R(C(t));
-  E(() => {
-    const y = C(t), s = p.current !== y;
-    if (p.current = y, g === "POP" && s)
-      return;
-    const c = new URLSearchParams(t), u = new URLSearchParams(t);
-    let i = !1, f = !1, S = !0;
-    if (e.forEach((o) => {
-      const V = a[o.key], m = c.get(o.key), k = v(V, o.defaultValue);
-      k || (S = !1);
-      const w = O(o, V, k);
-      w !== m && (i = x({ nextParams: u, key: o.key, serializedValue: w }) || i, ((o.history ?? "push") === "push" || !k && K(o, m)) && (f = !0));
-    }), i) {
-      const o = T(u, e), V = u.toString();
-      l.current = V, n && (S && o === "" ? localStorage.removeItem(n) : localStorage.setItem(n, o));
-      const m = f ? "push" : "replace";
-      h.current(o, m);
-    }
-  }, [a, t, e, n, g]);
-}, Q = (r) => {
-  const {
-    config: e,
-    searchString: t,
-    localStorageKey: a,
-    onUpdateStore: d,
-    onNavigate: l,
-    isRestoringRef: n,
-    lastWrittenNormalizedSearchRef: g,
-    hasCheckedStorageRef: h
-  } = r;
-  D(() => {
-    if (!a) {
-      h.current = !0;
-      return;
-    }
-    const p = new URLSearchParams(t);
-    if (!e.some((s) => p.has(s.key))) {
-      const s = localStorage.getItem(a);
-      if (s) {
-        n.current = !0;
-        const P = new URLSearchParams(s);
-        e.forEach((i) => {
-          const f = P.get(i.key), S = L(i, f);
-          S !== null && typeof S < "u" && d(i.action(S));
-        });
-        const c = s.replace(/^\?/, ""), u = t.replace(/^\?/, "");
-        c !== u && (g.current = new URLSearchParams(s).toString(), l(s, "replace")), setTimeout(() => {
-          n.current = !1;
-        }, 0);
-      }
-    }
-    h.current = !0;
-  }, [a]);
-}, J = (r) => {
-  const e = R(null), t = R(!1), a = R(!r.localStorageKey);
-  Q({
-    ...r,
-    lastWrittenNormalizedSearchRef: e,
-    isRestoringRef: t,
-    hasCheckedStorageRef: a
-  }), F({
-    ...r,
-    lastWrittenNormalizedSearchRef: e,
-    isRestoringRef: t,
-    hasCheckedStorageRef: a
-  }), q({
-    ...r,
-    lastWrittenNormalizedSearchRef: e
-  });
+import { deserializeValue as e, serializeValue as t, toQueryString as n } from "../utils/routeUtils.js";
+import r from "./useAfterMount.js";
+import i from "./useLatest.js";
+import { useEffect as a, useRef as o } from "react";
+import { isEqual as s, isNil as c } from "es-toolkit";
+//#region src/hooks/useUrlState.ts
+var l = (e) => {
+	let t = e.replace(/^\?/, "");
+	return new URLSearchParams(t).toString();
+}, u = (t, n) => t.customDeserialize ? t.customDeserialize(n) : e(n, t.type ?? "string"), d = (e, t) => e ?? t, f = (e) => {
+	let { valueToApply: t, currentStoreValue: n, urlRawValue: r, defaultValue: i } = e;
+	if (t === void 0 || s(t, n)) return !1;
+	let a = c(r), o = s(n, i);
+	return !(a && o);
+}, p = (e, n, r) => r ? null : e.customSerialize ? e.customSerialize(n) : t(n, e.type ?? "string"), m = (e) => {
+	let { nextParams: t, key: n, serializedValue: r } = e;
+	return c(r) ? t.has(n) ? (t.delete(n), !0) : !1 : (t.set(n, r), !0);
+}, h = (e, t) => c(t) ? !0 : s(d(u(e, t), e.defaultValue), e.defaultValue), g = ({ config: e, searchString: t, storeValues: n, navigationType: r, onUpdateStore: o, lastWrittenNormalizedSearchRef: s, isRestoringRef: p, hasCheckedStorageRef: m }) => {
+	let h = i(e), g = i(n), _ = i(o);
+	a(() => {
+		if (!m.current) return;
+		let e = l(t);
+		if (s.current === e && (s.current = null), p.current) return;
+		let n = new URLSearchParams(t);
+		h.current.forEach((e) => {
+			let t = n.get(e.key), i = d(u(e, t), e.defaultValue), a = g.current[e.key];
+			if (f({
+				valueToApply: i,
+				currentStoreValue: a,
+				urlRawValue: t,
+				defaultValue: e.defaultValue
+			})) {
+				if (c(t) && r !== "POP") return;
+				_.current(e.action(i));
+			}
+		});
+	}, [
+		t,
+		s,
+		p,
+		m
+	]);
+}, _ = (e) => {
+	let { config: t, searchString: a, storeValues: c, onNavigate: u, lastWrittenNormalizedSearchRef: d, localStorageKey: f, navigationType: g } = e, _ = i(u), v = o(l(a));
+	r(() => {
+		let e = l(a), r = v.current !== e;
+		if (v.current = e, g === "POP" && r) return;
+		let i = new URLSearchParams(a), o = new URLSearchParams(a), u = !1, y = !1, b = !0;
+		if (t.forEach((e) => {
+			let t = c[e.key], n = i.get(e.key), r = s(t, e.defaultValue);
+			r || (b = !1);
+			let a = p(e, t, r);
+			a !== n && (u = m({
+				nextParams: o,
+				key: e.key,
+				serializedValue: a
+			}) || u, ((e.history ?? "push") === "push" || !r && h(e, n)) && (y = !0));
+		}), u) {
+			let e = n(o, t), r = o.toString();
+			d.current = r, f && (b && e === "" ? localStorage.removeItem(f) : localStorage.setItem(f, e));
+			let i = y ? "push" : "replace";
+			_.current(e, i);
+		}
+	}, [
+		c,
+		a,
+		t,
+		f,
+		g
+	]);
+}, v = (e) => {
+	let { config: t, searchString: n, localStorageKey: r, onUpdateStore: i, onNavigate: o, isRestoringRef: s, lastWrittenNormalizedSearchRef: c, hasCheckedStorageRef: l } = e;
+	a(() => {
+		if (!r) {
+			l.current = !0;
+			return;
+		}
+		let e = new URLSearchParams(n);
+		if (!t.some((t) => e.has(t.key))) {
+			let e = localStorage.getItem(r);
+			if (e) {
+				s.current = !0;
+				let r = new URLSearchParams(e);
+				t.forEach((e) => {
+					let t = u(e, r.get(e.key));
+					t != null && i(e.action(t));
+				}), e.replace(/^\?/, "") !== n.replace(/^\?/, "") && (c.current = new URLSearchParams(e).toString(), o(e, "replace")), setTimeout(() => {
+					s.current = !1;
+				}, 0);
+			}
+		}
+		l.current = !0;
+	}, [r]);
+}, y = (e) => {
+	let t = o(null), n = o(!1), r = o(!e.localStorageKey);
+	v({
+		...e,
+		lastWrittenNormalizedSearchRef: t,
+		isRestoringRef: n,
+		hasCheckedStorageRef: r
+	}), g({
+		...e,
+		lastWrittenNormalizedSearchRef: t,
+		isRestoringRef: n,
+		hasCheckedStorageRef: r
+	}), _({
+		...e,
+		lastWrittenNormalizedSearchRef: t
+	});
 };
-export {
-  J as default
-};
-//# sourceMappingURL=useUrlState.js.map
+//#endregion
+export { y as default };
+
+//# sourceMappingURL=useUrlState.js.map