@ultraviolet/ui 1.28.0 → 1.29.1

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

@@ -26,11 +26,10 @@ const PROMINENCES = {
 /**
  * Generate all styles available for badge based on prominence and sentiments
  */
-const generateStyles = _ref => {
-  let {
-    prominence,
-    theme
-  } = _ref;
+const generateStyles = ({
+  prominence,
+  theme
+}) => {
   const definedProminence = prominence === PROMINENCES.strong ? capitalize(PROMINENCES.strong) : '';
   const text = `text${definedProminence}`;
   const background = `background${definedProminence}`;
@@ -58,53 +57,34 @@ const generateStyles = _ref => {
 const StyledSpan = /*#__PURE__*/_styled(Text, {
   shouldForwardProp: prop => !['sentimentStyles', 'size', 'fontSize'].includes(prop),
   target: "ej33bna0"
-})("display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:", _ref2 => {
-  let {
-    theme
-  } = _ref2;
-  return theme.radii.xlarge;
-}, ";padding:0 ", _ref3 => {
-  let {
-    theme,
-    size
-  } = _ref3;
-  return size === SIZES.small ? theme.space['1'] : theme.space['2'];
-}, ";gap:", _ref4 => {
-  let {
-    theme,
-    size
-  } = _ref4;
-  return size === SIZES.small ? theme.space['0.5'] : theme.space['1'];
-}, ";width:fit-content;height:", _ref5 => {
-  let {
-    size
-  } = _ref5;
-  return size;
-}, "px;text-transform:uppercase;font-size:", _ref6 => {
-  let {
-    fontSize
-  } = _ref6;
-  return fontSize;
-}, "px;color:inherit;", _ref7 => {
-  let {
-    sentimentStyles
-  } = _ref7;
-  return sentimentStyles;
-}, ";");
+})("display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:", ({
+  theme
+}) => theme.radii.xlarge, ";padding:0 ", ({
+  theme,
+  size
+}) => size === SIZES.small ? theme.space['1'] : theme.space['2'], ";gap:", ({
+  theme,
+  size
+}) => size === SIZES.small ? theme.space['0.5'] : theme.space['1'], ";width:fit-content;height:", ({
+  size
+}) => size, "px;text-transform:uppercase;font-size:", ({
+  fontSize
+}) => fontSize, "px;color:inherit;", ({
+  sentimentStyles
+}) => sentimentStyles, ";");
 /**
  * Badge component is used to display a status or a label in a small container.
  */
-const Badge = _ref8 => {
-  let {
-    sentiment = 'neutral',
-    size = 'medium',
-    prominence = 'default',
-    icon,
-    disabled = false,
-    className,
-    children,
-    'data-testid': dataTestId
-  } = _ref8;
+const Badge = ({
+  sentiment = 'neutral',
+  size = 'medium',
+  prominence = 'default',
+  icon,
+  disabled = false,
+  className,
+  children,
+  'data-testid': dataTestId
+}) => {
   const theme = useTheme();
 
   /**

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

@@ -9,12 +9,11 @@ import defaultIllustrationSmall from './assets/default-image-small.svg.js';
 import defaultIllustration from './assets/default-image.svg.js';
 import { jsxs, jsx } from '@emotion/react/jsx-runtime';
 
-const styles = _ref => {
-  let {
-    theme,
-    variant,
-    size
-  } = _ref;
+const styles = ({
+  theme,
+  variant,
+  size
+}) => {
   if (size === 'small') {
     if (variant === 'intro') {
       return /*#__PURE__*/css("background:", theme.colors.primary.background, ";background-position:left,right;background-repeat:no-repeat,no-repeat;background-size:contain,contain;");
@@ -36,68 +35,49 @@ const styles = _ref => {
 const Container = /*#__PURE__*/_styled('div', {
   shouldForwardProp: prop => !['variant', 'size', 'padding'].includes(prop),
   target: "e1kdwp5x1"
-})("padding:", _ref2 => {
-  let {
-    theme,
-    size
-  } = _ref2;
-  return theme.space[size === 'small' ? '2' : '3'];
-}, ";border-radius:", _ref3 => {
-  let {
-    theme
-  } = _ref3;
-  return theme.radii.large;
-}, ";display:flex;flex-direction:row;justify-content:space-between;gap:", _ref4 => {
-  let {
-    theme
-  } = _ref4;
-  return theme.space['2'];
-}, ";", _ref5 => {
-  let {
-    theme,
-    variant,
-    size
-  } = _ref5;
-  return styles({
-    theme,
-    variant,
-    size
-  });
-}, ";>svg:first-child,>img{height:", _ref6 => {
-  let {
-    size
-  } = _ref6;
-  return size === 'medium' ? '140px' : '100px';
-}, ";align-self:center;}button[name='close']{background:none;&:hover{background:none;}}");
+})("padding:", ({
+  theme,
+  size
+}) => theme.space[size === 'small' ? '2' : '3'], ";border-radius:", ({
+  theme
+}) => theme.radii.large, ";display:flex;flex-direction:row;justify-content:space-between;gap:", ({
+  theme
+}) => theme.space['2'], ";", ({
+  theme,
+  variant,
+  size
+}) => styles({
+  theme,
+  variant,
+  size
+}), ";>svg:first-child,>img{height:", ({
+  size
+}) => size === 'medium' ? '140px' : '100px', ";align-self:center;}button[name='close']{background:none;&:hover{background:none;}}");
 const ImageStack = /*#__PURE__*/_styled(Stack, {
   shouldForwardProp: prop => !['size'].includes(prop),
   target: "e1kdwp5x0"
-})("width:", _ref7 => {
-  let {
-    size
-  } = _ref7;
-  return size === 'medium' ? '140px' : '74px';
-}, ";");
+})("width:", ({
+  size
+}) => size === 'medium' ? '140px' : '74px', ";");
 /**
  * Banner component is used to display an informative message to the user with style.
  */
-const Banner = _ref8 => {
-  let {
-    variant = 'intro',
-    size = 'medium',
-    title,
-    children,
-    direction = 'column',
-    onClose,
-    buttonText,
-    onClickButton,
-    linkText,
-    linkHref,
-    image,
-    className,
-    closable = true,
-    'data-testid': dataTestId
-  } = _ref8;
+const Banner = ({
+  variant = 'intro',
+  size = 'medium',
+  title,
+  children,
+  direction = 'column',
+  onClose,
+  buttonText,
+  onClickButton,
+  linkText,
+  linkHref,
+  image,
+  className,
+  closable = true,
+  'data-testid': dataTestId
+}) => {
   const {
     theme
   } = useTheme();

package/dist/src/components/BarChart/Tooltip.js

@@ -4,60 +4,45 @@ import { jsxs, jsx } from '@emotion/react/jsx-runtime';
 
 const BarToolTipContainer = /*#__PURE__*/_styled("div", {
   target: "e1ilr3nn1"
-})("display:flex;background:", _ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.colors.neutral.backgroundWeakElevated;
-}, ";border-radius:", _ref2 => {
-  let {
-    theme
-  } = _ref2;
-  return theme.radii.small;
-}, ";box-shadow:", _ref3 => {
-  let {
-    theme
-  } = _ref3;
-  return theme.shadows.tooltip;
-}, ";padding:5px 9px;align-items:center;");
+})("display:flex;background:", ({
+  theme
+}) => theme.colors.neutral.backgroundWeakElevated, ";border-radius:", ({
+  theme
+}) => theme.radii.small, ";box-shadow:", ({
+  theme
+}) => theme.shadows.tooltip, ";padding:5px 9px;align-items:center;");
 const BarColorSquare = /*#__PURE__*/_styled('span', {
   shouldForwardProp: prop => !['color'].includes(prop),
   target: "e1ilr3nn0"
-})("display:block;width:12px;height:12px;background:", _ref4 => {
-  let {
-    color
-  } = _ref4;
-  return color;
-}, ";margin-right:12px;");
-const BarChartToolTip = _ref5 => {
-  let {
-    formattedValue,
-    indexValue,
-    color,
-    className,
-    'data-testid': dataTestId
-  } = _ref5;
-  return jsxs(BarToolTipContainer, {
-    className: className,
-    "data-testid": dataTestId,
-    children: [jsx("div", {
-      children: jsx(BarColorSquare, {
-        color: color
-      })
-    }), jsxs("div", {
-      children: [jsx(Text, {
-        variant: "bodyStronger",
-        as: "p",
-        sentiment: "primary",
-        children: formattedValue
-      }), jsx(Text, {
-        variant: "bodySmall",
-        as: "p",
-        children: indexValue
-      })]
+})("display:block;width:12px;height:12px;background:", ({
+  color
+}) => color, ";margin-right:12px;");
+const BarChartToolTip = ({
+  formattedValue,
+  indexValue,
+  color,
+  className,
+  'data-testid': dataTestId
+}) => jsxs(BarToolTipContainer, {
+  className: className,
+  "data-testid": dataTestId,
+  children: [jsx("div", {
+    children: jsx(BarColorSquare, {
+      color: color
+    })
+  }), jsxs("div", {
+    children: [jsx(Text, {
+      variant: "bodyStronger",
+      as: "p",
+      sentiment: "primary",
+      children: formattedValue
+    }), jsx(Text, {
+      variant: "bodySmall",
+      as: "p",
+      children: indexValue
     })]
-  });
-};
+  })]
+});
 var BarChartTooltip = BarChartToolTip;
 
 export { BarChartTooltip as default };

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

@@ -20,20 +20,19 @@ const DEFAULT_KEYS = ['value'];
  * See https://nivo.rocks/bar/ for more information.
  * @experimental This component is experimental and may be subject to breaking changes in the future.
  */
-const BarChart = _ref => {
-  let {
-    height = '537px',
-    // to maintain aspect ratio based on our standard 1074px width,
-    margin = DEFAULT_MARGIN,
-    data = DEFAULT_DATA,
-    axisFormatters = DEFAULT_AXISFORMATTER,
-    tickValues,
-    keys = DEFAULT_KEYS,
-    tooltipFunction,
-    chartProps,
-    className,
-    'data-testid': dataTestId
-  } = _ref;
+const BarChart = ({
+  height = '537px',
+  // to maintain aspect ratio based on our standard 1074px width,
+  margin = DEFAULT_MARGIN,
+  data = DEFAULT_DATA,
+  axisFormatters = DEFAULT_AXISFORMATTER,
+  tickValues,
+  keys = DEFAULT_KEYS,
+  tooltipFunction,
+  chartProps,
+  className,
+  'data-testid': dataTestId
+}) => {
   const theme = useTheme();
   const chartTheme = {
     axis: {