@synerise/ds-column-manager 1.0.13 → 1.1.1

package/dist/ColumnManagerList/ColumnManagerList.js

@@ -1,62 +1,95 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { ReactSortable } from 'react-sortablejs';
+import React, { useMemo, useRef, useState } from 'react';
+import { DragOverlay } from '@dnd-kit/core';
+import { SortableContainer } from '@synerise/ds-sortable';
+import Scrollbar from '@synerise/ds-scrollbar';
+import Result from '@synerise/ds-result';
+import { useResizeObserver } from '@synerise/ds-utils';
+import { ColumnManagerSortableItem } from '../ColumnManagerSortableItem/ColumnManagerSortableItem';
+import { ColumnManagerItem } from '../ColumnManagerItem/ColumnManagerItem';
 import * as S from './ColumnManager.style';
-import ColumnManagerItem from '../ColumnManagerItem/ColumnManagerItem';
-import ColumnManagerSearchResults from '../ColumnManagerSearchResults/ColumnManagerSearchResults';
-var SORTABLE_CONFIG = {
-  ghostClass: 'sortable-list-ghost-element',
-  className: 'sortable-list',
-  animation: 150,
-  group: 'column-manager',
-  forceFallback: true
+export var LIST_STYLE = {
+  overflowX: 'unset',
+  overflowY: 'unset'
 };
 var ColumnManagerList = function ColumnManagerList(_ref) {
   var searchQuery = _ref.searchQuery,
-    visibleList = _ref.visibleList,
-    hiddenList = _ref.hiddenList,
-    updateVisibleList = _ref.updateVisibleList,
-    updateHiddenList = _ref.updateHiddenList,
-    setFixed = _ref.setFixed,
-    showGroupSettings = _ref.showGroupSettings,
+    columns = _ref.columns,
+    draggable = _ref.draggable,
+    handleOrderChange = _ref.handleOrderChange,
     toggleColumn = _ref.toggleColumn,
-    searchResults = _ref.searchResults,
     texts = _ref.texts;
-  return /*#__PURE__*/React.createElement(S.ColumnManagerList, null, !searchQuery ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.ListHeadline, null, texts.visible), /*#__PURE__*/React.createElement(ReactSortable, _extends({}, SORTABLE_CONFIG, {
-    list: visibleList,
-    setList: updateVisibleList
-  }), visibleList.map(function (item) {
-    return /*#__PURE__*/React.createElement(ColumnManagerItem, {
-      "data-testid": "ds-column-manager-visible-item",
-      key: item.id,
-      item: item,
-      setFixed: setFixed,
-      showGroupSettings: showGroupSettings,
-      switchAction: toggleColumn,
-      draggable: true,
-      texts: texts
+  var _useState = useState(),
+    activeItem = _useState[0],
+    setActiveItem = _useState[1];
+  var _useState2 = useState(0),
+    containerHeight = _useState2[0],
+    setContainerHeight = _useState2[1];
+  var listRef = useRef(null);
+  var containerRef = useRef(null);
+  var isItemDraggable = draggable && !searchQuery;
+  var items = useMemo(function () {
+    return columns.map(function (column) {
+      return {
+        key: column.id,
+        id: column.id,
+        item: column,
+        isDragged: (activeItem == null ? void 0 : activeItem.id) === column.id,
+        switchAction: toggleColumn,
+        draggable: isItemDraggable,
+        texts: texts
+      };
     });
-  })), hiddenList.length > 0 && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(S.ListHeadline, null, texts.hidden), /*#__PURE__*/React.createElement(ReactSortable, _extends({}, SORTABLE_CONFIG, {
-    list: hiddenList,
-    setList: updateHiddenList
-  }), hiddenList.map(function (item) {
-    return /*#__PURE__*/React.createElement(ColumnManagerItem, {
-      "data-testid": "ds-column-manager-hidden-item",
-      key: item.id,
-      item: item,
-      setFixed: setFixed,
-      switchAction: toggleColumn,
-      showGroupSettings: showGroupSettings,
-      draggable: true,
-      texts: texts
-    });
-  })))) : /*#__PURE__*/React.createElement(ColumnManagerSearchResults, {
-    texts: texts,
-    searchResults: searchResults,
-    showGroupSettings: showGroupSettings,
-    searchQuery: searchQuery,
-    setFixed: setFixed,
-    switchAction: toggleColumn
-  }));
+  }, [columns, toggleColumn, texts, activeItem, isItemDraggable]);
+  var handleScroll = function handleScroll(_ref2) {
+    var currentTarget = _ref2.currentTarget;
+    var scrollTop = currentTarget.scrollTop;
+    if (listRef.current) {
+      listRef.current.scrollTo(scrollTop);
+    }
+  };
+  useResizeObserver(containerRef, function (dimensions) {
+    setContainerHeight(dimensions.height);
+  });
+  return /*#__PURE__*/React.createElement(S.ColumnManagerList, {
+    ref: containerRef,
+    "data-testid": "ds-column-manager-list"
+  }, !items.length && searchQuery ? /*#__PURE__*/React.createElement(Result, {
+    description: texts.noResults,
+    type: "no-results",
+    noSearchResults: true
+  }) : /*#__PURE__*/React.createElement(SortableContainer, {
+    onDragStart: function onDragStart(_ref3) {
+      var active = _ref3.active;
+      var column = items.find(function (item) {
+        return item.id === active.id;
+      });
+      setActiveItem(column);
+    },
+    onDragEnd: function onDragEnd() {
+      setActiveItem(undefined);
+    },
+    onOrderChange: handleOrderChange,
+    onDragCancel: function onDragCancel() {
+      return setActiveItem(undefined);
+    },
+    items: items,
+    axis: "y"
+  }, /*#__PURE__*/React.createElement(Scrollbar, {
+    absolute: true,
+    withDnd: true,
+    onScroll: handleScroll,
+    maxHeight: containerHeight
+  }, /*#__PURE__*/React.createElement(S.List, {
+    isDragging: !!activeItem,
+    height: containerHeight,
+    itemCount: items.length,
+    itemSize: 56,
+    itemData: items,
+    width: "100%",
+    ref: listRef,
+    style: LIST_STYLE
+  }, function (props) {
+    return /*#__PURE__*/React.createElement(ColumnManagerSortableItem, props);
+  })), /*#__PURE__*/React.createElement(DragOverlay, null, activeItem && /*#__PURE__*/React.createElement(ColumnManagerItem, activeItem))));
 };
 export default ColumnManagerList;

