@rio-cloud/rio-uikit 1.6.0 → 1.7.0

package/lib/es/components/table/TableSettingsDialogFooter.js

@@ -3,13 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TableSettingsDialogFooter = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const Button_1 = tslib_1.__importDefault(require("../../Button"));
 const TableSettingsDialogFooter = (props) => {
     const { hasChanged, isResetAll, immediateChange, resetButtonText, closeButtonText, cancelButtonText, applyButtonText, onHide, onResetColumnChanges, onDiscardChanges, onApplyChanges, onConfirmResetColumnChanges, onCancelResetColumnChanges, } = props;
     const restButtonClassNames = (0, classnames_1.default)('btn', 'btn-link', !hasChanged && 'disabled');
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'display-flex justify-content-between' }, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [!isResetAll && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: restButtonClassNames, onClick: onResetColumnChanges }, { children: [(0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-revert text-size-xs margin-right-10' }), resetButtonText] }))), isResetAll && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'btn-group' }, { children: [(0, jsx_runtime_1.jsx)(Button_1.default, { iconOnly: true, iconName: 'rioglyph-remove', className: 'margin-right-5 btn-outline', onClick: onCancelResetColumnChanges }), (0, jsx_runtime_1.jsx)(Button_1.default, { iconOnly: true, bsStyle: Button_1.default.PRIMARY, iconName: 'rioglyph-ok', onClick: onConfirmResetColumnChanges })] })))] }), immediateChange ? ((0, jsx_runtime_1.jsx)(Button_1.default, Object.assign({ onClick: onHide }, { children: closeButtonText }))) : ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'btn-toolbar' }, { children: [(0, jsx_runtime_1.jsx)(Button_1.default, Object.assign({ onClick: onDiscardChanges }, { children: cancelButtonText })), (0, jsx_runtime_1.jsx)(Button_1.default, Object.assign({ bsStyle: Button_1.default.PRIMARY, onClick: onApplyChanges }, { children: applyButtonText }))] })))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: 'display-flex justify-content-between', children: [(0, jsx_runtime_1.jsxs)("div", { children: [!isResetAll && ((0, jsx_runtime_1.jsxs)("div", { className: restButtonClassNames, onClick: onResetColumnChanges, children: [(0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-revert text-size-xs margin-right-10' }), resetButtonText] })), isResetAll && ((0, jsx_runtime_1.jsxs)("div", { className: 'btn-group', children: [(0, jsx_runtime_1.jsx)(Button_1.default, { iconOnly: true, iconName: 'rioglyph-remove', className: 'margin-right-5 btn-outline', onClick: onCancelResetColumnChanges }), (0, jsx_runtime_1.jsx)(Button_1.default, { iconOnly: true, bsStyle: Button_1.default.PRIMARY, iconName: 'rioglyph-ok', onClick: onConfirmResetColumnChanges })] }))] }), immediateChange ? ((0, jsx_runtime_1.jsx)(Button_1.default, { onClick: onHide, children: closeButtonText })) : ((0, jsx_runtime_1.jsxs)("div", { className: 'btn-toolbar', children: [(0, jsx_runtime_1.jsx)(Button_1.default, { onClick: onDiscardChanges, children: cancelButtonText }), (0, jsx_runtime_1.jsx)(Button_1.default, { bsStyle: Button_1.default.PRIMARY, onClick: onApplyChanges, children: applyButtonText })] }))] }));
 };
 exports.TableSettingsDialogFooter = TableSettingsDialogFooter;

package/lib/es/components/table/TableSettingsListContainer.js

@@ -20,6 +20,6 @@ const TableSettingsListContainer = (props) => {
         onSortEnd(event, items);
     };
     const activeClass = 'table-settings-item shadow-smooth-to-bottom z-index-max';
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'table-settings-items-container' }, { children: (0, jsx_runtime_1.jsx)(core_1.DndContext, Object.assign({ sensors: sensors, collisionDetection: core_1.closestCenter, modifiers: [modifiers_1.restrictToVerticalAxis], onDragStart: handleDragStart, onDragEnd: handleDragEnd }, { children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, Object.assign({ items: items, strategy: sortable_1.verticalListSortingStrategy }, { children: items.map((column, index) => ((0, jsx_runtime_1.jsx)(TableSettingsListItem_1.default, Object.assign({ column: column, orderIndex: index, isActive: activeDraggedColumn === column, className: activeDraggedColumn === column ? activeClass : '' }, itemProps), column))) })) })) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: 'table-settings-items-container', children: (0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: sensors, collisionDetection: core_1.closestCenter, modifiers: [modifiers_1.restrictToVerticalAxis], onDragStart: handleDragStart, onDragEnd: handleDragEnd, children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: items, strategy: sortable_1.verticalListSortingStrategy, children: items.map((column, index) => ((0, jsx_runtime_1.jsx)(TableSettingsListItem_1.default, { column: column, orderIndex: index, isActive: activeDraggedColumn === column, className: activeDraggedColumn === column ? activeClass : '', ...itemProps }, column))) }) }) }));
 };
 exports.TableSettingsListContainer = TableSettingsListContainer;

package/lib/es/components/table/TableSettingsListItem.js

@@ -3,8 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.filterColumns = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-/* eslint-disable new-cap */
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const sortable_1 = require("@dnd-kit/sortable");
 const utilities_1 = require("@dnd-kit/utilities");
