@ultraviolet/ui 1.40.1 → 1.41.1

package/dist/index.d.ts

@@ -1780,6 +1780,7 @@ type ColumnProps$1 = Pick<ComponentProps<typeof HeaderCell$1>, 'isOrdered' | 'on
     info?: string;
 };
 type ListProps = {
+    expandButton?: boolean;
     selectable?: boolean;
     columns: ColumnProps$1[];
     children: ReactNode;
@@ -1820,6 +1821,7 @@ declare const List: react.ForwardRefExoticComponent<ListProps & react.RefAttribu
         };
         expandRow: (rowId: string) => void;
         collapseRow: (rowId: string) => void;
+        expandButton: boolean;
         registerSelectableRow: (rowId: string) => () => void;
         selectedRowIds: {
             [x: string]: boolean;
@@ -2588,9 +2590,11 @@ type ContentProps = {
 };
 type ItemProps = {
     sentiment?: ComponentProps<typeof Bullet>['sentiment'];
+    prominence?: ComponentProps<typeof Bullet>['prominence'];
     size?: Sizes;
     disabled?: boolean;
     children: ReactNode;
+    onClick?: () => void;
     className?: string;
 } & ContentProps;
 type StepListProps = {
@@ -2604,7 +2608,7 @@ type StepListProps = {
  */
 declare const StepList: {
     ({ children, className, "data-testid": dataTestId, }: StepListProps): _emotion_react_jsx_runtime.JSX.Element;
-    Item: ({ bulletText, bulletIcon, sentiment, children, size, disabled, className, }: ItemProps) => _emotion_react_jsx_runtime.JSX.Element;
+    Item: ({ bulletText, bulletIcon, sentiment, prominence, children, onClick, size, disabled, className, }: ItemProps) => _emotion_react_jsx_runtime.JSX.Element;
 };
 
 type StepperProps = {
@@ -3089,13 +3093,13 @@ type TimeInputType = ((props: TimeInputProps) => JSX.Element) & {
 declare const TimeInput: TimeInputType;
 
 declare const toast: {
-    error: (children: ReactNode, options?: ToastOptions) => number | string;
+    error: (children: ReactNode, options?: ToastOptions, containerId?: string) => number | string;
     /**
      * @deprecated "Deprecated, please use another variant instead"
      */
-    info: (children: ReactNode, options?: ToastOptions) => number | string;
-    success: (children: ReactNode, options?: ToastOptions) => number | string;
-    warning: (children: ReactNode, options?: ToastOptions) => number | string;
+    info: (children: ReactNode, options?: ToastOptions, containerId?: string) => number | string;
+    success: (children: ReactNode, options?: ToastOptions, containerId?: string) => number | string;
+    warning: (children: ReactNode, options?: ToastOptions, containerId?: string) => number | string;
 };
 type ToastContainerProps = {
     /**
@@ -3117,6 +3121,10 @@ type ToastContainerProps = {
      * Delay before the toast is automatically closed, if not set the default value is 6000ms
      */
     autoClose?: number;
+    /**
+     * Set a custom containerId to be able to define multiple ToastContainers
+     */
+    containerId?: string;
 };
 /**
  * Display short information about an event that happen in the interface in a floating alert.
@@ -3126,7 +3134,7 @@ type ToastContainerProps = {
  * Toaster is separated in two parts, first the `ToastContainer` which is where the div of the toast will be rendered,
  * and second the `toast()` function which is used to display the toast.
  */
-declare const ToastContainer: ({ newestOnTop, limit, position, "data-testid": dataTestId, className, autoClose, }: ToastContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const ToastContainer: ({ newestOnTop, limit, position, "data-testid": dataTestId, className, autoClose, containerId, }: ToastContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 /**
  * Toggle component is used to toggle between two states (on/off, true/false, etc.).
@@ -3324,7 +3332,7 @@ type CloseButtonProps = {
     ariaLabel?: string;
     theme: Theme$1;
 };
-declare const notification: (children: ReactNode | ((props: CloseButtonProps) => ReactNode), title: string, icon?: ReactNode, isClosable?: boolean, options?: ToastOptions) => react_toastify.Id;
+declare const notification: (children: ReactNode | ((props: CloseButtonProps) => ReactNode), title: string, icon?: ReactNode, isClosable?: boolean, containerId?: string, options?: ToastOptions) => react_toastify.Id;
 type NotificationContainerProps = {
     /**
      * Delay (in ms) before the notification autocloses. To disable autoclose, set to false
@@ -3345,8 +3353,33 @@ type NotificationContainerProps = {
     position?: ToastOptions['position'];
     'data-testid'?: string;
     className?: string;
+    /**
+     * Give a personalized containerId in case there are multiple notifications with different styled to display
+     */
+    containerId?: string;
+};
+declare const NotificationContainer: ({ newestOnTop, limit, autoClose, position, "data-testid": dataTestId, className, containerId, }: NotificationContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
+
+type CardSelectableCardProps = Omit<ComponentProps<typeof SelectableCard>, 'onChange' | 'checked' | 'type' | 'showTick'>;
+type SelectableCardGroupProps = {
+    legend?: string;
+    value: string | number | (string | number)[];
+    className?: string;
+    helper?: ReactNode;
+    error?: ReactNode;
+    columns?: number;
+    children: ReactNode;
+    type: 'radio' | 'checkbox';
+    required?: boolean;
+    showTick?: boolean;
+} & Required<Pick<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'name'>>;
+/**
+ * SelectableCardGroup is a component that allows users to select cards from a list of cards using SelectableCard.
+ */
+declare const SelectableCardGroup: {
+    ({ legend, value, className, helper, error, columns, children, onChange, name, required, type, showTick, }: SelectableCardGroupProps): _emotion_react_jsx_runtime.JSX.Element;
+    Card: ({ value, disabled, children, className, isError, onFocus, onBlur, tooltip, id, label, "data-testid": dataTestId, }: CardSelectableCardProps) => _emotion_react_jsx_runtime.JSX.Element;
 };
-declare const NotificationContainer: ({ newestOnTop, limit, autoClose, position, "data-testid": dataTestId, className, }: NotificationContainerProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare const getUUID: (prefix?: string) => string;
 
@@ -3391,4 +3424,4 @@ declare const down: (size: ScreenSize, rules: string) => string;
 
 declare const normalize: () => string;
 
-export { ActionBar, Alert, Avatar, Badge, Banner, BarChart, BarStack, Breadcrumbs, Breakpoint, Bullet, Button, Card, Carousel, Checkbox, CheckboxGroup, CheckboxGroupCheckbox, CopyButton, DateInput, EmptyState, Expandable, GlobalAlert, LineChart, Link, List, Loader, Menu, MenuV2, Meter, Modal, Notice, NotificationContainer, NumberInput, NumberInputV2, Pagination, PasswordCheck, PasswordStrengthMeter, PieChart, Popover, Popup, ProgressBar, Radio, RadioGroup, Row, type SCWUITheme, SelectInput, SelectableCard, Separator, Skeleton, Snippet, Stack, Status, StepList, Stepper, SwitchButton, Table, Tabs, Tag, TagInput, TagList, Text, TextArea, TextInput, TextInputV2, TimeInput, ToastContainer, Toggle, ToggleGroup, Tooltip, type UltravioletUITheme, VerificationCode, bounce, down, extendTheme, fadeIn, fadeOut, flash, getUUID, normalize, notification, ping, pulse, quickScaleDown, scaleBack, scaleDown, scaleForward, scaleUp, sketchIn, sketchOut, slideDownLarge, slideFromBottom, slideFromLeft, slideFromRight, slideFromTop, slideToBottom, slideToLeft, slideToRight, slideToTop, slideUpLarge, toast, unfoldIn, unfoldOut, up, zoomIn, zoomOut };
+export { ActionBar, Alert, Avatar, Badge, Banner, BarChart, BarStack, Breadcrumbs, Breakpoint, Bullet, Button, Card, Carousel, Checkbox, CheckboxGroup, CheckboxGroupCheckbox, CopyButton, DateInput, EmptyState, Expandable, GlobalAlert, LineChart, Link, List, Loader, Menu, MenuV2, Meter, Modal, Notice, NotificationContainer, NumberInput, NumberInputV2, Pagination, PasswordCheck, PasswordStrengthMeter, PieChart, Popover, Popup, ProgressBar, Radio, RadioGroup, Row, type SCWUITheme, SelectInput, SelectableCard, SelectableCardGroup, Separator, Skeleton, Snippet, Stack, Status, StepList, Stepper, SwitchButton, Table, Tabs, Tag, TagInput, TagList, Text, TextArea, TextInput, TextInputV2, TimeInput, ToastContainer, Toggle, ToggleGroup, Tooltip, type UltravioletUITheme, VerificationCode, bounce, down, extendTheme, fadeIn, fadeOut, flash, getUUID, normalize, notification, ping, pulse, quickScaleDown, scaleBack, scaleDown, scaleForward, scaleUp, sketchIn, sketchOut, slideDownLarge, slideFromBottom, slideFromLeft, slideFromRight, slideFromTop, slideToBottom, slideToLeft, slideToRight, slideToTop, slideUpLarge, toast, unfoldIn, unfoldOut, up, zoomIn, zoomOut };

package/dist/src/components/List/HeaderRow.js

@@ -19,7 +19,8 @@ const HeaderRow = ({
     allRowSelectValue,
     selectAll,
     unselectAll,
-    selectedRowIds
+    selectedRowIds,
+    expandButton
   } = useListContext();
   const selectableRowCount = Object.keys(selectedRowIds).length;
   return jsxs(StyledHeaderRow, {
@@ -33,6 +34,8 @@ const HeaderRow = ({
         onChange: allRowSelectValue === false ? selectAll : unselectAll,
         disabled: selectableRowCount === 0
       })
+    }) : null, expandButton ? jsx(HeaderCell, {
+      children: null
     }) : null, children]
   });
 };

package/dist/src/components/List/ListContext.js

@@ -5,7 +5,8 @@ const ListContext = /*#__PURE__*/createContext(undefined);
 const ListProvider = ({
   children,
   autoCollapse,
-  selectable
+  selectable,
+  expandButton
 }) => {
   const [expandedRowIds, setExpandedRowIds] = useState({});
   const [selectedRowIds, setSelectedRowIds] = useState({});
@@ -101,8 +102,9 @@ const ListProvider = ({
     selectable,
     selectAll,
     unselectAll,
-    allRowSelectValue
-  }), [registerExpandableRow, expandedRowIds, expandRow, collapseRow, registerSelectableRow, selectedRowIds, selectRow, unselectRow, selectable, selectAll, unselectAll, allRowSelectValue]);
+    allRowSelectValue,
+    expandButton
+  }), [registerExpandableRow, expandedRowIds, expandRow, collapseRow, registerSelectableRow, selectedRowIds, selectRow, unselectRow, selectable, selectAll, unselectAll, allRowSelectValue, expandButton]);
   return jsx(ListContext.Provider, {
     value: value,
     children: children

package/dist/src/components/List/Row.js

@@ -1,5 +1,6 @@
 import _styled from '@emotion/styled/base';
 import { forwardRef, useEffect } from 'react';
+import { Button } from '../Button/index.js';
 import { Checkbox } from '../Checkbox/index.js';
 import { Tooltip } from '../Tooltip/index.js';
 import { Cell } from './Cell.js';
@@ -88,7 +89,8 @@ const Row = /*#__PURE__*/forwardRef(({
     registerSelectableRow,
     selectedRowIds,
     selectRow,
-    unselectRow
+    unselectRow,
+    expandButton
   } = useListContext();
   const isSelectDisabled = disabled || selectDisabled !== undefined && selectDisabled !== false;
   const hasExpandable = !!expandable;
@@ -152,6 +154,16 @@ const Row = /*#__PURE__*/forwardRef(({
           })
         })
       })
+    }) : null, expandButton ? jsx(Cell, {
+      preventClick: true,
+      children: jsx(Button, {
+        disabled: disabled || !expandable,
+        icon: expandedRowIds[id] ? 'arrow-up' : 'arrow-down',
+        onClick: toggleRowExpand,
+        size: "xsmall",
+        sentiment: "neutral",
+        variant: "ghost"
+      })
     }) : null, children, expandable && expandedRowIds[id] ? jsx(ExpandableWrapper, {
       "data-expandable-content": true,
       onClick: e => {

package/dist/src/components/List/constants.js

@@ -1,3 +1,4 @@
 const SELECTABLE_CHECKBOX_SIZE = 24;
+const EXPAND_BUTTON_SIZE = 24;
 
-export { SELECTABLE_CHECKBOX_SIZE };
+export { EXPAND_BUTTON_SIZE, SELECTABLE_CHECKBOX_SIZE };

package/dist/src/components/List/index.js

@@ -8,7 +8,7 @@ import { useListContext, ListProvider } from './ListContext.js';
 import { Row } from './Row.js';
 import { SelectBar } from './SelectBar.js';
 import { SkeletonRows } from './SkeletonRows.js';
-import { SELECTABLE_CHECKBOX_SIZE } from './constants.js';
+import { SELECTABLE_CHECKBOX_SIZE, EXPAND_BUTTON_SIZE } from './constants.js';
 import { jsx, jsxs } from '@emotion/react/jsx-runtime';
 
 const StyledList = /*#__PURE__*/_styled('div', {
@@ -20,17 +20,19 @@ const StyledList = /*#__PURE__*/_styled('div', {
   template
 }) => template, ";align-items:center;}");
 const BaseList = /*#__PURE__*/forwardRef(({
+  expandButton = false,
   selectable = false,
   columns,
   children,
   loading,
   autoCollapse = false
 }, ref) => {
-  const computeTemplate = `${selectable ? `${SELECTABLE_CHECKBOX_SIZE}px ` : ''}${columns.map(({
+  const computeTemplate = `${selectable ? `${SELECTABLE_CHECKBOX_SIZE}px ` : ''}${expandButton ? `${EXPAND_BUTTON_SIZE}px ` : ''}${columns.map(({
     width
   }) => width ?? 'minmax(0, 1fr)').join(' ')}`;
   return jsx(ListProvider, {
     selectable: selectable,
+    expandButton: expandButton,
     autoCollapse: autoCollapse,
     children: jsxs(StyledList, {
       ref: ref,

package/dist/src/components/MenuV2/Item.js

@@ -18,6 +18,7 @@ const itemCoreStyle = ({
   ${borderless ? '' : `border-bottom: 1px solid ${theme.colors.neutral.border};`}
   cursor: pointer;
   min-width: 110px;
+  width: 100%;
 
   color: ${theme.colors[sentiment][disabled ? 'textDisabled' : 'text']};
   svg {

package/dist/src/components/Notification/index.js

@@ -10,7 +10,7 @@ const PREFIX = '.Toastify';
 const styles = {
   toast: ({
     theme
-  }) => /*#__PURE__*/css("border-radius:", theme.radii.default, ";&", PREFIX, "__toast{background-color:", theme.colors.neutral.background, ";color:", theme.colors.neutral.text, ";padding:", theme.space['2'], ";box-shadow:", theme.shadows.defaultShadow, ";}&", PREFIX, "__toast-container{width:312px;}", PREFIX, "__toast-body{margin:0;padding:0;}")
+  }) => /*#__PURE__*/css("border-radius:", theme.radii.default, ";&", PREFIX, "__toast{background-color:", theme.colors.neutral.background, ";color:", theme.colors.neutral.text, ";padding:", theme.space['2'], ";box-shadow:", theme.shadows.defaultShadow, ";}&", PREFIX, "__toast-container{width:312px;}", PREFIX, "__toast-body{margin:0;padding:0;display:none;}")
 };
 const closeButton = props => jsx(Button, {
   "aria-label": "close",
@@ -20,7 +20,7 @@ const closeButton = props => jsx(Button, {
   onClick: props.closeToast,
   size: "xsmall"
 });
-const notification = (children, title, icon, isClosable, options) => toast('', {
+const notification = (children, title, icon, isClosable, containerId, options) => toast('', {
   ...options,
   closeButton: props => jsxs(Stack, {
     direction: "row",
@@ -35,7 +35,8 @@ const notification = (children, title, icon, isClosable, options) => toast('', {
         children: title
       }), typeof children === 'function' ? children(props) : children]
     }), isClosable ? closeButton(props) : null]
-  })
+  }),
+  containerId: containerId ?? 'notification'
 });
 const NotificationContainer = ({
   newestOnTop,
@@ -43,7 +44,8 @@ const NotificationContainer = ({
   autoClose = false,
   position = 'top-right',
   'data-testid': dataTestId,
-  className
+  className,
+  containerId = 'notification'
 }) => {
   const theme = useTheme();
   return jsxs(Fragment, {
@@ -65,7 +67,8 @@ const NotificationContainer = ({
         hideProgressBar: true,
         draggable: false,
         transition: Slide,
-        className: className
+        className: className,
+        containerId: containerId
       })
     })]
   });

package/dist/src/components/SelectableCardGroup/index.js

@@ -0,0 +1,141 @@
+import _styled from '@emotion/styled/base';
+import { Icon } from '@ultraviolet/icons';
+import { useMemo, createContext, useContext } from 'react';
+import { Row } from '../Row/index.js';
+import { SelectableCard } from '../SelectableCard/index.js';
+import { Stack } from '../Stack/index.js';
+import { Text } from '../Text/index.js';
+import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+const SelectableCardGroupContext = /*#__PURE__*/createContext(undefined);
+const CardSelectableCard = ({
+  value,
+  disabled,
+  children,
+  className,
+  isError,
+  onFocus,
+  onBlur,
+  tooltip,
+  id,
+  label,
+  'data-testid': dataTestId
+}) => {
+  const context = useContext(SelectableCardGroupContext);
+  if (!context) {
+    throw new Error('SelectableCardGroup.Card can only be used inside a SelectableCardGroup');
+  }
+  const {
+    groupName,
+    onChange,
+    groupValue,
+    type,
+    showTick
+  } = context;
+  return jsx(SelectableCard, {
+    name: groupName,
+    value: value,
+    showTick: showTick,
+    type: type,
+    disabled: disabled,
+    className: className,
+    isError: isError,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    tooltip: tooltip,
+    id: id,
+    label: label,
+    onChange: onChange,
+    checked: typeof groupValue === 'object' ? groupValue.includes(value) : groupValue === value,
+    "data-testid": dataTestId,
+    children: children
+  });
+};
+const FieldSet = /*#__PURE__*/_styled("fieldset", {
+  target: "e1cxe6lb1"
+})(process.env.NODE_ENV === "production" ? {
+  name: "7o2an9",
+  styles: "border:none;padding:0;margin:0"
+} : {
+  name: "7o2an9",
+  styles: "border:none;padding:0;margin:0",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+const StyledRequiredIcon = /*#__PURE__*/_styled(Icon, {
+  target: "e1cxe6lb0"
+})(process.env.NODE_ENV === "production" ? {
+  name: "1nglpc5",
+  styles: "vertical-align:super"
+} : {
+  name: "1nglpc5",
+  styles: "vertical-align:super",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+/**
+ * SelectableCardGroup is a component that allows users to select cards from a list of cards using SelectableCard.
+ */
+const SelectableCardGroup = ({
+  legend,
+  value,
+  className,
+  helper,
+  error,
+  columns = 1,
+  children,
+  onChange,
+  name,
+  required = false,
+  type,
+  showTick = false
+}) => {
+  const contextValue = useMemo(() => ({
+    groupName: name,
+    groupValue: value,
+    onChange,
+    required,
+    type,
+    showTick
+  }), [name, value, onChange, required, type, showTick]);
+  return jsx(SelectableCardGroupContext.Provider, {
+    value: contextValue,
+    children: jsxs(Stack, {
+      gap: 1,
+      children: [jsx(FieldSet, {
+        className: className,
+        children: jsxs(Stack, {
+          gap: 1.5,
+          children: [jsxs(Text, {
+            as: "legend",
+            variant: "bodyStrong",
+            children: [legend && jsxs(Fragment, {
+              children: [legend, " \xA0"]
+            }), required ? jsx(StyledRequiredIcon, {
+              name: "asterisk",
+              color: "danger",
+              size: 8
+            }) : null]
+          }), jsx(Row, {
+            gap: 2,
+            templateColumns: `repeat(${columns}, auto)`,
+            children: children
+          })]
+        })
+      }), helper ? jsx(Text, {
+        as: "span",
+        variant: "caption",
+        prominence: "weak",
+        sentiment: "neutral",
+        children: helper
+      }) : null, error ? jsx(Text, {
+        as: "span",
+        variant: "caption",
+        sentiment: "danger",
+        children: error
+      }) : null]
+    })
+  });
+};
+SelectableCardGroup.Card = CardSelectableCard;
+
+export { SelectableCardGroup };

package/dist/src/components/StepList/index.js

@@ -26,21 +26,26 @@ const Item = ({
   bulletText,
   bulletIcon,
   sentiment,
+  prominence,
   children,
+  onClick,
   size = 'medium',
   disabled = false,
   className
 }) => jsxs(Step, {
   disabled: disabled,
   className: className,
+  onClick: onClick,
   children: [bulletIcon ? jsx(Bullet, {
     icon: bulletIcon,
     size: size,
-    sentiment: disabled ? 'disabled' : sentiment
+    sentiment: disabled ? 'disabled' : sentiment,
+    prominence: prominence
   }) : null, bulletText ? jsx(Bullet, {
     text: bulletText,
     size: size,
-    sentiment: disabled ? 'disabled' : sentiment
+    sentiment: disabled ? 'disabled' : sentiment,
+    prominence: prominence
   }) : null, jsx(StyledDiv, {
     size: size,
     children: children

package/dist/src/components/TextArea/index.js

@@ -179,7 +179,8 @@ const TextArea = /*#__PURE__*/forwardRef(({
             size: STATE_ICON_SIZE
           }) : null, error ? jsx(Icon, {
             name: "alert",
-            color: "danger"
+            color: "danger",
+            variant: "outlined"
           }) : null]
         })]
       })

package/dist/src/components/Toaster/index.js

@@ -46,41 +46,45 @@ const Content = ({
   })
 });
 const toast = {
-  error: (children, options) => toast$1.error(jsx(Content, {
+  error: (children, options, containerId) => toast$1.error(jsx(Content, {
     children: children
   }), {
     ...options,
     closeButton: jsx(CloseButton, {
       sentiment: "danger"
-    })
+    }),
+    containerId: containerId ?? 'toaster'
   }),
   /**
    * @deprecated "Deprecated, please use another variant instead"
    */
   // eslint-disable-next-line deprecation/deprecation
-  info: (children, options) => toast$1.info(jsx(Content, {
+  info: (children, options, containerId) => toast$1.info(jsx(Content, {
     children: children
   }), {
     ...options,
     closeButton: jsx(CloseButton, {
       sentiment: "info"
-    })
+    }),
+    containerId: containerId ?? 'toaster'
   }),
-  success: (children, options) => toast$1.success(jsx(Content, {
+  success: (children, options, containerId) => toast$1.success(jsx(Content, {
     children: children
   }), {
     ...options,
     closeButton: jsx(CloseButton, {
       sentiment: "success"
-    })
+    }),
+    containerId: containerId ?? 'toaster'
   }),
-  warning: (children, options) => toast$1.warn(jsx(Content, {
+  warning: (children, options, containerId) => toast$1.warn(jsx(Content, {
     children: children
   }), {
     ...options,
     closeButton: jsx(CloseButton, {
       sentiment: "warning"
-    })
+    }),
+    containerId: containerId ?? 'toaster'
   })
 };
 /**
@@ -97,7 +101,8 @@ const ToastContainer = ({
   position = 'top-right',
   'data-testid': dataTestId,
   className,
-  autoClose
+  autoClose,
+  containerId = 'toaster'
 }) => {
   const theme = useTheme();
   return jsxs(Fragment, {
@@ -117,7 +122,8 @@ const ToastContainer = ({
         stacked: true,
         hideProgressBar: true,
         className: className,
-        transition: Slide
+        transition: Slide,
+        containerId: containerId
       })
     })]
   });

package/dist/src/index.js

@@ -72,3 +72,4 @@ export { Icon } from '@ultraviolet/icons';
 export { MenuV2 } from './components/MenuV2/index.js';
 export { GlobalAlert } from './components/GlobalAlert/index.js';
 export { NotificationContainer, notification } from './components/Notification/index.js';
+export { SelectableCardGroup } from './components/SelectableCardGroup/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "1.40.1",
+  "version": "1.41.1",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -67,7 +67,7 @@
     "react-use-clipboard": "1.0.9",
     "reakit": "1.3.11",
     "@ultraviolet/themes": "1.9.0",
-    "@ultraviolet/icons": "2.9.3"
+    "@ultraviolet/icons": "2.10.0"
   },
   "scripts": {
     "build": "rollup -c ../../rollup.config.mjs",