package/dist/ColumnManagerList/ColumnManagerList.types.d.ts

@@ -1,18 +1,10 @@
-import React from 'react';
-import { Column } from '../ColumnManagerItem/ColumManagerItem.types';
-import { GroupSettings } from '../ColumnManager.types';
-export type Props = {
+import type { Column, ColumnManagerItemProps } from '../ColumnManagerItem/ColumManagerItem.types';
+import type { ColumnManagerTexts } from '../ColumnManager.types';
+export type ColumnManagerListProps<ColumnType extends Column> = {
     searchQuery: string;
-    visibleList: Column[];
-    hiddenList: Column[];
-    searchResults: Column[];
-    setFixed: (id: string, fixed?: string) => void;
-    showGroupSettings: (item: Column) => void;
+    columns: ColumnType[];
+    draggable?: boolean;
+    handleOrderChange: (items: ColumnManagerItemProps<ColumnType>[]) => void;
     toggleColumn: (id: string, visible: boolean) => void;
-    groupSettings?: GroupSettings;
-    updateVisibleList: (newList: Column[]) => void;
-    updateHiddenList: (newList: Column[]) => void;
-    texts: {
-        [k: string]: string | React.ReactNode;
-    };
+    texts: ColumnManagerTexts;
 };

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ColumnManagerSortableItemProps } from './ColumnManagerSortableItem.types';
+import { Column } from '../ColumnManagerItem/ColumManagerItem.types';
+export declare const ColumnManagerSortableItem: <ColumnType extends Column>(props: ColumnManagerSortableItemProps<ColumnType>) => React.JSX.Element;

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.js