@@ -40,9 +38,9 @@ const TableSettingsListItem = (props) => {
     const isFiltered = (0, exports.filterColumns)(columnSearchValue, column, columnLabelStrings) && !updateColumnLabelStrings;
     const itemClassNames = (0, classnames_1.default)('table-settings-item', updateColumnLabelStrings && 'opacity-0', isFiltered && 'position-offscreen', className);
     const columnDetails = columnsDetails[column];
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: itemClassNames, ref: setNodeRef, style: style }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'table-settings-item-header user-select-none', ref: setActivatorNodeRef }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'CheckboxWrapper display-flex align-items-center padding-left-2' }, { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { checked: !hiddenColumns.includes(column), onClick: event => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: itemClassNames, ref: setNodeRef, style: style, children: [(0, jsx_runtime_1.jsxs)("div", { className: 'table-settings-item-header user-select-none', ref: setActivatorNodeRef, children: [(0, jsx_runtime_1.jsx)("div", { className: 'CheckboxWrapper display-flex align-items-center padding-left-2', children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { checked: !hiddenColumns.includes(column), onClick: event => {
                                 onToggleHideColumn(column);
                                 event.stopPropagation();
-                            }, disabled: disabledColumns.includes(column) }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`, "data-key": column }, attributes, listeners, { children: columnLabels[column] })), columnDetails && ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'column-width-label' }, { children: columnDetails.width ? `${columnDetails.width}px` : autoLabel }))), (0, jsx_runtime_1.jsx)(TableSettingsColumnButtons_1.TableSettingsColumnButtons, { column: column, index: orderIndex, columnDetails: columnDetails, columnOrder: columnOrder, openColumnsDetails: openColumnsDetails, disabled: isSortingDisabled, onMoveColumn: onMoveColumn, onOpenDetails: onOpenDetails })] })), columnDetails && !isActive && ((0, jsx_runtime_1.jsx)(Collapse_1.default, Object.assign({ open: !!openColumnsDetails[column] }, { children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(TableSettingsColumnDetails_1.TableSettingsColumnDetails, Object.assign({}, columnDetails, { column: column, maxColumnWidth: MAX_COLUMN_WIDTH, onColumnWidthChange: onColumnWidthChange, onResetColumnWidth: onResetColumnWidth })) }) })))] }), `table-settings-item-${column}`));
+                            }, disabled: disabledColumns.includes(column) }) }), (0, jsx_runtime_1.jsx)("div", { className: `table-settings-item-label ${isSortingDisabled ? 'no-drag' : ''}`, "data-key": column, ...attributes, ...listeners, children: columnLabels[column] }), columnDetails && ((0, jsx_runtime_1.jsx)("div", { className: 'column-width-label', children: columnDetails.width ? `${columnDetails.width}px` : autoLabel })), (0, jsx_runtime_1.jsx)(TableSettingsColumnButtons_1.TableSettingsColumnButtons, { column: column, index: orderIndex, columnDetails: columnDetails, columnOrder: columnOrder, openColumnsDetails: openColumnsDetails, disabled: isSortingDisabled, onMoveColumn: onMoveColumn, onOpenDetails: onOpenDetails })] }), columnDetails && !isActive && ((0, jsx_runtime_1.jsx)(Collapse_1.default, { open: !!openColumnsDetails[column], children: (0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(TableSettingsColumnDetails_1.TableSettingsColumnDetails, { ...columnDetails, column: column, maxColumnWidth: MAX_COLUMN_WIDTH, onColumnWidthChange: onColumnWidthChange, onResetColumnWidth: onResetColumnWidth }) }) }))] }, `table-settings-item-${column}`));
 };
 exports.default = TableSettingsListItem;

package/lib/es/components/table/TableToolbar.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
-const TableToolbar = ({ className, children }) => ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: (0, classnames_1.default)('table-toolbar', className) }, { children: children })));
+const TableToolbar = ({ className, children }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('table-toolbar', className), children: children }));
 exports.default = TableToolbar;

package/lib/es/components/table/TableViewToggles.js

@@ -8,7 +8,7 @@ const noop_1 = tslib_1.__importDefault(require("lodash/noop"));
 const OverlayTrigger_1 = tslib_1.__importDefault(require("../overlay/OverlayTrigger"));
 const Tooltip_1 = tslib_1.__importDefault(require("../tooltip/Tooltip"));
 // TODO: add responsive behaviour and trigger a change from table to list for small screen -> see DriverAdministration
-const wrapWithTooltip = (tooltipContent, element) => ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, Object.assign({ placement: 'bottom', overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, Object.assign({ id: 'tooltip', allowOnTouch: true }, { children: tooltipContent })) }, { children: element })));
+const wrapWithTooltip = (tooltipContent, element) => ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, { placement: 'bottom', overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, { id: 'tooltip', allowOnTouch: true, children: tooltipContent }), children: element }));
 const typeIcons = {
     TABLE: 'rioglyph-table-view',
     SINGLE_CARD: 'rioglyph-th-list',
@@ -20,11 +20,11 @@ const TypeButton = (props) => {
         return null;
     }
     const classes = (0, classnames_1.default)('btn btn-default btn-icon-only', disabled && 'disabled pointer-events-none', viewType === currentViewType && 'active');
-    const button = ((0, jsx_runtime_1.jsx)("button", Object.assign({ className: classes, type: 'button', onClick: () => onClick(viewType) }, { children: (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${typeIcons[viewType]}` }) })));
+    const button = ((0, jsx_runtime_1.jsx)("button", { className: classes, type: 'button', onClick: () => onClick(viewType), children: (0, jsx_runtime_1.jsx)("span", { className: `rioglyph ${typeIcons[viewType]}` }) }));
     return tooltipContent ? wrapWithTooltip(tooltipContent, button) : button;
 };
 const TableViewToggles = (props) => {
-    const { viewType, initialViewType = 'TABLE', disabledViewTypes = [], onViewTypeChange = noop_1.default, tableViewTooltipContent, singleCardViewTooltipContent, multiCardsViewTooltipContent, disabled = false, className } = props, remainingProps = tslib_1.__rest(props, ["viewType", "initialViewType", "disabledViewTypes", "onViewTypeChange", "tableViewTooltipContent", "singleCardViewTooltipContent", "multiCardsViewTooltipContent", "disabled", "className"]);
+    const { viewType, initialViewType = 'TABLE', disabledViewTypes = [], onViewTypeChange = noop_1.default, tableViewTooltipContent, singleCardViewTooltipContent, multiCardsViewTooltipContent, disabled = false, className, ...remainingProps } = props;
     const [internalViewType, setInternalViewType] = (0, react_1.useState)(initialViewType);
     // update internal state when external state changes - controlled component case
     (0, react_1.useEffect)(() => {
@@ -37,7 +37,7 @@ const TableViewToggles = (props) => {
         onViewTypeChange(vt);
     };
     const wrapperClassNames = (0, classnames_1.default)('TableViewToggles', 'btn-group', 'display-flex', 'flex-row', className && className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: wrapperClassNames }, { children: [(0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'TABLE', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: tableViewTooltipContent, onClick: setViewType, disabled: disabled }), (0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'SINGLE_CARD', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: singleCardViewTooltipContent, onClick: setViewType, disabled: disabled }), (0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'MULTI_CARDS', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: multiCardsViewTooltipContent, onClick: setViewType, disabled: disabled })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: wrapperClassNames, children: [(0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'TABLE', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: tableViewTooltipContent, onClick: setViewType, disabled: disabled }), (0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'SINGLE_CARD', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: singleCardViewTooltipContent, onClick: setViewType, disabled: disabled }), (0, jsx_runtime_1.jsx)(TypeButton, { viewType: 'MULTI_CARDS', currentViewType: internalViewType, disabledViewTypes: disabledViewTypes, tooltipContent: multiCardsViewTooltipContent, onClick: setViewType, disabled: disabled })] }));
 };
 // Don't export values as string but as a distinct union type
 TableViewToggles.VIEW_TYPE_TABLE = 'TABLE';

