@rio-cloud/rio-uikit 2.1.0 → 2.2.0

package/components/table/TableSettingsDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableSettingsDialog.js","sources":["../../../src/components/table/TableSettingsDialog.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState, useEffect, useRef } from 'react';\nimport classNames from 'classnames';\nimport { isEqual } from 'es-toolkit/predicate';\nimport { isEmpty, mapValues, some } from 'es-toolkit/compat';\nimport { noop } from 'es-toolkit/function';\nimport { arrayMove } from '@dnd-kit/sortable';\n\nimport type { DragEndEvent } from '@dnd-kit/core';\n\nimport Dialog from '../dialog/Dialog';\nimport ClearableInput from '../clearableInput/ClearableInput';\nimport { TableSettingsDialogFooter } from './TableSettingsDialogFooter';\nimport { TableSettingsListContainer } from './TableSettingsListContainer';\nimport { filterColumns } from './TableSettingsListItem';\nimport type { TableColumnDetailsMap, ColumnLabelStrings, TableColumnDetails } from './TableSettingsDialog.types';\n\nconst DEFAULT_COLUMN_WIDTH = 0;\nconst MAX_COLUMN_WIDTH = 1000;\n\ntype TableSettingsDialogProps = {\n    /**\n     * Defined whether to show the dialog or not.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * The title for the dialog header.\n     */\n    title: React.ReactNode;\n\n    /**\n     * The subtitle for the dialog header.\n     */\n    subtitle?: React.ReactNode;\n\n    /**\n     * List of column names in default order. This will be used for resetting changes.\n     *\n     * @default []\n     */\n    defaultColumnOrder: string[];\n\n    /**\n     * List of hidden columns that are hidden by default. This will be used for resetting changes.\n     *\n     * @default []\n     */\n    defaultHiddenColumns?: string[];\n\n    /**\n     * List of column names in current order. The \"columnOrder\" will be returned when the order changes.\n     *\n     * @default []\n     */\n    columnOrder: string[];\n\n    /**\n     * List of column names which are currently hidden. The \"hiddenColumns\n     * will be returned when the order changes.\n     *\n     * @default []\n     */\n    hiddenColumns?: string[];\n\n    /**\n     * List of column labels which will be shown in the table header. These labels are usually\n     * translated labels that can be set as FormattedMessage components for instance.\n     *\n     * The object key is the column name and the object value is the translated message.\n     *\n     * @default {}\n     * @example\n     * { name: <FormattedMessage id='name' /> }\n     */\n    columnLabels: { [name: string]: React.ReactNode };\n\n    /**\n     * Hide a sorted column will result in an error, so disable at least one important fallback column\n     * or the sorted column (fallback column recommended)\n     */\n    disabledColumns: string[];\n\n    /**\n     * Optional object of detail properties to be shown in the details section of the respective\n     * column item. If the prop is not given, the width sections won't be rendered.\n     * The keys of this object are the column names / keys you use to identify a column.\n     */\n    columnsDetails?: TableColumnDetailsMap;\n\n    /**\n     * The label shown when the column width is unset, which means \"auto\".\n     *\n     * @default ''\n     */\n    autoLabel?: string | React.ReactNode;\n\n    /**\n     * Text for the \"apply\" button. This button will not be shown when\n     * `immediateChange` is enabled.\n     */\n    applyButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"cancel\" button. This button will not be shown when\n     * `immediateChange` is enabled.\n     */\n    cancelButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"close\" button. This button will only be shown when\n     * `immediateChange` is enabled.\n     */\n    closeButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"reset to default\" button.\n     */\n    resetButtonText: string | React.ReactNode;\n\n    /**\n     * Callback function for when the column order or visibility changes.\n     *\n     * @param columnOrder\n     * @param hiddenColumns\n     * @param columnsDetails\n     * @returns\n     */\n    onColumnChange?: (columnOrder: string[], hiddenColumns: string[], columnsDetails?: TableColumnDetailsMap) => void;\n\n    /**\n     * Callback function for when a single column details like width changes.\n     *\n     * @param column\n     * @param columnsDetails\n     * @returns\n     */\n    onColumnDetailsChange?: (column: string, columnsDetails: TableColumnDetails) => void;\n\n    /**\n     * Callback function for when the changes are discarded and the dialog should close.\n     * Will not be triggered when `immediateChange` is enabled.\n     *\n     * @returns\n     */\n    onDiscard?: () => void;\n\n    /**\n     * Callback function for when the final changes should be applied and the dialog should close.\n     * Will not be triggered when `immediateChange `is enabled.\n     *\n     * @param columnOrder\n     * @param hiddenColumns\n     * @param columnsDetails\n     * @returns\n     */\n    onApply?: (columnOrder: string[], hiddenColumns: string[], columnsDetails: TableColumnDetailsMap) => void;\n\n    /**\n     * Callback function for when dialog should close.\n     *\n     * @returns\n     */\n    onHide: () => void;\n\n    /**\n     * Search value which should be set for the search field when the dialog opens.\n     */\n    columnSearchValue?: string;\n\n    /**\n     * Callback function for when the search value changes.\n     *\n     * @param value\n     * @returns\n     */\n    onSearchChange?: (value: string) => void;\n\n    /**\n     * Placeholder text for the search input.\n     */\n    searchPlaceholder: React.ReactNode;\n\n    /**\n     * Message that should be shown when column search result is empty.\n     */\n    notFoundMessage?: string;\n\n    /**\n     * Defines whether or not all changes apply immediately. If so, no cancel and apply buttons are shown.\n     * Enable this if you want to update the table after each change. Be aware of having side effects when\n     * toggling columns where data need to be fetched from the backend.\n     *\n     * @default false\n     */\n    immediateChange?: boolean;\n\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableSettingsDialog = (props: TableSettingsDialogProps) => {\n    const {\n        show = false,\n        title,\n        subtitle,\n        className,\n        defaultColumnOrder = [],\n        defaultHiddenColumns = [],\n        columnOrder: extColumnOrder = [],\n        hiddenColumns: extHiddenColumns = [],\n        columnLabels = {},\n        disabledColumns = [],\n        columnsDetails: extColumnsDetails = {},\n        autoLabel = '',\n        applyButtonText,\n        cancelButtonText,\n        closeButtonText,\n        resetButtonText,\n        onColumnChange = noop,\n        onColumnDetailsChange = noop,\n        onDiscard = noop,\n        // onCancel = noop,\n        onApply = noop,\n        onHide,\n        columnSearchValue: extColumnSearchValue = '',\n        onSearchChange = noop,\n        searchPlaceholder,\n        notFoundMessage = '',\n        immediateChange = false,\n    } = props;\n\n    const [columnSearchValue, setColumnSearchValue] = useState(extColumnSearchValue);\n    const [columnOrder, setColumnOrder] = useState(extColumnOrder);\n    const [hiddenColumns, setHiddenColumns] = useState(extHiddenColumns || defaultHiddenColumns);\n\n    const [columnsDetails, setColumnsDetails] = useState(extColumnsDetails);\n    const [openColumnsDetails, setOpenColumnsDetails] = useState<Record<string, string>>({});\n\n    const [columnLabelStrings, setColumnLabelStrings] = useState<ColumnLabelStrings>({});\n    const [updateColumnLabelStrings, setUpdateColumnLabelStrings] = useState(true);\n\n    // Dirty flag for offering to reset changes or to discard them\n    const [hasChanged, setHasChanged] = useState(false);\n    const [isResetAll, setIsResetAll] = useState(false);\n\n    const [movedColumn, setMovedColumn] = useState(false);\n\n    const contentRef = useRef<HTMLDivElement>(null);\n\n    // Update items from outside\n    useEffect(() => {\n        setColumnSearchValue(extColumnSearchValue);\n        setColumnOrder(extColumnOrder);\n        setHiddenColumns(extHiddenColumns);\n\n        if (show) {\n            getColumnLabelStringsFromDOM();\n        }\n\n        const externalColumnOrder = extColumnOrder ?? defaultColumnOrder;\n        const externalHiddenColumns = extHiddenColumns ?? defaultHiddenColumns;\n        const externalColumnsDetails = extColumnsDetails ?? {};\n\n        const hasChangesFromDefaults =\n            !isEqual(externalColumnOrder, defaultColumnOrder) ||\n            !isEqual(externalHiddenColumns, defaultHiddenColumns) ||\n            hasColumnsDetailsChanged(externalColumnsDetails);\n\n        setHasChanged(hasChangesFromDefaults);\n    }, [\n        extColumnSearchValue,\n        extColumnOrder,\n        extHiddenColumns,\n        extColumnsDetails,\n        defaultColumnOrder,\n        defaultHiddenColumns,\n        show,\n    ]);\n\n    const hasColumnsDetailsChanged = (columnsDetailsToCheck: TableColumnDetailsMap) => {\n        if (isEmpty(columnsDetailsToCheck)) {\n            return false;\n        }\n\n        const hasObjectChanged = some(columnsDetailsToCheck, (details: TableColumnDetails) => {\n            const defaultWidth = Number.isFinite(details.defaultWidth) ? details.defaultWidth : DEFAULT_COLUMN_WIDTH;\n            return details.width !== defaultWidth;\n        });\n\n        return hasObjectChanged;\n    };\n\n    // Update column details from outside if provided. Note, that in \"sort columns only\" mode\n    // the columns details are undefined and no column widths can be set\n    const [previousColumnDetails, setPreviousColumnDetails] = useState(extColumnsDetails);\n    if (!isEqual(columnsDetails, previousColumnDetails)) {\n        const columnsDetailsChanged = hasColumnsDetailsChanged(extColumnsDetails);\n        setColumnsDetails(columnsDetailsChanged ? extColumnsDetails : columnsDetails);\n        setPreviousColumnDetails(extColumnsDetails);\n    }\n\n    const getColumnLabelStringsFromDOM = () => {\n        if (!contentRef.current) {\n            return;\n        }\n\n        // For searching by name we need to get the label from the DOM as it may contain a FormattedMessage\n        const labels = contentRef.current.getElementsByClassName('table-settings-item-label');\n\n        const columnStrings: { [key: string]: string } = {};\n        [...labels].forEach(label => {\n            const dataKey = label.getAttribute('data-key');\n            if (dataKey) {\n                const updatedLabel = label.textContent?.replace(/\\r?\\n|\\r/g, '').toLowerCase();\n                if (updatedLabel) {\n                    columnStrings[dataKey] = updatedLabel;\n                }\n            }\n        });\n\n        setColumnLabelStrings(columnStrings);\n        setUpdateColumnLabelStrings(false);\n    };\n\n    const deleteMovedColumn = () => {\n        setMovedColumn(false);\n    };\n\n    const moveColumnToIndex = (columnName: string, newIndex: number, changeMovedColumn: boolean) => {\n        const newColumnOrder = columnOrder.filter(name => name !== columnName);\n        newColumnOrder.splice(newIndex, 0, columnName);\n\n        setColumnOrder(newColumnOrder);\n        setMovedColumn(changeMovedColumn ? !!columnName : false);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(newColumnOrder, hiddenColumns);\n        }\n\n        window.setTimeout(deleteMovedColumn, 500);\n    };\n\n    const handleResetColumnChanges = () => setIsResetAll(true);\n    const handleCancelResetColumnChanges = () => setIsResetAll(false);\n\n    const resetColumnsDetails = (details: TableColumnDetailsMap) => {\n        return mapValues(details, (singleColumnDetails: TableColumnDetails) => {\n            return {\n                ...singleColumnDetails,\n                width: singleColumnDetails.defaultWidth || DEFAULT_COLUMN_WIDTH,\n            };\n        });\n    };\n\n    const resetAllColumnChanges = () => {\n        const defaultColumnsDetails = resetColumnsDetails(columnsDetails);\n\n        setColumnOrder(defaultColumnOrder);\n        setHiddenColumns(defaultHiddenColumns);\n        setColumnSearchValue('');\n        setHasChanged(false);\n        setIsResetAll(false);\n\n        if (!isEmpty(columnsDetails)) {\n            setColumnsDetails(defaultColumnsDetails);\n        }\n\n        if (immediateChange) {\n            onSearchChange('');\n            onColumnChange(defaultColumnOrder, defaultHiddenColumns, defaultColumnsDetails);\n        }\n    };\n\n    const discardColumnChanges = () => {\n        onSearchChange('');\n        // onCancel();\n        onDiscard();\n        onHide();\n    };\n\n    const handleManuallyApplyChanges = () => {\n        setColumnSearchValue('');\n\n        onSearchChange('');\n        onColumnChange(columnOrder, hiddenColumns, columnsDetails);\n        onApply(columnOrder, hiddenColumns, columnsDetails);\n        onHide();\n    };\n\n    const toggleHideColumn = (column: string) => {\n        const isHidden = hiddenColumns.includes(column);\n        const newHiddenColumns = isHidden ? hiddenColumns.filter(name => name !== column) : [...hiddenColumns, column];\n\n        setHiddenColumns(newHiddenColumns);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(columnOrder, newHiddenColumns);\n        }\n    };\n\n    const handleSearchChange = (searchValue: string) => {\n        const newSearch = searchValue.toLowerCase();\n\n        setColumnSearchValue(() => {\n            onSearchChange(newSearch);\n            return newSearch;\n        });\n    };\n\n    const handleColumnWidthChange = (column: keyof TableColumnDetailsMap, value: number) => {\n        if (columnsDetails[column]) {\n            columnsDetails[column].width = value;\n        } else {\n            columnsDetails[column] = {\n                width: value,\n                defaultWidth: 0,\n                maxWidth: MAX_COLUMN_WIDTH,\n            };\n        }\n\n        setColumnsDetails(columnsDetails);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnDetailsChange(column, columnsDetails[column]);\n        }\n    };\n\n    const handleResetColumnWidth = (column: keyof TableColumnDetailsMap) => {\n        const updatedColumnDetails = columnsDetails[column];\n        updatedColumnDetails.width = updatedColumnDetails.defaultWidth;\n\n        setColumnsDetails(columnsDetails);\n\n        if (immediateChange) {\n            onColumnDetailsChange(column, columnsDetails[column]);\n        }\n    };\n\n    const handleOpenColumnsDetails = (columnName: keyof TableColumnDetailsMap) => {\n        const updatedOpenColumnDetails = { ...openColumnsDetails };\n\n        if (updatedOpenColumnDetails[columnName]) {\n            delete updatedOpenColumnDetails[columnName];\n        } else {\n            updatedOpenColumnDetails[columnName] = columnName;\n        }\n\n        setOpenColumnsDetails(updatedOpenColumnDetails);\n    };\n\n    const handleSortEnd = (event: DragEndEvent, previousOrder: string[]) => {\n        const { active, over } = event;\n\n        const activeId = active.id;\n        const overId = over?.id;\n\n        if (activeId === overId) {\n            return;\n        }\n\n        const oldIndex = previousOrder.indexOf(String(activeId));\n        const newIndex = previousOrder.indexOf(String(overId));\n\n        const newColumnOrder = arrayMove(previousOrder, oldIndex, newIndex);\n\n        setColumnOrder(newColumnOrder);\n        setMovedColumn(true);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(newColumnOrder, hiddenColumns);\n        }\n    };\n\n    const renderTableSettingsDialogContent = () => {\n        const itemProps = {\n            columnLabels,\n            autoLabel,\n            disabledColumns,\n            columnOrder,\n            hiddenColumns,\n            columnSearchValue,\n            columnsDetails,\n            columnLabelStrings,\n            openColumnsDetails,\n            updateColumnLabelStrings,\n            onMoveColumn: moveColumnToIndex,\n            onOpenDetails: handleOpenColumnsDetails,\n            onColumnWidthChange: handleColumnWidthChange,\n            onResetColumnWidth: handleResetColumnWidth,\n            onToggleHideColumn: toggleHideColumn,\n        };\n\n        const filteredColumns = columnOrder.filter(column =>\n            filterColumns(columnSearchValue, column, columnLabelStrings)\n        );\n\n        const hasItems = !isEqual(filteredColumns, columnOrder);\n\n        return (\n            <div ref={contentRef}>\n                <div className='table-settings-search'>\n                    <div className='input-group width-100pct'>\n                        <span className='input-group-addon'>\n                            <span className='rioglyph rioglyph-search' />\n                        </span>\n                        <ClearableInput\n                            value={columnSearchValue}\n                            onChange={handleSearchChange}\n                            placeholder={searchPlaceholder}\n                        />\n                    </div>\n                </div>\n                <div className='table-settings-body'>\n                    {hasItems ? (\n                        <TableSettingsListContainer\n                            items={columnOrder}\n                            onSortEnd={handleSortEnd}\n                            itemProps={{ ...itemProps }}\n                        />\n                    ) : (\n                        <div className='text-center text-color-gray'>{notFoundMessage}</div>\n                    )}\n                </div>\n            </div>\n        );\n    };\n\n    const renderTableSettingsDialogFooter = () => {\n        return (\n            <TableSettingsDialogFooter\n                hasChanged={hasChanged}\n                isResetAll={isResetAll}\n                immediateChange={immediateChange}\n                resetButtonText={resetButtonText}\n                closeButtonText={closeButtonText}\n                cancelButtonText={cancelButtonText}\n                applyButtonText={applyButtonText}\n                onHide={onHide}\n                onResetColumnChanges={handleResetColumnChanges}\n                onDiscardChanges={discardColumnChanges}\n                onApplyChanges={handleManuallyApplyChanges}\n                onConfirmResetColumnChanges={resetAllColumnChanges}\n                onCancelResetColumnChanges={handleCancelResetColumnChanges}\n            />\n        );\n    };\n\n    if (!show) {\n        return null;\n    }\n\n    const dialogClassNames = classNames('TableSettingsDialog', className);\n\n    return (\n        <Dialog\n            show={show}\n            title={title}\n            subtitle={subtitle}\n            onClose={onHide}\n            body={renderTableSettingsDialogContent()}\n            footer={renderTableSettingsDialogFooter()}\n            className={dialogClassNames}\n        />\n    );\n};\n\nexport default TableSettingsDialog;\n"],"names":["DEFAULT_COLUMN_WIDTH","MAX_COLUMN_WIDTH","TableSettingsDialog","props","show","title","subtitle","className","defaultColumnOrder","defaultHiddenColumns","extColumnOrder","extHiddenColumns","columnLabels","disabledColumns","extColumnsDetails","autoLabel","applyButtonText","cancelButtonText","closeButtonText","resetButtonText","onColumnChange","noop","onColumnDetailsChange","onDiscard","onApply","onHide","extColumnSearchValue","onSearchChange","searchPlaceholder","notFoundMessage","immediateChange","columnSearchValue","setColumnSearchValue","useState","columnOrder","setColumnOrder","hiddenColumns","setHiddenColumns","columnsDetails","setColumnsDetails","openColumnsDetails","setOpenColumnsDetails","columnLabelStrings","setColumnLabelStrings","updateColumnLabelStrings","setUpdateColumnLabelStrings","hasChanged","setHasChanged","isResetAll","setIsResetAll","movedColumn","setMovedColumn","contentRef","useRef","useEffect","getColumnLabelStringsFromDOM","externalColumnOrder","externalHiddenColumns","externalColumnsDetails","hasChangesFromDefaults","isEqual","hasColumnsDetailsChanged","columnsDetailsToCheck","isEmpty","some","details","defaultWidth","previousColumnDetails","setPreviousColumnDetails","columnsDetailsChanged","labels","columnStrings","label","dataKey","updatedLabel","deleteMovedColumn","moveColumnToIndex","columnName","newIndex","changeMovedColumn","newColumnOrder","name","handleResetColumnChanges","handleCancelResetColumnChanges","resetColumnsDetails","mapValues","singleColumnDetails","resetAllColumnChanges","defaultColumnsDetails","discardColumnChanges","handleManuallyApplyChanges","toggleHideColumn","column","newHiddenColumns","handleSearchChange","searchValue","newSearch","handleColumnWidthChange","value","handleResetColumnWidth","updatedColumnDetails","handleOpenColumnsDetails","updatedOpenColumnDetails","handleSortEnd","event","previousOrder","active","over","activeId","overId","oldIndex","arrayMove","renderTableSettingsDialogContent","itemProps","filteredColumns","filterColumns","hasItems","jsxs","jsx","ClearableInput","TableSettingsListContainer","renderTableSettingsDialogFooter","TableSettingsDialogFooter","dialogClassNames","classNames","Dialog"],"mappings":"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"}
+{"version":3,"file":"TableSettingsDialog.js","sources":["../../../src/components/table/TableSettingsDialog.tsx"],"sourcesContent":["import type React from 'react';\nimport { useState, useEffect, useRef } from 'react';\nimport { isEqual } from 'es-toolkit/predicate';\nimport { isEmpty, mapValues } from 'es-toolkit/compat';\nimport { noop } from 'es-toolkit/function';\nimport { arrayMove } from '@dnd-kit/sortable';\nimport type { DragEndEvent } from '@dnd-kit/core';\n\nimport classNames from '../../utils/classNames';\nimport Dialog from '../dialog/Dialog';\nimport ClearableInput from '../clearableInput/ClearableInput';\nimport { TableSettingsDialogFooter } from './TableSettingsDialogFooter';\nimport { TableSettingsListContainer } from './TableSettingsListContainer';\nimport { filterColumns } from './TableSettingsListItem';\n\nconst DEFAULT_COLUMN_WIDTH = 0;\nconst MAX_COLUMN_WIDTH = 1000;\n\nexport type TableColumnDetails = {\n    /**\n     * Defined the current width of a column.\n     *\n     * @default 0\n     */\n    width?: number;\n\n    /**\n     * Defined the default width of a column which will be used when resetting to default.\n     *\n     * @default 0\n     */\n    defaultWidth?: number;\n\n    /**\n     * Defined the maximum width of a column.\n     *\n     * @default 1000\n     */\n    maxWidth?: number;\n};\n\nexport type TableColumnsSettings = {\n    columnOrder: string[];\n    hiddenColumns: string[];\n    columnsDetails: TableColumnDetailsMap;\n};\n\nexport type TableColumnDetailsMap = Record<string, TableColumnDetails>;\nexport type ColumnLabelStrings = Record<string, string>;\n\nexport type TableSettingsItemProps = {\n    columnLabels?: any;\n    autoLabel?: string | React.ReactNode;\n    disabledColumns?: string[];\n    columnOrder: string[];\n    hiddenColumns?: string[];\n    columnSearchValue: string;\n    columnsDetails: TableColumnDetailsMap;\n    columnLabelStrings?: ColumnLabelStrings;\n    openColumnsDetails?: Record<string, string>;\n    updateColumnLabelStrings?: boolean;\n    onColumnWidthChange?: (column: keyof TableColumnDetailsMap, value: number) => void;\n    onResetColumnWidth?: (column: keyof TableColumnDetailsMap) => void;\n    onMoveColumn?: (columnName: string, newIndex: number, changeMovedColumn: boolean) => void;\n    onOpenDetails?: (columnName: keyof TableColumnDetailsMap) => void;\n    onToggleHideColumn?: (column: string) => void;\n};\n\ntype TableSettingsDialogProps = {\n    /**\n     * Defined whether to show the dialog or not.\n     *\n     * @default false\n     */\n    show: boolean;\n\n    /**\n     * The title for the dialog header.\n     */\n    title: React.ReactNode;\n\n    /**\n     * The subtitle for the dialog header.\n     */\n    subtitle?: React.ReactNode;\n\n    /**\n     * List of column names in default order. This will be used for resetting changes.\n     *\n     * @default []\n     */\n    defaultColumnOrder: string[];\n\n    /**\n     * List of hidden columns that are hidden by default. This will be used for resetting changes.\n     *\n     * @default []\n     */\n    defaultHiddenColumns?: string[];\n\n    /**\n     * Initial default configuration for the each columns with regards to column width.\n     * Used to reset to this state when the configuration differs.\n     *\n     * @default {}\n     */\n    defaultColumnDetails?: TableColumnDetailsMap;\n\n    /**\n     * List of column names in current order. The \"columnOrder\" will be returned when the order changes.\n     *\n     * @default []\n     */\n    columnOrder: string[];\n\n    /**\n     * List of column names which are currently hidden. The \"hiddenColumns\n     * will be returned when the order changes.\n     *\n     * @default []\n     */\n    hiddenColumns?: string[];\n\n    /**\n     * List of column labels which will be shown in the table header. These labels are usually\n     * translated labels that can be set as FormattedMessage components for instance.\n     *\n     * The object key is the column name and the object value is the translated message.\n     *\n     * @default {}\n     * @example\n     * { name: <FormattedMessage id='name' /> }\n     */\n    columnLabels: { [name: string]: React.ReactNode };\n\n    /**\n     * Hide a sorted column will result in an error, so disable at least one important fallback column\n     * or the sorted column (fallback column recommended)\n     */\n    disabledColumns: string[];\n\n    /**\n     * Optional object of detail properties to be shown in the details section of the respective\n     * column item. If the prop is not given, the width sections won't be rendered.\n     * The keys of this object are the column names / keys you use to identify a column.\n     */\n    columnsDetails?: TableColumnDetailsMap;\n\n    /**\n     * The label shown when the column width is unset, which means \"auto\".\n     *\n     * @default ''\n     */\n    autoLabel?: string | React.ReactNode;\n\n    /**\n     * Text for the \"apply\" button. This button will not be shown when\n     * `immediateChange` is enabled.\n     */\n    applyButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"cancel\" button. This button will not be shown when\n     * `immediateChange` is enabled.\n     */\n    cancelButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"close\" button. This button will only be shown when\n     * `immediateChange` is enabled.\n     */\n    closeButtonText?: string | React.ReactNode;\n\n    /**\n     * Text for the \"reset to default\" button.\n     */\n    resetButtonText: string | React.ReactNode;\n\n    /**\n     * Callback function for when the column order or visibility changes.\n     *\n     * @param columnOrder\n     * @param hiddenColumns\n     * @param columnsDetails\n     * @returns\n     */\n    onColumnChange?: (columnOrder: string[], hiddenColumns: string[], columnsDetails?: TableColumnDetailsMap) => void;\n\n    /**\n     * Callback function for when a single column details like width changes.\n     *\n     * @param column\n     * @param columnsDetails\n     * @returns\n     */\n    onColumnDetailsChange?: (column: string, columnsDetails: TableColumnDetails) => void;\n\n    /**\n     * Callback function for when the changes are discarded and the dialog should close.\n     * Will not be triggered when `immediateChange` is enabled.\n     *\n     * @returns\n     */\n    onDiscard?: () => void;\n\n    /**\n     * Callback function for when the final changes should be applied and the dialog should close.\n     * Will not be triggered when `immediateChange `is enabled.\n     *\n     * @param columnOrder\n     * @param hiddenColumns\n     * @param columnsDetails\n     * @returns\n     */\n    onApply?: (columnOrder: string[], hiddenColumns: string[], columnsDetails: TableColumnDetailsMap) => void;\n\n    /**\n     * Callback function for when dialog should close.\n     *\n     * @returns\n     */\n    onHide: () => void;\n\n    /**\n     * Search value which should be set for the search field when the dialog opens.\n     */\n    columnSearchValue?: string;\n\n    /**\n     * Callback function for when the search value changes.\n     *\n     * @param value\n     * @returns\n     */\n    onSearchChange?: (value: string) => void;\n\n    /**\n     * Placeholder text for the search input.\n     */\n    searchPlaceholder: React.ReactNode;\n\n    /**\n     * Message that should be shown when column search result is empty.\n     */\n    notFoundMessage?: string;\n\n    /**\n     * Defines whether or not all changes apply immediately. If so, no cancel and apply buttons are shown.\n     * Enable this if you want to update the table after each change. Be aware of having side effects when\n     * toggling columns where data need to be fetched from the backend.\n     *\n     * @default false\n     */\n    immediateChange?: boolean;\n\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableSettingsDialog = (props: TableSettingsDialogProps) => {\n    const {\n        show = false,\n        title,\n        subtitle,\n        className,\n        defaultColumnOrder = [],\n        defaultHiddenColumns = [],\n        defaultColumnDetails = {},\n        columnOrder: extColumnOrder = [],\n        hiddenColumns: extHiddenColumns = [],\n        columnLabels = {},\n        disabledColumns = [],\n        columnsDetails: extColumnsDetails = {},\n        autoLabel = '',\n        applyButtonText,\n        cancelButtonText,\n        closeButtonText,\n        resetButtonText,\n        onColumnChange = noop,\n        onColumnDetailsChange = noop,\n        onDiscard = noop,\n        onApply = noop,\n        onHide,\n        columnSearchValue: extColumnSearchValue = '',\n        onSearchChange = noop,\n        searchPlaceholder,\n        notFoundMessage = '',\n        immediateChange = false,\n    } = props;\n\n    const [columnSearchValue, setColumnSearchValue] = useState(extColumnSearchValue);\n    const [columnOrder, setColumnOrder] = useState(extColumnOrder);\n    const [hiddenColumns, setHiddenColumns] = useState(extHiddenColumns || defaultHiddenColumns);\n\n    const [columnsDetails, setColumnsDetails] = useState(extColumnsDetails);\n    const [openColumnsDetails, setOpenColumnsDetails] = useState<Record<string, string>>({});\n\n    const [columnLabelStrings, setColumnLabelStrings] = useState<ColumnLabelStrings>({});\n    const [updateColumnLabelStrings, setUpdateColumnLabelStrings] = useState(true);\n\n    // Dirty flag for offering to reset changes or to discard them\n    const [hasChanged, setHasChanged] = useState(false);\n    const [isResetAll, setIsResetAll] = useState(false);\n\n    const [movedColumn, setMovedColumn] = useState(false);\n\n    const contentRef = useRef<HTMLDivElement>(null);\n\n    const defaultColumnDetailsRef = useRef(defaultColumnDetails);\n\n    // Update items from outside\n    useEffect(() => {\n        setColumnSearchValue(extColumnSearchValue);\n        setColumnOrder(extColumnOrder);\n        setHiddenColumns(extHiddenColumns);\n        setColumnsDetails(extColumnsDetails);\n\n        if (show) {\n            getColumnLabelStringsFromDOM();\n        }\n\n        const externalColumnOrder = extColumnOrder ?? defaultColumnOrder;\n        const externalHiddenColumns = extHiddenColumns ?? defaultHiddenColumns;\n        const externalColumnsDetails = extColumnsDetails ?? {};\n\n        const hasChangesFromDefaults =\n            !isEqual(externalColumnOrder, defaultColumnOrder) ||\n            !isEqual(externalHiddenColumns, defaultHiddenColumns) ||\n            hasColumnsDetailsChanged(externalColumnsDetails);\n        setHasChanged(hasChangesFromDefaults);\n    }, [\n        extColumnSearchValue,\n        extColumnOrder,\n        extHiddenColumns,\n        extColumnsDetails,\n        defaultColumnOrder,\n        defaultHiddenColumns,\n        show,\n    ]);\n\n    const hasColumnsDetailsChanged = (columnsDetailsToCheck: TableColumnDetailsMap) => {\n        if (isEmpty(defaultColumnDetailsRef.current)) {\n            return false;\n        }\n\n        const getEffectiveWidth = (details: TableColumnDetails | undefined) => {\n            if (!details) {\n                return DEFAULT_COLUMN_WIDTH;\n            }\n            const { width, defaultWidth } = details;\n            if (Number.isFinite(width)) {\n                return width as number;\n            }\n            if (Number.isFinite(defaultWidth)) {\n                return defaultWidth as number;\n            }\n            return DEFAULT_COLUMN_WIDTH;\n        };\n\n        return Object.keys(defaultColumnDetailsRef.current).some(key => {\n            const baseline = defaultColumnDetailsRef.current[key];\n            const current = columnsDetailsToCheck[key];\n            return getEffectiveWidth(current) !== getEffectiveWidth(baseline);\n        });\n    };\n\n    const getColumnLabelStringsFromDOM = () => {\n        if (!contentRef.current) {\n            return;\n        }\n\n        // For searching by name we need to get the label from the DOM as it may contain a FormattedMessage\n        const labels = contentRef.current.getElementsByClassName('table-settings-item-label');\n\n        const columnStrings: { [key: string]: string } = {};\n        [...labels].forEach(label => {\n            const dataKey = label.getAttribute('data-key');\n            if (dataKey) {\n                const updatedLabel = label.textContent?.replace(/\\r?\\n|\\r/g, '').toLowerCase();\n                if (updatedLabel) {\n                    columnStrings[dataKey] = updatedLabel;\n                }\n            }\n        });\n\n        setColumnLabelStrings(columnStrings);\n        setUpdateColumnLabelStrings(false);\n    };\n\n    const deleteMovedColumn = () => {\n        setMovedColumn(false);\n    };\n\n    const moveColumnToIndex = (columnName: string, newIndex: number, changeMovedColumn: boolean) => {\n        const newColumnOrder = columnOrder.filter(name => name !== columnName);\n        newColumnOrder.splice(newIndex, 0, columnName);\n\n        setColumnOrder(newColumnOrder);\n        setMovedColumn(changeMovedColumn ? !!columnName : false);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(newColumnOrder, hiddenColumns);\n        }\n\n        setTimeout(deleteMovedColumn, 500);\n    };\n\n    const handleResetColumnChanges = () => setIsResetAll(true);\n    const handleCancelResetColumnChanges = () => setIsResetAll(false);\n\n    const resetColumnsDetails = (details: TableColumnDetailsMap) => {\n        // If explicit defaults were provided, return them to keep shape identical to the baseline.\n        if (!isEmpty(defaultColumnDetails)) {\n            return defaultColumnDetails;\n        }\n\n        // Fallback: derive sparse defaults like before\n        return mapValues(details, (singleColumnDetails: TableColumnDetails) => {\n            if (Number.isFinite(singleColumnDetails.defaultWidth)) {\n                const defaultWidth = singleColumnDetails.defaultWidth as number;\n                return { ...singleColumnDetails, width: defaultWidth };\n            }\n\n            const { width: _ignoredWidth, defaultWidth: _ignoredDefaultWidth, ...rest } = singleColumnDetails;\n            return rest;\n        });\n    };\n\n    const resetAllColumnChanges = () => {\n        const defaultColumnsDetails = resetColumnsDetails(columnsDetails);\n\n        setColumnOrder(defaultColumnOrder);\n        setHiddenColumns(defaultHiddenColumns);\n        setColumnSearchValue('');\n        setHasChanged(false);\n        setIsResetAll(false);\n\n        if (!isEmpty(columnsDetails)) {\n            setColumnsDetails(defaultColumnsDetails);\n        }\n\n        if (immediateChange) {\n            onSearchChange('');\n            onColumnChange(defaultColumnOrder, defaultHiddenColumns, defaultColumnsDetails);\n        }\n    };\n\n    const discardColumnChanges = () => {\n        onSearchChange('');\n        // onCancel();\n        onDiscard();\n        onHide();\n    };\n\n    const handleManuallyApplyChanges = () => {\n        setColumnSearchValue('');\n\n        onSearchChange('');\n        onColumnChange(columnOrder, hiddenColumns, columnsDetails);\n        onApply(columnOrder, hiddenColumns, columnsDetails);\n        onHide();\n    };\n\n    const toggleHideColumn = (column: string) => {\n        const isHidden = hiddenColumns.includes(column);\n        const newHiddenColumns = isHidden ? hiddenColumns.filter(name => name !== column) : [...hiddenColumns, column];\n\n        setHiddenColumns(newHiddenColumns);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(columnOrder, newHiddenColumns);\n        }\n    };\n\n    const handleSearchChange = (searchValue: string) => {\n        const newSearch = searchValue.toLowerCase();\n\n        setColumnSearchValue(() => {\n            onSearchChange(newSearch);\n            return newSearch;\n        });\n    };\n\n    const handleColumnWidthChange = (column: keyof TableColumnDetailsMap, value: number) => {\n        const previousColumnDetails = columnsDetails[column];\n        const updatedColumnDetails = previousColumnDetails\n            ? { ...previousColumnDetails, width: value }\n            : {\n                  width: value,\n                  defaultWidth: DEFAULT_COLUMN_WIDTH,\n                  maxWidth: MAX_COLUMN_WIDTH,\n              };\n        const updatedColumnsDetails = { ...columnsDetails, [column]: updatedColumnDetails };\n\n        setColumnsDetails(updatedColumnsDetails);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnDetailsChange(column, updatedColumnDetails);\n        }\n    };\n\n    const handleResetColumnWidth = (column: keyof TableColumnDetailsMap) => {\n        const previousColumnDetails = columnsDetails[column];\n        if (!previousColumnDetails) {\n            return;\n        }\n\n        const updatedColumnDetails = {\n            ...previousColumnDetails,\n            width: previousColumnDetails.defaultWidth ?? DEFAULT_COLUMN_WIDTH,\n        };\n        const updatedColumnsDetails = { ...columnsDetails, [column]: updatedColumnDetails };\n\n        setColumnsDetails(updatedColumnsDetails);\n\n        if (immediateChange) {\n            onColumnDetailsChange(column, updatedColumnDetails);\n        }\n    };\n\n    const handleOpenColumnsDetails = (columnName: keyof TableColumnDetailsMap) => {\n        const updatedOpenColumnDetails = { ...openColumnsDetails };\n\n        if (updatedOpenColumnDetails[columnName]) {\n            delete updatedOpenColumnDetails[columnName];\n        } else {\n            updatedOpenColumnDetails[columnName] = columnName;\n        }\n\n        setOpenColumnsDetails(updatedOpenColumnDetails);\n    };\n\n    const handleSortEnd = (event: DragEndEvent, previousOrder: string[]) => {\n        const { active, over } = event;\n\n        const activeId = active.id;\n        const overId = over?.id;\n\n        if (activeId === overId) {\n            return;\n        }\n\n        const oldIndex = previousOrder.indexOf(String(activeId));\n        const newIndex = previousOrder.indexOf(String(overId));\n\n        const newColumnOrder = arrayMove(previousOrder, oldIndex, newIndex);\n\n        setColumnOrder(newColumnOrder);\n        setMovedColumn(true);\n        setHasChanged(true);\n\n        if (immediateChange) {\n            onColumnChange(newColumnOrder, hiddenColumns);\n        }\n    };\n\n    const renderTableSettingsDialogContent = () => {\n        const itemProps = {\n            columnLabels,\n            autoLabel,\n            disabledColumns,\n            columnOrder,\n            hiddenColumns,\n            columnSearchValue,\n            columnsDetails,\n            columnLabelStrings,\n            openColumnsDetails,\n            updateColumnLabelStrings,\n            onMoveColumn: moveColumnToIndex,\n            onOpenDetails: handleOpenColumnsDetails,\n            onColumnWidthChange: handleColumnWidthChange,\n            onResetColumnWidth: handleResetColumnWidth,\n            onToggleHideColumn: toggleHideColumn,\n        };\n\n        const filteredColumns = columnOrder.filter(column =>\n            filterColumns(columnSearchValue, column, columnLabelStrings)\n        );\n\n        const hasItems = !isEqual(filteredColumns, columnOrder);\n\n        return (\n            <div ref={contentRef}>\n                <div className='table-settings-search'>\n                    <div className='input-group width-100pct'>\n                        <span className='input-group-addon'>\n                            <span className='rioglyph rioglyph-search' />\n                        </span>\n                        <ClearableInput\n                            value={columnSearchValue}\n                            onChange={handleSearchChange}\n                            placeholder={searchPlaceholder}\n                        />\n                    </div>\n                </div>\n                <div className='table-settings-body'>\n                    {hasItems ? (\n                        <TableSettingsListContainer\n                            items={columnOrder}\n                            onSortEnd={handleSortEnd}\n                            itemProps={{ ...itemProps }}\n                        />\n                    ) : (\n                        <div className='text-center text-color-gray'>{notFoundMessage}</div>\n                    )}\n                </div>\n            </div>\n        );\n    };\n\n    const renderTableSettingsDialogFooter = () => {\n        return (\n            <TableSettingsDialogFooter\n                hasChanged={hasChanged}\n                isResetAll={isResetAll}\n                immediateChange={immediateChange}\n                resetButtonText={resetButtonText}\n                closeButtonText={closeButtonText}\n                cancelButtonText={cancelButtonText}\n                applyButtonText={applyButtonText}\n                onHide={onHide}\n                onResetColumnChanges={handleResetColumnChanges}\n                onDiscardChanges={discardColumnChanges}\n                onApplyChanges={handleManuallyApplyChanges}\n                onConfirmResetColumnChanges={resetAllColumnChanges}\n                onCancelResetColumnChanges={handleCancelResetColumnChanges}\n            />\n        );\n    };\n\n    if (!show) {\n        return null;\n    }\n\n    const dialogClassNames = classNames('TableSettingsDialog', className);\n\n    return (\n        <Dialog\n            show={show}\n            title={title}\n            subtitle={subtitle}\n            onClose={onHide}\n            body={renderTableSettingsDialogContent()}\n            footer={renderTableSettingsDialogFooter()}\n            className={dialogClassNames}\n        />\n    );\n};\n\nexport default TableSettingsDialog;\n"],"names":["DEFAULT_COLUMN_WIDTH","MAX_COLUMN_WIDTH","TableSettingsDialog","props","show","title","subtitle","className","defaultColumnOrder","defaultHiddenColumns","defaultColumnDetails","extColumnOrder","extHiddenColumns","columnLabels","disabledColumns","extColumnsDetails","autoLabel","applyButtonText","cancelButtonText","closeButtonText","resetButtonText","onColumnChange","noop","onColumnDetailsChange","onDiscard","onApply","onHide","extColumnSearchValue","onSearchChange","searchPlaceholder","notFoundMessage","immediateChange","columnSearchValue","setColumnSearchValue","useState","columnOrder","setColumnOrder","hiddenColumns","setHiddenColumns","columnsDetails","setColumnsDetails","openColumnsDetails","setOpenColumnsDetails","columnLabelStrings","setColumnLabelStrings","updateColumnLabelStrings","setUpdateColumnLabelStrings","hasChanged","setHasChanged","isResetAll","setIsResetAll","movedColumn","setMovedColumn","contentRef","useRef","defaultColumnDetailsRef","useEffect","getColumnLabelStringsFromDOM","externalColumnOrder","externalHiddenColumns","externalColumnsDetails","hasChangesFromDefaults","isEqual","hasColumnsDetailsChanged","columnsDetailsToCheck","isEmpty","getEffectiveWidth","details","width","defaultWidth","key","baseline","current","labels","columnStrings","label","dataKey","updatedLabel","deleteMovedColumn","moveColumnToIndex","columnName","newIndex","changeMovedColumn","newColumnOrder","name","handleResetColumnChanges","handleCancelResetColumnChanges","resetColumnsDetails","mapValues","singleColumnDetails","_ignoredWidth","_ignoredDefaultWidth","rest","resetAllColumnChanges","defaultColumnsDetails","discardColumnChanges","handleManuallyApplyChanges","toggleHideColumn","column","newHiddenColumns","handleSearchChange","searchValue","newSearch","handleColumnWidthChange","value","previousColumnDetails","updatedColumnDetails","updatedColumnsDetails","handleResetColumnWidth","handleOpenColumnsDetails","updatedOpenColumnDetails","handleSortEnd","event","previousOrder","active","over","activeId","overId","oldIndex","arrayMove","renderTableSettingsDialogContent","itemProps","filteredColumns","filterColumns","hasItems","jsxs","jsx","ClearableInput","TableSettingsListContainer","renderTableSettingsDialogFooter","TableSettingsDialogFooter","dialogClassNames","classNames","Dialog"],"mappings":"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"}