@@ -0,0 +1,36 @@
+var _excluded = ["index", "style", "data"];
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import React from 'react';
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { ColumnManagerItem } from '../ColumnManagerItem/ColumnManagerItem';
+export var ColumnManagerSortableItem = function ColumnManagerSortableItem(props) {
+  var index = props.index,
+    styleProp = props.style,
+    data = props.data,
+    rest = _objectWithoutPropertiesLoose(props, _excluded);
+  var id = data[index].id;
+  var _useSortable = useSortable({
+      id: id
+    }),
+    attributes = _useSortable.attributes,
+    listeners = _useSortable.listeners,
+    setNodeRef = _useSortable.setNodeRef,
+    transform = _useSortable.transform,
+    transition = _useSortable.transition;
+  var style = _extends({}, styleProp, {
+    transform: CSS.Transform.toString(transform),
+    transition: transition
+  });
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
+    key: "column-manager-item-" + id,
+    style: style,
+    ref: setNodeRef
+  }), /*#__PURE__*/React.createElement(ColumnManagerItem, _extends({}, data[index], {
+    dragHandleProps: {
+      attributes: attributes,
+      listeners: listeners
+    }
+  })));
+};

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.types.d.ts

@@ -0,0 +1,3 @@
+import type { ListChildComponentProps } from 'react-window';
+import type { ColumnManagerItemProps, Column } from '../ColumnManagerItem/ColumManagerItem.types';
+export type ColumnManagerSortableItemProps<ColumnType extends Column> = ListChildComponentProps<ColumnManagerItemProps<ColumnType>[]>;

package/dist/hooks/useTranslations.d.ts

@@ -0,0 +1,2 @@
+import type { ColumnManagerTexts } from '../ColumnManager.types';
+export declare const useTranslations: (texts?: Partial<ColumnManagerTexts>) => ColumnManagerTexts;

package/dist/hooks/useTranslations.js

@@ -0,0 +1,43 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import { useIntl } from 'react-intl';
+export var useTranslations = function useTranslations(texts) {
+  var intl = useIntl();
+  return _extends({
+    title: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.TITLE',
+      defaultMessage: 'Manage columns'
+    }),
+    searchPlaceholder: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.SEARCH-PLACEHOLDER',
+      defaultMessage: 'Search columns'
+    }),
+    searchClearTooltip: intl.formatMessage({
+      id: 'DS.ITEM-FILTER.SEARCH-CLEAR',
+      defaultMessage: 'Clear'
+    }),
+    noResults: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.NO-RESULTS',
+      defaultMessage: 'No results'
+    }),
+    cancel: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.CANCEL',
+      defaultMessage: 'Cancel'
+    }),
+    apply: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.APPLY',
+      defaultMessage: 'Apply'
+    }),
+    clear: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.CLEAR',
+      defaultMessage: 'Clear'
+    }),
+    switchOn: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.SWITCH-ON',
+      defaultMessage: 'Hide column'
+    }),
+    switchOff: intl.formatMessage({
+      id: 'DS.COLUMN-MANAGER.SWITCH-OFF',
+      defaultMessage: 'Show column'
+    })
+  }, texts || {});
+};

package/dist/index.d.ts

@@ -1,4 +1,3 @@
 export { default } from './ColumnManager';
-export { GROUP_BY } from './ColumnManagerGroupSettings/ColumnManagerGroupSettings.types';
-export type { SavedView, GroupSettings, ColumnManagerProps } from './ColumnManager.types';
+export type { ColumnManagerProps } from './ColumnManager.types';
 export type { Column } from './ColumnManagerItem/ColumManagerItem.types';

package/dist/index.js

