@synerise/ds-column-manager 1.2.47 → 1.2.49

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.2.49](https://github.com/Synerise/synerise-design/compare/@synerise/ds-column-manager@1.2.48...@synerise/ds-column-manager@1.2.49) (2026-04-01)
+
+**Note:** Version bump only for package @synerise/ds-column-manager
+
+## [1.2.48](https://github.com/Synerise/synerise-design/compare/@synerise/ds-column-manager@1.2.47...@synerise/ds-column-manager@1.2.48) (2026-03-24)
+
+**Note:** Version bump only for package @synerise/ds-column-manager
+
 ## [1.2.47](https://github.com/Synerise/synerise-design/compare/@synerise/ds-column-manager@1.2.46...@synerise/ds-column-manager@1.2.47) (2026-03-20)
 
 **Note:** Version bump only for package @synerise/ds-column-manager

package/dist/ColumnManager.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
-import type { Column, ColumnManagerProps } from './ColumnManager.types';
+import { default as React } from 'react';
+import { Column, ColumnManagerProps } from './ColumnManager.types';
 declare const ColumnManager: <ColumnType extends Column>({ columns, texts: customTexts, onApply, visible, hide, draggable, }: ColumnManagerProps<ColumnType>) => React.JSX.Element;
 export default ColumnManager;

package/dist/ColumnManager.js

@@ -1,118 +1,76 @@
-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, { useEffect, useMemo, useState } from 'react';
-import Button from '@synerise/ds-button';
-import { useTheme } from '@synerise/ds-core';
-import Drawer from '@synerise/ds-drawer';
-import Icon, { CloseM, SearchM } from '@synerise/ds-icon';
-import { Title } from '@synerise/ds-typography';
-import * as S from './ColumnManager.styles';
-import { ColumnManagerActions } from './ColumnManagerActions/ColumnManagerActions';
-import ColumnManagerList from './ColumnManagerList/ColumnManagerList';
-import { useTranslations } from './hooks/useTranslations';
-import { matchesSearchQuery } from './utils/matchesSearchQuery';
-var ColumnManager = function ColumnManager(_ref) {
-  var columns = _ref.columns,
-    customTexts = _ref.texts,
-    onApply = _ref.onApply,
-    visible = _ref.visible,
-    hide = _ref.hide,
-    _ref$draggable = _ref.draggable,
-    draggable = _ref$draggable === void 0 ? true : _ref$draggable;
-  var _useState = useState(''),
-    searchQuery = _useState[0],
-    setSearchQuery = _useState[1];
-  var _useState2 = useState(columns),
-    currentColumns = _useState2[0],
-    setCurrentColumns = _useState2[1];
-  var texts = useTranslations(customTexts);
-  var theme = useTheme();
-  useEffect(function () {
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useEffect, useMemo } from "react";
+import Button from "@synerise/ds-button";
+import { useTheme } from "@synerise/ds-core";
+import Drawer from "@synerise/ds-drawer";
+import Icon, { CloseM, SearchM } from "@synerise/ds-icon";
+import { Title } from "@synerise/ds-typography";
+import { ColumnManager as ColumnManager$1, SearchBar, ColumnManagerListWrapper } from "./ColumnManager.styles.js";
+import { ColumnManagerActions } from "./ColumnManagerActions/ColumnManagerActions.js";
+import ColumnManagerList from "./ColumnManagerList/ColumnManagerList.js";
+import { useTranslations } from "./hooks/useTranslations.js";
+import { matchesSearchQuery } from "./utils/matchesSearchQuery.js";
+const ColumnManager = ({
+  columns,
+  texts: customTexts,
+  onApply,
+  visible,
+  hide,
+  draggable = true
+}) => {
+  const [searchQuery, setSearchQuery] = useState("");
+  const [currentColumns, setCurrentColumns] = useState(columns);
+  const texts = useTranslations(customTexts);
+  const theme = useTheme();
+  useEffect(() => {
     setCurrentColumns(columns);
   }, [columns]);
-  useEffect(function () {
+  useEffect(() => {
     if (!visible) {
       setCurrentColumns(columns);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [visible]);
-  var handleApply = function handleApply() {
+  const handleApply = () => {
     onApply(currentColumns);
   };
-  var handleCancel = function handleCancel() {
+  const handleCancel = () => {
     hide();
   };
-  var handleToggleColumn = function handleToggleColumn(id, updatedVisible) {
-    setCurrentColumns(currentColumns.map(function (column) {
-      return column.id === id ? _extends({}, column, {
-        visible: updatedVisible
-      }) : column;
-    }));
+  const handleToggleColumn = (id, updatedVisible) => {
+    setCurrentColumns(currentColumns.map((column) => column.id === id ? {
+      ...column,
+      visible: updatedVisible
+    } : column));
   };
-  var handleOrderChange = function handleOrderChange(newOrder) {
-    var idOrder = newOrder.map(function (item) {
-      return item.id;
-    });
-    var updatedColumns = [].concat(currentColumns).sort(function (a, b) {
-      return idOrder.indexOf(a.id) - idOrder.indexOf(b.id);
-    });
+  const handleOrderChange = (newOrder) => {
+    const idOrder = newOrder.map((item) => item.id);
+    const updatedColumns = [...currentColumns].sort((a, b) => idOrder.indexOf(a.id) - idOrder.indexOf(b.id));
     setCurrentColumns(updatedColumns);
   };
-  var handleSearchChange = function handleSearchChange(query) {
+  const handleSearchChange = (query) => {
     setSearchQuery(query);
   };
-  var filteredColumns = useMemo(function () {
-    return searchQuery ? currentColumns.filter(function (column) {
-      return matchesSearchQuery(column.name, searchQuery);
-    }) : currentColumns;
+  const filteredColumns = useMemo(() => {
+    return searchQuery ? currentColumns.filter((column) => matchesSearchQuery(column.name, searchQuery)) : currentColumns;
   }, [currentColumns, searchQuery]);
-  return /*#__PURE__*/React.createElement(S.ColumnManager, {
-    visible: visible,
-    width: 338,
-    onClose: hide
-  }, /*#__PURE__*/React.createElement(Drawer.DrawerHeader, null, /*#__PURE__*/React.createElement(Drawer.DrawerHeaderBar, null, /*#__PURE__*/React.createElement(Title, {
-    style: {
-      flex: 1,
-      margin: 0
-    },
-    level: 4
-  }, texts.title), /*#__PURE__*/React.createElement(Button, {
-    "data-testid": "ds-column-manager-close",
-    style: {
-      marginLeft: '8px'
-    },
-    mode: "single-icon",
-    type: "ghost",
-    onClick: hide
-  }, /*#__PURE__*/React.createElement(Icon, {
-    component: /*#__PURE__*/React.createElement(CloseM, null)
-  })))), /*#__PURE__*/React.createElement(S.SearchBar, {
-    onSearchChange: handleSearchChange,
-    placeholder: texts.searchPlaceholder,
-    value: searchQuery,
-    onClearInput: function onClearInput() {
-      return handleSearchChange('');
-    },
-    iconLeft: /*#__PURE__*/React.createElement(Icon, {
-      component: /*#__PURE__*/React.createElement(SearchM, null),
-      color: theme.palette['grey-600']
-    }),
-    clearTooltip: texts.searchClearTooltip || ''
-  }), /*#__PURE__*/React.createElement(S.ColumnManagerListWrapper, null, /*#__PURE__*/React.createElement(Drawer.DrawerContent, {
-    style: {
-      padding: '0',
-      height: '100%'
-    }
-  }, /*#__PURE__*/React.createElement(ColumnManagerList, {
-    texts: texts,
-    draggable: draggable,
-    handleOrderChange: handleOrderChange,
-    searchQuery: searchQuery,
-    columns: filteredColumns,
-    toggleColumn: handleToggleColumn
-  }))), /*#__PURE__*/React.createElement(ColumnManagerActions, {
-    onApply: handleApply,
-    onCancel: handleCancel,
-    texts: texts
-  }));
+  return /* @__PURE__ */ jsxs(ColumnManager$1, { visible, width: 338, onClose: hide, children: [
+    /* @__PURE__ */ jsx(Drawer.DrawerHeader, { children: /* @__PURE__ */ jsxs(Drawer.DrawerHeaderBar, { children: [
+      /* @__PURE__ */ jsx(Title, { style: {
+        flex: 1,
+        margin: 0
+      }, level: 4, children: texts.title }),
+      /* @__PURE__ */ jsx(Button, { "data-testid": "ds-column-manager-close", style: {
+        marginLeft: "8px"
+      }, mode: "single-icon", type: "ghost", onClick: hide, children: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(CloseM, {}) }) })
+    ] }) }),
+    /* @__PURE__ */ jsx(SearchBar, { onSearchChange: handleSearchChange, placeholder: texts.searchPlaceholder, value: searchQuery, onClearInput: () => handleSearchChange(""), iconLeft: /* @__PURE__ */ jsx(Icon, { component: /* @__PURE__ */ jsx(SearchM, {}), color: theme.palette["grey-600"] }), clearTooltip: texts.searchClearTooltip || "" }),
+    /* @__PURE__ */ jsx(ColumnManagerListWrapper, { children: /* @__PURE__ */ jsx(Drawer.DrawerContent, { style: {
+      padding: "0",
+      height: "100%"
+    }, children: /* @__PURE__ */ jsx(ColumnManagerList, { texts, draggable, handleOrderChange, searchQuery, columns: filteredColumns, toggleColumn: handleToggleColumn }) }) }),
+    /* @__PURE__ */ jsx(ColumnManagerActions, { onApply: handleApply, onCancel: handleCancel, texts })
+  ] });
+};
+export {
+  ColumnManager as default
 };
-export default ColumnManager;

package/dist/ColumnManager.styles.d.ts

@@ -1,5 +1,5 @@
-import Drawer from '@synerise/ds-drawer';
-import { type StyledSearchBar } from '@synerise/ds-search-bar';
-export declare const ColumnManager: import("styled-components").StyledComponent<typeof Drawer, any, {}, never>;
+import { default as Drawer } from '@synerise/ds-drawer';
+import { StyledSearchBar } from '@synerise/ds-search-bar';
+export declare const ColumnManager: import('styled-components').StyledComponent<typeof Drawer, any, {}, never>;
 export declare const SearchBar: StyledSearchBar;
-export declare const ColumnManagerListWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ColumnManagerListWrapper: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/ColumnManager.styles.js

@@ -1,15 +1,20 @@
-import styled from 'styled-components';
-import Drawer from '@synerise/ds-drawer';
-import SearchBarBase from '@synerise/ds-search-bar';
-export var ColumnManager = styled(Drawer).withConfig({
+import styled from "styled-components";
+import Drawer from "@synerise/ds-drawer";
+import SearchBarBase from "@synerise/ds-search-bar";
+const ColumnManager = /* @__PURE__ */ styled(Drawer).withConfig({
   displayName: "ColumnManagerstyles__ColumnManager",
   componentId: "sc-4cxi70-0"
 })([""]);
-export var SearchBar = styled(SearchBarBase).withConfig({
+const SearchBar = /* @__PURE__ */ styled(SearchBarBase).withConfig({
   displayName: "ColumnManagerstyles__SearchBar",
   componentId: "sc-4cxi70-1"
 })(["min-height:52px;height:52px;"]);
-export var ColumnManagerListWrapper = styled.div.withConfig({
+const ColumnManagerListWrapper = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerstyles__ColumnManagerListWrapper",
   componentId: "sc-4cxi70-2"
-})(["flex:1 1 auto;min-height:0;"]);
+})(["flex:1 1 auto;min-height:0;"]);
+export {
+  ColumnManager,
+  ColumnManagerListWrapper,
+  SearchBar
+};

package/dist/ColumnManager.types.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export type Column = {
     id: string;
     name: string;

package/dist/ColumnManager.types.js

@@ -1 +1 @@
-export {};
+

package/dist/ColumnManagerActions/ColumnManagerActions.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-import { type ColumnManagerActionsProps } from './ColumnManagerActions.types';
+import { default as React } from 'react';
+import { ColumnManagerActionsProps } from './ColumnManagerActions.types';
 export declare const ColumnManagerActions: ({ texts, onApply, onCancel, }: ColumnManagerActionsProps) => React.JSX.Element;

package/dist/ColumnManagerActions/ColumnManagerActions.js

@@ -1,19 +1,16 @@
-import React from 'react';
-import Button from '@synerise/ds-button';
-import * as S from './ColumnManagerActions.styles';
-export var ColumnManagerActions = function ColumnManagerActions(_ref) {
-  var texts = _ref.texts,
-    onApply = _ref.onApply,
-    onCancel = _ref.onCancel;
-  return /*#__PURE__*/React.createElement(S.ColumnManagerActions, null, /*#__PURE__*/React.createElement(S.RightButtons, null, /*#__PURE__*/React.createElement(Button, {
-    "data-testid": "ds-column-manager-cancel",
-    type: "ghost",
-    mode: "simple",
-    onClick: onCancel
-  }, texts.cancel), /*#__PURE__*/React.createElement(Button, {
-    "data-testid": "ds-column-manager-apply",
-    type: "primary",
-    mode: "simple",
-    onClick: onApply
-  }, texts.apply)));
-};
+import { jsx, jsxs } from "react/jsx-runtime";
+import Button from "@synerise/ds-button";
+import { ColumnManagerActions as ColumnManagerActions$1, RightButtons } from "./ColumnManagerActions.styles.js";
+const ColumnManagerActions = ({
+  texts,
+  onApply,
+  onCancel
+}) => {
+  return /* @__PURE__ */ jsx(ColumnManagerActions$1, { children: /* @__PURE__ */ jsxs(RightButtons, { children: [
+    /* @__PURE__ */ jsx(Button, { "data-testid": "ds-column-manager-cancel", type: "ghost", mode: "simple", onClick: onCancel, children: texts.cancel }),
+    /* @__PURE__ */ jsx(Button, { "data-testid": "ds-column-manager-apply", type: "primary", mode: "simple", onClick: onApply, children: texts.apply })
+  ] }) });
+};
+export {
+  ColumnManagerActions
+};

package/dist/ColumnManagerActions/ColumnManagerActions.styles.d.ts

@@ -1,2 +1,2 @@
-export declare const ColumnManagerActions: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const RightButtons: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ColumnManagerActions: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const RightButtons: import('styled-components').StyledComponent<"div", any, {}, never>;

package/dist/ColumnManagerActions/ColumnManagerActions.styles.js

@@ -1,11 +1,13 @@
-import styled from 'styled-components';
-export var ColumnManagerActions = styled.div.withConfig({
+import styled from "styled-components";
+const ColumnManagerActions = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerActionsstyles__ColumnManagerActions",
   componentId: "sc-1vmwevx-0"
-})(["display:flex;flex:0 0 80px;flex-direction:row;align-items:center;justify-content:flex-end;background-color:", ";padding:24px;"], function (props) {
-  return props.theme.palette['grey-050'];
-});
-export var RightButtons = styled.div.withConfig({
+})(["display:flex;flex:0 0 80px;flex-direction:row;align-items:center;justify-content:flex-end;background-color:", ";padding:24px;"], (props) => props.theme.palette["grey-050"]);
+const RightButtons = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerActionsstyles__RightButtons",
   componentId: "sc-1vmwevx-1"
-})(["display:flex;flex-direction:row;align-items:center;justify-content:flex-end;button{margin-left:8px;}"]);
+})(["display:flex;flex-direction:row;align-items:center;justify-content:flex-end;button{margin-left:8px;}"]);
+export {
+  ColumnManagerActions,
+  RightButtons
+};

package/dist/ColumnManagerActions/ColumnManagerActions.types.d.ts

@@ -1,4 +1,4 @@
-import { type ColumnManagerTexts } from '../ColumnManager.types';
+import { ColumnManagerTexts } from '../ColumnManager.types';
 export type ColumnManagerActionsProps = {
     onApply: () => void;
     onCancel: () => void;

package/dist/ColumnManagerActions/ColumnManagerActions.types.js

@@ -1 +1 @@
-export {};
+

package/dist/ColumnManagerItem/ColumManagerItem.types.d.ts

@@ -1,5 +1,5 @@
-import type { DraggableAttributes, DraggableSyntheticListeners } from '@synerise/ds-sortable';
-import type { Column, ColumnManagerTexts } from '../ColumnManager.types';
+import { DraggableAttributes, DraggableSyntheticListeners } from '@synerise/ds-sortable';
+import { Column, ColumnManagerTexts } from '../ColumnManager.types';
 export type ColumnManagerItemProps<ColumnType extends Column> = {
     draggable?: boolean;
     isDragged?: boolean;

package/dist/ColumnManagerItem/ColumManagerItem.types.js

@@ -1 +1 @@
-export {};
+

package/dist/ColumnManagerItem/ColumnManagerItem.const.js

@@ -1,11 +1,16 @@
-import React from 'react';
-import { VarTypeBooleanM, VarTypeDateM, VarTypeListM, VarTypeNumberM, VarTypeStringM } from '@synerise/ds-icon';
-export var DEFAULT_ITEM_TYPE = 'text';
-export var TYPES_WITH_ICONS = ['text', 'number', 'date', 'boolean', 'list'];
-export var ICON_MAP = {
-  text: /*#__PURE__*/React.createElement(VarTypeStringM, null),
-  number: /*#__PURE__*/React.createElement(VarTypeNumberM, null),
-  date: /*#__PURE__*/React.createElement(VarTypeDateM, null),
-  "boolean": /*#__PURE__*/React.createElement(VarTypeBooleanM, null),
-  list: /*#__PURE__*/React.createElement(VarTypeListM, null)
-};
+import { jsx } from "react/jsx-runtime";
+import { VarTypeListM, VarTypeBooleanM, VarTypeDateM, VarTypeNumberM, VarTypeStringM } from "@synerise/ds-icon";
+const DEFAULT_ITEM_TYPE = "text";
+const TYPES_WITH_ICONS = ["text", "number", "date", "boolean", "list"];
+const ICON_MAP = {
+  text: /* @__PURE__ */ jsx(VarTypeStringM, {}),
+  number: /* @__PURE__ */ jsx(VarTypeNumberM, {}),
+  date: /* @__PURE__ */ jsx(VarTypeDateM, {}),
+  boolean: /* @__PURE__ */ jsx(VarTypeBooleanM, {}),
+  list: /* @__PURE__ */ jsx(VarTypeListM, {})
+};
+export {
+  DEFAULT_ITEM_TYPE,
+  ICON_MAP,
+  TYPES_WITH_ICONS
+};

package/dist/ColumnManagerItem/ColumnManagerItem.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { type Column } from '../ColumnManager.types';
-import { type ColumnManagerItemProps } from './ColumManagerItem.types';
+import { default as React } from 'react';
+import { Column } from '../ColumnManager.types';
+import { ColumnManagerItemProps } from './ColumManagerItem.types';
 export declare const ColumnManagerItem: <ColumnType extends Column>({ item, switchAction, draggable, searchQuery, texts, dragHandleProps, id, isDragged, ...rest }: ColumnManagerItemProps<ColumnType>) => React.JSX.Element;
 export default ColumnManagerItem;

package/dist/ColumnManagerItem/ColumnManagerItem.js

@@ -1,62 +1,46 @@
-var _excluded = ["item", "switchAction", "draggable", "searchQuery", "texts", "dragHandleProps", "id", "isDragged"];
-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, { useMemo } from 'react';
-import { useTheme } from '@synerise/ds-core';
-import Icon, { DragHandleM } from '@synerise/ds-icon';
-import { RawSwitch } from '@synerise/ds-switch';
-import Tooltip from '@synerise/ds-tooltip';
-import { escapeRegEx } from '@synerise/ds-utils';
-import { DEFAULT_ITEM_TYPE, ICON_MAP, TYPES_WITH_ICONS } from './ColumnManagerItem.const';
-import * as S from './ColumnManagerItem.styles';
-export var ColumnManagerItem = function ColumnManagerItem(_ref) {
-  var item = _ref.item,
-    switchAction = _ref.switchAction,
-    draggable = _ref.draggable,
-    searchQuery = _ref.searchQuery,
-    texts = _ref.texts,
-    dragHandleProps = _ref.dragHandleProps,
-    id = _ref.id,
-    isDragged = _ref.isDragged,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var theme = useTheme();
-  var iconComponent = ICON_MAP[item.type && TYPES_WITH_ICONS.includes(item.type) ? item.type : DEFAULT_ITEM_TYPE];
-  var columnName = useMemo(function () {
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { useTheme } from "@synerise/ds-core";
+import Icon, { DragHandleM } from "@synerise/ds-icon";
+import { RawSwitch } from "@synerise/ds-switch";
+import Tooltip from "@synerise/ds-tooltip";
+import { escapeRegEx } from "@synerise/ds-utils";
+import { ICON_MAP, TYPES_WITH_ICONS, DEFAULT_ITEM_TYPE } from "./ColumnManagerItem.const.js";
+import { ColumnManagerItem as ColumnManagerItem$1, ItemPart, DragHandler, ColumnManagerItemName } from "./ColumnManagerItem.styles.js";
+const ColumnManagerItem = ({
+  item,
+  switchAction,
+  draggable,
+  searchQuery,
+  texts,
+  dragHandleProps,
+  id,
+  isDragged,
+  ...rest
+}) => {
+  const theme = useTheme();
+  const iconComponent = ICON_MAP[item.type && TYPES_WITH_ICONS.includes(item.type) ? item.type : DEFAULT_ITEM_TYPE];
+  const columnName = useMemo(() => {
     if (searchQuery) {
-      var escapedQuery = escapeRegEx(searchQuery);
-      var startOfQuery = item.name.toLowerCase().search(escapedQuery.toLowerCase());
-      var result = item.name.substr(startOfQuery, searchQuery.length);
-      return item.name.replace(result, "<span class=\"search-highlight\">" + result + "</span>");
+      const escapedQuery = escapeRegEx(searchQuery);
+      const startOfQuery = item.name.toLowerCase().search(escapedQuery.toLowerCase());
+      const result = item.name.substr(startOfQuery, searchQuery.length);
+      return item.name.replace(result, `<span class="search-highlight">${result}</span>`);
     }
     return item.name;
   }, [item.name, searchQuery]);
-  return /*#__PURE__*/React.createElement(S.ColumnManagerItem, _extends({
-    "data-testid": "ds-column-manager-item",
-    isDragged: isDragged
-  }, rest), /*#__PURE__*/React.createElement(S.ItemPart, {
-    align: "left"
-  }, draggable && /*#__PURE__*/React.createElement(S.DragHandler, _extends({
-    component: /*#__PURE__*/React.createElement(DragHandleM, null),
-    color: theme.palette['grey-400']
-  }, dragHandleProps == null ? void 0 : dragHandleProps.attributes, dragHandleProps == null ? void 0 : dragHandleProps.listeners)), /*#__PURE__*/React.createElement(Icon, {
-    component: iconComponent,
-    color: theme.palette['grey-600']
-  }), /*#__PURE__*/React.createElement(S.ColumnManagerItemName, {
-    dangerouslySetInnerHTML: {
-      __html: columnName
-    }
-  })), /*#__PURE__*/React.createElement(S.ItemPart, {
-    align: "right"
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    title: item.visible ? texts.switchOff : texts.switchOn,
-    placement: "topRight",
-    disabled: item.readOnly
-  }, /*#__PURE__*/React.createElement(RawSwitch, {
-    disabled: item.readOnly,
-    checked: item.visible,
-    onChange: function onChange() {
-      return switchAction(item.id, !item.visible);
-    }
-  }))));
+  return /* @__PURE__ */ jsxs(ColumnManagerItem$1, { "data-testid": "ds-column-manager-item", isDragged, ...rest, children: [
+    /* @__PURE__ */ jsxs(ItemPart, { align: "left", children: [
+      draggable && /* @__PURE__ */ jsx(DragHandler, { component: /* @__PURE__ */ jsx(DragHandleM, {}), color: theme.palette["grey-400"], ...dragHandleProps?.attributes, ...dragHandleProps?.listeners }),
+      /* @__PURE__ */ jsx(Icon, { component: iconComponent, color: theme.palette["grey-600"] }),
+      /* @__PURE__ */ jsx(ColumnManagerItemName, { dangerouslySetInnerHTML: {
+        __html: columnName
+      } })
+    ] }),
+    /* @__PURE__ */ jsx(ItemPart, { align: "right", children: /* @__PURE__ */ jsx(Tooltip, { title: item.visible ? texts.switchOff : texts.switchOn, placement: "topRight", disabled: item.readOnly, children: /* @__PURE__ */ jsx(RawSwitch, { disabled: item.readOnly, checked: item.visible, onChange: () => switchAction(item.id, !item.visible) }) }) })
+  ] });
+};
+export {
+  ColumnManagerItem,
+  ColumnManagerItem as default
 };
-export default ColumnManagerItem;

package/dist/ColumnManagerItem/ColumnManagerItem.styles.d.ts

@@ -1,11 +1,11 @@
-import Menu from '@synerise/ds-menu';
-export declare const DragHandler: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@synerise/ds-icon").BaseIconProps & Omit<import("react").HTMLAttributes<HTMLDivElement>, keyof import("@synerise/ds-icon").BaseIconProps> & import("@synerise/ds-utils").DataAttributes & import("react").RefAttributes<HTMLDivElement>>, any, {}, never>;
-export declare const Icons: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ItemPart: import("styled-components").StyledComponent<"div", any, {
+import { default as Menu } from '@synerise/ds-menu';
+export declare const DragHandler: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<import('@synerise/ds-icon').BaseIconProps & Omit<import('react').HTMLAttributes<HTMLDivElement>, keyof import('@synerise/ds-icon').BaseIconProps> & import('@synerise/ds-utils').DataAttributes & import('react').RefAttributes<HTMLDivElement>>, any, {}, never>;
+export declare const Icons: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ItemPart: import('styled-components').StyledComponent<"div", any, {
     align: string;
 }, never>;
-export declare const ColumnManagerItem: import("styled-components").StyledComponent<"div", any, {
+export declare const ColumnManagerItem: import('styled-components').StyledComponent<"div", any, {
     isDragged?: boolean;
 }, never>;
-export declare const ColumnManagerItemName: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const FixedMenu: import("styled-components").StyledComponent<typeof Menu, any, {}, never>;
+export declare const ColumnManagerItemName: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const FixedMenu: import('styled-components').StyledComponent<typeof Menu, any, {}, never>;

package/dist/ColumnManagerItem/ColumnManagerItem.styles.js

@@ -1,47 +1,37 @@
-import styled from 'styled-components';
-import Icon, { IconContainer } from '@synerise/ds-icon';
-import Menu from '@synerise/ds-menu';
-export var DragHandler = styled(Icon).withConfig({
+import styled from "styled-components";
+import Icon, { IconContainer } from "@synerise/ds-icon";
+import Menu from "@synerise/ds-menu";
+const DragHandler = /* @__PURE__ */ styled(Icon).withConfig({
   displayName: "ColumnManagerItemstyles__DragHandler",
   componentId: "sc-12ob8aa-0"
 })(["position:absolute;top:16px;left:-24px;opacity:0;cursor:pointer;"]);
-export var Icons = styled.div.withConfig({
+const Icons = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerItemstyles__Icons",
   componentId: "sc-12ob8aa-1"
 })(["display:flex;align-items:center;justify-content:center;", "{margin-left:8px;}"], IconContainer);
-export var ItemPart = styled.div.withConfig({
+const ItemPart = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerItemstyles__ItemPart",
   componentId: "sc-12ob8aa-2"
-})(["display:flex;flex-direction:row;align-items:center;position:relative;height:56px;justify-content:", ";flex:", ";max-width:", ";.switch-texts{margin:0;}.ds-switch{margin-left:8px;}"], function (props) {
-  return props.align === 'left' ? 'flex-start' : 'flex-end';
-}, function (props) {
-  return props.align === 'left' ? '1' : 'auto';
-}, function (props) {
-  return props.align === 'left' ? 'calc(100% - 80px)' : '68px';
-});
-export var ColumnManagerItem = styled.div.withConfig({
+})(["display:flex;flex-direction:row;align-items:center;position:relative;height:56px;justify-content:", ";flex:", ";max-width:", ";.switch-texts{margin:0;}.ds-switch{margin-left:8px;}"], (props) => props.align === "left" ? "flex-start" : "flex-end", (props) => props.align === "left" ? "1" : "auto", (props) => props.align === "left" ? "calc(100% - 80px)" : "68px");
+const ColumnManagerItem = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerItemstyles__ColumnManagerItem",
   componentId: "sc-12ob8aa-3"
-})(["display:flex;flex-direction:row;align-items:center;height:56px;justify-content:space-between;width:100%;padding:13px 24px;position:relative;background:", ";border-bottom:1px solid ", ";", " &:hover{background-color:", ";&:before{width:2px;position:absolute;top:0;left:0;height:100%;background-color:", ";content:'';}", "{opacity:1;}", "{display:none;}&&{.ds-button{visibility:visible;opacity:1;}}}&&{.ds-button{position:absolute;right:36px;top:12px;display:flex;visibility:hidden;opacity:0;transition:all 0s;}}"], function (props) {
-  return props.theme.palette.white;
-}, function (props) {
-  return props.theme.palette['grey-200'];
-}, function (props) {
-  return props.isDragged && "\n      opacity: 0;\n    ";
-}, function (props) {
-  return props.theme.palette['grey-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, DragHandler, Icons);
-export var ColumnManagerItemName = styled.span.withConfig({
+})(["display:flex;flex-direction:row;align-items:center;height:56px;justify-content:space-between;width:100%;padding:13px 24px;position:relative;background:", ";border-bottom:1px solid ", ";", " &:hover{background-color:", ";&:before{width:2px;position:absolute;top:0;left:0;height:100%;background-color:", ";content:'';}", "{opacity:1;}", "{display:none;}&&{.ds-button{visibility:visible;opacity:1;}}}&&{.ds-button{position:absolute;right:36px;top:12px;display:flex;visibility:hidden;opacity:0;transition:all 0s;}}"], (props) => props.theme.palette.white, (props) => props.theme.palette["grey-200"], (props) => props.isDragged && `
+      opacity: 0;
+    `, (props) => props.theme.palette["grey-050"], (props) => props.theme.palette["blue-600"], DragHandler, Icons);
+const ColumnManagerItemName = /* @__PURE__ */ styled.span.withConfig({
   displayName: "ColumnManagerItemstyles__ColumnManagerItemName",
   componentId: "sc-12ob8aa-4"
-})(["font-size:13px;line-height:1.38;color:", ";margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;flex:1;.search-highlight{font-weight:500;color:", ";}"], function (props) {
-  return props.theme.palette['grey-600'];
-}, function (props) {
-  return props.theme.palette['grey-800'];
-});
-export var FixedMenu = styled(Menu).withConfig({
+})(["font-size:13px;line-height:1.38;color:", ";margin-left:8px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;flex:1;.search-highlight{font-weight:500;color:", ";}"], (props) => props.theme.palette["grey-600"], (props) => props.theme.palette["grey-800"]);
+const FixedMenu = /* @__PURE__ */ styled(Menu).withConfig({
   displayName: "ColumnManagerItemstyles__FixedMenu",
   componentId: "sc-12ob8aa-5"
-})(["padding:8px;.ant-dropdown-menu-item{padding:0 8px !important;}"]);
+})(["padding:8px;.ant-dropdown-menu-item{padding:0 8px !important;}"]);
+export {
+  ColumnManagerItem,
+  ColumnManagerItemName,
+  DragHandler,
+  FixedMenu,
+  Icons,
+  ItemPart
+};

package/dist/ColumnManagerList/ColumnManager.style.d.ts

@@ -1,7 +1,7 @@
-import { FixedSizeList } from 'react-window';
-export declare const ColumnManagerList: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ListHeadline: import("styled-components").StyledComponent<"span", any, {}, never>;
-export declare const List: import("styled-components").StyledComponent<typeof FixedSizeList, any, {
+import { FixedSizeList } from '../../../../../config/vitest/__mocks__/reactWindowMock.js';
+export declare const ColumnManagerList: import('styled-components').StyledComponent<"div", any, {}, never>;
+export declare const ListHeadline: import('styled-components').StyledComponent<"span", any, {}, never>;
+export declare const List: import('styled-components').StyledComponent<typeof FixedSizeList, any, {
     maxHeight?: number;
     isDragging?: boolean;
 }, never>;

package/dist/ColumnManagerList/ColumnManager.style.js

@@ -1,26 +1,19 @@
-import { FixedSizeList } from 'react-window';
-import styled from 'styled-components';
-export var ColumnManagerList = styled.div.withConfig({
+import { FixedSizeList } from "react-window";
+import styled from "styled-components";
+const ColumnManagerList = /* @__PURE__ */ styled.div.withConfig({
   displayName: "ColumnManagerstyle__ColumnManagerList",
   componentId: "sc-8vnyk-0"
 })(["display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;width:100%;height:100%;"]);
-export var ListHeadline = styled.span.withConfig({
+const ListHeadline = /* @__PURE__ */ styled.span.withConfig({
   displayName: "ColumnManagerstyle__ListHeadline",
   componentId: "sc-8vnyk-1"
-})(["display:flex;width:100%;font-size:14px;line-height:1.42;font-weight:500;padding:24px 24px 12px;border-bottom:1px solid ", ";color:", ";"], function (props) {
-  return props.theme.palette['grey-200'];
-}, function (props) {
-  return props.theme.palette['grey-800'];
-});
-export var List = styled(FixedSizeList).withConfig({
+})(["display:flex;width:100%;font-size:14px;line-height:1.42;font-weight:500;padding:24px 24px 12px;border-bottom:1px solid ", ";color:", ";"], (props) => props.theme.palette["grey-200"], (props) => props.theme.palette["grey-800"]);
+const List = /* @__PURE__ */ styled(FixedSizeList).withConfig({
   displayName: "ColumnManagerstyle__List",
   componentId: "sc-8vnyk-2"
-})(["overflow-x:unset;overflow-y:unset;height:auto !important;background:", ";box-shadow:2px 0 0 0 ", " inset;", " ", ""], function (props) {
-  return props.theme.palette['blue-050'];
-}, function (props) {
-  return props.theme.palette['blue-600'];
-}, function (props) {
-  return props.maxHeight !== undefined && "max-height: " + props.maxHeight + "px;";
-}, function (props) {
-  return props.isDragging && "user-select: none;";
-});
+})(["overflow-x:unset;overflow-y:unset;height:auto !important;background:", ";box-shadow:2px 0 0 0 ", " inset;", " ", ""], (props) => props.theme.palette["blue-050"], (props) => props.theme.palette["blue-600"], (props) => props.maxHeight !== void 0 && `max-height: ${props.maxHeight}px;`, (props) => props.isDragging && `user-select: none;`);
+export {
+  ColumnManagerList,
+  List,
+  ListHeadline
+};

package/dist/ColumnManagerList/ColumnManagerList.d.ts

@@ -1,6 +1,6 @@
-import React, { type CSSProperties } from 'react';
-import { type Column } from '../ColumnManager.types';
-import { type ColumnManagerListProps } from './ColumnManagerList.types';
+import { default as React, CSSProperties } from 'react';
+import { Column } from '../ColumnManager.types';
+import { ColumnManagerListProps } from './ColumnManagerList.types';
 export declare const LIST_STYLE: CSSProperties;
 declare const ColumnManagerList: <ColumnType extends Column>({ searchQuery, columns, draggable, handleOrderChange, toggleColumn, texts, }: ColumnManagerListProps<ColumnType>) => React.JSX.Element;
 export default ColumnManagerList;

package/dist/ColumnManagerList/ColumnManagerList.js

@@ -1,93 +1,66 @@
-import React, { useMemo, useRef, useState } from 'react';
-import Result from '@synerise/ds-result';
-import Scrollbar from '@synerise/ds-scrollbar';
-import { DragOverlay, SortableContainer } from '@synerise/ds-sortable';
-import { useResizeObserver } from '@synerise/ds-utils';
-import { ColumnManagerItem } from '../ColumnManagerItem/ColumnManagerItem';
-import { ColumnManagerSortableItem } from '../ColumnManagerSortableItem/ColumnManagerSortableItem';
-import * as S from './ColumnManager.style';
-export var LIST_STYLE = {
-  overflowX: 'unset',
-  overflowY: 'unset'
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useMemo } from "react";
+import Result from "@synerise/ds-result";
+import Scrollbar from "@synerise/ds-scrollbar";
+import { SortableContainer, DragOverlay } from "@synerise/ds-sortable";
+import { useResizeObserver } from "@synerise/ds-utils";
+import { ColumnManagerItem } from "../ColumnManagerItem/ColumnManagerItem.js";
+import { ColumnManagerSortableItem } from "../ColumnManagerSortableItem/ColumnManagerSortableItem.js";
+import { ColumnManagerList as ColumnManagerList$1, List } from "./ColumnManager.style.js";
+const LIST_STYLE = {
+  overflowX: "unset",
+  overflowY: "unset"
 };
-var ColumnManagerList = function ColumnManagerList(_ref) {
-  var searchQuery = _ref.searchQuery,
-    columns = _ref.columns,
-    draggable = _ref.draggable,
-    handleOrderChange = _ref.handleOrderChange,
-    toggleColumn = _ref.toggleColumn,
-    texts = _ref.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 && (activeItem == null ? void 0 : activeItem.id) === column.id,
-        switchAction: toggleColumn,
-        draggable: isItemDraggable,
-        texts: texts
-      };
-    });
+const ColumnManagerList = ({
+  searchQuery,
+  columns,
+  draggable,
+  handleOrderChange,
+  toggleColumn,
+  texts
+}) => {
+  const [activeItem, setActiveItem] = useState();
+  const [containerHeight, setContainerHeight] = useState(0);
+  const listRef = useRef(null);
+  const containerRef = useRef(null);
+  const isItemDraggable = draggable && !searchQuery;
+  const items = useMemo(() => {
+    return columns.map((column) => ({
+      key: column.id,
+      id: column.id,
+      item: column,
+      isDragged: activeItem && activeItem?.id === column.id,
+      switchAction: toggleColumn,
+      draggable: isItemDraggable,
+      texts
+    }));
   }, [columns, toggleColumn, texts, activeItem, isItemDraggable]);
-  var handleScroll = function handleScroll(_ref2) {
-    var currentTarget = _ref2.currentTarget;
-    var scrollTop = currentTarget.scrollTop;
+  const handleScroll = ({
+    currentTarget
+  }) => {
+    const {
+      scrollTop
+    } = currentTarget;
     if (listRef.current) {
       listRef.current.scrollTo(scrollTop);
     }
   };
-  useResizeObserver(containerRef, function (dimensions) {
+  useResizeObserver(containerRef, (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"
-  }) : /*#__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);
-    },
-    onDragCancel: function onDragCancel() {
-      return setActiveItem(undefined);
-    },
-    onOrderChange: handleOrderChange,
-    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))));
+  return /* @__PURE__ */ jsx(ColumnManagerList$1, { ref: containerRef, "data-testid": "ds-column-manager-list", children: !items.length && searchQuery ? /* @__PURE__ */ jsx(Result, { description: texts.noResults, type: "no-results" }) : /* @__PURE__ */ jsxs(SortableContainer, { onDragStart: ({
+    active
+  }) => {
+    const column = items.find((item) => item.id === active.id);
+    setActiveItem(column);
+  }, onDragEnd: () => {
+    setActiveItem(void 0);
+  }, onDragCancel: () => setActiveItem(void 0), onOrderChange: handleOrderChange, items, axis: "y", children: [
+    /* @__PURE__ */ jsx(Scrollbar, { absolute: true, withDnd: true, onScroll: handleScroll, maxHeight: containerHeight, children: /* @__PURE__ */ jsx(List, { isDragging: !!activeItem, height: containerHeight, itemCount: items.length, itemSize: 56, itemData: items, width: "100%", ref: listRef, style: LIST_STYLE, children: (props) => /* @__PURE__ */ jsx(ColumnManagerSortableItem, { ...props }) }) }),
+    /* @__PURE__ */ jsx(DragOverlay, { children: activeItem && /* @__PURE__ */ jsx(ColumnManagerItem, { ...activeItem }) })
+  ] }) });
+};
+export {
+  LIST_STYLE,
+  ColumnManagerList as default
 };
-export default ColumnManagerList;

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

@@ -1,5 +1,5 @@
-import type { Column, ColumnManagerTexts } from '../ColumnManager.types';
-import type { ColumnManagerItemProps } from '../ColumnManagerItem/ColumManagerItem.types';
+import { Column, ColumnManagerTexts } from '../ColumnManager.types';
+import { ColumnManagerItemProps } from '../ColumnManagerItem/ColumManagerItem.types';
 export type ColumnManagerListProps<ColumnType extends Column> = {
     searchQuery: string;
     columns: ColumnType[];

package/dist/ColumnManagerList/ColumnManagerList.types.js

@@ -1 +1 @@
-export {};
+

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.d.ts

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

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.js

@@ -1,35 +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 { CSS, useSortable } from '@synerise/ds-sortable';
-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
+import { jsx } from "react/jsx-runtime";
+import { createElement } from "react";
+import { useSortable, CSS } from "@synerise/ds-sortable";
+import { ColumnManagerItem } from "../ColumnManagerItem/ColumnManagerItem.js";
+const ColumnManagerSortableItem = (props) => {
+  const {
+    index,
+    style: styleProp,
+    data,
+    ...rest
+  } = props;
+  const {
+    id
+  } = data[index];
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    transform,
+    transition
+  } = useSortable({
+    id
   });
-  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
-    }
-  })));
-};
+  const style = {
+    ...styleProp,
+    transform: CSS.Transform.toString(transform),
+    transition
+  };
+  return /* @__PURE__ */ createElement("div", { ...rest, key: `column-manager-item-${id}`, style, ref: setNodeRef }, /* @__PURE__ */ jsx(ColumnManagerItem, { ...data[index], dragHandleProps: {
+    attributes,
+    listeners
+  } }));
+};
+export {
+  ColumnManagerSortableItem
+};

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

@@ -1,4 +1,4 @@
-import type { ListChildComponentProps } from 'react-window';
-import type { Column } from '../ColumnManager.types';
-import type { ColumnManagerItemProps } from '../ColumnManagerItem/ColumManagerItem.types';
+import { ListChildComponentProps } from '../../../../../config/vitest/__mocks__/reactWindowMock.js';
+import { Column } from '../ColumnManager.types';
+import { ColumnManagerItemProps } from '../ColumnManagerItem/ColumManagerItem.types';
 export type ColumnManagerSortableItemProps<ColumnType extends Column> = ListChildComponentProps<ColumnManagerItemProps<ColumnType>[]>;

package/dist/ColumnManagerSortableItem/ColumnManagerSortableItem.types.js

@@ -1 +1 @@
-export {};
+

package/dist/hooks/useTranslations.d.ts

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

package/dist/hooks/useTranslations.js

@@ -1,43 +1,46 @@
-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({
+import { useIntl } from "react-intl";
+const useTranslations = (texts) => {
+  const intl = useIntl();
+  return {
     title: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.TITLE',
-      defaultMessage: 'Manage columns'
+      id: "DS.COLUMN-MANAGER.TITLE",
+      defaultMessage: "Manage columns"
     }),
     searchPlaceholder: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.SEARCH-PLACEHOLDER',
-      defaultMessage: 'Search columns'
+      id: "DS.COLUMN-MANAGER.SEARCH-PLACEHOLDER",
+      defaultMessage: "Search columns"
     }),
     searchClearTooltip: intl.formatMessage({
-      id: 'DS.ITEM-FILTER.SEARCH-CLEAR',
-      defaultMessage: 'Clear'
+      id: "DS.ITEM-FILTER.SEARCH-CLEAR",
+      defaultMessage: "Clear"
     }),
     noResults: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.NO-RESULTS',
-      defaultMessage: 'No results'
+      id: "DS.COLUMN-MANAGER.NO-RESULTS",
+      defaultMessage: "No results"
     }),
     cancel: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.CANCEL',
-      defaultMessage: 'Cancel'
+      id: "DS.COLUMN-MANAGER.CANCEL",
+      defaultMessage: "Cancel"
     }),
     apply: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.APPLY',
-      defaultMessage: 'Apply'
+      id: "DS.COLUMN-MANAGER.APPLY",
+      defaultMessage: "Apply"
     }),
     clear: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.CLEAR',
-      defaultMessage: 'Clear'
+      id: "DS.COLUMN-MANAGER.CLEAR",
+      defaultMessage: "Clear"
     }),
     switchOn: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.SWITCH-ON',
-      defaultMessage: 'Hide column'
+      id: "DS.COLUMN-MANAGER.SWITCH-ON",
+      defaultMessage: "Hide column"
     }),
     switchOff: intl.formatMessage({
-      id: 'DS.COLUMN-MANAGER.SWITCH-OFF',
-      defaultMessage: 'Show column'
-    })
-  }, texts || {});
-};
+      id: "DS.COLUMN-MANAGER.SWITCH-OFF",
+      defaultMessage: "Show column"
+    }),
+    ...texts || {}
+  };
+};
+export {
+  useTranslations
+};