package/lib/es/components/tag/Tag.js

@@ -6,8 +6,8 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const Tag = (0, react_1.forwardRef)((props, ref) => {
-    const { children, icon, active = false, disabled = false, clickable = false, selectable = false, deletable = false, revertable = false, multiline = false, muted = false, round = true, size, className } = props, remainingProps = tslib_1.__rest(props, ["children", "icon", "active", "disabled", "clickable", "selectable", "deletable", "revertable", "multiline", "muted", "round", "size", "className"]);
+    const { children, icon, active = false, disabled = false, clickable = false, selectable = false, deletable = false, revertable = false, multiline = false, muted = false, round = true, size, className, ...remainingProps } = props;
     const tagClasses = (0, classnames_1.default)('tag', size === 'small' && 'tag-small', icon && `rioglyph ${icon}`, active && 'active clickable rioglyph rioglyph-ok', disabled && 'disabled', clickable && 'clickable', selectable && 'selectable clickable rioglyph rioglyph-checkbox', deletable && 'deletable clickable rioglyph rioglyph-remove', revertable && 'revertable clickable rioglyph rioglyph-revert', multiline && 'multiline', muted && 'tag-muted', !round && 'rounded', className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref }, remainingProps, { className: tagClasses }, { children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'tag-inner' }, { children: children })) })));
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, ...remainingProps, className: tagClasses, children: (0, jsx_runtime_1.jsx)("div", { className: 'tag-inner', children: children }) }));
 });
 exports.default = Tag;

package/lib/es/components/tag/TagList.js

@@ -2,13 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const TagList = (props) => {
-    const { children, inline = true, autoTagWidth = false, tagsPerRow } = props, remainingProps = tslib_1.__rest(props, ["children", "inline", "autoTagWidth", "tagsPerRow"]);
+    const { children, inline = true, autoTagWidth = false, tagsPerRow, ...remainingProps } = props;
     const tagListClasses = (0, classnames_1.default)('taglist', !autoTagWidth && 'taglist-autowidth', !inline && 'taglist-vertical', tagsPerRow && 'row display-flex-sm flex-wrap-sm', props.className);
-    const wrappedChildren = (0, jsx_runtime_1.jsx)("div", Object.assign({ className: `tags-per-row-${tagsPerRow}` }, { children: children }));
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, remainingProps, { className: tagListClasses }, { children: tagsPerRow ? wrappedChildren : children })));
+    const wrappedChildren = (0, jsx_runtime_1.jsx)("div", { className: `tags-per-row-${tagsPerRow}`, children: children });
+    return ((0, jsx_runtime_1.jsx)("div", { ...remainingProps, className: tagListClasses, children: tagsPerRow ? wrappedChildren : children }));
 };
 exports.default = TagList;

package/lib/es/components/tagManager/CustomSuggestionItem.js

@@ -2,12 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const CustomSuggestionItem = ({ value, placeholder }) => {
     const wrapperClassNames = (0, classnames_1.default)('display-flex align-items-center padding-top-5 padding-bottom-5', !value && 'text-color-gray');
     const iconClassNames = (0, classnames_1.default)('margin-left--5 margin-right-5 margin-top--1 rioglyph', value ? 'rioglyph-plus' : 'rioglyph-arrow-up');
-    return ((0, jsx_runtime_1.jsxs)("span", Object.assign({ className: wrapperClassNames }, { children: [(0, jsx_runtime_1.jsx)("span", { className: iconClassNames }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'text-italic' }, { children: value || placeholder }))] })));
+    return ((0, jsx_runtime_1.jsxs)("span", { className: wrapperClassNames, children: [(0, jsx_runtime_1.jsx)("span", { className: iconClassNames }), (0, jsx_runtime_1.jsx)("span", { className: 'text-italic', children: value || placeholder })] }));
 };
 exports.default = CustomSuggestionItem;

package/lib/es/components/tagManager/TagManager.js

@@ -55,7 +55,7 @@ const filterSuggestions = (suggestions, selectedTagNames, value = '') => suggest
         !suggestion.customSuggestion);
 });
 const TagManager = (props) => {
-    const { tagList, tagSuggestions, placeholder, className, customTagPlaceholder, dropdownSeparatorText, onTagListChange = noop_1.default, useCustomTags = true, noItemMessage, showInput = true } = props, remainingProps = tslib_1.__rest(props, ["tagList", "tagSuggestions", "placeholder", "className", "customTagPlaceholder", "dropdownSeparatorText", "onTagListChange", "useCustomTags", "noItemMessage", "showInput"]);
+    const { tagList, tagSuggestions, placeholder, className, customTagPlaceholder, dropdownSeparatorText, onTagListChange = noop_1.default, useCustomTags = true, noItemMessage, showInput = true, ...remainingProps } = props;
     const [tags, setTags] = (0, react_1.useState)(tagList);
     const [inputValue, setInputValue] = (0, react_1.useState)('');
     const [currentSuggestions, setCurrentSuggestions] = (0, react_1.useState)([]);
@@ -117,6 +117,6 @@ const TagManager = (props) => {
         tabIndex: 1,
     };
     const autoSuggestClasses = (0, classnames_1.default)(!(0, isEmpty_1.default)(tags) && 'margin-bottom-10');
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: (0, classnames_1.default)('TagManager', className) }, { children: [showInput && ((0, jsx_runtime_1.jsx)(AutoSuggest_1.default, { className: autoSuggestClasses, inputProps: inputProps, suggestions: currentSuggestions, onSuggestionSelected: handleSuggestionSelected, onSuggestionsFetchRequested: handleSuggestionsChange, openOnFocus: true, noItemMessage: noItemMessage })), (0, jsx_runtime_1.jsx)(TagManagerItemList_1.default, { tags: tags, onRemoveFromTagList: handleRemoveFromTagList })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: (0, classnames_1.default)('TagManager', className), children: [showInput && ((0, jsx_runtime_1.jsx)(AutoSuggest_1.default, { className: autoSuggestClasses, inputProps: inputProps, suggestions: currentSuggestions, onSuggestionSelected: handleSuggestionSelected, onSuggestionsFetchRequested: handleSuggestionsChange, openOnFocus: true, noItemMessage: noItemMessage })), (0, jsx_runtime_1.jsx)(TagManagerItemList_1.default, { tags: tags, onRemoveFromTagList: handleRemoveFromTagList })] }));
 };
 exports.default = TagManager;