@@ -1,2 +1 @@
-export { default } from './ColumnManager';
-export { GROUP_BY } from './ColumnManagerGroupSettings/ColumnManagerGroupSettings.types';
+export { default } from './ColumnManager';

package/dist/utils/matchesSearchQuery.d.ts

@@ -0,0 +1 @@
+export declare const matchesSearchQuery: (text: string, searchQuery: string) => boolean;

package/dist/utils/matchesSearchQuery.js

@@ -0,0 +1,3 @@
+export var matchesSearchQuery = function matchesSearchQuery(text, searchQuery) {
+  return text.toLowerCase().includes(searchQuery.toLowerCase());
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-column-manager",
-  "version": "1.0.13",
+  "version": "1.1.1",
   "description": "ColumnManager UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -31,26 +31,19 @@
   "sideEffects": false,
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-alert": "^1.1.3",
-    "@synerise/ds-button": "^1.3.2",
-    "@synerise/ds-drawer": "^1.0.3",
-    "@synerise/ds-dropdown": "^1.0.9",
-    "@synerise/ds-icon": "^1.5.1",
-    "@synerise/ds-input": "^1.1.4",
-    "@synerise/ds-input-number": "^1.1.4",
-    "@synerise/ds-item-filter": "^1.0.13",
-    "@synerise/ds-menu": "^1.0.10",
-    "@synerise/ds-modal": "^1.1.3",
-    "@synerise/ds-result": "^1.0.10",
-    "@synerise/ds-scrollbar": "^1.0.9",
-    "@synerise/ds-search-bar": "^1.1.4",
-    "@synerise/ds-select": "^1.1.4",
-    "@synerise/ds-switch": "^1.1.4",
-    "@synerise/ds-tooltip": "^1.1.8",
-    "@synerise/ds-typography": "^1.0.9",
-    "@synerise/ds-utils": "^1.1.1",
-    "react-sortablejs": "^6.0.0",
-    "uuid": "^8.3.2"
+    "@synerise/ds-button": "^1.3.3",
+    "@synerise/ds-drawer": "^1.0.4",
+    "@synerise/ds-icon": "^1.5.2",
+    "@synerise/ds-menu": "^1.0.11",
+    "@synerise/ds-result": "^1.0.11",
+    "@synerise/ds-scrollbar": "^1.0.10",
+    "@synerise/ds-search-bar": "^1.3.0",
+    "@synerise/ds-sortable": "^1.2.0",
+    "@synerise/ds-switch": "^1.1.5",
+    "@synerise/ds-tooltip": "^1.1.9",
+    "@synerise/ds-typography": "^1.0.10",
+    "@synerise/ds-utils": "^1.2.0",
+    "react-window": "1.8.5"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
@@ -59,5 +52,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "12eaee0c6431aac9a7b2dbc42e0f8567b3de7244"
+  "gitHead": "35c8f09d6a248f199237766c1f5181f4b3fc88af"
 }

package/dist/ColumnManagerGroupSettings/ColumnManagerGroupSettings.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { GroupSettingsProps } from './ColumnManagerGroupSettings.types';
-declare const ColumnManagerGroupSettings: React.FC<GroupSettingsProps>;
-export default ColumnManagerGroupSettings;

package/dist/ColumnManagerGroupSettings/ColumnManagerGroupSettings.js

