@rio-cloud/rio-uikit 0.16.4-beta.2 → 0.16.4-beta.20

package/components/table/TableCardsSorting.d.ts

@@ -1,37 +1,37 @@
-export default TableCardsSorting;
-declare class TableCardsSorting extends React.Component<any, any, any> {
-    constructor(props: any);
-    state: {
-        sortName: any;
-        sortOrder: any;
-    };
-    setSortName(item: any): void;
-    setSortDirectionAsc(): void;
-    setSortDirectionDesc(): void;
-    setSortDirection(direction: any): void;
-    render(): JSX.Element;
-}
-declare namespace TableCardsSorting {
-    namespace defaultProps {
-        function onSortChange(): void;
-        const sortOrder: string;
-        const selectOptions: never[];
-    }
-    namespace propTypes {
-        export const sortName: PropTypes.Validator<string>;
-        const sortOrder_1: PropTypes.Validator<string>;
-        export { sortOrder_1 as sortOrder };
-        const onSortChange_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onSortChange_1 as onSortChange };
-        const selectOptions_1: PropTypes.Validator<(PropTypes.InferProps<{
-            id: PropTypes.Validator<string>;
-            label: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
-            selected: PropTypes.Requireable<boolean>;
-            disabled: PropTypes.Requireable<boolean>;
-        }> | null | undefined)[]>;
-        export { selectOptions_1 as selectOptions };
-        export const className: PropTypes.Requireable<string>;
-    }
-}
-import React from "react";
-import PropTypes from "prop-types";
+export default TableCardsSorting;
+declare class TableCardsSorting extends React.Component<any, any, any> {
+    constructor(props: any);
+    state: {
+        sortName: any;
+        sortOrder: any;
+    };
+    setSortName(item: any): void;
+    setSortDirectionAsc(): void;
+    setSortDirectionDesc(): void;
+    setSortDirection(direction: any): void;
+    render(): import("react/jsx-runtime").JSX.Element;
+}
+declare namespace TableCardsSorting {
+    namespace defaultProps {
+        function onSortChange(): void;
+        const sortOrder: string;
+        const selectOptions: never[];
+    }
+    namespace propTypes {
+        export const sortName: PropTypes.Validator<string>;
+        const sortOrder_1: PropTypes.Validator<string>;
+        export { sortOrder_1 as sortOrder };
+        const onSortChange_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onSortChange_1 as onSortChange };
+        const selectOptions_1: PropTypes.Validator<(PropTypes.InferProps<{
+            id: PropTypes.Validator<string>;
+            label: PropTypes.Validator<NonNullable<NonNullable<PropTypes.ReactNodeLike>>>;
+            selected: PropTypes.Requireable<boolean>;
+            disabled: PropTypes.Requireable<boolean>;
+        }> | null | undefined)[]>;
+        export { selectOptions_1 as selectOptions };
+        export const className: PropTypes.Requireable<string>;
+    }
+}
+import React from "react";
+import PropTypes from "prop-types";

package/components/table/TableCardsSorting.js