package/lib/es/components/tagManager/TagManagerItemList.js

@@ -2,15 +2,14 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const TagList_1 = tslib_1.__importDefault(require("../tag/TagList"));
 const Tag_1 = tslib_1.__importDefault(require("../tag/Tag"));
 const TagManagerItemList = (props) => {
     const { tags, onRemoveFromTagList = () => { } } = props;
-    return ((0, jsx_runtime_1.jsx)(TagList_1.default, Object.assign({ inline: false }, { children: tags.map(tag => {
+    return ((0, jsx_runtime_1.jsx)(TagList_1.default, { inline: false, children: tags.map(tag => {
             const tagClasses = (0, classnames_1.default)(tag.toAdd && 'border-color-success text-color-success', tag.toRemove && 'border-color-danger text-color-danger');
-            return ((0, jsx_runtime_1.jsx)(Tag_1.default, Object.assign({ className: tagClasses, deletable: true, round: false, onClick: () => onRemoveFromTagList(tag) }, { children: tag.label }), tag.label));
-        }) })));
+            return ((0, jsx_runtime_1.jsx)(Tag_1.default, { className: tagClasses, deletable: true, round: false, onClick: () => onRemoveFromTagList(tag), children: tag.label }, tag.label));
+        }) }));
 };
 exports.default = TagManagerItemList;

package/lib/es/components/teaser/Teaser.js

@@ -2,8 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const noop_1 = tslib_1.__importDefault(require("lodash/fp/noop"));
 const Button_1 = tslib_1.__importDefault(require("../button/Button"));
@@ -11,49 +9,48 @@ const Teaser = (props) => {
     const { segmentation, verticalAlignment = 'top' } = props;
     const alignmentClass = verticalAlignment === 'center' ? 'align-items-center-sm' : '';
     if (segmentation === '100') {
-        return (0, jsx_runtime_1.jsx)(SingleColumnTeaser, Object.assign({ alignmentClass: alignmentClass }, props));
+        return (0, jsx_runtime_1.jsx)(SingleColumnTeaser, { alignmentClass: alignmentClass, ...props });
     }
     // Thumbnail based layout for multiple segments or multiple teaser in a row
-    return (0, jsx_runtime_1.jsx)(MultipleSegmentsOrRowsTeaser, Object.assign({ alignmentClass: alignmentClass }, props));
+    return (0, jsx_runtime_1.jsx)(MultipleSegmentsOrRowsTeaser, { alignmentClass: alignmentClass, ...props });
 };
 exports.default = Teaser;
 const SingleColumnTeaser = (props) => {
     const { headline, content, footer, image, button, segmentation, className, alignmentClass } = props;
     const wrapperClassNames = (0, classnames_1.default)('teaser panel panel-default panel-body padding-20 margin-bottom-20 text-center', alignmentClass, className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: wrapperClassNames }, { children: [(0, jsx_runtime_1.jsx)(TeaserHeadline, { headline: headline, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserImageComp, { image: image, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserContent, { content: content, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserButtonComp, { button: button }), (0, jsx_runtime_1.jsx)(TeaserFooter, { footer: footer })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: wrapperClassNames, children: [(0, jsx_runtime_1.jsx)(TeaserHeadline, { headline: headline, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserImageComp, { image: image, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserContent, { content: content, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserButtonComp, { button: button }), (0, jsx_runtime_1.jsx)(TeaserFooter, { footer: footer })] }));
 };
 const MultipleSegmentsOrRowsTeaser = (props) => {
     const { headline, content, footer, image, button, segmentation, className, alignmentClass } = props;
     const wrapperClasses = (0, classnames_1.default)('teaser thumbnail display-flex-sm', !segmentation && 'flex-column height-100pct-sm', // only for multiple teasers in a row
     alignmentClass, className);
-    const captionClasses = (0, classnames_1.default)('caption', (image === null || image === void 0 ? void 0 : image.align) === 'left' && 'flex-order-2-sm', (image === null || image === void 0 ? void 0 : image.align) === 'right' && 'flex-order-1-sm', segmentation === '50' && 'width-50pct-sm', segmentation === '25:75' && 'width-50pct-sm width-25pct-lg', segmentation === '75:25' && 'width-50pct-sm width-75pct-lg', !segmentation && 'display-flex-sm flex-column-sm flex-1-0-sm');
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: wrapperClasses }, { children: [(0, jsx_runtime_1.jsx)(TeaserImageComp, { image: image, segmentation: segmentation }), (headline || content || button) && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: captionClasses }, { children: [(0, jsx_runtime_1.jsx)(TeaserHeadline, { headline: headline, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserContent, { content: content, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserButtonComp, { button: button }), (0, jsx_runtime_1.jsx)(TeaserFooter, { footer: footer })] })))] })));
+    const captionClasses = (0, classnames_1.default)('caption', image?.align === 'left' && 'flex-order-2-sm', image?.align === 'right' && 'flex-order-1-sm', segmentation === '50' && 'width-50pct-sm', segmentation === '25:75' && 'width-50pct-sm width-25pct-lg', segmentation === '75:25' && 'width-50pct-sm width-75pct-lg', !segmentation && 'display-flex-sm flex-column-sm flex-1-0-sm');
+    return ((0, jsx_runtime_1.jsxs)("div", { className: wrapperClasses, children: [(0, jsx_runtime_1.jsx)(TeaserImageComp, { image: image, segmentation: segmentation }), (headline || content || button) && ((0, jsx_runtime_1.jsxs)("div", { className: captionClasses, children: [(0, jsx_runtime_1.jsx)(TeaserHeadline, { headline: headline, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserContent, { content: content, segmentation: segmentation }), (0, jsx_runtime_1.jsx)(TeaserButtonComp, { button: button }), (0, jsx_runtime_1.jsx)(TeaserFooter, { footer: footer })] }))] }));
 };
 const TeaserHeadline = ({ headline, segmentation }) => {
     if (!headline) {
         return null;
     }
-    return (0, jsx_runtime_1.jsx)("h2", Object.assign({ className: segmentation === '100' ? 'margin-top-20 margin-bottom-25' : 'margin-top-5' }, { children: headline }));
+    return (0, jsx_runtime_1.jsx)("h2", { className: segmentation === '100' ? 'margin-top-20 margin-bottom-25' : 'margin-top-5', children: headline });
 };
 const TeaserContent = ({ content, segmentation }) => {
     if (!content) {
         return null;
     }
     const classes = (0, classnames_1.default)('teaser-content-wrapper text-size-16', segmentation === '100' ? 'padding-left-25-sm padding-right-25-sm' : 'flex-1-0-sm');
-    return (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes }, { children: content }));
+    return (0, jsx_runtime_1.jsx)("div", { className: classes, children: content });
 };
 const TeaserFooter = ({ footer }) => {
     if (!footer) {
         return null;
     }
-    return (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'teaser-footer-wrapper' }, { children: footer }));
+    return (0, jsx_runtime_1.jsx)("div", { className: 'teaser-footer-wrapper', children: footer });
 };
 const TeaserButtonComp = ({ button }) => {
-    var _a;
     if (!button) {
         return null;
     }
-    return ((0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)(Button_1.default, Object.assign({ bsStyle: (_a = button.bsStyle) !== null && _a !== void 0 ? _a : 'primary', className: button.className, onClick: button.onClick }, { children: button.text })) }));
+    return ((0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)(Button_1.default, { bsStyle: button.bsStyle ?? 'primary', className: button.className, onClick: button.onClick, children: button.text }) }));
 };
 /* eslint-disable max-len */
 const placeholderImage1by1 = 'data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAA+gAAAPoCAQAAADnqhxvAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAAmJLR0QA/4ePzL8AAAAHdElNRQfiCw8ODSFLsnJ3AAAPvUlEQVR42u3VMQ0AIADAMMC/ZxDBQVhaBfs29wAAfrdeBwAA9wwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDB0AAgwdAAIMHQACDgTLCM9BHrU/AAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE4LTExLTE1VDEzOjEzOjMzKzAxOjAwgedH5AAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxOC0xMS0xNVQxMzoxMzozMyswMTowMPC6/1gAAAAASUVORK5CYII=';