@@ -1,210 +0,0 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import Modal from '@synerise/ds-modal';
-import React from 'react';
-import Select from '@synerise/ds-select';
-import Icon, { InfoFillS, Add3M } from '@synerise/ds-icon';
-import Tooltip from '@synerise/ds-tooltip';
-import { theme } from '@synerise/ds-core';
-import Button from '@synerise/ds-button';
-import InputNumber from '@synerise/ds-input-number';
-import Alert from '@synerise/ds-alert';
-import * as S from './ColumnManangerGroupSettings.styles';
-import RangesForm from './RangesForm/RangesForm';
-import { GROUP_BY } from './ColumnManagerGroupSettings.types';
-var EMPTY_RANGE = {
-  from: {
-    value: undefined,
-    error: undefined
-  },
-  to: {
-    value: undefined,
-    error: undefined
-  }
-};
-var validateRange = function validateRange(range, index, ranges, texts) {
-  var validRange = _extends({}, range);
-  if ((range.from.value === undefined || range.from.value === '') && (range.to.value === undefined || range.to.value === '')) {
-    validRange.from.error = texts.errorEmptyRange;
-    validRange.to.error = texts.errorEmptyRange;
-  } else {
-    if ((range.from.value === undefined || range.from.value === '') && index > 0) {
-      validRange.from.error = texts.errorEmptyFromField;
-    } else {
-      validRange.from.error = undefined;
-    }
-    if ((range.to.value === undefined || range.from.value === '') && index < ranges.length - 1) {
-      validRange.to.error = texts.errorEmptyToField;
-    } else {
-      validRange.to.error = undefined;
-    }
-  }
-  return validRange;
-};
-var ColumnManagerGroupSettings = function ColumnManagerGroupSettings(_ref) {
-  var hide = _ref.hide,
-    visible = _ref.visible,
-    column = _ref.column,
-    onOk = _ref.onOk,
-    settings = _ref.settings,
-    texts = _ref.texts;
-  var _React$useState = React.useState(undefined),
-    groupBy = _React$useState[0],
-    setGroupBy = _React$useState[1];
-  var _React$useState2 = React.useState([EMPTY_RANGE]),
-    ranges = _React$useState2[0],
-    setRanges = _React$useState2[1];
-  var _React$useState3 = React.useState(undefined),
-    interval = _React$useState3[0],
-    setIntervalValue = _React$useState3[1];
-  var _React$useState4 = React.useState(undefined),
-    error = _React$useState4[0],
-    setError = _React$useState4[1];
-  var clearState = React.useCallback(function () {
-    setRanges([EMPTY_RANGE]);
-    setError(undefined);
-    setGroupBy(undefined);
-    setIntervalValue(undefined);
-  }, []);
-  React.useEffect(function () {
-    setGroupBy(settings == null ? void 0 : settings.settings.type);
-    setRanges((settings == null ? void 0 : settings.settings.ranges) || [EMPTY_RANGE]);
-    setIntervalValue((settings == null ? void 0 : settings.settings.interval) || undefined);
-    return function () {
-      clearState();
-    };
-  }, [settings, setGroupBy, setRanges, clearState, setIntervalValue]);
-  var validate = React.useCallback(function () {
-    if (groupBy === GROUP_BY.value) return true;
-    if (groupBy === undefined) {
-      setError(texts.errorChooseGrouping);
-      return false;
-    }
-    if (groupBy === GROUP_BY.interval) {
-      if (!interval) {
-        setError(texts.errorInterval);
-      } else {
-        setError(undefined);
-      }
-      return Boolean(interval);
-    }
-    if (groupBy === GROUP_BY.ranges) {
-      var validatedRanges = ranges.map(function (range, index, allRanges) {
-        return validateRange(range, index, allRanges, texts);
-      });
-      var errors = validatedRanges.filter(function (range) {
-        return range.from.error || range.to.error;
-      });
-      setRanges(validatedRanges);
-      if (errors.length) {
-        setError(texts.errorRange);
-        return false;
-      }
-    }
-    setError(undefined);
-    return true;
-  }, [groupBy, ranges, interval, setError, setRanges, texts]);
-  var handleOk = React.useCallback(function () {
-    if (groupBy === GROUP_BY.disabled) {
-      onOk(undefined);
-      return;
-    }
-    if (validate()) {
-      var currentSettings = {
-        column: column,
-        settings: {
-          type: groupBy,
-          ranges: groupBy === GROUP_BY.ranges && ranges.map(function (range) {
-            return {
-              from: range.from,
-              to: range.to
-            };
-          }),
-          interval: groupBy === GROUP_BY.interval && interval
-        }
-      };
-      clearState();
-      onOk(currentSettings);
-    }
-  }, [onOk, column, groupBy, ranges, interval, clearState, validate]);
-  var selectLabel = React.useMemo(function () {
-    return /*#__PURE__*/React.createElement(S.Title, null, texts.groupingType, /*#__PURE__*/React.createElement(Tooltip, {
-      title: texts.groupingTypeTooltip,
-      trigger: ['hover']
-    }, /*#__PURE__*/React.createElement(S.IconWrapper, null, /*#__PURE__*/React.createElement(Icon, {
-      component: /*#__PURE__*/React.createElement(InfoFillS, null),
-      color: theme.palette['grey-600']
-    }))));
-  }, [texts]);
-  var addRow = React.useCallback(function () {
-    setRanges([].concat(ranges, [EMPTY_RANGE]));
-  }, [setRanges, ranges]);
-  var renderForm = React.useCallback(function () {
-    if (groupBy === GROUP_BY.ranges) {
-      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(RangesForm, {
-        setRanges: setRanges,
-        ranges: ranges,
-        type: (column == null ? void 0 : column.type) || '',
-        texts: texts
-      }), /*#__PURE__*/React.createElement(Button, {
-        onClick: addRow,
-        type: "ghost-primary",
-        mode: "icon-label"
-      }, /*#__PURE__*/React.createElement(Icon, {
-        component: /*#__PURE__*/React.createElement(Add3M, null)
-      }), texts.addRange));
-    }
-    if (groupBy === GROUP_BY.interval) {
-      return /*#__PURE__*/React.createElement(S.IntervalInput, null, /*#__PURE__*/React.createElement(InputNumber, {
-        "data-testid": "group-by-interval",
-        min: 1,
-        label: texts.intervalPlaceholder,
-        value: Number(interval),
-        onChange: setIntervalValue
-      }));
-    }
-    return null;
-  }, [groupBy, ranges, column, interval, addRow, texts]);
-  var handleHide = React.useCallback(function () {
-    clearState();
-    hide();
-  }, [hide, clearState]);
-  var groupByRangesDisabled = React.useMemo(function () {
-    var availableColumnTypes = ['text', 'number', 'date'];
-    var type = (column == null ? void 0 : column.type) || undefined;
-    return !type || !availableColumnTypes.includes(type);
-  }, [column]);
-  var handleGroupTypeChange = React.useCallback(function (value) {
-    setGroupBy(value);
-    setError(undefined);
-  }, [setGroupBy, setError]);
-  return /*#__PURE__*/React.createElement(Modal, {
-    onCancel: handleHide,
-    visible: visible,
-    onOk: handleOk,
-    size: "small",
-    title: texts.groupTitle
-  }, /*#__PURE__*/React.createElement(S.ModalContent, null, /*#__PURE__*/React.createElement(Select, {
-    label: selectLabel,
-    value: groupBy,
-    onChange: handleGroupTypeChange,
-    placeholder: texts.selectPlaceholder,
-    style: {
-      width: '100%'
-    }
-  }, /*#__PURE__*/React.createElement(Select.Option, {
-    value: GROUP_BY.value
-  }, texts.groupByValue), /*#__PURE__*/React.createElement(Select.Option, {
-    value: GROUP_BY.ranges,
-    disabled: groupByRangesDisabled
-  }, texts.groupByRanges), /*#__PURE__*/React.createElement(Select.Option, {
-    value: GROUP_BY.interval
-  }, texts.groupByIntervals), /*#__PURE__*/React.createElement(Select.Option, {
-    value: GROUP_BY.disabled
-  }, texts.groupDisabled)), error && /*#__PURE__*/React.createElement(Alert, {
-    type: "error",
-    description: error,
-    message: "",
-    showIcon: true
-  }), renderForm()));
-};
-export default ColumnManagerGroupSettings;