package/components/table/TableSettingsDialogFooter.js

@@ -1,5 +1,5 @@
 import { jsxs as t, jsx as n } from "react/jsx-runtime";
-import y from "classnames";
+import y from "../../utils/classNames.js";
 import e from "../button/Button.js";
 const R = (l) => {
   const {

package/components/table/TableSettingsDialogFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableSettingsDialogFooter.js","sources":["../../../src/components/table/TableSettingsDialogFooter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\n\nexport type TableSettingsDialogFooterProps = {\n    hasChanged: boolean;\n    isResetAll: boolean;\n    immediateChange: boolean;\n    resetButtonText: string | ReactNode;\n    closeButtonText: string | ReactNode;\n    cancelButtonText: string | ReactNode;\n    applyButtonText: string | ReactNode;\n    onHide: () => void;\n    onResetColumnChanges: () => void;\n    onDiscardChanges: () => void;\n    onApplyChanges: () => void;\n    onConfirmResetColumnChanges: () => void;\n    onCancelResetColumnChanges: () => void;\n};\n\nexport const TableSettingsDialogFooter = (props: TableSettingsDialogFooterProps) => {\n    const {\n        hasChanged,\n        isResetAll,\n        immediateChange,\n        resetButtonText,\n        closeButtonText,\n        cancelButtonText,\n        applyButtonText,\n        onHide,\n        onResetColumnChanges,\n        onDiscardChanges,\n        onApplyChanges,\n        onConfirmResetColumnChanges,\n        onCancelResetColumnChanges,\n    } = props;\n\n    const restButtonClassNames = classNames('btn', 'btn-default btn-link', !hasChanged && 'disabled');\n\n    return (\n        <div className='display-flex justify-content-between'>\n            <div>\n                {!isResetAll && (\n                    <div className={restButtonClassNames} onClick={onResetColumnChanges}>\n                        <span className='rioglyph rioglyph-revert text-size-xs margin-right-10' />\n                        {resetButtonText}\n                    </div>\n                )}\n                {isResetAll && (\n                    <div className='btn-group'>\n                        <Button\n                            iconOnly\n                            iconName='rioglyph-remove'\n                            className='margin-right-5 btn-outline'\n                            onClick={onCancelResetColumnChanges}\n                        />\n                        <Button\n                            iconOnly\n                            bsStyle={Button.PRIMARY}\n                            iconName='rioglyph-ok'\n                            onClick={onConfirmResetColumnChanges}\n                        />\n                    </div>\n                )}\n            </div>\n            {immediateChange ? (\n                <Button onClick={onHide}>{closeButtonText}</Button>\n            ) : (\n                <div className='btn-toolbar'>\n                    <Button onClick={onDiscardChanges}>{cancelButtonText}</Button>\n                    <Button bsStyle={Button.PRIMARY} onClick={onApplyChanges}>\n                        {applyButtonText}\n                    </Button>\n                </div>\n            )}\n        </div>\n    );\n};\n"],"names":["TableSettingsDialogFooter","props","hasChanged","isResetAll","immediateChange","resetButtonText","closeButtonText","cancelButtonText","applyButtonText","onHide","onResetColumnChanges","onDiscardChanges","onApplyChanges","onConfirmResetColumnChanges","onCancelResetColumnChanges","restButtonClassNames","classNames","jsxs","jsx","Button"],"mappings":";;;AAqBO,MAAMA,IAA4B,CAACC,MAA0C;AAChF,QAAM;AAAA,IACF,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,6BAAAC;AAAA,IACA,4BAAAC;AAAA,EAAA,IACAb,GAEEc,IAAuBC,EAAW,OAAO,wBAAwB,CAACd,KAAc,UAAU;AAEhG,SACI,gBAAAe,EAAC,OAAA,EAAI,WAAU,wCACX,UAAA;AAAA,IAAA,gBAAAA,EAAC,OAAA,EACI,UAAA;AAAA,MAAA,CAACd,KACE,gBAAAc,EAAC,OAAA,EAAI,WAAWF,GAAsB,SAASL,GAC3C,UAAA;AAAA,QAAA,gBAAAQ,EAAC,QAAA,EAAK,WAAU,wDAAA,CAAwD;AAAA,QACvEb;AAAA,MAAA,GACL;AAAA,MAEHF,KACG,gBAAAc,EAAC,OAAA,EAAI,WAAU,aACX,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,UAAQ;AAAA,YACR,UAAS;AAAA,YACT,WAAU;AAAA,YACV,SAASL;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,UAAQ;AAAA,YACR,SAASA,EAAO;AAAA,YAChB,UAAS;AAAA,YACT,SAASN;AAAA,UAAA;AAAA,QAAA;AAAA,MACb,EAAA,CACJ;AAAA,IAAA,GAER;AAAA,IACCT,IACG,gBAAAc,EAACC,GAAA,EAAO,SAASV,GAAS,aAAgB,IAE1C,gBAAAQ,EAAC,OAAA,EAAI,WAAU,eACX,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAO,SAASR,GAAmB,UAAAJ,GAAiB;AAAA,wBACpDY,GAAA,EAAO,SAASA,EAAO,SAAS,SAASP,GACrC,UAAAJ,EAAA,CACL;AAAA,IAAA,EAAA,CACJ;AAAA,EAAA,GAER;AAER;"}
+{"version":3,"file":"TableSettingsDialogFooter.js","sources":["../../../src/components/table/TableSettingsDialogFooter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport classNames from '../../utils/classNames';\nimport Button from '../../Button';\n\nexport type TableSettingsDialogFooterProps = {\n    hasChanged: boolean;\n    isResetAll: boolean;\n    immediateChange: boolean;\n    resetButtonText: string | ReactNode;\n    closeButtonText: string | ReactNode;\n    cancelButtonText: string | ReactNode;\n    applyButtonText: string | ReactNode;\n    onHide: () => void;\n    onResetColumnChanges: () => void;\n    onDiscardChanges: () => void;\n    onApplyChanges: () => void;\n    onConfirmResetColumnChanges: () => void;\n    onCancelResetColumnChanges: () => void;\n};\n\nexport const TableSettingsDialogFooter = (props: TableSettingsDialogFooterProps) => {\n    const {\n        hasChanged,\n        isResetAll,\n        immediateChange,\n        resetButtonText,\n        closeButtonText,\n        cancelButtonText,\n        applyButtonText,\n        onHide,\n        onResetColumnChanges,\n        onDiscardChanges,\n        onApplyChanges,\n        onConfirmResetColumnChanges,\n        onCancelResetColumnChanges,\n    } = props;\n\n    const restButtonClassNames = classNames('btn', 'btn-default btn-link', !hasChanged && 'disabled');\n\n    return (\n        <div className='display-flex justify-content-between'>\n            <div>\n                {!isResetAll && (\n                    <div className={restButtonClassNames} onClick={onResetColumnChanges}>\n                        <span className='rioglyph rioglyph-revert text-size-xs margin-right-10' />\n                        {resetButtonText}\n                    </div>\n                )}\n                {isResetAll && (\n                    <div className='btn-group'>\n                        <Button\n                            iconOnly\n                            iconName='rioglyph-remove'\n                            className='margin-right-5 btn-outline'\n                            onClick={onCancelResetColumnChanges}\n                        />\n                        <Button\n                            iconOnly\n                            bsStyle={Button.PRIMARY}\n                            iconName='rioglyph-ok'\n                            onClick={onConfirmResetColumnChanges}\n                        />\n                    </div>\n                )}\n            </div>\n            {immediateChange ? (\n                <Button onClick={onHide}>{closeButtonText}</Button>\n            ) : (\n                <div className='btn-toolbar'>\n                    <Button onClick={onDiscardChanges}>{cancelButtonText}</Button>\n                    <Button bsStyle={Button.PRIMARY} onClick={onApplyChanges}>\n                        {applyButtonText}\n                    </Button>\n                </div>\n            )}\n        </div>\n    );\n};\n"],"names":["TableSettingsDialogFooter","props","hasChanged","isResetAll","immediateChange","resetButtonText","closeButtonText","cancelButtonText","applyButtonText","onHide","onResetColumnChanges","onDiscardChanges","onApplyChanges","onConfirmResetColumnChanges","onCancelResetColumnChanges","restButtonClassNames","classNames","jsxs","jsx","Button"],"mappings":";;;AAqBO,MAAMA,IAA4B,CAACC,MAA0C;AAChF,QAAM;AAAA,IACF,YAAAC;AAAA,IACA,YAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,6BAAAC;AAAA,IACA,4BAAAC;AAAA,EAAA,IACAb,GAEEc,IAAuBC,EAAW,OAAO,wBAAwB,CAACd,KAAc,UAAU;AAEhG,SACI,gBAAAe,EAAC,OAAA,EAAI,WAAU,wCACX,UAAA;AAAA,IAAA,gBAAAA,EAAC,OAAA,EACI,UAAA;AAAA,MAAA,CAACd,KACE,gBAAAc,EAAC,OAAA,EAAI,WAAWF,GAAsB,SAASL,GAC3C,UAAA;AAAA,QAAA,gBAAAQ,EAAC,QAAA,EAAK,WAAU,wDAAA,CAAwD;AAAA,QACvEb;AAAA,MAAA,GACL;AAAA,MAEHF,KACG,gBAAAc,EAAC,OAAA,EAAI,WAAU,aACX,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,UAAQ;AAAA,YACR,UAAS;AAAA,YACT,WAAU;AAAA,YACV,SAASL;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,UAAQ;AAAA,YACR,SAASA,EAAO;AAAA,YAChB,UAAS;AAAA,YACT,SAASN;AAAA,UAAA;AAAA,QAAA;AAAA,MACb,EAAA,CACJ;AAAA,IAAA,GAER;AAAA,IACCT,IACG,gBAAAc,EAACC,GAAA,EAAO,SAASV,GAAS,aAAgB,IAE1C,gBAAAQ,EAAC,OAAA,EAAI,WAAU,eACX,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAO,SAASR,GAAmB,UAAAJ,GAAiB;AAAA,wBACpDY,GAAA,EAAO,SAASA,EAAO,SAAS,SAASP,GACrC,UAAAJ,EAAA,CACL;AAAA,IAAA,EAAA,CACJ;AAAA,EAAA,GAER;AAER;"}

package/components/table/TableSettingsListContainer.d.ts

@@ -1,5 +1,5 @@
 import { DragEndEvent } from '@dnd-kit/core';
-import { TableSettingsItemProps } from './TableSettingsDialog.types';
+import { TableSettingsItemProps } from './TableSettingsDialog';
 export type TableSettingsListContainerProps = {
     items: string[];
     itemProps: TableSettingsItemProps;

package/components/table/TableSettingsListContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableSettingsListContainer.js","sources":["../../../src/components/table/TableSettingsListContainer.tsx"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport {\n    closestCenter,\n    DndContext,\n    type DragEndEvent,\n    type DragStartEvent,\n    KeyboardSensor,\n    PointerSensor,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport { SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport type { UniqueIdentifier } from '@dnd-kit/core/dist/types';\n\nimport TableSettingsListItem from './TableSettingsListItem';\nimport type { TableSettingsItemProps } from './TableSettingsDialog.types';\n\nexport type TableSettingsListContainerProps = {\n    items: string[];\n    itemProps: TableSettingsItemProps;\n    onSortEnd: (event: DragEndEvent, previousOrder: string[]) => void;\n};\n\nexport const TableSettingsListContainer = (props: TableSettingsListContainerProps) => {\n    const { items, itemProps, onSortEnd } = props;\n\n    const [activeDraggedColumn, setActiveDraggedColumn] = useState<UniqueIdentifier | null>(null);\n\n    const sensors = useSensors(\n        useSensor(PointerSensor),\n        useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates })\n    );\n\n    const handleDragStart = useCallback((event: DragStartEvent) => {\n        setActiveDraggedColumn(event.active.id);\n    }, []);\n\n    const handleDragEnd = (event: DragEndEvent) => {\n        setActiveDraggedColumn(null);\n        onSortEnd(event, items);\n    };\n\n    const activeClass = 'table-settings-item shadow-smooth-to-bottom z-index-max';\n\n    return (\n        <div className='table-settings-items-container'>\n            <DndContext\n                sensors={sensors}\n                collisionDetection={closestCenter}\n                modifiers={[restrictToVerticalAxis]}\n                onDragStart={handleDragStart}\n                onDragEnd={handleDragEnd}\n            >\n                <SortableContext items={items} strategy={verticalListSortingStrategy}>\n                    {items.map((column, index) => (\n                        <TableSettingsListItem\n                            key={column}\n                            column={column}\n                            orderIndex={index}\n                            isActive={activeDraggedColumn === column}\n                            className={activeDraggedColumn === column ? activeClass : ''}\n                            {...itemProps}\n                        />\n                    ))}\n                </SortableContext>\n            </DndContext>\n        </div>\n    );\n};\n"],"names":["TableSettingsListContainer","props","items","itemProps","onSortEnd","activeDraggedColumn","setActiveDraggedColumn","useState","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","handleDragStart","useCallback","event","handleDragEnd","activeClass","jsx","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","verticalListSortingStrategy","column","index","TableSettingsListItem"],"mappings":";;;;;;AAwBO,MAAMA,IAA6B,CAACC,MAA2C;AAClF,QAAM,EAAE,OAAAC,GAAO,WAAAC,GAAW,WAAAC,EAAA,IAAcH,GAElC,CAACI,GAAqBC,CAAsB,IAAIC,EAAkC,IAAI,GAEtFC,IAAUC;AAAA,IACZC,EAAUC,CAAa;AAAA,IACvBD,EAAUE,GAAgB,EAAE,kBAAkBC,GAA6B;AAAA,EAAA,GAGzEC,IAAkBC,EAAY,CAACC,MAA0B;AAC3D,IAAAV,EAAuBU,EAAM,OAAO,EAAE;AAAA,EAC1C,GAAG,CAAA,CAAE,GAECC,IAAgB,CAACD,MAAwB;AAC3C,IAAAV,EAAuB,IAAI,GAC3BF,EAAUY,GAAOd,CAAK;AAAA,EAC1B,GAEMgB,IAAc;AAEpB,SACI,gBAAAC,EAAC,OAAA,EAAI,WAAU,kCACX,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,SAAAZ;AAAA,MACA,oBAAoBa;AAAA,MACpB,WAAW,CAACC,CAAsB;AAAA,MAClC,aAAaR;AAAA,MACb,WAAWG;AAAA,MAEX,UAAA,gBAAAE,EAACI,KAAgB,OAAArB,GAAc,UAAUsB,GACpC,UAAAtB,EAAM,IAAI,CAACuB,GAAQC,MAChB,gBAAAP;AAAA,QAACQ;AAAA,QAAA;AAAA,UAEG,QAAAF;AAAA,UACA,YAAYC;AAAA,UACZ,UAAUrB,MAAwBoB;AAAA,UAClC,WAAWpB,MAAwBoB,IAASP,IAAc;AAAA,UACzD,GAAGf;AAAA,QAAA;AAAA,QALCsB;AAAA,MAAA,CAOZ,EAAA,CACL;AAAA,IAAA;AAAA,EAAA,GAER;AAER;"}
+{"version":3,"file":"TableSettingsListContainer.js","sources":["../../../src/components/table/TableSettingsListContainer.tsx"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport {\n    closestCenter,\n    DndContext,\n    type DragEndEvent,\n    type DragStartEvent,\n    KeyboardSensor,\n    PointerSensor,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport { SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { restrictToVerticalAxis } from '@dnd-kit/modifiers';\nimport type { UniqueIdentifier } from '@dnd-kit/core/dist/types';\n\nimport TableSettingsListItem from './TableSettingsListItem';\nimport type { TableSettingsItemProps } from './TableSettingsDialog';\n\nexport type TableSettingsListContainerProps = {\n    items: string[];\n    itemProps: TableSettingsItemProps;\n    onSortEnd: (event: DragEndEvent, previousOrder: string[]) => void;\n};\n\nexport const TableSettingsListContainer = (props: TableSettingsListContainerProps) => {\n    const { items, itemProps, onSortEnd } = props;\n\n    const [activeDraggedColumn, setActiveDraggedColumn] = useState<UniqueIdentifier | null>(null);\n\n    const sensors = useSensors(\n        useSensor(PointerSensor),\n        useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates })\n    );\n\n    const handleDragStart = useCallback((event: DragStartEvent) => {\n        setActiveDraggedColumn(event.active.id);\n    }, []);\n\n    const handleDragEnd = (event: DragEndEvent) => {\n        setActiveDraggedColumn(null);\n        onSortEnd(event, items);\n    };\n\n    const activeClass = 'table-settings-item shadow-smooth-to-bottom z-index-max';\n\n    return (\n        <div className='table-settings-items-container'>\n            <DndContext\n                sensors={sensors}\n                collisionDetection={closestCenter}\n                modifiers={[restrictToVerticalAxis]}\n                onDragStart={handleDragStart}\n                onDragEnd={handleDragEnd}\n            >\n                <SortableContext items={items} strategy={verticalListSortingStrategy}>\n                    {items.map((column, index) => (\n                        <TableSettingsListItem\n                            key={column}\n                            column={column}\n                            orderIndex={index}\n                            isActive={activeDraggedColumn === column}\n                            className={activeDraggedColumn === column ? activeClass : ''}\n                            {...itemProps}\n                        />\n                    ))}\n                </SortableContext>\n            </DndContext>\n        </div>\n    );\n};\n"],"names":["TableSettingsListContainer","props","items","itemProps","onSortEnd","activeDraggedColumn","setActiveDraggedColumn","useState","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","handleDragStart","useCallback","event","handleDragEnd","activeClass","jsx","DndContext","closestCenter","restrictToVerticalAxis","SortableContext","verticalListSortingStrategy","column","index","TableSettingsListItem"],"mappings":";;;;;;AAwBO,MAAMA,IAA6B,CAACC,MAA2C;AAClF,QAAM,EAAE,OAAAC,GAAO,WAAAC,GAAW,WAAAC,EAAA,IAAcH,GAElC,CAACI,GAAqBC,CAAsB,IAAIC,EAAkC,IAAI,GAEtFC,IAAUC;AAAA,IACZC,EAAUC,CAAa;AAAA,IACvBD,EAAUE,GAAgB,EAAE,kBAAkBC,GAA6B;AAAA,EAAA,GAGzEC,IAAkBC,EAAY,CAACC,MAA0B;AAC3D,IAAAV,EAAuBU,EAAM,OAAO,EAAE;AAAA,EAC1C,GAAG,CAAA,CAAE,GAECC,IAAgB,CAACD,MAAwB;AAC3C,IAAAV,EAAuB,IAAI,GAC3BF,EAAUY,GAAOd,CAAK;AAAA,EAC1B,GAEMgB,IAAc;AAEpB,SACI,gBAAAC,EAAC,OAAA,EAAI,WAAU,kCACX,UAAA,gBAAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,SAAAZ;AAAA,MACA,oBAAoBa;AAAA,MACpB,WAAW,CAACC,CAAsB;AAAA,MAClC,aAAaR;AAAA,MACb,WAAWG;AAAA,MAEX,UAAA,gBAAAE,EAACI,KAAgB,OAAArB,GAAc,UAAUsB,GACpC,UAAAtB,EAAM,IAAI,CAACuB,GAAQC,MAChB,gBAAAP;AAAA,QAACQ;AAAA,QAAA;AAAA,UAEG,QAAAF;AAAA,UACA,YAAYC;AAAA,UACZ,UAAUrB,MAAwBoB;AAAA,UAClC,WAAWpB,MAAwBoB,IAASP,IAAc;AAAA,UACzD,GAAGf;AAAA,QAAA;AAAA,QALCsB;AAAA,MAAA,CAOZ,EAAA,CACL;AAAA,IAAA;AAAA,EAAA,GAER;AAER;"}

package/components/table/TableSettingsListItem.d.ts

@@ -1,4 +1,4 @@
-import { TableSettingsItemProps } from './TableSettingsDialog.types';
+import { TableSettingsItemProps } from './TableSettingsDialog';
 export declare const filterColumns: (searchValue: string, column: string, columnLabelStrings: Record<string, string>) => boolean;
 export type TableSettingsListItemProps = TableSettingsItemProps & {
     column: string;

package/components/table/TableSettingsListItem.js

@@ -1,8 +1,8 @@
 import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import R from "classnames";
-import { useSortable as $ } from "@dnd-kit/sortable";
-import { CSS as j } from "@dnd-kit/utilities";
-import { noop as H, isEmpty as _ } from "es-toolkit/compat";
+import { useSortable as R } from "@dnd-kit/sortable";
+import { CSS as $ } from "@dnd-kit/utilities";
+import { noop as j, isEmpty as H } from "es-toolkit/compat";
+import _ from "../../utils/classNames.js";
 import B from "../checkbox/Checkbox.js";
 import E from "../collapse/Collapse.js";
 import { TableSettingsColumnDetails as F } from "./TableSettingsColumnDetails.js";
@@ -25,16 +25,16 @@ const U = 1e3, X = (o, e, n) => o ? !(n[e] || "").toLowerCase().includes(o.toLow
     onResetColumnWidth: h,
     onMoveColumn: N,
     onOpenDetails: S,
-    onToggleHideColumn: x = H,
+    onToggleHideColumn: x = j,
     isActive: v = !1,
     className: L
-  } = o, i = !_(a), { attributes: D, listeners: T, setNodeRef: k, setActivatorNodeRef: w, transform: y, transition: W } = $({
+  } = o, i = !H(a), { attributes: D, listeners: T, setNodeRef: k, setActivatorNodeRef: w, transform: y, transition: W } = R({
     id: e,
     disabled: i
   }), A = {
-    transform: j.Transform.toString(y),
+    transform: $.Transform.toString(y),
     transition: W
-  }, I = X(a, e, C) && !m, M = R(
+  }, I = X(a, e, C) && !m, M = _(
     "table-settings-item",
     m && "opacity-0",
     I && "position-offscreen",

package/components/table/TableSettingsListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableSettingsListItem.js","sources":["../../../src/components/table/TableSettingsListItem.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { isEmpty, noop } from 'es-toolkit/compat';\n\nimport Checkbox from '../checkbox/Checkbox';\nimport Collapse from '../collapse/Collapse';\nimport { TableSettingsColumnDetails } from './TableSettingsColumnDetails';\nimport { TableSettingsColumnButtons } from './TableSettingsColumnButtons';\nimport type { TableSettingsItemProps } from './TableSettingsDialog.types';\n\nconst MAX_COLUMN_WIDTH = 1000;\n\nexport const filterColumns = (searchValue: string, column: string, columnLabelStrings: Record<string, string>) => {\n    if (!searchValue) {\n        return false;\n    }\n    const label = columnLabelStrings[column] || '';\n    return !label.toLowerCase().includes(searchValue.toLowerCase());\n};\n\nexport type TableSettingsListItemProps = TableSettingsItemProps & {\n    column: string;\n    orderIndex: number;\n    isActive: boolean;\n    className?: string;\n};\n\nconst TableSettingsListItem = (props: TableSettingsListItemProps) => {\n    const {\n        column,\n        orderIndex,\n        columnLabels,\n        autoLabel,\n        disabledColumns = [],\n        columnOrder,\n        hiddenColumns = [],\n        columnSearchValue,\n        columnsDetails,\n        columnLabelStrings = {},\n        openColumnsDetails = {},\n        updateColumnLabelStrings,\n        onColumnWidthChange,\n        onResetColumnWidth,\n        onMoveColumn,\n        onOpenDetails,\n        onToggleHideColumn = noop,\n        isActive = false,\n        className,\n    } = props;\n\n    const isSortingDisabled = !isEmpty(columnSearchValue);\n\n    const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition } = useSortable({\n        id: column,\n        disabled: isSortingDisabled,\n    });\n\n    const style = {\n        transform: CSS.Transform.toString(transform),\n        transition,\n    };\n\n    // Filter out items which don't match the search value.\n    // Note that we need to render all items at least once at the beginning in order to get their DOM labels\n    // otherwise the search won't work when initial search value is provided via props.\n    const isFiltered = filterColumns(columnSearchValue, column, columnLabelStrings) && !updateColumnLabelStrings;\n\n    const itemClassNames = classNames(\n        'table-settings-item',\n        updateColumnLabelStrings && 'opacity-0',\n        isFiltered && 'position-offscreen',\n        className\n    );\n\n    const columnDetails = columnsDetails[column];\n\n    return (\n        <div className={itemClassNames} key={`table-settings-item-${column}`} ref={setNodeRef} style={style}>\n            <div className='table-settings-item-header user-select-none' ref={setActivatorNodeRef}>\n                <div className='CheckboxWrapper display-flex align-items-center padding-left-2 margin-top--3'>\n                    <Checkbox\n                        checked={!hiddenColumns.includes(column)}\n                        onClick={event => {\n                            onToggleHideColumn(column);\n                            event.stopPropagation();\n                        }}\n                        disabled={disabledColumns.includes(column)}\n                    />\n                </div>\n                <div\n                    className={`table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`}\n                    data-key={column}\n                    {...attributes}\n                    {...listeners}\n                >\n                    {columnLabels[column]}\n                </div>\n                {columnDetails && (\n                    <div className='column-width-label'>\n                        {columnDetails.width ? `${columnDetails.width}px` : autoLabel}\n                    </div>\n                )}\n                <TableSettingsColumnButtons\n                    column={column}\n                    index={orderIndex}\n                    columnDetails={columnDetails}\n                    columnOrder={columnOrder}\n                    openColumnsDetails={openColumnsDetails}\n                    disabled={isSortingDisabled}\n                    onMoveColumn={onMoveColumn}\n                    onOpenDetails={onOpenDetails}\n                />\n            </div>\n            {columnDetails && !isActive && (\n                <Collapse open={!!openColumnsDetails[column]}>\n                    <div>\n                        <TableSettingsColumnDetails\n                            {...columnDetails}\n                            column={column}\n                            maxColumnWidth={MAX_COLUMN_WIDTH}\n                            onColumnWidthChange={onColumnWidthChange}\n                            onResetColumnWidth={onResetColumnWidth}\n                        />\n                    </div>\n                </Collapse>\n            )}\n        </div>\n    );\n};\n\nexport default TableSettingsListItem;\n"],"names":["MAX_COLUMN_WIDTH","filterColumns","searchValue","column","columnLabelStrings","TableSettingsListItem","props","orderIndex","columnLabels","autoLabel","disabledColumns","columnOrder","hiddenColumns","columnSearchValue","columnsDetails","openColumnsDetails","updateColumnLabelStrings","onColumnWidthChange","onResetColumnWidth","onMoveColumn","onOpenDetails","onToggleHideColumn","noop","isActive","className","isSortingDisabled","isEmpty","attributes","listeners","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","style","CSS","isFiltered","itemClassNames","classNames","columnDetails","jsxs","jsx","Checkbox","event","TableSettingsColumnButtons","Collapse","TableSettingsColumnDetails"],"mappings":"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"}
+{"version":3,"file":"TableSettingsListItem.js","sources":["../../../src/components/table/TableSettingsListItem.tsx"],"sourcesContent":["import { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { isEmpty, noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport Checkbox from '../checkbox/Checkbox';\nimport Collapse from '../collapse/Collapse';\nimport { TableSettingsColumnDetails } from './TableSettingsColumnDetails';\nimport { TableSettingsColumnButtons } from './TableSettingsColumnButtons';\nimport type { TableSettingsItemProps } from './TableSettingsDialog';\n\nconst MAX_COLUMN_WIDTH = 1000;\n\nexport const filterColumns = (searchValue: string, column: string, columnLabelStrings: Record<string, string>) => {\n    if (!searchValue) {\n        return false;\n    }\n    const label = columnLabelStrings[column] || '';\n    return !label.toLowerCase().includes(searchValue.toLowerCase());\n};\n\nexport type TableSettingsListItemProps = TableSettingsItemProps & {\n    column: string;\n    orderIndex: number;\n    isActive: boolean;\n    className?: string;\n};\n\nconst TableSettingsListItem = (props: TableSettingsListItemProps) => {\n    const {\n        column,\n        orderIndex,\n        columnLabels,\n        autoLabel,\n        disabledColumns = [],\n        columnOrder,\n        hiddenColumns = [],\n        columnSearchValue,\n        columnsDetails,\n        columnLabelStrings = {},\n        openColumnsDetails = {},\n        updateColumnLabelStrings,\n        onColumnWidthChange,\n        onResetColumnWidth,\n        onMoveColumn,\n        onOpenDetails,\n        onToggleHideColumn = noop,\n        isActive = false,\n        className,\n    } = props;\n\n    const isSortingDisabled = !isEmpty(columnSearchValue);\n\n    const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition } = useSortable({\n        id: column,\n        disabled: isSortingDisabled,\n    });\n\n    const style = {\n        transform: CSS.Transform.toString(transform),\n        transition,\n    };\n\n    // Filter out items which don't match the search value.\n    // Note that we need to render all items at least once at the beginning in order to get their DOM labels\n    // otherwise the search won't work when initial search value is provided via props.\n    const isFiltered = filterColumns(columnSearchValue, column, columnLabelStrings) && !updateColumnLabelStrings;\n\n    const itemClassNames = classNames(\n        'table-settings-item',\n        updateColumnLabelStrings && 'opacity-0',\n        isFiltered && 'position-offscreen',\n        className\n    );\n\n    const columnDetails = columnsDetails[column];\n\n    return (\n        <div className={itemClassNames} key={`table-settings-item-${column}`} ref={setNodeRef} style={style}>\n            <div className='table-settings-item-header user-select-none' ref={setActivatorNodeRef}>\n                <div className='CheckboxWrapper display-flex align-items-center padding-left-2 margin-top--3'>\n                    <Checkbox\n                        checked={!hiddenColumns.includes(column)}\n                        onClick={event => {\n                            onToggleHideColumn(column);\n                            event.stopPropagation();\n                        }}\n                        disabled={disabledColumns.includes(column)}\n                    />\n                </div>\n                <div\n                    className={`table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`}\n                    data-key={column}\n                    {...attributes}\n                    {...listeners}\n                >\n                    {columnLabels[column]}\n                </div>\n                {columnDetails && (\n                    <div className='column-width-label'>\n                        {columnDetails.width ? `${columnDetails.width}px` : autoLabel}\n                    </div>\n                )}\n                <TableSettingsColumnButtons\n                    column={column}\n                    index={orderIndex}\n                    columnDetails={columnDetails}\n                    columnOrder={columnOrder}\n                    openColumnsDetails={openColumnsDetails}\n                    disabled={isSortingDisabled}\n                    onMoveColumn={onMoveColumn}\n                    onOpenDetails={onOpenDetails}\n                />\n            </div>\n            {columnDetails && !isActive && (\n                <Collapse open={!!openColumnsDetails[column]}>\n                    <div>\n                        <TableSettingsColumnDetails\n                            {...columnDetails}\n                            column={column}\n                            maxColumnWidth={MAX_COLUMN_WIDTH}\n                            onColumnWidthChange={onColumnWidthChange}\n                            onResetColumnWidth={onResetColumnWidth}\n                        />\n                    </div>\n                </Collapse>\n            )}\n        </div>\n    );\n};\n\nexport default TableSettingsListItem;\n"],"names":["MAX_COLUMN_WIDTH","filterColumns","searchValue","column","columnLabelStrings","TableSettingsListItem","props","orderIndex","columnLabels","autoLabel","disabledColumns","columnOrder","hiddenColumns","columnSearchValue","columnsDetails","openColumnsDetails","updateColumnLabelStrings","onColumnWidthChange","onResetColumnWidth","onMoveColumn","onOpenDetails","onToggleHideColumn","noop","isActive","className","isSortingDisabled","isEmpty","attributes","listeners","setNodeRef","setActivatorNodeRef","transform","transition","useSortable","style","CSS","isFiltered","itemClassNames","classNames","columnDetails","jsxs","jsx","Checkbox","event","TableSettingsColumnButtons","Collapse","TableSettingsColumnDetails"],"mappings":"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"}

package/components/table/TableToolbar.js

@@ -1,5 +1,5 @@
 import { jsx as s } from "react/jsx-runtime";
-import l from "classnames";
+import l from "../../utils/classNames.js";
 const e = ({ className: a, children: o }) => /* @__PURE__ */ s("div", { className: l("table-toolbar", a), children: o });
 export {
   e as default

package/components/table/TableToolbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableToolbar.js","sources":["../../../src/components/table/TableToolbar.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport classNames from 'classnames';\n\nexport type TableToolbarProps = {\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableToolbar = ({ className, children }: PropsWithChildren<TableToolbarProps>) => (\n    <div className={classNames('table-toolbar', className)}>{children}</div>\n);\n\nexport default TableToolbar;\n"],"names":["TableToolbar","className","children","jsx","classNames"],"mappings":";;AAUA,MAAMA,IAAe,CAAC,EAAE,WAAAC,GAAW,UAAAC,EAAA,MAC/B,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAW,iBAAiBH,CAAS,GAAI,UAAAC,EAAA,CAAS;"}
+{"version":3,"file":"TableToolbar.js","sources":["../../../src/components/table/TableToolbar.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type TableToolbarProps = {\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableToolbar = ({ className, children }: PropsWithChildren<TableToolbarProps>) => (\n    <div className={classNames('table-toolbar', className)}>{children}</div>\n);\n\nexport default TableToolbar;\n"],"names":["TableToolbar","className","children","jsx","classNames"],"mappings":";;AAWA,MAAMA,IAAe,CAAC,EAAE,WAAAC,GAAW,UAAAC,EAAA,MAC/B,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAW,iBAAiBH,CAAS,GAAI,UAAAC,EAAA,CAAS;"}

package/components/table/TableViewToggles.js

@@ -1,7 +1,7 @@
 import { jsxs as E, jsx as t } from "react/jsx-runtime";
 import { useState as f, useEffect as g } from "react";
-import u from "classnames";
 import { noop as _ } from "es-toolkit/compat";
+import u from "../../utils/classNames.js";
 import A from "../overlay/OverlayTrigger.js";
 import I from "../tooltip/Tooltip.js";
 const L = (i, e) => /* @__PURE__ */ t(

package/components/table/TableViewToggles.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableViewToggles.js","sources":["../../../src/components/table/TableViewToggles.tsx"],"sourcesContent":["import { type JSX, type ReactNode, useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/compat';\n\nimport OverlayTrigger from '../overlay/OverlayTrigger';\nimport Tooltip from '../tooltip/Tooltip';\n\n// TODO: add responsive behaviour and trigger a change from table to list for small screen -> see DriverAdministration\n\nconst wrapWithTooltip = (tooltipContent: ReactNode, element: JSX.Element) => (\n    <OverlayTrigger\n        placement='bottom'\n        overlay={\n            <Tooltip id='tooltip' allowOnTouch>\n                {tooltipContent}\n            </Tooltip>\n        }\n    >\n        {element}\n    </OverlayTrigger>\n);\n\nconst typeIcons: Record<TableViewTogglesViewType, string> = {\n    TABLE: 'rioglyph-table-view',\n    SINGLE_CARD: 'rioglyph-th-list',\n    MULTI_CARDS: 'rioglyph-split-view',\n};\n\ntype TypeButtonProps = {\n    viewType: TableViewTogglesViewType;\n    currentViewType: TableViewTogglesViewType;\n    disabledViewTypes: TableViewTogglesViewType[];\n    tooltipContent: ReactNode;\n    onClick: (vt: TableViewTogglesViewType) => void;\n    disabled: boolean;\n};\n\nconst TypeButton = (props: TypeButtonProps) => {\n    const { viewType, currentViewType, disabledViewTypes, tooltipContent, onClick, disabled } = props;\n\n    if (disabledViewTypes.includes(viewType)) {\n        return null;\n    }\n\n    const classes = classNames(\n        'btn btn-default btn-icon-only',\n        disabled && 'disabled pointer-events-none',\n        viewType === currentViewType && 'active'\n    );\n\n    const button = (\n        <button className={classes} type='button' onClick={() => onClick(viewType)}>\n            <span className={`rioglyph ${typeIcons[viewType]}`} />\n        </button>\n    );\n\n    return tooltipContent ? wrapWithTooltip(tooltipContent, button) : button;\n};\n\nexport type TableViewTogglesViewType = 'SINGLE_CARD' | 'MULTI_CARDS' | 'TABLE';\n\nexport type TableViewTogglesProps = {\n    /**\n     * The current viewType for controlling the TablesViewToggles component.\n     *\n     * Possible values are:\n     *\n     * - `'SINGLE_CARD'`\n     * - `'MULTI_CARDS'`\n     * - `'TABLE'`\n     * - `TableViewToggles.VIEW_TYPE_TABLE`\n     * - `TableViewToggles.VIEW_TYPE_SINGLE_CARD`\n     * - `TableViewToggles.VIEW_TYPE_CARD`\n     */\n    viewType?: TableViewTogglesViewType;\n\n    /**\n     * Defines the initial viewType (when viewType is not controlled from the outside).\n     *\n     * Possible values are:\n     *\n     * - `'SINGLE_CARD'`\n     * - `'MULTI_CARDS'`\n     * - `'TABLE'`\n     * - `TableViewToggles.VIEW_TYPE_TABLE`\n     * - `TableViewToggles.VIEW_TYPE_SINGLE_CARD`\n     * - `TableViewToggles.VIEW_TYPE_CARD`\n     *\n     * @default TableViewToggles.VIEW_TYPE\n     */\n    initialViewType?: TableViewTogglesViewType;\n\n    /**\n     * Defines the view types which shall not be supported and are omitted.\n     *\n     * @default []\n     */\n    disabledViewTypes?: TableViewTogglesViewType[];\n\n    /**\n     * Callback function for when the user wants to change the viewType.\n     *\n     * Receives the new type as an argument.\n     *\n     * @param viewType The new viewType selected by the user.\n     */\n    onViewTypeChange: (viewType: TableViewTogglesViewType) => void;\n\n    /**\n     * Optional tooltip content for table view button.\n     */\n    tableViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Optional tooltip content for single card view button.\n     */\n    singleCardViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Optional tooltip content for multi card view button.\n     */\n    multiCardsViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Disables all buttons.\n     *\n     * This means the buttons cannot be clicked. Used when disabling toolbar buttons during loading state or when the\n     * corresponding table is empty.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableViewToggles = (props: TableViewTogglesProps) => {\n    const {\n        viewType,\n        initialViewType = 'TABLE',\n        disabledViewTypes = [],\n        onViewTypeChange = noop,\n        tableViewTooltipContent,\n        singleCardViewTooltipContent,\n        multiCardsViewTooltipContent,\n        disabled = false,\n        className,\n        ...remainingProps\n    } = props;\n\n    const [internalViewType, setInternalViewType] = useState(initialViewType);\n\n    // update internal state when external state changes - controlled component case\n    useEffect(() => {\n        if (viewType) {\n            setInternalViewType(viewType);\n        }\n    }, [viewType]);\n\n    const setViewType = (vt: TableViewTogglesViewType) => {\n        setInternalViewType(vt);\n        onViewTypeChange(vt);\n    };\n\n    const wrapperClassNames = classNames(\n        'TableViewToggles',\n        'btn-group',\n        'display-flex',\n        'flex-row',\n        className && className\n    );\n\n    return (\n        <div {...remainingProps} className={wrapperClassNames}>\n            <TypeButton\n                viewType='TABLE'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={tableViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n\n            <TypeButton\n                viewType='SINGLE_CARD'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={singleCardViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n\n            <TypeButton\n                viewType='MULTI_CARDS'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={multiCardsViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n        </div>\n    );\n};\n\n// Don't export values as string but as a distinct union type\nTableViewToggles.VIEW_TYPE_TABLE = 'TABLE' as TableViewTogglesViewType;\nTableViewToggles.VIEW_TYPE_SINGLE_CARD = 'SINGLE_CARD' as TableViewTogglesViewType;\nTableViewToggles.VIEW_TYPE_MULTI_CARDS = 'MULTI_CARDS' as TableViewTogglesViewType;\n\nexport default TableViewToggles;\n"],"names":["wrapWithTooltip","tooltipContent","element","jsx","OverlayTrigger","Tooltip","typeIcons","TypeButton","props","viewType","currentViewType","disabledViewTypes","onClick","disabled","classes","classNames","button","TableViewToggles","initialViewType","onViewTypeChange","noop","tableViewTooltipContent","singleCardViewTooltipContent","multiCardsViewTooltipContent","className","remainingProps","internalViewType","setInternalViewType","useState","useEffect","setViewType","vt","wrapperClassNames","jsxs"],"mappings":";;;;;;AASA,MAAMA,IAAkB,CAACC,GAA2BC,MAChD,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACG,WAAU;AAAA,IACV,SACI,gBAAAD,EAACE,GAAA,EAAQ,IAAG,WAAU,cAAY,IAC7B,UAAAJ,GACL;AAAA,IAGH,UAAAC;AAAA,EAAA;AACL,GAGEI,IAAsD;AAAA,EACxD,OAAO;AAAA,EACP,aAAa;AAAA,EACb,aAAa;AACjB,GAWMC,IAAa,CAACC,MAA2B;AAC3C,QAAM,EAAE,UAAAC,GAAU,iBAAAC,GAAiB,mBAAAC,GAAmB,gBAAAV,GAAgB,SAAAW,GAAS,UAAAC,MAAaL;AAE5F,MAAIG,EAAkB,SAASF,CAAQ;AACnC,WAAO;AAGX,QAAMK,IAAUC;AAAA,IACZ;AAAA,IACAF,KAAY;AAAA,IACZJ,MAAaC,KAAmB;AAAA,EAAA,GAG9BM,sBACD,UAAA,EAAO,WAAWF,GAAS,MAAK,UAAS,SAAS,MAAMF,EAAQH,CAAQ,GACrE,UAAA,gBAAAN,EAAC,UAAK,WAAW,YAAYG,EAAUG,CAAQ,CAAC,IAAI,EAAA,CACxD;AAGJ,SAAOR,IAAiBD,EAAgBC,GAAgBe,CAAM,IAAIA;AACtE,GAkFMC,IAAmB,CAACT,MAAiC;AACvD,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,iBAAAS,IAAkB;AAAA,IAClB,mBAAAP,IAAoB,CAAA;AAAA,IACpB,kBAAAQ,IAAmBC;AAAA,IACnB,yBAAAC;AAAA,IACA,8BAAAC;AAAA,IACA,8BAAAC;AAAA,IACA,UAAAV,IAAW;AAAA,IACX,WAAAW;AAAA,IACA,GAAGC;AAAA,EAAA,IACHjB,GAEE,CAACkB,GAAkBC,CAAmB,IAAIC,EAASV,CAAe;AAGxE,EAAAW,EAAU,MAAM;AACZ,IAAIpB,KACAkB,EAAoBlB,CAAQ;AAAA,EAEpC,GAAG,CAACA,CAAQ,CAAC;AAEb,QAAMqB,IAAc,CAACC,MAAiC;AAClD,IAAAJ,EAAoBI,CAAE,GACtBZ,EAAiBY,CAAE;AAAA,EACvB,GAEMC,IAAoBjB;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACAS,KAAaA;AAAA,EAAA;AAGjB,SACI,gBAAAS,EAAC,OAAA,EAAK,GAAGR,GAAgB,WAAWO,GAChC,UAAA;AAAA,IAAA,gBAAA7B;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBU;AAAA,QAChB,SAASS;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGJ,gBAAAV;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBW;AAAA,QAChB,SAASQ;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGJ,gBAAAV;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBY;AAAA,QAChB,SAASO;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GACJ;AAER;AAGAI,EAAiB,kBAAkB;AACnCA,EAAiB,wBAAwB;AACzCA,EAAiB,wBAAwB;"}
+{"version":3,"file":"TableViewToggles.js","sources":["../../../src/components/table/TableViewToggles.tsx"],"sourcesContent":["import { type JSX, type ReactNode, useEffect, useState } from 'react';\nimport { noop } from 'es-toolkit/compat';\n\nimport classNames from '../../utils/classNames';\nimport OverlayTrigger from '../overlay/OverlayTrigger';\nimport Tooltip from '../tooltip/Tooltip';\n\n// TODO: add responsive behaviour and trigger a change from table to list for small screen -> see DriverAdministration\n\nconst wrapWithTooltip = (tooltipContent: ReactNode, element: JSX.Element) => (\n    <OverlayTrigger\n        placement='bottom'\n        overlay={\n            <Tooltip id='tooltip' allowOnTouch>\n                {tooltipContent}\n            </Tooltip>\n        }\n    >\n        {element}\n    </OverlayTrigger>\n);\n\nconst typeIcons: Record<TableViewTogglesViewType, string> = {\n    TABLE: 'rioglyph-table-view',\n    SINGLE_CARD: 'rioglyph-th-list',\n    MULTI_CARDS: 'rioglyph-split-view',\n};\n\ntype TypeButtonProps = {\n    viewType: TableViewTogglesViewType;\n    currentViewType: TableViewTogglesViewType;\n    disabledViewTypes: TableViewTogglesViewType[];\n    tooltipContent: ReactNode;\n    onClick: (vt: TableViewTogglesViewType) => void;\n    disabled: boolean;\n};\n\nconst TypeButton = (props: TypeButtonProps) => {\n    const { viewType, currentViewType, disabledViewTypes, tooltipContent, onClick, disabled } = props;\n\n    if (disabledViewTypes.includes(viewType)) {\n        return null;\n    }\n\n    const classes = classNames(\n        'btn btn-default btn-icon-only',\n        disabled && 'disabled pointer-events-none',\n        viewType === currentViewType && 'active'\n    );\n\n    const button = (\n        <button className={classes} type='button' onClick={() => onClick(viewType)}>\n            <span className={`rioglyph ${typeIcons[viewType]}`} />\n        </button>\n    );\n\n    return tooltipContent ? wrapWithTooltip(tooltipContent, button) : button;\n};\n\nexport type TableViewTogglesViewType = 'SINGLE_CARD' | 'MULTI_CARDS' | 'TABLE';\n\nexport type TableViewTogglesProps = {\n    /**\n     * The current viewType for controlling the TablesViewToggles component.\n     *\n     * Possible values are:\n     *\n     * - `'SINGLE_CARD'`\n     * - `'MULTI_CARDS'`\n     * - `'TABLE'`\n     * - `TableViewToggles.VIEW_TYPE_TABLE`\n     * - `TableViewToggles.VIEW_TYPE_SINGLE_CARD`\n     * - `TableViewToggles.VIEW_TYPE_CARD`\n     */\n    viewType?: TableViewTogglesViewType;\n\n    /**\n     * Defines the initial viewType (when viewType is not controlled from the outside).\n     *\n     * Possible values are:\n     *\n     * - `'SINGLE_CARD'`\n     * - `'MULTI_CARDS'`\n     * - `'TABLE'`\n     * - `TableViewToggles.VIEW_TYPE_TABLE`\n     * - `TableViewToggles.VIEW_TYPE_SINGLE_CARD`\n     * - `TableViewToggles.VIEW_TYPE_CARD`\n     *\n     * @default TableViewToggles.VIEW_TYPE\n     */\n    initialViewType?: TableViewTogglesViewType;\n\n    /**\n     * Defines the view types which shall not be supported and are omitted.\n     *\n     * @default []\n     */\n    disabledViewTypes?: TableViewTogglesViewType[];\n\n    /**\n     * Callback function for when the user wants to change the viewType.\n     *\n     * Receives the new type as an argument.\n     *\n     * @param viewType The new viewType selected by the user.\n     */\n    onViewTypeChange: (viewType: TableViewTogglesViewType) => void;\n\n    /**\n     * Optional tooltip content for table view button.\n     */\n    tableViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Optional tooltip content for single card view button.\n     */\n    singleCardViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Optional tooltip content for multi card view button.\n     */\n    multiCardsViewTooltipContent?: string | ReactNode;\n\n    /**\n     * Disables all buttons.\n     *\n     * This means the buttons cannot be clicked. Used when disabling toolbar buttons during loading state or when the\n     * corresponding table is empty.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Optional class names for the wrapper element.\n     */\n    className?: string;\n};\n\nconst TableViewToggles = (props: TableViewTogglesProps) => {\n    const {\n        viewType,\n        initialViewType = 'TABLE',\n        disabledViewTypes = [],\n        onViewTypeChange = noop,\n        tableViewTooltipContent,\n        singleCardViewTooltipContent,\n        multiCardsViewTooltipContent,\n        disabled = false,\n        className,\n        ...remainingProps\n    } = props;\n\n    const [internalViewType, setInternalViewType] = useState(initialViewType);\n\n    // update internal state when external state changes - controlled component case\n    useEffect(() => {\n        if (viewType) {\n            setInternalViewType(viewType);\n        }\n    }, [viewType]);\n\n    const setViewType = (vt: TableViewTogglesViewType) => {\n        setInternalViewType(vt);\n        onViewTypeChange(vt);\n    };\n\n    const wrapperClassNames = classNames(\n        'TableViewToggles',\n        'btn-group',\n        'display-flex',\n        'flex-row',\n        className && className\n    );\n\n    return (\n        <div {...remainingProps} className={wrapperClassNames}>\n            <TypeButton\n                viewType='TABLE'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={tableViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n\n            <TypeButton\n                viewType='SINGLE_CARD'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={singleCardViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n\n            <TypeButton\n                viewType='MULTI_CARDS'\n                currentViewType={internalViewType}\n                disabledViewTypes={disabledViewTypes}\n                tooltipContent={multiCardsViewTooltipContent}\n                onClick={setViewType}\n                disabled={disabled}\n            />\n        </div>\n    );\n};\n\n// Don't export values as string but as a distinct union type\nTableViewToggles.VIEW_TYPE_TABLE = 'TABLE' as TableViewTogglesViewType;\nTableViewToggles.VIEW_TYPE_SINGLE_CARD = 'SINGLE_CARD' as TableViewTogglesViewType;\nTableViewToggles.VIEW_TYPE_MULTI_CARDS = 'MULTI_CARDS' as TableViewTogglesViewType;\n\nexport default TableViewToggles;\n"],"names":["wrapWithTooltip","tooltipContent","element","jsx","OverlayTrigger","Tooltip","typeIcons","TypeButton","props","viewType","currentViewType","disabledViewTypes","onClick","disabled","classes","classNames","button","TableViewToggles","initialViewType","onViewTypeChange","noop","tableViewTooltipContent","singleCardViewTooltipContent","multiCardsViewTooltipContent","className","remainingProps","internalViewType","setInternalViewType","useState","useEffect","setViewType","vt","wrapperClassNames","jsxs"],"mappings":";;;;;;AASA,MAAMA,IAAkB,CAACC,GAA2BC,MAChD,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACG,WAAU;AAAA,IACV,SACI,gBAAAD,EAACE,GAAA,EAAQ,IAAG,WAAU,cAAY,IAC7B,UAAAJ,GACL;AAAA,IAGH,UAAAC;AAAA,EAAA;AACL,GAGEI,IAAsD;AAAA,EACxD,OAAO;AAAA,EACP,aAAa;AAAA,EACb,aAAa;AACjB,GAWMC,IAAa,CAACC,MAA2B;AAC3C,QAAM,EAAE,UAAAC,GAAU,iBAAAC,GAAiB,mBAAAC,GAAmB,gBAAAV,GAAgB,SAAAW,GAAS,UAAAC,MAAaL;AAE5F,MAAIG,EAAkB,SAASF,CAAQ;AACnC,WAAO;AAGX,QAAMK,IAAUC;AAAA,IACZ;AAAA,IACAF,KAAY;AAAA,IACZJ,MAAaC,KAAmB;AAAA,EAAA,GAG9BM,sBACD,UAAA,EAAO,WAAWF,GAAS,MAAK,UAAS,SAAS,MAAMF,EAAQH,CAAQ,GACrE,UAAA,gBAAAN,EAAC,UAAK,WAAW,YAAYG,EAAUG,CAAQ,CAAC,IAAI,EAAA,CACxD;AAGJ,SAAOR,IAAiBD,EAAgBC,GAAgBe,CAAM,IAAIA;AACtE,GAkFMC,IAAmB,CAACT,MAAiC;AACvD,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,iBAAAS,IAAkB;AAAA,IAClB,mBAAAP,IAAoB,CAAA;AAAA,IACpB,kBAAAQ,IAAmBC;AAAA,IACnB,yBAAAC;AAAA,IACA,8BAAAC;AAAA,IACA,8BAAAC;AAAA,IACA,UAAAV,IAAW;AAAA,IACX,WAAAW;AAAA,IACA,GAAGC;AAAA,EAAA,IACHjB,GAEE,CAACkB,GAAkBC,CAAmB,IAAIC,EAASV,CAAe;AAGxE,EAAAW,EAAU,MAAM;AACZ,IAAIpB,KACAkB,EAAoBlB,CAAQ;AAAA,EAEpC,GAAG,CAACA,CAAQ,CAAC;AAEb,QAAMqB,IAAc,CAACC,MAAiC;AAClD,IAAAJ,EAAoBI,CAAE,GACtBZ,EAAiBY,CAAE;AAAA,EACvB,GAEMC,IAAoBjB;AAAA,IACtB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACAS,KAAaA;AAAA,EAAA;AAGjB,SACI,gBAAAS,EAAC,OAAA,EAAK,GAAGR,GAAgB,WAAWO,GAChC,UAAA;AAAA,IAAA,gBAAA7B;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBU;AAAA,QAChB,SAASS;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGJ,gBAAAV;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBW;AAAA,QAChB,SAASQ;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,IAGJ,gBAAAV;AAAA,MAACI;AAAA,MAAA;AAAA,QACG,UAAS;AAAA,QACT,iBAAiBmB;AAAA,QACjB,mBAAAf;AAAA,QACA,gBAAgBY;AAAA,QAChB,SAASO;AAAA,QACT,UAAAjB;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GACJ;AAER;AAGAI,EAAiB,kBAAkB;AACnCA,EAAiB,wBAAwB;AACzCA,EAAiB,wBAAwB;"}

package/components/tag/Tag.js

@@ -1,6 +1,6 @@
 import { jsx as l } from "react/jsx-runtime";
 import { forwardRef as y } from "react";
-import k from "classnames";
+import k from "../../utils/classNames.js";
 const j = y((a, i) => {
   const {
     children: r,

package/components/tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React, { forwardRef, type PropsWithChildren } from 'react';\nimport classNames from 'classnames';\n\nexport type TagProps = {\n    /**\n     * Defines if the tag is active.\n     *\n     * @default false\n     */\n    active?: boolean;\n\n    /**\n     * Defines if the tag is clickable.\n     *\n     * @default false\n     */\n    clickable?: boolean;\n\n    /**\n     * Defines if the tag is deletable.\n     *\n     * @default false\n     */\n    deletable?: boolean;\n\n    /**\n     * Defines if the tag is revertable.\n     *\n     * @default false\n     */\n    revertable?: boolean;\n\n    /**\n     * Defines if the tag is disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Define any rioglyph icon like \"rioglyph-truck\".\n     */\n    icon?: string;\n\n    /**\n     * Sets a more subtle style for border and background.\n     *\n     * @default false\n     */\n    muted?: boolean;\n\n    /**\n     * Defines if the tag is round.\n     *\n     * @default true\n     */\n    round?: boolean;\n\n    /**\n     * Defines if the tag is selectable.\n     *\n     * @default false\n     */\n    selectable?: boolean;\n\n    /**\n     * Defines if you want to render the tag in a different size.\n     *\n     * Possible values are: `'small'` and `'medium'`\n     */\n    size?: 'small' | 'medium';\n\n    /**\n     * Allows to render text on multiple lines.\n     *\n     * @default false\n     */\n    multiline?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n\n    [remainingProp: string]: unknown;\n};\n\nconst Tag = forwardRef((props: PropsWithChildren<TagProps>, ref: React.Ref<HTMLDivElement>) => {\n    const {\n        children,\n        icon,\n        active = false,\n        disabled = false,\n        clickable = false,\n        selectable = false,\n        deletable = false,\n        revertable = false,\n        multiline = false,\n        muted = false,\n        round = true,\n        size,\n        className,\n        ...remainingProps\n    } = props;\n\n    const tagClasses = classNames(\n        'tag',\n        size === 'small' && 'tag-small',\n        icon && `rioglyph ${icon}`,\n        active && 'active clickable rioglyph rioglyph-ok',\n        disabled && 'disabled',\n        clickable && 'clickable',\n        selectable && 'selectable clickable rioglyph rioglyph-checkbox',\n        deletable && 'deletable clickable rioglyph rioglyph-remove',\n        revertable && 'revertable clickable rioglyph rioglyph-revert',\n        multiline && 'multiline',\n        muted && 'tag-muted',\n        !round && 'rounded',\n        className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={tagClasses}>\n            <div className='tag-inner'>{children}</div>\n        </div>\n    );\n});\n\nexport default Tag;\n"],"names":["Tag","forwardRef","props","ref","children","icon","active","disabled","clickable","selectable","deletable","revertable","multiline","muted","round","size","className","remainingProps","tagClasses","classNames","jsx"],"mappings":";;;AAuFA,MAAMA,IAAMC,EAAW,CAACC,GAAoCC,MAAmC;AAC3F,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,OAAAC,IAAQ;AAAA,IACR,OAAAC,IAAQ;AAAA,IACR,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHf,GAEEgB,IAAaC;AAAA,IACf;AAAA,IACAJ,MAAS,WAAW;AAAA,IACpBV,KAAQ,YAAYA,CAAI;AAAA,IACxBC,KAAU;AAAA,IACVC,KAAY;AAAA,IACZC,KAAa;AAAA,IACbC,KAAc;AAAA,IACdC,KAAa;AAAA,IACbC,KAAc;AAAA,IACdC,KAAa;AAAA,IACbC,KAAS;AAAA,IACT,CAACC,KAAS;AAAA,IACVE;AAAA,EAAA;AAGJ,SACI,gBAAAI,EAAC,OAAA,EAAI,KAAAjB,GAAW,GAAGc,GAAgB,WAAWC,GAC1C,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,aAAa,UAAAhB,EAAA,CAAS,GACzC;AAER,CAAC;"}
+{"version":3,"file":"Tag.js","sources":["../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React, { forwardRef, type PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type TagProps = {\n    /**\n     * Defines if the tag is active.\n     *\n     * @default false\n     */\n    active?: boolean;\n\n    /**\n     * Defines if the tag is clickable.\n     *\n     * @default false\n     */\n    clickable?: boolean;\n\n    /**\n     * Defines if the tag is deletable.\n     *\n     * @default false\n     */\n    deletable?: boolean;\n\n    /**\n     * Defines if the tag is revertable.\n     *\n     * @default false\n     */\n    revertable?: boolean;\n\n    /**\n     * Defines if the tag is disabled.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Define any rioglyph icon like \"rioglyph-truck\".\n     */\n    icon?: string;\n\n    /**\n     * Sets a more subtle style for border and background.\n     *\n     * @default false\n     */\n    muted?: boolean;\n\n    /**\n     * Defines if the tag is round.\n     *\n     * @default true\n     */\n    round?: boolean;\n\n    /**\n     * Defines if the tag is selectable.\n     *\n     * @default false\n     */\n    selectable?: boolean;\n\n    /**\n     * Defines if you want to render the tag in a different size.\n     *\n     * Possible values are: `'small'` and `'medium'`\n     */\n    size?: 'small' | 'medium';\n\n    /**\n     * Allows to render text on multiple lines.\n     *\n     * @default false\n     */\n    multiline?: boolean;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n\n    [remainingProp: string]: unknown;\n};\n\nconst Tag = forwardRef((props: PropsWithChildren<TagProps>, ref: React.Ref<HTMLDivElement>) => {\n    const {\n        children,\n        icon,\n        active = false,\n        disabled = false,\n        clickable = false,\n        selectable = false,\n        deletable = false,\n        revertable = false,\n        multiline = false,\n        muted = false,\n        round = true,\n        size,\n        className,\n        ...remainingProps\n    } = props;\n\n    const tagClasses = classNames(\n        'tag',\n        size === 'small' && 'tag-small',\n        icon && `rioglyph ${icon}`,\n        active && 'active clickable rioglyph rioglyph-ok',\n        disabled && 'disabled',\n        clickable && 'clickable',\n        selectable && 'selectable clickable rioglyph rioglyph-checkbox',\n        deletable && 'deletable clickable rioglyph rioglyph-remove',\n        revertable && 'revertable clickable rioglyph rioglyph-revert',\n        multiline && 'multiline',\n        muted && 'tag-muted',\n        !round && 'rounded',\n        className\n    );\n\n    return (\n        <div ref={ref} {...remainingProps} className={tagClasses}>\n            <div className='tag-inner'>{children}</div>\n        </div>\n    );\n});\n\nexport default Tag;\n"],"names":["Tag","forwardRef","props","ref","children","icon","active","disabled","clickable","selectable","deletable","revertable","multiline","muted","round","size","className","remainingProps","tagClasses","classNames","jsx"],"mappings":";;;AAwFA,MAAMA,IAAMC,EAAW,CAACC,GAAoCC,MAAmC;AAC3F,QAAM;AAAA,IACF,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,YAAAC,IAAa;AAAA,IACb,WAAAC,IAAY;AAAA,IACZ,OAAAC,IAAQ;AAAA,IACR,OAAAC,IAAQ;AAAA,IACR,MAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACHf,GAEEgB,IAAaC;AAAA,IACf;AAAA,IACAJ,MAAS,WAAW;AAAA,IACpBV,KAAQ,YAAYA,CAAI;AAAA,IACxBC,KAAU;AAAA,IACVC,KAAY;AAAA,IACZC,KAAa;AAAA,IACbC,KAAc;AAAA,IACdC,KAAa;AAAA,IACbC,KAAc;AAAA,IACdC,KAAa;AAAA,IACbC,KAAS;AAAA,IACT,CAACC,KAAS;AAAA,IACVE;AAAA,EAAA;AAGJ,SACI,gBAAAI,EAAC,OAAA,EAAI,KAAAjB,GAAW,GAAGc,GAAgB,WAAWC,GAC1C,UAAA,gBAAAE,EAAC,OAAA,EAAI,WAAU,aAAa,UAAAhB,EAAA,CAAS,GACzC;AAER,CAAC;"}

package/components/tag/TagList.js

@@ -1,5 +1,5 @@
 import { jsx as e } from "react/jsx-runtime";
-import c from "classnames";
+import c from "../../utils/classNames.js";
 const g = (a) => {
   const { children: t, inline: i = !0, autoTagWidth: r = !1, tagsPerRow: s, ...l } = a, o = c(
     "taglist",

package/components/tag/TagList.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagList.js","sources":["../../../src/components/tag/TagList.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport classNames from 'classnames';\n\nexport type TagListProps = {\n    /**\n     * Defines if the tag list is rendered inline or vertically.\n     *\n     * @default true\n     */\n    inline?: boolean;\n\n    /**\n     * Defines if the tag has the same with as it`s parent container.\n     *\n     * @default false\n     */\n    autoTagWidth?: boolean;\n\n    /**\n     * Possible values are 1-6\n     */\n    tagsPerRow?: 1 | 2 | 3 | 4 | 6;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n};\n\nconst TagList = (props: PropsWithChildren<TagListProps>) => {\n    const { children, inline = true, autoTagWidth = false, tagsPerRow, ...remainingProps } = props;\n\n    const tagListClasses = classNames(\n        'taglist',\n        !autoTagWidth && 'taglist-autowidth',\n        !inline && 'taglist-vertical',\n        tagsPerRow && 'row display-flex-sm flex-wrap-sm',\n        props.className\n    );\n\n    const wrappedChildren = <div className={`tags-per-row-${tagsPerRow}`}>{children}</div>;\n\n    return (\n        <div {...remainingProps} className={tagListClasses}>\n            {tagsPerRow ? wrappedChildren : children}\n        </div>\n    );\n};\n\nexport default TagList;\n"],"names":["TagList","props","children","inline","autoTagWidth","tagsPerRow","remainingProps","tagListClasses","classNames","wrappedChildren","jsx"],"mappings":";;AA6BA,MAAMA,IAAU,CAACC,MAA2C;AACxD,QAAM,EAAE,UAAAC,GAAU,QAAAC,IAAS,IAAM,cAAAC,IAAe,IAAO,YAAAC,GAAY,GAAGC,EAAA,IAAmBL,GAEnFM,IAAiBC;AAAA,IACnB;AAAA,IACA,CAACJ,KAAgB;AAAA,IACjB,CAACD,KAAU;AAAA,IACXE,KAAc;AAAA,IACdJ,EAAM;AAAA,EAAA,GAGJQ,IAAkB,gBAAAC,EAAC,OAAA,EAAI,WAAW,gBAAgBL,CAAU,IAAK,UAAAH,GAAS;AAEhF,SACI,gBAAAQ,EAAC,SAAK,GAAGJ,GAAgB,WAAWC,GAC/B,UAAAF,IAAaI,IAAkBP,EAAA,CACpC;AAER;"}
+{"version":3,"file":"TagList.js","sources":["../../../src/components/tag/TagList.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type TagListProps = {\n    /**\n     * Defines if the tag list is rendered inline or vertically.\n     *\n     * @default true\n     */\n    inline?: boolean;\n\n    /**\n     * Defines if the tag has the same with as it`s parent container.\n     *\n     * @default false\n     */\n    autoTagWidth?: boolean;\n\n    /**\n     * Possible values are 1-6\n     */\n    tagsPerRow?: 1 | 2 | 3 | 4 | 6;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n};\n\nconst TagList = (props: PropsWithChildren<TagListProps>) => {\n    const { children, inline = true, autoTagWidth = false, tagsPerRow, ...remainingProps } = props;\n\n    const tagListClasses = classNames(\n        'taglist',\n        !autoTagWidth && 'taglist-autowidth',\n        !inline && 'taglist-vertical',\n        tagsPerRow && 'row display-flex-sm flex-wrap-sm',\n        props.className\n    );\n\n    const wrappedChildren = <div className={`tags-per-row-${tagsPerRow}`}>{children}</div>;\n\n    return (\n        <div {...remainingProps} className={tagListClasses}>\n            {tagsPerRow ? wrappedChildren : children}\n        </div>\n    );\n};\n\nexport default TagList;\n"],"names":["TagList","props","children","inline","autoTagWidth","tagsPerRow","remainingProps","tagListClasses","classNames","wrappedChildren","jsx"],"mappings":";;AA8BA,MAAMA,IAAU,CAACC,MAA2C;AACxD,QAAM,EAAE,UAAAC,GAAU,QAAAC,IAAS,IAAM,cAAAC,IAAe,IAAO,YAAAC,GAAY,GAAGC,EAAA,IAAmBL,GAEnFM,IAAiBC;AAAA,IACnB;AAAA,IACA,CAACJ,KAAgB;AAAA,IACjB,CAACD,KAAU;AAAA,IACXE,KAAc;AAAA,IACdJ,EAAM;AAAA,EAAA,GAGJQ,IAAkB,gBAAAC,EAAC,OAAA,EAAI,WAAW,gBAAgBL,CAAU,IAAK,UAAAH,GAAS;AAEhF,SACI,gBAAAQ,EAAC,SAAK,GAAGJ,GAAgB,WAAWC,GAC/B,UAAAF,IAAaI,IAAkBP,EAAA,CACpC;AAER;"}

package/components/tagManager/CustomSuggestionItem.js

@@ -1,5 +1,5 @@
 import { jsxs as e, jsx as a } from "react/jsx-runtime";
-import t from "classnames";
+import t from "../../utils/classNames.js";
 const l = ({ value: s, placeholder: r }) => {
   const o = t(
     "display-flex align-items-center padding-top-5 padding-bottom-5",

package/components/tagManager/CustomSuggestionItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomSuggestionItem.js","sources":["../../../src/components/tagManager/CustomSuggestionItem.tsx"],"sourcesContent":["import type React from 'react';\nimport classNames from 'classnames';\n\nexport type CustomSuggestionItemProps = {\n    value?: string | React.ReactNode;\n    placeholder?: string | React.ReactNode;\n};\n\nconst CustomSuggestionItem = ({ value, placeholder }: CustomSuggestionItemProps) => {\n    const wrapperClassNames = classNames(\n        'display-flex align-items-center padding-top-5 padding-bottom-5',\n        !value && 'text-color-gray'\n    );\n\n    const iconClassNames = classNames(\n        'margin-left--5 margin-right-5 margin-top--1 rioglyph',\n        value ? 'rioglyph-plus' : 'rioglyph-arrow-up'\n    );\n\n    return (\n        <span className={wrapperClassNames}>\n            <span className={iconClassNames} />\n            <span className='text-italic'>{value || placeholder}</span>\n        </span>\n    );\n};\n\nexport default CustomSuggestionItem;\n"],"names":["CustomSuggestionItem","value","placeholder","wrapperClassNames","classNames","iconClassNames","jsxs","jsx"],"mappings":";;AAQA,MAAMA,IAAuB,CAAC,EAAE,OAAAC,GAAO,aAAAC,QAA6C;AAChF,QAAMC,IAAoBC;AAAA,IACtB;AAAA,IACA,CAACH,KAAS;AAAA,EAAA,GAGRI,IAAiBD;AAAA,IACnB;AAAA,IACAH,IAAQ,kBAAkB;AAAA,EAAA;AAG9B,SACI,gBAAAK,EAAC,QAAA,EAAK,WAAWH,GACb,UAAA;AAAA,IAAA,gBAAAI,EAAC,QAAA,EAAK,WAAWF,EAAA,CAAgB;AAAA,IACjC,gBAAAE,EAAC,QAAA,EAAK,WAAU,eAAe,eAASL,EAAA,CAAY;AAAA,EAAA,GACxD;AAER;"}
+{"version":3,"file":"CustomSuggestionItem.js","sources":["../../../src/components/tagManager/CustomSuggestionItem.tsx"],"sourcesContent":["import type React from 'react';\n\nimport classNames from '../../utils/classNames';\n\nexport type CustomSuggestionItemProps = {\n    value?: string | React.ReactNode;\n    placeholder?: string | React.ReactNode;\n};\n\nconst CustomSuggestionItem = ({ value, placeholder }: CustomSuggestionItemProps) => {\n    const wrapperClassNames = classNames(\n        'display-flex align-items-center padding-top-5 padding-bottom-5',\n        !value && 'text-color-gray'\n    );\n\n    const iconClassNames = classNames(\n        'margin-left--5 margin-right-5 margin-top--1 rioglyph',\n        value ? 'rioglyph-plus' : 'rioglyph-arrow-up'\n    );\n\n    return (\n        <span className={wrapperClassNames}>\n            <span className={iconClassNames} />\n            <span className='text-italic'>{value || placeholder}</span>\n        </span>\n    );\n};\n\nexport default CustomSuggestionItem;\n"],"names":["CustomSuggestionItem","value","placeholder","wrapperClassNames","classNames","iconClassNames","jsxs","jsx"],"mappings":";;AASA,MAAMA,IAAuB,CAAC,EAAE,OAAAC,GAAO,aAAAC,QAA6C;AAChF,QAAMC,IAAoBC;AAAA,IACtB;AAAA,IACA,CAACH,KAAS;AAAA,EAAA,GAGRI,IAAiBD;AAAA,IACnB;AAAA,IACAH,IAAQ,kBAAkB;AAAA,EAAA;AAG9B,SACI,gBAAAK,EAAC,QAAA,EAAK,WAAWH,GACb,UAAA;AAAA,IAAA,gBAAAI,EAAC,QAAA,EAAK,WAAWF,EAAA,CAAgB;AAAA,IACjC,gBAAAE,EAAC,QAAA,EAAK,WAAU,eAAe,eAASL,EAAA,CAAY;AAAA,EAAA,GACxD;AAER;"}

package/components/tagManager/TagManager.d.ts

@@ -1,6 +1,18 @@
 import { default as React } from 'react';
-import { TagManagerTag } from './TagManagerTag';
-export type { TagManagerTag } from './TagManagerTag';
+export type TagManagerTag = {
+    /**
+     * The visible text of the tag.
+     */
+    label?: string;
+    /**
+     * Marks a tag that should be added (used to differentiate newly added tags).
+     */
+    toAdd?: boolean;
+    /**
+     * Marks a tag that should be removed (used to differentiate tags flagged for deletion).
+     */
+    toRemove?: boolean;
+};
 export type TagManagerProps = {
     /**
      * The list of existing tags to be listed.

package/components/tagManager/TagManager.js

@@ -1,8 +1,8 @@
 import { jsxs as O, jsx as b } from "react/jsx-runtime";
 import { useState as p, useEffect as f } from "react";
-import v from "classnames";
 import { noop as W, compact as h, isEmpty as d } from "es-toolkit/compat";
-import { isEqual as N } from "es-toolkit/predicate";
+import { isEqual as v } from "es-toolkit/predicate";
+import N from "../../utils/classNames.js";
 import { AutoSuggest as _ } from "../autosuggest/AutoSuggest.js";
 import k from "./CustomSuggestionItem.js";
 import z from "./TagManagerItemList.js";
@@ -61,15 +61,15 @@ const B = (e, t) => ({
       return;
     }
     m([...a, n]);
-  }, P = (o, r) => o.map((n) => (N(n.label, r.label) && (n.toRemove ? delete n.toRemove : n.toRemove = !0), n)), V = (o) => {
-    o.toAdd ? m(a.filter((r) => !N(r, o))) : m(P(a, o));
+  }, P = (o, r) => o.map((n) => (v(n.label, r.label) && (n.toRemove ? delete n.toRemove : n.toRemove = !0), n)), V = (o) => {
+    o.toAdd ? m(a.filter((r) => !v(r, o))) : m(P(a, o));
   }, j = {
     className: "",
     placeholder: l || "Start typing ...",
     value: c,
     tabIndex: 1
-  }, q = v(!d(a) && "margin-bottom-10");
-  return /* @__PURE__ */ O("div", { ...y, className: v("TagManager", u), children: [
+  }, q = N(!d(a) && "margin-bottom-10");
+  return /* @__PURE__ */ O("div", { ...y, className: N("TagManager", u), children: [
     x && /* @__PURE__ */ b(
       _,
       {

package/components/tagManager/TagManager.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagManager.js","sources":["../../../src/components/tagManager/TagManager.tsx"],"sourcesContent":["import type React from 'react';\nimport { useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { compact, isEmpty, noop } from 'es-toolkit/compat';\nimport { isEqual } from 'es-toolkit/predicate';\n\nimport AutoSuggest, { type AutoSuggestProps, type AutoSuggestSuggestion } from '../autosuggest/AutoSuggest';\nimport CustomSuggestionItem from './CustomSuggestionItem';\nimport TagManagerItemList from './TagManagerItemList';\nimport type { TagManagerTag } from './TagManagerTag';\n\nconst getCustomSuggestion = (value: string, placeholder: string | undefined): AutoSuggestSuggestion => ({\n    customSuggestion: <CustomSuggestionItem value={value} placeholder={placeholder} />,\n    label: value,\n    disabled: isEmpty(value),\n});\n\nconst getSuggestionSeparator = (dropdownSeparatorText: string): AutoSuggestSuggestion => ({\n    header: true,\n    label: dropdownSeparatorText,\n});\n\nconst cleanupTagState = (tag: TagManagerTag): TagManagerTag => {\n    delete tag.toAdd;\n    delete tag.toRemove;\n    return tag;\n};\n\nconst hasTagAlreadySelected = (tags: TagManagerTag[], newSuggestion: AutoSuggestSuggestion) =>\n    !!tags.find(tag => tag.label === newSuggestion.label);\n\nconst getNewSuggestion = (suggestion: AutoSuggestSuggestion) => {\n    const newSuggestion = suggestion.customSuggestion ? { label: suggestion.label } : suggestion;\n    newSuggestion.toAdd = true;\n    return newSuggestion;\n};\n\nconst buildSuggestions =\n    (useCustomTags: boolean, customTagPlaceholder: string | undefined, dropdownSeparatorText: string | undefined) =>\n    (value: string, suggestions: TagManagerTag[]): AutoSuggestSuggestion[] => {\n        const cleanedSuggestions = suggestions.map(cleanupTagState).filter(item => item.label);\n        const hasDropdownSeparatorText = typeof dropdownSeparatorText === 'string' && !isEmpty(dropdownSeparatorText);\n\n        return compact([\n            useCustomTags && getCustomSuggestion(value, customTagPlaceholder),\n            useCustomTags &&\n                !isEmpty(cleanedSuggestions) &&\n                hasDropdownSeparatorText &&\n                getSuggestionSeparator(dropdownSeparatorText),\n            ...(cleanedSuggestions as unknown as AutoSuggestSuggestion[]),\n        ]);\n    };\n\nconst filterSuggestions = (suggestions: AutoSuggestSuggestion[], selectedTagNames: string[], value = '') =>\n    suggestions.filter(suggestion => {\n        const label = suggestion.label;\n        if (!label) {\n            return false;\n        }\n        const lowerCaseLabel = label.toLowerCase();\n        const lowerCaseValue = value.toLowerCase();\n        return (\n            lowerCaseLabel.includes(lowerCaseValue) &&\n            !selectedTagNames.includes(label) &&\n            !suggestion.header &&\n            !suggestion.customSuggestion\n        );\n    });\n\nexport type { TagManagerTag } from './TagManagerTag';\n\nexport type TagManagerProps = {\n    /**\n     * The list of existing tags to be listed.\n     */\n    tagList: TagManagerTag[];\n\n    /**\n     * The list of tags used as suggestions for the built-in AutoSuggest.\n     */\n    tagSuggestions: TagManagerTag[];\n\n    /**\n     * Callback function triggered when the list of tags changes.\n     *\n     * For instance when a tag was added by the AutoSuggest or when a tag is marked to be deleted.\n     *\n     * This function returns the updated list of tags where tags may have additional properties indicating whether they\n     * have to be removed or added to your data.\n     *\n     * @param newTags The updated list of tags.\n     * \n     * @example\n     * [\n        {\n            label: 'Foo',\n        },\n        {\n            label: 'Bar',\n            toAdd: true,\n        },\n        {\n            label: 'Lorem ipsum',\n            toRemove: true,\n        }\n    ]\n     */\n    onTagListChange?: (newTags: TagManagerTag[]) => void;\n\n    /**\n     * The placeholder message for the AutoSuggest input.\n     */\n    placeholder?: string;\n\n    /**\n     * The placeholder message for custom tag in the AutoSuggest dropdown.\n     *\n     * This is only relevant when having custom tags enabled.\n     */\n    customTagPlaceholder?: string;\n\n    /**\n     * The header message for existing tags in the AutoSuggest dropdown.\n     *\n     * This is only relevant when having custom tags enabled.\n     */\n    dropdownSeparatorText?: string;\n\n    /**\n     * Enables or disabled to add custom tags from the AutoSuggest dropdown.\n     *\n     * @default true\n     */\n    useCustomTags?: boolean;\n\n    /**\n     * Define whether the input shall be shown and to allow to select tags.\n     *\n     * @default true\n     */\n    showInput?: boolean;\n\n    /**\n     * The message to be shown when no tag suggestion could be found for the entered value of the AutoSuggest.\n     */\n    noItemMessage?: string | React.ReactNode;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n};\n\nconst TagManager = (props: TagManagerProps) => {\n    const {\n        tagList,\n        tagSuggestions,\n        placeholder,\n        className,\n        customTagPlaceholder,\n        dropdownSeparatorText,\n        onTagListChange = noop,\n        useCustomTags = true,\n        noItemMessage,\n        showInput = true,\n        ...remainingProps\n    } = props;\n\n    const [tags, setTags] = useState(tagList);\n    const [inputValue, setInputValue] = useState('');\n    const [currentSuggestions, setCurrentSuggestions] = useState([] as AutoSuggestSuggestion[]);\n\n    const getSuggestions = buildSuggestions(useCustomTags, customTagPlaceholder, dropdownSeparatorText);\n\n    // Update internal list of tags when they change from the outside i.e. when they have been saved,\n    // additionally, cleanup previous state for adding or removing tags\n    useEffect(() => setTags(compact(tagList.map(cleanupTagState))), [tagList]);\n\n    // build suggestion when passed tag suggestions passed change i.e. when a tag got selected and removed from the list\n    useEffect(() => setCurrentSuggestions(getSuggestions(inputValue, tagSuggestions)), [tagSuggestions]);\n\n    // build suggestions when input value change as it should filter the list on suggestions\n    useEffect(() => {\n        const selectedTagNames = compact(tags.map(tag => tag.label));\n        const value = inputValue || '';\n\n        const filteredList = filterSuggestions(\n            tagSuggestions as unknown as AutoSuggestSuggestion[],\n            selectedTagNames,\n            value\n        );\n        setCurrentSuggestions(getSuggestions(value, filteredList));\n    }, [tags, inputValue, tagSuggestions]);\n\n    const updateTags = (updatedTags: TagManagerTag[]) => {\n        setTags(updatedTags);\n        // Notify outside component\n        console.log(updatedTags);\n\n        onTagListChange(updatedTags);\n    };\n\n    const handleSuggestionsChange: AutoSuggestProps['onSuggestionsFetchRequested'] = ({ value }) =>\n        setInputValue(value);\n\n    const handleSuggestionSelected: AutoSuggestProps['onSuggestionSelected'] = (_, { suggestion }) => {\n        setInputValue('');\n\n        const newSuggestion = getNewSuggestion(suggestion);\n\n        if (hasTagAlreadySelected(tags, newSuggestion)) {\n            updateTags([...tags]);\n            return;\n        }\n\n        updateTags([...tags, newSuggestion]);\n    };\n\n    const updateTagsWithSelectedTag = (tagItems: TagManagerTag[], selectedTag: TagManagerTag) => {\n        return tagItems.map(tag => {\n            if (isEqual(tag.label, selectedTag.label)) {\n                // update tag and mark as \"to remove\"\n                if (tag.toRemove) {\n                    delete tag.toRemove;\n                } else {\n                    tag.toRemove = true;\n                }\n            }\n            return tag;\n        });\n    };\n\n    const handleRemoveFromTagList = (selectedTag: TagManagerTag) => {\n        if (selectedTag.toAdd) {\n            updateTags(tags.filter(tag => !isEqual(tag, selectedTag)));\n        } else {\n            updateTags(updateTagsWithSelectedTag(tags, selectedTag));\n        }\n    };\n\n    const inputProps = {\n        className: '',\n        placeholder: placeholder || 'Start typing ...',\n        value: inputValue,\n        tabIndex: 1,\n    };\n\n    const autoSuggestClasses = classNames(!isEmpty(tags) && 'margin-bottom-10');\n\n    return (\n        <div {...remainingProps} className={classNames('TagManager', className)}>\n            {showInput && (\n                <AutoSuggest\n                    className={autoSuggestClasses}\n                    inputProps={inputProps}\n                    suggestions={currentSuggestions}\n                    onSuggestionSelected={handleSuggestionSelected}\n                    onSuggestionsFetchRequested={handleSuggestionsChange}\n                    openOnFocus\n                    noItemMessage={noItemMessage}\n                />\n            )}\n            <TagManagerItemList tags={tags} onRemoveFromTagList={handleRemoveFromTagList} />\n        </div>\n    );\n};\n\nexport default TagManager;\n"],"names":["getCustomSuggestion","value","placeholder","jsx","CustomSuggestionItem","isEmpty","getSuggestionSeparator","dropdownSeparatorText","cleanupTagState","tag","hasTagAlreadySelected","tags","newSuggestion","getNewSuggestion","suggestion","buildSuggestions","useCustomTags","customTagPlaceholder","suggestions","cleanedSuggestions","item","hasDropdownSeparatorText","compact","filterSuggestions","selectedTagNames","label","lowerCaseLabel","lowerCaseValue","TagManager","props","tagList","tagSuggestions","className","onTagListChange","noop","noItemMessage","showInput","remainingProps","setTags","useState","inputValue","setInputValue","currentSuggestions","setCurrentSuggestions","getSuggestions","useEffect","filteredList","updateTags","updatedTags","handleSuggestionsChange","handleSuggestionSelected","_","updateTagsWithSelectedTag","tagItems","selectedTag","isEqual","handleRemoveFromTagList","inputProps","autoSuggestClasses","classNames","jsxs","AutoSuggest","TagManagerItemList"],"mappings":"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"}
+{"version":3,"file":"TagManager.js","sources":["../../../src/components/tagManager/TagManager.tsx"],"sourcesContent":["import type React from 'react';\nimport { useEffect, useState } from 'react';\nimport { compact, isEmpty, noop } from 'es-toolkit/compat';\nimport { isEqual } from 'es-toolkit/predicate';\n\nimport classNames from '../../utils/classNames';\nimport AutoSuggest, { type AutoSuggestProps, type AutoSuggestSuggestion } from '../autosuggest/AutoSuggest';\nimport CustomSuggestionItem from './CustomSuggestionItem';\nimport TagManagerItemList from './TagManagerItemList';\n\nexport type TagManagerTag = {\n    /**\n     * The visible text of the tag.\n     */\n    label?: string;\n\n    /**\n     * Marks a tag that should be added (used to differentiate newly added tags).\n     */\n    toAdd?: boolean;\n\n    /**\n     * Marks a tag that should be removed (used to differentiate tags flagged for deletion).\n     */\n    toRemove?: boolean;\n};\n\nconst getCustomSuggestion = (value: string, placeholder: string | undefined): AutoSuggestSuggestion => ({\n    customSuggestion: <CustomSuggestionItem value={value} placeholder={placeholder} />,\n    label: value,\n    disabled: isEmpty(value),\n});\n\nconst getSuggestionSeparator = (dropdownSeparatorText: string): AutoSuggestSuggestion => ({\n    header: true,\n    label: dropdownSeparatorText,\n});\n\nconst cleanupTagState = (tag: TagManagerTag): TagManagerTag => {\n    delete tag.toAdd;\n    delete tag.toRemove;\n    return tag;\n};\n\nconst hasTagAlreadySelected = (tags: TagManagerTag[], newSuggestion: AutoSuggestSuggestion) =>\n    !!tags.find(tag => tag.label === newSuggestion.label);\n\nconst getNewSuggestion = (suggestion: AutoSuggestSuggestion) => {\n    const newSuggestion = suggestion.customSuggestion ? { label: suggestion.label } : suggestion;\n    newSuggestion.toAdd = true;\n    return newSuggestion;\n};\n\nconst buildSuggestions =\n    (useCustomTags: boolean, customTagPlaceholder: string | undefined, dropdownSeparatorText: string | undefined) =>\n    (value: string, suggestions: TagManagerTag[]): AutoSuggestSuggestion[] => {\n        const cleanedSuggestions = suggestions.map(cleanupTagState).filter(item => item.label);\n        const hasDropdownSeparatorText = typeof dropdownSeparatorText === 'string' && !isEmpty(dropdownSeparatorText);\n\n        return compact([\n            useCustomTags && getCustomSuggestion(value, customTagPlaceholder),\n            useCustomTags &&\n                !isEmpty(cleanedSuggestions) &&\n                hasDropdownSeparatorText &&\n                getSuggestionSeparator(dropdownSeparatorText),\n            ...(cleanedSuggestions as unknown as AutoSuggestSuggestion[]),\n        ]);\n    };\n\nconst filterSuggestions = (suggestions: AutoSuggestSuggestion[], selectedTagNames: string[], value = '') =>\n    suggestions.filter(suggestion => {\n        const label = suggestion.label;\n        if (!label) {\n            return false;\n        }\n        const lowerCaseLabel = label.toLowerCase();\n        const lowerCaseValue = value.toLowerCase();\n        return (\n            lowerCaseLabel.includes(lowerCaseValue) &&\n            !selectedTagNames.includes(label) &&\n            !suggestion.header &&\n            !suggestion.customSuggestion\n        );\n    });\n\nexport type TagManagerProps = {\n    /**\n     * The list of existing tags to be listed.\n     */\n    tagList: TagManagerTag[];\n\n    /**\n     * The list of tags used as suggestions for the built-in AutoSuggest.\n     */\n    tagSuggestions: TagManagerTag[];\n\n    /**\n     * Callback function triggered when the list of tags changes.\n     *\n     * For instance when a tag was added by the AutoSuggest or when a tag is marked to be deleted.\n     *\n     * This function returns the updated list of tags where tags may have additional properties indicating whether they\n     * have to be removed or added to your data.\n     *\n     * @param newTags The updated list of tags.\n     * \n     * @example\n     * [\n        {\n            label: 'Foo',\n        },\n        {\n            label: 'Bar',\n            toAdd: true,\n        },\n        {\n            label: 'Lorem ipsum',\n            toRemove: true,\n        }\n    ]\n     */\n    onTagListChange?: (newTags: TagManagerTag[]) => void;\n\n    /**\n     * The placeholder message for the AutoSuggest input.\n     */\n    placeholder?: string;\n\n    /**\n     * The placeholder message for custom tag in the AutoSuggest dropdown.\n     *\n     * This is only relevant when having custom tags enabled.\n     */\n    customTagPlaceholder?: string;\n\n    /**\n     * The header message for existing tags in the AutoSuggest dropdown.\n     *\n     * This is only relevant when having custom tags enabled.\n     */\n    dropdownSeparatorText?: string;\n\n    /**\n     * Enables or disabled to add custom tags from the AutoSuggest dropdown.\n     *\n     * @default true\n     */\n    useCustomTags?: boolean;\n\n    /**\n     * Define whether the input shall be shown and to allow to select tags.\n     *\n     * @default true\n     */\n    showInput?: boolean;\n\n    /**\n     * The message to be shown when no tag suggestion could be found for the entered value of the AutoSuggest.\n     */\n    noItemMessage?: string | React.ReactNode;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n};\n\nconst TagManager = (props: TagManagerProps) => {\n    const {\n        tagList,\n        tagSuggestions,\n        placeholder,\n        className,\n        customTagPlaceholder,\n        dropdownSeparatorText,\n        onTagListChange = noop,\n        useCustomTags = true,\n        noItemMessage,\n        showInput = true,\n        ...remainingProps\n    } = props;\n\n    const [tags, setTags] = useState(tagList);\n    const [inputValue, setInputValue] = useState('');\n    const [currentSuggestions, setCurrentSuggestions] = useState([] as AutoSuggestSuggestion[]);\n\n    const getSuggestions = buildSuggestions(useCustomTags, customTagPlaceholder, dropdownSeparatorText);\n\n    // Update internal list of tags when they change from the outside i.e. when they have been saved,\n    // additionally, cleanup previous state for adding or removing tags\n    useEffect(() => setTags(compact(tagList.map(cleanupTagState))), [tagList]);\n\n    // build suggestion when passed tag suggestions passed change i.e. when a tag got selected and removed from the list\n    useEffect(() => setCurrentSuggestions(getSuggestions(inputValue, tagSuggestions)), [tagSuggestions]);\n\n    // build suggestions when input value change as it should filter the list on suggestions\n    useEffect(() => {\n        const selectedTagNames = compact(tags.map(tag => tag.label));\n        const value = inputValue || '';\n\n        const filteredList = filterSuggestions(\n            tagSuggestions as unknown as AutoSuggestSuggestion[],\n            selectedTagNames,\n            value\n        );\n        setCurrentSuggestions(getSuggestions(value, filteredList));\n    }, [tags, inputValue, tagSuggestions]);\n\n    const updateTags = (updatedTags: TagManagerTag[]) => {\n        setTags(updatedTags);\n        // Notify outside component\n        console.log(updatedTags);\n\n        onTagListChange(updatedTags);\n    };\n\n    const handleSuggestionsChange: AutoSuggestProps['onSuggestionsFetchRequested'] = ({ value }) =>\n        setInputValue(value);\n\n    const handleSuggestionSelected: AutoSuggestProps['onSuggestionSelected'] = (_, { suggestion }) => {\n        setInputValue('');\n\n        const newSuggestion = getNewSuggestion(suggestion);\n\n        if (hasTagAlreadySelected(tags, newSuggestion)) {\n            updateTags([...tags]);\n            return;\n        }\n\n        updateTags([...tags, newSuggestion]);\n    };\n\n    const updateTagsWithSelectedTag = (tagItems: TagManagerTag[], selectedTag: TagManagerTag) => {\n        return tagItems.map(tag => {\n            if (isEqual(tag.label, selectedTag.label)) {\n                // update tag and mark as \"to remove\"\n                if (tag.toRemove) {\n                    delete tag.toRemove;\n                } else {\n                    tag.toRemove = true;\n                }\n            }\n            return tag;\n        });\n    };\n\n    const handleRemoveFromTagList = (selectedTag: TagManagerTag) => {\n        if (selectedTag.toAdd) {\n            updateTags(tags.filter(tag => !isEqual(tag, selectedTag)));\n        } else {\n            updateTags(updateTagsWithSelectedTag(tags, selectedTag));\n        }\n    };\n\n    const inputProps = {\n        className: '',\n        placeholder: placeholder || 'Start typing ...',\n        value: inputValue,\n        tabIndex: 1,\n    };\n\n    const autoSuggestClasses = classNames(!isEmpty(tags) && 'margin-bottom-10');\n\n    return (\n        <div {...remainingProps} className={classNames('TagManager', className)}>\n            {showInput && (\n                <AutoSuggest\n                    className={autoSuggestClasses}\n                    inputProps={inputProps}\n                    suggestions={currentSuggestions}\n                    onSuggestionSelected={handleSuggestionSelected}\n                    onSuggestionsFetchRequested={handleSuggestionsChange}\n                    openOnFocus\n                    noItemMessage={noItemMessage}\n                />\n            )}\n            <TagManagerItemList tags={tags} onRemoveFromTagList={handleRemoveFromTagList} />\n        </div>\n    );\n};\n\nexport default TagManager;\n"],"names":["getCustomSuggestion","value","placeholder","jsx","CustomSuggestionItem","isEmpty","getSuggestionSeparator","dropdownSeparatorText","cleanupTagState","tag","hasTagAlreadySelected","tags","newSuggestion","getNewSuggestion","suggestion","buildSuggestions","useCustomTags","customTagPlaceholder","suggestions","cleanedSuggestions","item","hasDropdownSeparatorText","compact","filterSuggestions","selectedTagNames","label","lowerCaseLabel","lowerCaseValue","TagManager","props","tagList","tagSuggestions","className","onTagListChange","noop","noItemMessage","showInput","remainingProps","setTags","useState","inputValue","setInputValue","currentSuggestions","setCurrentSuggestions","getSuggestions","useEffect","filteredList","updateTags","updatedTags","handleSuggestionsChange","handleSuggestionSelected","_","updateTagsWithSelectedTag","tagItems","selectedTag","isEqual","handleRemoveFromTagList","inputProps","autoSuggestClasses","classNames","jsxs","AutoSuggest","TagManagerItemList"],"mappings":"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"}

package/components/tagManager/TagManagerItemList.d.ts

@@ -1,4 +1,4 @@
-import { TagManagerTag } from './TagManagerTag';
+import { TagManagerTag } from './TagManager';
 export type TagManagerItemListProps = {
     tags: TagManagerTag[];
     onRemoveFromTagList?: (tag: TagManagerTag) => void;