@@ -68,7 +65,6 @@ const teaserPlaceholderImages = {
     '16:9': placeholderImage16by9,
 };
 const TeaserImageComp = ({ image, segmentation }) => {
-    var _a, _b, _c;
     if (!image) {
         return null;
     }
@@ -77,6 +73,6 @@ const TeaserImageComp = ({ image, segmentation }) => {
         specificClassNames = (0, classnames_1.default)(image.align === 'left' && 'flex-order-1-sm padding-left-20-sm', image.align === 'right' && 'flex-order-2-sm padding-right-20-sm', segmentation === '50' && 'width-50pct-sm', segmentation === '25:75' && 'width-50pct-sm width-75pct-lg', segmentation === '75:25' && 'width-50pct-sm width-25pct-lg', segmentation && 'padding-top-20-sm padding-bottom-20-sm');
     }
     const imageWrapperClassNames = (0, classnames_1.default)('teaser-image-wrapper', specificClassNames, image.className && image.className);
-    const callback = (_a = image === null || image === void 0 ? void 0 : image.onClick) !== null && _a !== void 0 ? _a : noop_1.default;
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: imageWrapperClassNames, onClick: callback }, { children: (0, jsx_runtime_1.jsx)("img", { className: 'img-responsive cover center', src: (_b = teaserPlaceholderImages[image.aspectRatio]) !== null && _b !== void 0 ? _b : placeholderImage16by9, alt: (_c = image.alt) !== null && _c !== void 0 ? _c : '', style: { backgroundImage: `url(${image.src})` } }) })));
+    const callback = image?.onClick ?? noop_1.default;
+    return ((0, jsx_runtime_1.jsx)("div", { className: imageWrapperClassNames, onClick: callback, children: (0, jsx_runtime_1.jsx)("img", { className: 'img-responsive cover center', src: teaserPlaceholderImages[image.aspectRatio] ?? placeholderImage16by9, alt: image.alt ?? '', style: { backgroundImage: `url(${image.src})` } }) }));
 };

package/lib/es/components/teaser/TeaserContainer.js

@@ -29,8 +29,8 @@ const TeaserContainer = (props) => {
         ? getGridClasses(teaserPerRow)
         : getGridClasses(react_1.Children.count(children) || 1);
     const aggregatedColumnClassNames = (0, classnames_1.default)(columnClassNames, columnClassName);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: rowClassNames }, { children: react_1.Children.map(children, child => {
-            return (0, jsx_runtime_1.jsx)("div", Object.assign({ className: aggregatedColumnClassNames }, { children: child }));
-        }) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: rowClassNames, children: react_1.Children.map(children, child => {
+            return (0, jsx_runtime_1.jsx)("div", { className: aggregatedColumnClassNames, children: child });
+        }) }));
 };
 exports.default = TeaserContainer;

package/lib/es/components/timepicker/TimePicker.js