@@ -1,61 +1,61 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import { SortDirection } from '../../utils/SortUtils';
-import Select from '../selects/Select';
-import ToggleButton from '../button/ToggleButton';
-class TableCardsSorting extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            sortName: this.props.sortName,
-            sortOrder: this.props.sortOrder,
-        };
-        this.setSortName = this.setSortName.bind(this);
-        this.setSortDirectionAsc = this.setSortDirectionAsc.bind(this);
-        this.setSortDirectionDesc = this.setSortDirectionDesc.bind(this);
-    }
-    setSortDirectionAsc() {
-        this.setSortDirection(SortDirection.ASCENDING);
-    }
-    setSortDirectionDesc() {
-        this.setSortDirection(SortDirection.DESCENDING);
-    }
-    setSortDirection(direction) {
-        this.setState({
-            sortOrder: direction,
-        });
-        this.props.onSortChange(this.state.sortName, direction);
-    }
-    setSortName(item) {
-        this.setState({
-            sortName: item.id,
-        });
-        this.props.onSortChange(item.id, this.state.sortOrder);
-    }
-    render() {
-        const { className, selectOptions } = this.props;
-        const { sortOrder } = this.state;
-        const wrapperClassNames = classNames('table-toolbar-cards-sorting', 'btn-toolbar', className && className);
-        return (_jsxs("div", Object.assign({ className: wrapperClassNames }, { children: [_jsxs("div", Object.assign({ className: 'btn-group margin-left-0' }, { children: [_jsx(ToggleButton, Object.assign({ className: 'btn-icon-only', active: sortOrder === SortDirection.ASCENDING, onClick: this.setSortDirectionAsc }, { children: _jsx("span", { className: 'rioglyph rioglyph-sort-by-attributes-alt' }) })), _jsx(ToggleButton, Object.assign({ className: 'btn-icon-only', active: sortOrder === SortDirection.DESCENDING, onClick: this.setSortDirectionDesc }, { children: _jsx("span", { className: 'rioglyph rioglyph-sort-by-attributes' }) }))] })), selectOptions.length && (_jsx("div", Object.assign({ className: 'btn-group' }, { children: _jsx(Select, { options: selectOptions, onChange: this.setSortName }) })))] })));
-    }
-}
-TableCardsSorting.defaultProps = {
-    onSortChange: () => { },
-    sortOrder: SortDirection.ASCENDING,
-    selectOptions: [],
-};
-TableCardsSorting.propTypes = {
-    sortName: PropTypes.string.isRequired,
-    sortOrder: PropTypes.oneOf([SortDirection.ASCENDING, SortDirection.DESCENDING]).isRequired,
-    onSortChange: PropTypes.func,
-    selectOptions: PropTypes.arrayOf(PropTypes.shape({
-        id: PropTypes.string.isRequired,
-        label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
-        selected: PropTypes.bool,
-        disabled: PropTypes.bool,
-    })).isRequired,
-    className: PropTypes.string,
-};
-export default TableCardsSorting;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import { SortDirection } from '../../utils/SortUtils';
+import Select from '../selects/Select';
+import ToggleButton from '../button/ToggleButton';
+class TableCardsSorting extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            sortName: this.props.sortName,
+            sortOrder: this.props.sortOrder,
+        };
+        this.setSortName = this.setSortName.bind(this);
+        this.setSortDirectionAsc = this.setSortDirectionAsc.bind(this);
+        this.setSortDirectionDesc = this.setSortDirectionDesc.bind(this);
+    }
+    setSortDirectionAsc() {
+        this.setSortDirection(SortDirection.ASCENDING);
+    }
+    setSortDirectionDesc() {
+        this.setSortDirection(SortDirection.DESCENDING);
+    }
+    setSortDirection(direction) {
+        this.setState({
+            sortOrder: direction,
+        });
+        this.props.onSortChange(this.state.sortName, direction);
+    }
+    setSortName(item) {
+        this.setState({
+            sortName: item.id,
+        });
+        this.props.onSortChange(item.id, this.state.sortOrder);
+    }
+    render() {
+        const { className, selectOptions } = this.props;
+        const { sortOrder } = this.state;
+        const wrapperClassNames = classNames('table-toolbar-cards-sorting', 'btn-toolbar', className && className);
+        return (_jsxs("div", Object.assign({ className: wrapperClassNames }, { children: [_jsxs("div", Object.assign({ className: 'btn-group margin-left-0' }, { children: [_jsx(ToggleButton, Object.assign({ className: 'btn-icon-only', active: sortOrder === SortDirection.ASCENDING, onClick: this.setSortDirectionAsc }, { children: _jsx("span", { className: 'rioglyph rioglyph-sort-by-attributes-alt' }) })), _jsx(ToggleButton, Object.assign({ className: 'btn-icon-only', active: sortOrder === SortDirection.DESCENDING, onClick: this.setSortDirectionDesc }, { children: _jsx("span", { className: 'rioglyph rioglyph-sort-by-attributes' }) }))] })), selectOptions.length && (_jsx("div", Object.assign({ className: 'btn-group' }, { children: _jsx(Select, { options: selectOptions, onChange: this.setSortName }) })))] })));
+    }
+}
+TableCardsSorting.defaultProps = {
+    onSortChange: () => { },
+    sortOrder: SortDirection.ASCENDING,
+    selectOptions: [],
+};
+TableCardsSorting.propTypes = {
+    sortName: PropTypes.string.isRequired,
+    sortOrder: PropTypes.oneOf([SortDirection.ASCENDING, SortDirection.DESCENDING]).isRequired,
+    onSortChange: PropTypes.func,
+    selectOptions: PropTypes.arrayOf(PropTypes.shape({
+        id: PropTypes.string.isRequired,
+        label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
+        selected: PropTypes.bool,
+        disabled: PropTypes.bool,
+    })).isRequired,
+    className: PropTypes.string,
+};
+export default TableCardsSorting;