package/dist/ColumnManagerGroupSettings/ColumnManagerGroupSettings.types.d.ts

@@ -1,27 +0,0 @@
-import React from 'react';
-import { GroupSettings } from '../ColumnManager.types';
-import { Column } from '../ColumnManagerItem/ColumManagerItem.types';
-export type GroupSettingsTexts = 'groupByValue' | 'groupByRanges' | 'groupByIntervals' | 'groupDisabled' | 'groupTitle' | 'selectPlaceholder' | 'intervalPlaceholder' | 'groupingType' | 'groupingTypeTooltip' | 'from' | 'to' | 'remove' | 'addRange' | 'errorEmptyRange' | 'errorEmptyFromField' | 'errorEmptyToField' | 'errorChooseGrouping' | 'errorInterval' | 'errorRange';
-export declare const GROUP_BY: {
-    [key: string]: string;
-};
-export interface GroupSettingsProps {
-    hide: () => void;
-    onOk: (settings: GroupSettings | undefined) => void;
-    visible: boolean;
-    settings?: GroupSettings;
-    column?: Column;
-    texts: {
-        [k in GroupSettingsTexts]: string | React.ReactNode;
-    };
-}
-export interface Range {
-    from: {
-        value: string | number | null | undefined;
-        error: React.ReactNode | undefined;
-    };
-    to: {
-        value: string | number | null | undefined;
-        error: React.ReactNode | undefined;
-    };
-}