@@ -32,7 +32,7 @@ const isControlledAndValid = (value) => {
     return hasExternalValue && isValid;
 };
 const TimePicker = (props) => {
-    const { value, onChange = noop_1.default, alwaysShowMask = true, showIcon = false, errorMessage, warningMessage, messageWhiteSpace = 'normal', className = '', inputProps = {} } = props, remainingProps = tslib_1.__rest(props, ["value", "onChange", "alwaysShowMask", "showIcon", "errorMessage", "warningMessage", "messageWhiteSpace", "className", "inputProps"]);
+    const { value, onChange = noop_1.default, alwaysShowMask = true, showIcon = false, errorMessage, warningMessage, messageWhiteSpace = 'normal', className = '', inputProps = {}, ...remainingProps } = props;
     const initialTime = isControlledAndValid(value) ? value : getInitialTime();
     const [timeValue, setTimeValue] = (0, react_1.useState)(initialTime);
     // Update internal time value from outside when used as a controlled component
@@ -68,8 +68,8 @@ const TimePicker = (props) => {
         setTimeValue(updatedTimeValue);
         onChange(updatedTimeValue);
     };
-    const { className: inputClassName } = inputProps, otherInputProps = tslib_1.__rest(inputProps, ["className"]);
+    const { className: inputClassName, ...otherInputProps } = inputProps;
     const hasFeedback = errorMessage || warningMessage;
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { className: (0, classnames_1.default)('TimePicker', 'input-group', className) }, { children: [showIcon && ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: 'input-group-addon' }, { children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-time-alt' }) }))), (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'form-control-feedback-wrapper' }, { children: [(0, jsx_runtime_1.jsx)(react_input_mask_1.default, Object.assign({}, otherInputProps, { className: (0, classnames_1.default)('TimePickerInput', 'form-control', inputClassName), mask: mask, maskPlaceholder: '-', value: timeValue, onChange: handleChangeTime, alwaysShowMask: alwaysShowMask })), hasFeedback && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [errorMessage && (0, jsx_runtime_1.jsx)("span", { className: 'form-control-feedback rioglyph rioglyph-error-sign' }), warningMessage && (0, jsx_runtime_1.jsx)("span", { className: 'form-control-feedback rioglyph rioglyph-warning-sign' }), (0, jsx_runtime_1.jsx)("span", Object.assign({ className: `help-block white-space-${messageWhiteSpace}` }, { children: (0, jsx_runtime_1.jsx)("span", { children: errorMessage || warningMessage }) }))] }))] })), isValid && ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'TimePickerIncreaseButton input-group-addon' }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'text-color-gray hover-text-color-dark', onClick: handleDecrease }, { children: (0, jsx_runtime_1.jsx)("div", { className: 'rioglyph rioglyph-chevron-left scale-90' }) })), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'text-color-gray hover-text-color-dark margin-left-5', onClick: handleIncrease }, { children: (0, jsx_runtime_1.jsx)("div", { className: 'rioglyph rioglyph-chevron-right scale-90' }) }))] })))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, className: (0, classnames_1.default)('TimePicker', 'input-group', className), children: [showIcon && ((0, jsx_runtime_1.jsx)("span", { className: 'input-group-addon', children: (0, jsx_runtime_1.jsx)("span", { className: 'rioglyph rioglyph-time-alt' }) })), (0, jsx_runtime_1.jsxs)("div", { className: 'form-control-feedback-wrapper', children: [(0, jsx_runtime_1.jsx)(react_input_mask_1.default, { ...otherInputProps, className: (0, classnames_1.default)('TimePickerInput', 'form-control', inputClassName), mask: mask, maskPlaceholder: '-', value: timeValue, onChange: handleChangeTime, alwaysShowMask: alwaysShowMask }), hasFeedback && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [errorMessage && (0, jsx_runtime_1.jsx)("span", { className: 'form-control-feedback rioglyph rioglyph-error-sign' }), warningMessage && (0, jsx_runtime_1.jsx)("span", { className: 'form-control-feedback rioglyph rioglyph-warning-sign' }), (0, jsx_runtime_1.jsx)("span", { className: `help-block white-space-${messageWhiteSpace}`, children: (0, jsx_runtime_1.jsx)("span", { children: errorMessage || warningMessage }) })] }))] }), isValid && ((0, jsx_runtime_1.jsxs)("div", { className: 'TimePickerIncreaseButton input-group-addon', children: [(0, jsx_runtime_1.jsx)("div", { className: 'text-color-gray hover-text-color-dark display-grid place-items-center cursor-pointer', onClick: handleDecrease, children: (0, jsx_runtime_1.jsx)("div", { className: 'rioglyph rioglyph-chevron-left scale-90' }) }), (0, jsx_runtime_1.jsx)("div", { className: 'text-color-gray hover-text-color-dark margin-left-5 display-grid place-items-center cursor-pointer', onClick: handleIncrease, children: (0, jsx_runtime_1.jsx)("div", { className: 'rioglyph rioglyph-chevron-right scale-90' }) })] }))] }));
 };
 exports.default = TimePicker;

package/lib/es/components/tooltip/SimpleTooltip.js

@@ -2,15 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @ts-ignore-next-line importsNotUsedAsValues
-require("react");
 const Tooltip_1 = tslib_1.__importDefault(require("./Tooltip"));
 const OverlayTrigger_1 = tslib_1.__importDefault(require("../overlay/OverlayTrigger"));
 const Placement_1 = require("../../values/Placement");
 const Trigger_1 = require("../../values/Trigger");
 const SimpleTooltip = (props) => {
-    const { children, placement = Placement_1.PLACEMENT.AUTO, trigger, content, delay, popperConfig, targetRef } = props, remainingProps = tslib_1.__rest(props, ["children", "placement", "trigger", "content", "delay", "popperConfig", "targetRef"]);
-    return ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, Object.assign({ placement: placement, trigger: trigger, overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, Object.assign({}, remainingProps, { ref: targetRef }, { children: content })), delay: delay, popperConfig: popperConfig }, { children: children })));
+    const { children, placement = Placement_1.PLACEMENT.AUTO, trigger, content, delay, popperConfig, targetRef, ...remainingProps } = props;
+    return ((0, jsx_runtime_1.jsx)(OverlayTrigger_1.default, { placement: placement, trigger: trigger, overlay: (0, jsx_runtime_1.jsx)(Tooltip_1.default, { ...remainingProps, ref: targetRef, children: content }), delay: delay, popperConfig: popperConfig, children: children }));
 };
 SimpleTooltip.TRIGGER_CLICK = Trigger_1.TRIGGER.CLICK;
 SimpleTooltip.TRIGGER_HOVER = Trigger_1.TRIGGER.HOVER;