package/dist/index.js

@@ -1,2 +1,4 @@
-export { default } from './ColumnManager';
-export * from './ColumnManager.types';
+import { default as default2 } from "./ColumnManager.js";
+export {
+  default2 as default
+};

package/dist/modules.d.js

@@ -1 +1 @@
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";

package/dist/utils/matchesSearchQuery.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-column-manager",
-  "version": "1.2.47",
+  "version": "1.2.49",
   "description": "ColumnManager UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "Synerise/synerise-design",
@@ -16,10 +16,10 @@
     "access": "public"
   },
   "scripts": {
-    "build": "pnpm run build:js && pnpm run build:css && pnpm run defs",
+    "build": "vite build",
     "build:css": "node ../../../scripts/style/less.js",
     "build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
-    "build:watch": "pnpm run build:js -- --watch",
+    "build:watch": "vite build --watch",
     "defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
     "pack:ci": "pnpm pack --pack-destination ../../storybook/storybook-static/static",
     "prepublish": "pnpm run build",
@@ -32,22 +32,22 @@
   "sideEffects": false,
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-button": "^1.5.17",
-    "@synerise/ds-drawer": "^1.1.1",
-    "@synerise/ds-icon": "^1.15.0",
-    "@synerise/ds-menu": "^1.4.12",
-    "@synerise/ds-result": "^1.0.48",
-    "@synerise/ds-scrollbar": "^1.2.16",
-    "@synerise/ds-search-bar": "^1.4.19",
-    "@synerise/ds-sortable": "^1.3.13",
-    "@synerise/ds-switch": "^1.2.19",
-    "@synerise/ds-tooltip": "^1.4.9",
-    "@synerise/ds-typography": "^1.1.12",
-    "@synerise/ds-utils": "^1.7.0",
+    "@synerise/ds-button": "^1.5.19",
+    "@synerise/ds-drawer": "^1.1.2",
+    "@synerise/ds-icon": "^1.15.2",
+    "@synerise/ds-menu": "^1.4.14",
+    "@synerise/ds-result": "^1.0.50",
+    "@synerise/ds-scrollbar": "^1.2.18",
+    "@synerise/ds-search-bar": "^1.4.21",
+    "@synerise/ds-sortable": "^1.3.14",
+    "@synerise/ds-switch": "^1.2.21",
+    "@synerise/ds-tooltip": "^1.4.11",
+    "@synerise/ds-typography": "^1.1.14",
+    "@synerise/ds-utils": "^1.7.1",
     "react-window": "1.8.11"
   },
   "devDependencies": {
-    "@synerise/ds-input": "^1.6.9",
+    "@synerise/ds-input": "^1.6.11",
     "vitest": "4"
   },
   "peerDependencies": {
@@ -57,5 +57,5 @@
     "react-intl": ">=3.12.0 <= 6.8",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "8efc031fa688c0b87c7b3915bae93546bb63bcac"
+  "gitHead": "c2384982c3533a31eb5e5e0408f8dcecb2b0f399"
 }