@ultraviolet/ui 1.43.2 → 1.44.0

package/dist/index.d.ts

@@ -1682,13 +1682,14 @@ type ExpandableProps = {
     minHeight?: number;
     className?: string;
     'data-testid'?: string;
+    animationDuration?: number;
 };
 /**
  * The Expandable component is a dynamic React component that allows for the expansion of its children content
  * based on its height. The component comes with a sleek and smooth animation, providing a visually pleasing
  * user experience.
  */
-declare const Expandable: ({ children, opened, minHeight, className, "data-testid": dataTestId, }: ExpandableProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Expandable: ({ children, opened, minHeight, className, "data-testid": dataTestId, animationDuration, }: ExpandableProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 type Transformer = (value: DatumValue) => string;
 type CustomLegendProps = {

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

@@ -5,9 +5,13 @@ import { jsx } from '@emotion/react/jsx-runtime';
 const ANIMATION_DURATION = 300; // in ms
 
 const StyledExpandable = /*#__PURE__*/_styled('div', {
-  shouldForwardProp: prop => !['opened', 'minHeight'].includes(prop),
+  shouldForwardProp: prop => !['opened', 'minHeight', 'animationDuration'].includes(prop),
   target: "e5hc7t70"
-})("transition:max-height ", ANIMATION_DURATION, "ms ease-out,opacity ", ANIMATION_DURATION, "ms ease-out;overflow:", ({
+})("transition:max-height ", ({
+  animationDuration
+}) => animationDuration, "ms ease-out,opacity ", ({
+  animationDuration
+}) => animationDuration, "ms ease-out;overflow:", ({
   opened
 }) => opened ? 'visible' : 'hidden', ";height:auto;max-height:", ({
   opened,
@@ -24,7 +28,8 @@ const Expandable = ({
   opened,
   minHeight = 0,
   className,
-  'data-testid': dataTestId
+  'data-testid': dataTestId,
+  animationDuration = ANIMATION_DURATION
 }) => {
   const [height, setHeight] = useState(null);
   const transitionTimer = useRef();
@@ -76,6 +81,7 @@ const Expandable = ({
     className: className,
     opened: opened,
     minHeight: minHeight,
+    animationDuration: animationDuration,
     children: children
   });
 };

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

@@ -9,7 +9,6 @@ import { Tooltip } from '../Tooltip/index.js';
 import { jsxs, jsx } 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 NUMBER_INPUT_MAX_STR_LENGTH = /*#__PURE__*/Number.MAX_SAFE_INTEGER.toString().length;
 const SIZES = {
   small: '30px',
   medium: '38px',
@@ -139,27 +138,6 @@ const NumberInputV2 = /*#__PURE__*/forwardRef(({
     }
     onChange?.(parseInt(localRef.current?.value ?? '', 10) ?? min);
   }, [localRef, min, onChange]);
-  const onChangeValue = inputStr => {
-    if (onChange) {
-      let numericValue;
-      if (inputStr.length > NUMBER_INPUT_MAX_STR_LENGTH && inputStr.startsWith('-')) {
-        numericValue = min;
-      } else if (inputStr.length > NUMBER_INPUT_MAX_STR_LENGTH) {
-        numericValue = max;
-      } else {
-        numericValue = parseInt(inputStr, 10);
-        if (Number.isNaN(numericValue) || numericValue < min) {
-          numericValue = min;
-        } else if (numericValue > max) {
-          numericValue = max;
-        }
-      }
-      onChange(numericValue);
-      if (localRef.current) {
-        localRef.current.value = numericValue.toString();
-      }
-    }
-  };
   const isMinusDisabled = useMemo(() => {
     if (!localRef?.current?.value || localRef?.current?.value === '') {
       return false;
@@ -191,6 +169,10 @@ const NumberInputV2 = /*#__PURE__*/forwardRef(({
     }
     return 'neutral';
   }, [error, success]);
+  let inputValue;
+  if (value !== undefined) {
+    inputValue = value !== null && Number.isInteger(value) ? value.toString() : '';
+  }
   return jsxs(Stack, {
     gap: "0.5",
     className: className,
@@ -246,28 +228,13 @@ const NumberInputV2 = /*#__PURE__*/forwardRef(({
               name: name,
               id: localId,
               placeholder: placeholder,
-              onKeyDown: event => {
-                if (event.key === 'Enter') {
-                  if (!localRef.current?.value) {
-                    onChange?.(null);
-                  } else if (onChange) {
-                    onChangeValue(localRef.current?.value ?? '');
-                  }
-                }
-              },
-              onBlur: event => {
-                if (event.target.value === '') {
-                  onBlur?.(event);
-                  onChange?.(null);
-                  return;
-                }
-                if (onChange) {
-                  onChangeValue(event.target.value);
-                }
-                onBlur?.(event);
-              },
-              defaultValue: value?.toString(),
+              onChange: onChange ? event => {
+                const newNumber = parseInt(event.target.value, 10);
+                onChange(Number.isNaN(newNumber) ? null : newNumber);
+              } : undefined,
+              value: inputValue,
               onFocus: onFocus,
+              onBlur: onBlur,
               "data-size": size,
               step: step,
               disabled: disabled,

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

@@ -13,7 +13,7 @@ const StyledIcon = /*#__PURE__*/_styled(Icon, {
 })("fill:", ({
   color,
   theme
-}) => theme.colors[color].border, ";");
+}) => theme.colors[color].borderWeak, ";");
 const StyledHr = /*#__PURE__*/_styled('hr', {
   shouldForwardProp: prop => !['direction', 'thickness', 'color', 'hasIcon'].includes(prop),
   target: "e1d1zom90"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "1.43.2",
+  "version": "1.44.0",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -39,7 +39,7 @@
     "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@babel/core": "7.24.0",
+    "@babel/core": "7.24.1",
     "@emotion/babel-plugin": "11.11.0",
     "@emotion/react": "11.11.4",
     "@emotion/styled": "11.11.0",
@@ -67,7 +67,7 @@
     "react-use-clipboard": "1.0.9",
     "reakit": "1.3.11",
     "@ultraviolet/themes": "1.9.0",
-    "@ultraviolet/icons": "2.10.1"
+    "@ultraviolet/icons": "2.11.0"
   },
   "scripts": {
     "build": "rollup -c ../../rollup.config.mjs",