package/lib/es/components/tooltip/Tooltip.js

@@ -18,7 +18,7 @@ const TEXT_ALIGNMENT_MAP = {
     TEXT_ALIGNMENT_RIGHT: TextAlignment_1.TEXT_ALIGNMENT.RIGHT,
 };
 const Tooltip = (0, react_1.forwardRef)((props, ref) => {
-    const _a = (0, omit_1.default)(['popper', 'positionLeft', 'positionTop'], props), { allowOnTouch = false, arrowProps, children, className = '', innerClassName = '', placement = 'bottom', style, textAlignment = 'center', tooltipStyle = 'default', width = 'auto' } = _a, remainingProps = tslib_1.__rest(_a, ["allowOnTouch", "arrowProps", "children", "className", "innerClassName", "placement", "style", "textAlignment", "tooltipStyle", "width"]);
+    const { allowOnTouch = false, arrowProps, children, className = '', innerClassName = '', placement = 'bottom', style, textAlignment = 'center', tooltipStyle = 'default', width = 'auto', ...remainingProps } = (0, omit_1.default)(['popper', 'positionLeft', 'positionTop'], props);
     // Mount the component but don't show it yet via CSS.
     // After it is mounted, we set the visibility class to use CSS animation
     const [isMounted, setIsMounted] = (0, react_1.useState)(false);
@@ -32,7 +32,7 @@ const Tooltip = (0, react_1.forwardRef)((props, ref) => {
     const wrapperClasses = (0, classnames_1.default)('tooltip', tooltipStyle && `tooltip-${tooltipStyle}`, placement, 'fade', isMounted && 'show', className);
     const innerClasses = (0, classnames_1.default)('tooltip-inner', textAlignment && `text-${textAlignment}`, width && `width-${width}`, innerClassName && innerClassName);
     /* eslint-disable react/no-unknown-property */
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, remainingProps, { role: 'tooltip', "x-placement": placement, ref: ref, className: wrapperClasses, style: Object.assign({}, style), "data-offset": 20 }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'tooltip-arrow' }, arrowProps)), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: innerClasses }, { children: children }))] })));
+    return ((0, jsx_runtime_1.jsxs)("div", { ...remainingProps, role: 'tooltip', "x-placement": placement, ref: ref, className: wrapperClasses, style: { ...style }, "data-offset": 20, children: [(0, jsx_runtime_1.jsx)("div", { className: 'tooltip-arrow', ...arrowProps }), (0, jsx_runtime_1.jsx)("div", { className: innerClasses, children: children })] }));
 });
 // statics
 Object.assign(Tooltip, STYLE_MAP);

package/lib/es/components/video/ResponsiveVideo.js

@@ -2,14 +2,13 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-require("react");
 const classnames_1 = tslib_1.__importDefault(require("classnames"));
 const FOUR_BY_THREE = '4by3';
 const SIXTEEN_BY_NINE = '16by9';
 const ResponsiveVideo = (props) => {
     const { src, className = '', allowFullScreen = true, aspectRatio = '16by9' } = props;
     const wrapperClassName = (0, classnames_1.default)('video-responsive', `video-responsive-${aspectRatio}`, className && className);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: wrapperClassName }, { children: (0, jsx_runtime_1.jsx)("iframe", { src: src, allowFullScreen: allowFullScreen }) })));
+    return ((0, jsx_runtime_1.jsx)("div", { className: wrapperClassName, children: (0, jsx_runtime_1.jsx)("iframe", { src: src, allowFullScreen: allowFullScreen }) }));
 };
 ResponsiveVideo.ASPECT_RATIO_4_BY_3 = FOUR_BY_THREE;
 ResponsiveVideo.ASPECT_RATIO_16_BY_9 = SIXTEEN_BY_NINE;

package/lib/es/components/virtualList/VirtualList.d.ts

@@ -0,0 +1,59 @@
+import React from 'react';
+export type VirtualListProps<T> = {
+    /**
+     * The array of items to be rendered in the list.
+     */
+    items: T[];
+    /**
+     * A function that renders an item given its data and index.
+     *
+     * @param item
+     * @param index
+     * @returns
+     */
+    renderItem: (item: T, index: number) => React.ReactElement;
+    /**
+     * The number of items to render outside the visible area for smoother scrolling.
+     *
+     * @default 3
+     */
+    overscanCount?: number;
+    /**
+     * The default height for items if their height cannot be determined.
+     *
+     * @default 50
+     */
+    defaultHeight?: number;
+    /**
+     * Optional ref to an external scroll container.
+     * Use this when VirtualList is inside a scrollable container.
+     */
+    scrollContainerRef?: React.RefObject<HTMLElement>;
+    /**
+     * Additional classNames for the container of the list items.
+     */
+    containerClassName?: string;
+    /**
+     * Additional classNames for each individual list item wrapper.
+     * This wrapper is required for proper positioning each item in the list using an absolute top value.
+     */
+    listItemWrapperClassName?: string;
+    /**
+     * Additional classNames for the outer list container
+     */
+    className?: string;
+};
+export type ItemHeight = number;
+export type ItemIndex = number;
+export type VisibleRange = {
+    start: number;
+    end: number;
+};
+export type VirtualListState = {
+    itemHeights: Record<ItemIndex, ItemHeight>;
+    visibleRange: VisibleRange;
+    scrollTop: number;
+    viewportHeight: number;
+};
+export declare const VirtualList: <T>(props: VirtualListProps<T>) => import("react/jsx-runtime").JSX.Element;
+export default VirtualList;

package/lib/es/components/virtualList/VirtualList.js