package/components/table/TableSearch.d.ts

@@ -1,9 +1,9 @@
-export default TableSearch;
-declare function TableSearch(props: any): JSX.Element;
-declare namespace TableSearch {
-    const defaultProps: {};
-    namespace propTypes {
-        const className: PropTypes.Requireable<string>;
-    }
-}
-import PropTypes from "prop-types";
+export default TableSearch;
+declare function TableSearch(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace TableSearch {
+    const defaultProps: {};
+    namespace propTypes {
+        const className: PropTypes.Requireable<string>;
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableSearch.js

@@ -1,15 +1,15 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import ClearableInput from '../clearableInput/ClearableInput';
-const TableSearch = props => {
-    const { className } = props;
-    const wrapperClassNames = classNames('table-toolbar-search', 'input-group', className && className);
-    return (_jsxs("div", Object.assign({ className: wrapperClassNames }, { children: [_jsx("span", Object.assign({ className: 'input-group-addon' }, { children: _jsx("span", { className: 'rioglyph rioglyph-search' }) })), _jsx(ClearableInput, Object.assign({}, props))] })));
-};
-TableSearch.defaultProps = {};
-TableSearch.propTypes = {
-    className: PropTypes.string,
-};
-export default TableSearch;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import ClearableInput from '../clearableInput/ClearableInput';
+const TableSearch = props => {
+    const { className } = props;
+    const wrapperClassNames = classNames('table-toolbar-search', 'input-group', className && className);
+    return (_jsxs("div", Object.assign({ className: wrapperClassNames }, { children: [_jsx("span", Object.assign({ className: 'input-group-addon' }, { children: _jsx("span", { className: 'rioglyph rioglyph-search' }) })), _jsx(ClearableInput, Object.assign({}, props))] })));
+};
+TableSearch.defaultProps = {};
+TableSearch.propTypes = {
+    className: PropTypes.string,
+};
+export default TableSearch;

package/components/table/TableSettingsColumnButtons.d.ts

@@ -1,28 +1,28 @@
-export function TableSettingsColumnButtons(props: any): JSX.Element;
-export namespace TableSettingsColumnButtons {
-    namespace defaultProps {
-        const column: string;
-        const index: number;
-        const columnOrder: never[];
-        const openColumnsDetails: {};
-        function onMoveColumn(): undefined;
-        function onOpenDetails(): undefined;
-    }
-    namespace propTypes {
-        const column_1: PropTypes.Validator<string>;
-        export { column_1 as column };
-        const index_1: PropTypes.Validator<number>;
-        export { index_1 as index };
-        const columnOrder_1: PropTypes.Validator<(string | null | undefined)[]>;
-        export { columnOrder_1 as columnOrder };
-        const openColumnsDetails_1: PropTypes.Validator<object>;
-        export { openColumnsDetails_1 as openColumnsDetails };
-        export const disabled: PropTypes.Requireable<boolean>;
-        export const columnDetails: PropTypes.Requireable<object>;
-        const onMoveColumn_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onMoveColumn_1 as onMoveColumn };
-        const onOpenDetails_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onOpenDetails_1 as onOpenDetails };
-    }
-}
-import PropTypes from "prop-types";
+export function TableSettingsColumnButtons(props: any): import("react/jsx-runtime").JSX.Element;
+export namespace TableSettingsColumnButtons {
+    namespace defaultProps {
+        const column: string;
+        const index: number;
+        const columnOrder: never[];
+        const openColumnsDetails: {};
+        function onMoveColumn(): undefined;
+        function onOpenDetails(): undefined;
+    }
+    namespace propTypes {
+        const column_1: PropTypes.Validator<string>;
+        export { column_1 as column };
+        const index_1: PropTypes.Validator<number>;
+        export { index_1 as index };
+        const columnOrder_1: PropTypes.Validator<(string | null | undefined)[]>;
+        export { columnOrder_1 as columnOrder };
+        const openColumnsDetails_1: PropTypes.Validator<object>;
+        export { openColumnsDetails_1 as openColumnsDetails };
+        export const disabled: PropTypes.Requireable<boolean>;
+        export const columnDetails: PropTypes.Requireable<object>;
+        const onMoveColumn_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onMoveColumn_1 as onMoveColumn };
+        const onOpenDetails_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onOpenDetails_1 as onOpenDetails };
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableSettingsColumnButtons.js

@@ -1,38 +1,38 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-export const TableSettingsColumnButtons = props => {
-    const { column, index, columnDetails, columnOrder, openColumnsDetails, disabled, onMoveColumn, onOpenDetails } = props;
-    const navButtonBase = classNames('btn btn-muted btn-icon-only btn-sm');
-    const columnUpClasses = classNames(navButtonBase, index === 0 && 'disabled');
-    const columnDownClasses = classNames(navButtonBase, index === columnOrder.length - 1 && 'disabled');
-    const toggleIconClassNames = classNames('rioglyph', openColumnsDetails[column] ? 'rioglyph-remove' : 'rioglyph-width');
-    return (_jsxs("div", Object.assign({ className: 'table-settings-item-item-buttons' }, { children: [!disabled && (_jsx("div", Object.assign({ className: columnUpClasses, onClick: event => {
-                    event.preventDefault();
-                    event.stopPropagation();
-                    onMoveColumn(column, index - 1, true);
-                } }, { children: _jsx("span", { className: 'rioglyph rioglyph-arrow-up' }) }))), !disabled && (_jsx("div", Object.assign({ className: columnDownClasses, onClick: event => {
-                    event.preventDefault();
-                    event.stopPropagation();
-                    onMoveColumn(column, index + 1, true);
-                } }, { children: _jsx("span", { className: 'rioglyph rioglyph-arrow-down' }) }))), columnDetails && (_jsx("div", Object.assign({ className: navButtonBase, onClick: () => onOpenDetails(column) }, { children: _jsx("span", { className: toggleIconClassNames }) })))] })));
-};
-TableSettingsColumnButtons.defaultProps = {
-    column: '',
-    index: 0,
-    columnOrder: [],
-    openColumnsDetails: {},
-    onMoveColumn: () => undefined,
-    onOpenDetails: () => undefined,
-};
-TableSettingsColumnButtons.propTypes = {
-    column: PropTypes.string.isRequired,
-    index: PropTypes.number.isRequired,
-    columnOrder: PropTypes.arrayOf(PropTypes.string).isRequired,
-    openColumnsDetails: PropTypes.object.isRequired,
-    disabled: PropTypes.bool,
-    columnDetails: PropTypes.object,
-    onMoveColumn: PropTypes.func,
-    onOpenDetails: PropTypes.func,
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+export const TableSettingsColumnButtons = props => {
+    const { column, index, columnDetails, columnOrder, openColumnsDetails, disabled, onMoveColumn, onOpenDetails } = props;
+    const navButtonBase = classNames('btn btn-muted btn-icon-only btn-sm');
+    const columnUpClasses = classNames(navButtonBase, index === 0 && 'disabled');
+    const columnDownClasses = classNames(navButtonBase, index === columnOrder.length - 1 && 'disabled');
+    const toggleIconClassNames = classNames('rioglyph', openColumnsDetails[column] ? 'rioglyph-remove' : 'rioglyph-width');
+    return (_jsxs("div", Object.assign({ className: 'table-settings-item-item-buttons' }, { children: [!disabled && (_jsx("div", Object.assign({ className: columnUpClasses, onClick: event => {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    onMoveColumn(column, index - 1, true);
+                } }, { children: _jsx("span", { className: 'rioglyph rioglyph-arrow-up' }) }))), !disabled && (_jsx("div", Object.assign({ className: columnDownClasses, onClick: event => {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    onMoveColumn(column, index + 1, true);
+                } }, { children: _jsx("span", { className: 'rioglyph rioglyph-arrow-down' }) }))), columnDetails && (_jsx("div", Object.assign({ className: navButtonBase, onClick: () => onOpenDetails(column) }, { children: _jsx("span", { className: toggleIconClassNames }) })))] })));
+};
+TableSettingsColumnButtons.defaultProps = {
+    column: '',
+    index: 0,
+    columnOrder: [],
+    openColumnsDetails: {},
+    onMoveColumn: () => undefined,
+    onOpenDetails: () => undefined,
+};
+TableSettingsColumnButtons.propTypes = {
+    column: PropTypes.string.isRequired,
+    index: PropTypes.number.isRequired,
+    columnOrder: PropTypes.arrayOf(PropTypes.string).isRequired,
+    openColumnsDetails: PropTypes.object.isRequired,
+    disabled: PropTypes.bool,
+    columnDetails: PropTypes.object,
+    onMoveColumn: PropTypes.func,
+    onOpenDetails: PropTypes.func,
+};

package/components/table/TableSettingsColumnDetails.d.ts

@@ -1,19 +1,19 @@
-export function TableSettingsColumnDetails(props: any): JSX.Element;
-export namespace TableSettingsColumnDetails {
-    namespace defaultProps {
-        function onColumnWidthChange(): undefined;
-        function onResetColumnWidth(): undefined;
-    }
-    namespace propTypes {
-        export const column: PropTypes.Validator<string>;
-        export const width: PropTypes.Requireable<number>;
-        export const defaultWidth: PropTypes.Requireable<number>;
-        export const maxWidth: PropTypes.Requireable<number>;
-        export const maxColumnWidth: PropTypes.Validator<number>;
-        const onColumnWidthChange_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onColumnWidthChange_1 as onColumnWidthChange };
-        const onResetColumnWidth_1: PropTypes.Requireable<(...args: any[]) => any>;
-        export { onResetColumnWidth_1 as onResetColumnWidth };
-    }
-}
-import PropTypes from "prop-types";
+export function TableSettingsColumnDetails(props: any): import("react/jsx-runtime").JSX.Element;
+export namespace TableSettingsColumnDetails {
+    namespace defaultProps {
+        function onColumnWidthChange(): undefined;
+        function onResetColumnWidth(): undefined;
+    }
+    namespace propTypes {
+        export const column: PropTypes.Validator<string>;
+        export const width: PropTypes.Requireable<number>;
+        export const defaultWidth: PropTypes.Requireable<number>;
+        export const maxWidth: PropTypes.Requireable<number>;
+        export const maxColumnWidth: PropTypes.Validator<number>;
+        const onColumnWidthChange_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onColumnWidthChange_1 as onColumnWidthChange };
+        const onResetColumnWidth_1: PropTypes.Requireable<(...args: any[]) => any>;
+        export { onResetColumnWidth_1 as onResetColumnWidth };
+    }
+}
+import PropTypes from "prop-types";