package/dist/ColumnManagerGroupSettings/ColumnManagerGroupSettings.types.js

@@ -1,6 +0,0 @@
-export var GROUP_BY = {
-  value: 'value',
-  ranges: 'ranges',
-  interval: 'interval',
-  disabled: 'disabled'
-};

package/dist/ColumnManagerGroupSettings/ColumnManangerGroupSettings.styles.d.ts

@@ -1,4 +0,0 @@
-export declare const Title: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const IconWrapper: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const ModalContent: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const IntervalInput: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/ColumnManagerGroupSettings/ColumnManangerGroupSettings.styles.js

@@ -1,19 +0,0 @@
-import styled from 'styled-components';
-import { AntdSelect } from '@synerise/ds-select/dist/Select.styles';
-import { AntdAlert } from '@synerise/ds-alert/dist/Alert.styles';
-export var Title = styled.span.withConfig({
-  displayName: "ColumnManangerGroupSettingsstyles__Title",
-  componentId: "sc-15dq2h5-0"
-})(["display:flex;align-items:center;justify-content:flex-start;"]);
-export var IconWrapper = styled.span.withConfig({
-  displayName: "ColumnManangerGroupSettingsstyles__IconWrapper",
-  componentId: "sc-15dq2h5-1"
-})([""]);
-export var ModalContent = styled.div.withConfig({
-  displayName: "ColumnManangerGroupSettingsstyles__ModalContent",
-  componentId: "sc-15dq2h5-2"
-})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;min-height:250px;", "{margin-bottom:20px;}", "{width:100%;margin-bottom:26px;}"], AntdAlert, AntdSelect);
-export var IntervalInput = styled.div.withConfig({
-  displayName: "ColumnManangerGroupSettingsstyles__IntervalInput",
-  componentId: "sc-15dq2h5-3"
-})(["width:100%;.ant-input-number{width:100%;}"]);

package/dist/ColumnManagerGroupSettings/RangesForm/RangeInput.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import { InputProps } from '@synerise/ds-input';
-import { Props as NumberInputProps } from '@synerise/ds-input-number/dist/InputNumber.types';
-type RangeInputProps = Omit<InputProps, 'value' | 'onChange'> & Omit<NumberInputProps, 'value' | 'onChange'> & {
-    value: string | number | null | undefined;
-    onChange: (value: string | number | null | undefined) => void;
-};
-declare const RangeInput: ({ type, value, onChange, handleInputRef, ...inputProps }: RangeInputProps) => React.JSX.Element;
-export default RangeInput;