@@ -0,0 +1,145 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VirtualList = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+// @ts-ignore-next-line importsNotUsedAsValues
+const react_1 = require("react");
+const VirtualListItemWrapper_1 = tslib_1.__importDefault(require("./VirtualListItemWrapper"));
+const useWindowResize_1 = tslib_1.__importDefault(require("../../hooks/useWindowResize"));
+const useVirtualListResizeObserver_1 = tslib_1.__importDefault(require("./useVirtualListResizeObserver"));
+const VirtualList = (props) => {
+    const { items, renderItem, overscanCount = 3, defaultHeight = 50, scrollContainerRef, containerClassName = '', listItemWrapperClassName = '', className = '', ...remainingProps } = props;
+    const [state, setState] = (0, react_1.useState)({
+        itemHeights: {},
+        visibleRange: { start: 0, end: 10 },
+        scrollTop: 0,
+        viewportHeight: 0,
+    });
+    const containerRef = (0, react_1.useRef)(null);
+    const itemsRef = (0, react_1.useRef)(null);
+    const lastMeasuredIndexRef = (0, react_1.useRef)(-1);
+    // Get the actual scroll container - either external or internal
+    const getScrollContainer = (0, react_1.useCallback)(() => {
+        return scrollContainerRef?.current || containerRef.current;
+    }, [scrollContainerRef]);
+    // Ensure we never return NaN or invalid heights
+    const getSafeHeight = (0, react_1.useCallback)((height) => {
+        return !Number.isNaN(height) && height > 0 ? height : defaultHeight;
+    }, [defaultHeight]);
+    const getItemPosition = (0, react_1.useCallback)((index) => {
+        let position = 0;
+        for (let i = 0; i < index; i++) {
+            const height = state.itemHeights[i] ?? defaultHeight;
+            position += getSafeHeight(height);
+        }
+        return position;
+    }, [state.itemHeights, getSafeHeight, defaultHeight]);
+    const getTotalHeight = (0, react_1.useCallback)(() => {
+        const measuredHeight = Object.values(state.itemHeights).reduce((sum, height) => sum + getSafeHeight(height), 0);
+        const measuredCount = Object.keys(state.itemHeights).length;
+        const averageHeight = measuredCount > 0 ? getSafeHeight(measuredHeight / measuredCount) : defaultHeight;
+        const unmeasuredCount = items.length - measuredCount;
+        return getSafeHeight(measuredHeight + unmeasuredCount * averageHeight);
+    }, [items.length, state.itemHeights, getSafeHeight, defaultHeight]);
+    const calculateVisibleRange = (0, react_1.useCallback)(() => {
+        const scrollContainer = getScrollContainer();
+        if (!scrollContainer) {
+            return state.visibleRange;
+        }
+        const viewportHeight = scrollContainer.clientHeight;
+        const scrollTop = scrollContainer.scrollTop;
+        let start = 0;
+        let currentPosition = 0;
+        while (start < items.length) {
+            const height = getSafeHeight(state.itemHeights[start] ?? defaultHeight);
+            if (currentPosition + height > scrollTop - overscanCount * height) {
+                break;
+            }
+            currentPosition += height;
+            start++;
+        }
+        let end = start;
+        while (end < items.length) {
+            const height = getSafeHeight(state.itemHeights[end] ?? defaultHeight);
+            if (currentPosition > scrollTop + viewportHeight + overscanCount * height) {
+                break;
+            }
+            currentPosition += height;
+            end++;
+        }
+        return {
+            start: Math.max(0, start - overscanCount),
+            end: Math.min(items.length, end + overscanCount),
+        };
+    }, [
+        items.length,
+        overscanCount,
+        state.itemHeights,
+        state.visibleRange,
+        getSafeHeight,
+        defaultHeight,
+        getScrollContainer,
+    ]);
+    const measureItem = (0, react_1.useCallback)((index, element) => {
+        const rect = element.getBoundingClientRect();
+        const computedStyle = window.getComputedStyle(element);
+        // Calculate total height with safety checks
+        const totalSafeHeight = getSafeHeight(rect.height +
+            Number.parseFloat(computedStyle.marginTop || '0') +
+            Number.parseFloat(computedStyle.marginBottom || '0'));
+        setState(prev => {
+            if (prev.itemHeights[index] === totalSafeHeight) {
+                return prev;
+            }
+            return {
+                ...prev,
+                itemHeights: { ...prev.itemHeights, [index]: totalSafeHeight },
+            };
+        });
+        lastMeasuredIndexRef.current = Math.max(lastMeasuredIndexRef.current, index);
+    }, [getSafeHeight]);
+    (0, useVirtualListResizeObserver_1.default)(itemsRef, measureItem, [state.visibleRange]);
+    const handleScroll = (0, react_1.useCallback)(() => {
+        const scrollContainer = getScrollContainer();
+        if (!scrollContainer) {
+            return;
+        }
+        const newRange = calculateVisibleRange();
+        setState(prev => ({
+            ...prev,
+            visibleRange: newRange,
+            scrollTop: scrollContainer.scrollTop,
+            viewportHeight: scrollContainer.clientHeight,
+        }));
+    }, [calculateVisibleRange, getScrollContainer]);
+    // Register container scroll event
+    (0, react_1.useEffect)(() => {
+        const scrollContainer = getScrollContainer();
+        if (!scrollContainer) {
+            return;
+        }
+        scrollContainer.addEventListener('scroll', handleScroll, { passive: true });
+        return () => scrollContainer.removeEventListener('scroll', handleScroll);
+    }, [handleScroll, getScrollContainer]);
+    // On window resize, update scroll position
+    (0, useWindowResize_1.default)(handleScroll);
+    const renderItemWithPosition = (item, index) => {
+        const renderedItem = renderItem(item, index);
+        const translateY = getItemPosition(index);
+        return ((0, jsx_runtime_1.jsx)(VirtualListItemWrapper_1.default, { "data-index": index, translateY: translateY, className: listItemWrapperClassName, children: renderedItem }, index));
+    };
+    const { start, end } = state.visibleRange;
+    const totalHeight = getTotalHeight();
+    // Adjust the root element style based on whether we're using an external scroll container
+    const rootStyle = {
+        height: scrollContainerRef ? totalHeight : '100%',
+        position: 'relative',
+        overflow: scrollContainerRef ? 'visible' : 'auto',
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { ...remainingProps, ref: containerRef, className: `VirtualList overflow-y-auto ${className}`, style: rootStyle, children: (0, jsx_runtime_1.jsx)("div", { className: 'position-relative', style: {
+                height: scrollContainerRef ? 'auto' : totalHeight,
+            }, children: (0, jsx_runtime_1.jsx)("div", { ref: itemsRef, className: `VirtualListItemContainer ${containerClassName}`, children: items.slice(start, end).map((item, idx) => renderItemWithPosition(item, start + idx)) }) }) }));
+};
+exports.VirtualList = VirtualList;
+exports.default = exports.VirtualList;