@ultraviolet/ui 1.8.2 → 1.8.4

package/dist/index.d.ts

@@ -717,8 +717,8 @@ declare const extendTheme: (extendedTheme: RecursivePartial<SCWUITheme>) => {
         xlarge: number;
     };
 };
-type Color = Extract<keyof typeof consoleLightTheme.colors, 'primary' | 'neutral' | 'success' | 'danger' | 'warning' | 'info'>;
-declare const SENTIMENTS: readonly ["primary", "neutral", "success", "danger", "warning", "info"];
+type Color = Extract<keyof typeof consoleLightTheme.colors, 'primary' | 'secondary' | 'neutral' | 'success' | 'danger' | 'warning' | 'info'>;
+declare const SENTIMENTS: readonly ["primary", "secondary", "neutral", "success", "danger", "warning", "info"];
 
 type SENTIMENT = (typeof SENTIMENTS)[number];
 declare const SIZE_HEIGHT: {
@@ -1285,7 +1285,7 @@ declare const List: react.ForwardRefExoticComponent<ListProps & react.RefAttribu
         expandable?: ReactNode;
         selectDisabled?: string | boolean | undefined;
         disabled?: boolean | undefined;
-        sentiment?: "primary" | "neutral" | "success" | "danger" | "warning" | "info" | undefined;
+        sentiment?: "primary" | "secondary" | "neutral" | "success" | "danger" | "warning" | "info" | undefined;
         className?: string | undefined;
         'data-testid'?: string | undefined;
     } & react.RefAttributes<HTMLDivElement>>;
@@ -2181,7 +2181,11 @@ type TextProps = {
     children: ReactNode;
     placement?: PlacementProps;
     variant: TextVariant;
+    /**
+     * @deprecated: use `sentiment` property instead
+     */
     color?: Color;
+    sentiment?: Color;
     prominence?: ProminenceProps;
     as: ElementType;
     oneLine?: boolean;
@@ -2193,7 +2197,7 @@ type TextProps = {
     htmlFor?: string;
     'data-testid'?: string;
 };
-declare const Text: ({ variant, children, as, color, oneLine, placement, prominence, className, disabled, italic, underline, id, dir, htmlFor, "data-testid": dataTestId, }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
+declare const Text: ({ variant, children, as, color, sentiment, oneLine, placement, prominence, className, disabled, italic, underline, id, dir, htmlFor, "data-testid": dataTestId, }: TextProps) => _emotion_react_jsx_runtime.JSX.Element;
 
 declare const inputSizes: {
     medium: {

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

@@ -31,6 +31,8 @@ const FOCUS_RING_KEY = {
   info: 'focusInfo',
   neutral: 'focusNeutral',
   primary: 'focusPrimary',
+  // @note: no focusSecondary so far, it will be added later, so far focusPrimary sounds fine
+  secondary: 'focusPrimary',
   success: 'focusSuccess',
   warning: 'focusWarning'
 };

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

@@ -19,7 +19,7 @@ const generateStyles = _ref => {
   let {
     placement,
     prominence,
-    color,
+    sentiment,
     variant,
     theme,
     oneLine,
@@ -27,12 +27,12 @@ const generateStyles = _ref => {
     italic,
     underline
   } = _ref;
-  // stronger is available only for neutral color
-  const definedProminence = color !== 'neutral' && prominence === 'stronger' ? capitalize(PROMINENCES.default) : capitalize(PROMINENCES[prominence]);
-  theme.colors[color];
+  // stronger is available only for neutral sentiment
+  const definedProminence = sentiment !== 'neutral' && prominence === 'stronger' ? capitalize(PROMINENCES.default) : capitalize(PROMINENCES[prominence]);
+  theme.colors[sentiment];
   const text = `text${definedProminence}${disabled ? 'Disabled' : ''}`;
   return `
-    color: ${theme.colors[color][text]};
+    color: ${theme.colors[sentiment][text]};
 
     font-size: ${theme.typography[variant].fontSize};
     font-family: ${theme.typography[variant].fontFamily};
@@ -51,7 +51,7 @@ const generateStyles = _ref => {
   `;
 };
 const StyledText = /*#__PURE__*/_styled('div', {
-  shouldForwardProp: prop => !['as', 'placement', 'variant', 'color', 'prominence', 'oneLine', 'disabled', 'italic', 'underline'].includes(prop),
+  shouldForwardProp: prop => !['as', 'placement', 'variant', 'sentiment', 'prominence', 'oneLine', 'disabled', 'italic', 'underline'].includes(prop),
   target: "e13y3mga0"
 })(generateStyles);
 const Text = _ref2 => {
@@ -59,7 +59,8 @@ const Text = _ref2 => {
     variant,
     children,
     as,
-    color = 'neutral',
+    color,
+    sentiment,
     oneLine = false,
     placement,
     prominence = 'default',
@@ -72,6 +73,7 @@ const Text = _ref2 => {
     htmlFor,
     'data-testid': dataTestId
   } = _ref2;
+  const computedSentiment = sentiment ?? color ?? 'neutral';
   const [isTruncated, setIsTruncated] = useState(false);
   const elementRef = useRef(null);
   const finalStringChildren = recursivelyGetChildrenString(children);
@@ -91,7 +93,7 @@ const Text = _ref2 => {
       as: as,
       placement: placement,
       prominence: prominence,
-      color: color,
+      sentiment: computedSentiment,
       variant: variant,
       oneLine: oneLine,
       className: className,

package/dist/src/theme/index.js

@@ -17,9 +17,9 @@ const {
  */
 const extendTheme = extendedTheme => deepmerge(consoleLightTheme, extendedTheme);
 
-// This type exclude overlay and secondary color
+// This type exclude overlay color
 
-const SENTIMENTS = ['primary', 'neutral', 'success', 'danger', 'warning', 'info'];
+const SENTIMENTS = ['primary', 'secondary', 'neutral', 'success', 'danger', 'warning', 'info'];
 const SENTIMENTS_WITHOUT_NEUTRAL = /*#__PURE__*/SENTIMENTS.filter(sentiment => sentiment !== 'neutral');
 
 export { SENTIMENTS, SENTIMENTS_WITHOUT_NEUTRAL, colors, extendTheme, radii, screens, shadows, space, typography };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ultraviolet/ui",
-  "version": "1.8.2",
+  "version": "1.8.4",
   "description": "Ultraviolet UI",
   "homepage": "https://github.com/scaleway/ultraviolet#readme",
   "repository": {
@@ -44,7 +44,7 @@
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
     "@types/react": "18.2.8",
-    "@types/react-datepicker": "4.11.2",
+    "@types/react-datepicker": "4.15.0",
     "@types/react-dom": "18.2.4",
     "react": "18.2.0",
     "react-dom": "18.2.0"
@@ -68,6 +68,6 @@
     "react-use-clipboard": "1.0.9",
     "reakit": "1.3.11",
     "@ultraviolet/themes": "1.2.1",
-    "@ultraviolet/icons": "1.2.2"
+    "@ultraviolet/icons": "1.2.3"
   }
 }