package/components/table/TableSettingsColumnDetails.js

@@ -1,31 +1,31 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import PropTypes from 'prop-types';
-import classNames from 'classnames';
-import Slider from '../slider/Slider';
-export const TableSettingsColumnDetails = props => {
-    const { width = 0, defaultWidth = 0, maxWidth, maxColumnWidth, column, onColumnWidthChange, onResetColumnWidth, } = props;
-    const handleWidthInputChange = event => {
-        const parsedValue = event.target.value ? parseInt(event.target.value, 10) : 0;
-        const max = maxWidth || maxColumnWidth;
-        const value = Math.min(parsedValue, max);
-        onColumnWidthChange(column, value);
-    };
-    const handleColumnWidthChange = value => onColumnWidthChange(column, value);
-    const handleResetColumnWidth = () => onResetColumnWidth(column);
-    const resetWidthButtonClassNames = classNames('btn', 'btn-muted', 'btn-icon-only', 'btn-sm', 'margin-left-10', width === defaultWidth && 'disabled');
-    return (_jsxs("div", Object.assign({ className: 'table-settings-item-body' }, { children: [_jsx(Slider, { className: 'margin-bottom-0', value: width, minValue: 0, maxValue: maxWidth || maxColumnWidth, step: 1, onChange: handleColumnWidthChange }), _jsx("div", Object.assign({ className: resetWidthButtonClassNames, role: 'button', onClick: handleResetColumnWidth }, { children: _jsx("span", { className: 'rioglyph rioglyph-revert' }) })), _jsx("div", Object.assign({ className: 'column-width-input' }, { children: _jsxs("div", Object.assign({ className: 'input-group' }, { children: [_jsx("input", { className: 'form-control text-right padding-right-5 no-controls', type: 'number', value: width || '', min: 0, max: maxWidth || maxColumnWidth, onChange: handleWidthInputChange }), _jsx("div", Object.assign({ className: 'input-group-addon' }, { children: "px" }))] })) }))] })));
-};
-TableSettingsColumnDetails.defaultProps = {
-    onColumnWidthChange: () => undefined,
-    onResetColumnWidth: () => undefined,
-};
-TableSettingsColumnDetails.propTypes = {
-    column: PropTypes.string.isRequired,
-    width: PropTypes.number,
-    defaultWidth: PropTypes.number,
-    maxWidth: PropTypes.number,
-    maxColumnWidth: PropTypes.number.isRequired,
-    onColumnWidthChange: PropTypes.func,
-    onResetColumnWidth: PropTypes.func,
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+import Slider from '../slider/Slider';
+export const TableSettingsColumnDetails = props => {
+    const { width = 0, defaultWidth = 0, maxWidth, maxColumnWidth, column, onColumnWidthChange, onResetColumnWidth, } = props;
+    const handleWidthInputChange = event => {
+        const parsedValue = event.target.value ? parseInt(event.target.value, 10) : 0;
+        const max = maxWidth || maxColumnWidth;
+        const value = Math.min(parsedValue, max);
+        onColumnWidthChange(column, value);
+    };
+    const handleColumnWidthChange = value => onColumnWidthChange(column, value);
+    const handleResetColumnWidth = () => onResetColumnWidth(column);
+    const resetWidthButtonClassNames = classNames('btn', 'btn-muted', 'btn-icon-only', 'btn-sm', 'margin-left-10', width === defaultWidth && 'disabled');
+    return (_jsxs("div", Object.assign({ className: 'table-settings-item-body' }, { children: [_jsx(Slider, { className: 'margin-bottom-0', value: width, minValue: 0, maxValue: maxWidth || maxColumnWidth, step: 1, onChange: handleColumnWidthChange }), _jsx("div", Object.assign({ className: resetWidthButtonClassNames, role: 'button', onClick: handleResetColumnWidth }, { children: _jsx("span", { className: 'rioglyph rioglyph-revert' }) })), _jsx("div", Object.assign({ className: 'column-width-input' }, { children: _jsxs("div", Object.assign({ className: 'input-group' }, { children: [_jsx("input", { className: 'form-control text-right padding-right-5 no-controls', type: 'number', value: width || '', min: 0, max: maxWidth || maxColumnWidth, onChange: handleWidthInputChange }), _jsx("div", Object.assign({ className: 'input-group-addon' }, { children: "px" }))] })) }))] })));
+};
+TableSettingsColumnDetails.defaultProps = {
+    onColumnWidthChange: () => undefined,
+    onResetColumnWidth: () => undefined,
+};
+TableSettingsColumnDetails.propTypes = {
+    column: PropTypes.string.isRequired,
+    width: PropTypes.number,
+    defaultWidth: PropTypes.number,
+    maxWidth: PropTypes.number,
+    maxColumnWidth: PropTypes.number.isRequired,
+    onColumnWidthChange: PropTypes.func,
+    onResetColumnWidth: PropTypes.func,
+};