@ultraviolet/ui 1.35.0 → 1.36.0

package/dist/index.d.ts

@@ -2690,12 +2690,13 @@ declare const Table: react.ForwardRefExoticComponent<TableProps & react.RefAttri
     Body: ({ children }: {
         children: ReactNode;
     }) => _emotion_react_jsx_runtime.JSX.Element;
-    Row: ({ children, className, id, selectDisabled, "data-testid": dataTestid, }: {
+    Row: ({ children, className, id, selectDisabled, highlightAnimation, "data-testid": dataTestid, }: {
         children: ReactNode;
         className?: string | undefined;
         id: string;
         'data-testid'?: string | undefined;
         selectDisabled?: string | boolean | undefined;
+        highlightAnimation?: boolean | undefined;
     }) => _emotion_react_jsx_runtime.JSX.Element;
     Cell: ({ children, className, colSpan, rowSpan }: {
         children?: ReactNode;

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

@@ -13,11 +13,11 @@ const contractString = str => {
 const StyledOl = /*#__PURE__*/_styled("ol", {
   target: "ej0p0s41"
 })(process.env.NODE_ENV === "production" ? {
-  name: "55j7or",
-  styles: "list-style:none;margin:0;padding:0;display:flex;align-items:center"
+  name: "105zz11",
+  styles: "list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center"
 } : {
-  name: "55j7or",
-  styles: "list-style:none;margin:0;padding:0;display:flex;align-items:center",
+  name: "105zz11",
+  styles: "list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const ItemContainer = /*#__PURE__*/_styled("li", {

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

@@ -1,4 +1,5 @@
 import _styled from '@emotion/styled/base';
+import { keyframes } from '@emotion/react';
 import { useEffect } from 'react';
 import { Checkbox } from '../Checkbox/index.js';
 import { Tooltip } from '../Tooltip/index.js';
@@ -6,16 +7,41 @@ import { Cell } from './Cell.js';
 import { useTableContext } from './TableContext.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 StyledCheckboxContainer = /*#__PURE__*/_styled("div", {
+  target: "e1qvrbgq1"
+})(process.env.NODE_ENV === "production" ? {
+  name: "zjik7",
+  styles: "display:flex"
+} : {
+  name: "zjik7",
+  styles: "display:flex",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+});
+
+// We start at 5% and finish at 80% to leave the original background color
+// as we can't know if the table will be stripped or not
+const colorChange = theme => keyframes`
+  5% {
+    background-color: ${theme.colors.primary.background};
+  }
+  80% {
+    background-color: ${theme.colors.primary.background};
+  }
+`;
+const StyledTr = /*#__PURE__*/_styled('tr', {
+  shouldForwardProp: prop => !['highlightAnimation'].includes(prop),
   target: "e1qvrbgq0"
-})("display:flex;background:", ({
+})("animation:", ({
+  highlightAnimation,
   theme
-}) => theme.colors.neutral.background, ";");
+}) => highlightAnimation ? colorChange(theme) : undefined, " 3s linear;");
 const Row = ({
   children,
   className,
   id,
   selectDisabled,
+  highlightAnimation,
   'data-testid': dataTestid
 }) => {
   const {
@@ -33,9 +59,10 @@ const Row = ({
     }
     return undefined;
   }, [id, registerSelectableRow, selectDisabled]);
-  return jsxs("tr", {
+  return jsxs(StyledTr, {
     className: className,
     "data-testid": dataTestid,
+    highlightAnimation: highlightAnimation,
     children: [selectable ? jsx(Cell, {
       children: jsx(StyledCheckboxContainer, {
         "data-visibility": allRowSelectValue === false ? 'hover' : undefined,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "1.35.0",
+  "version": "1.36.0",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {