@commercetools-uikit/design-system 19.18.0 → 19.19.0

package/dist/commercetools-uikit-design-system.cjs.dev.js

@@ -24,6 +24,7 @@ var _Object$fromEntries = require('@babel/runtime-corejs3/core-js-stable/object/
 var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
 var kebabCase = require('lodash/kebabCase');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+var react$1 = require('@emotion/react');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -662,12 +663,104 @@ const withThemeContext = WrappedComponent => {
   };
 };
 
+/* eslint-disable @typescript-eslint/no-unused-vars */
+const iconSizes = {
+  small: 12,
+  medium: 16,
+  big: 24,
+  '10': 12,
+  '20': 16,
+  '30': 20,
+  '40': 24
+};
+const getSizeDimensions = size => {
+  switch (size) {
+    case 'scale':
+      return {
+        width: '100%',
+        height: 'auto'
+      };
+    case 'small':
+    case 'medium':
+    case 'big':
+    case '10':
+    case '20':
+    case '30':
+    case '40':
+      return {
+        width: `${iconSizes[size]}px`,
+        height: `${iconSizes[size]}px`
+      };
+    default:
+      return {
+        width: `${iconSizes['40']}px`,
+        height: `${iconSizes['40']}px`
+      };
+  }
+};
+const getSizeStyle = size => {
+  const dimensions = getSizeDimensions(size);
+  switch (size) {
+    case 'scale':
+      return `
+        &:not(:root) {
+          width: ${dimensions.width};
+          height: ${dimensions.height};
+        }
+      `;
+    default:
+      return `
+        width: ${dimensions.width};
+        height: ${dimensions.height};
+      `;
+  }
+};
+const getColor = color => {
+  if (!color) return 'inherit';
+  let iconColor;
+  switch (color) {
+    case 'solid':
+      iconColor = designTokens$1.colorSolid;
+      break;
+    case 'neutral60':
+      iconColor = designTokens$1.colorNeutral60;
+      break;
+    case 'surface':
+      iconColor = designTokens$1.colorSurface;
+      break;
+    case 'info':
+      iconColor = designTokens$1.colorInfo;
+      break;
+    case 'primary':
+      iconColor = designTokens$1.colorPrimary;
+      break;
+    case 'primary40':
+      iconColor = designTokens$1.colorPrimary40;
+      break;
+    case 'warning':
+      iconColor = designTokens$1.colorWarning;
+      break;
+    case 'error':
+      iconColor = designTokens$1.colorError;
+      break;
+    case 'success':
+      iconColor = designTokens$1.colorSuccess;
+      break;
+  }
+  if (!iconColor) {
+    return 'inherit';
+  }
+  return iconColor;
+};
+const getIconStyles = props => /*#__PURE__*/react$1.css("*:not([fill='none']){fill:", getColor(props.color), ";}&,image{", getSizeStyle(props.size), ";}flex-shrink:0;" + (process.env.NODE_ENV === "production" ? "" : ";label:getIconStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24tdXRpbHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEd1RCIsImZpbGUiOiJpY29uLXV0aWxzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgQHR5cGVzY3JpcHQtZXNsaW50L25vLXVudXNlZC12YXJzICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgZGVzaWduVG9rZW5zIGZyb20gJy4vZGVzaWduLXRva2Vucyc7XG5cbmV4cG9ydCB0eXBlIFRJY29uUHJvcHMgPSB7XG4gIGNvbG9yPzpcbiAgICB8ICdzb2xpZCdcbiAgICB8ICduZXV0cmFsNjAnXG4gICAgfCAnc3VyZmFjZSdcbiAgICB8ICdpbmZvJ1xuICAgIHwgJ3ByaW1hcnknXG4gICAgfCAncHJpbWFyeTQwJ1xuICAgIHwgJ3dhcm5pbmcnXG4gICAgfCAnZXJyb3InXG4gICAgfCAnc3VjY2Vzcyc7XG4gIC8qKlxuICAgKiBUaGUgc2l6ZSBvZiB0aGUgaWNvbi4gJ3NtYWxsJywgJ21lZGl1bScsICdiaWcnIGhhdmUgYmVlbiBkZXByZWNhdGVkIGluIGZhdm9yIG9mICcxMCcsICcyMCcsICczMCcsICc0MCcuXG4gICAqL1xuICBzaXplPzogJ3NtYWxsJyB8ICdtZWRpdW0nIHwgJ2JpZycgfCAnc2NhbGUnIHwgJzEwJyB8ICcyMCcgfCAnMzAnIHwgJzQwJztcbn07XG5leHBvcnQgdHlwZSBUU1ZHUHJvcHMgPSBUSWNvblByb3BzICYgeyBjbGFzc05hbWU6IHN0cmluZyB9O1xuXG5jb25zdCBpY29uU2l6ZXMgPSB7XG4gIHNtYWxsOiAxMixcbiAgbWVkaXVtOiAxNixcbiAgYmlnOiAyNCxcbiAgJzEwJzogMTIsXG4gICcyMCc6IDE2LFxuICAnMzAnOiAyMCxcbiAgJzQwJzogMjQsXG59IGFzIGNvbnN0O1xuY29uc3QgZ2V0U2l6ZURpbWVuc2lvbnMgPSAoc2l6ZTogVEljb25Qcm9wc1snc2l6ZSddKSA9PiB7XG4gIHN3aXRjaCAoc2l6ZSkge1xuICAgIGNhc2UgJ3NjYWxlJzpcbiAgICAgIHJldHVybiB7IHdpZHRoOiAnMTAwJScsIGhlaWdodDogJ2F1dG8nIH07XG4gICAgY2FzZSAnc21hbGwnOlxuICAgIGNhc2UgJ21lZGl1bSc6XG4gICAgY2FzZSAnYmlnJzpcbiAgICBjYXNlICcxMCc6XG4gICAgY2FzZSAnMjAnOlxuICAgIGNhc2UgJzMwJzpcbiAgICBjYXNlICc0MCc6XG4gICAgICByZXR1cm4geyB3aWR0aDogYCR7aWNvblNpemVzW3NpemVdfXB4YCwgaGVpZ2h0OiBgJHtpY29uU2l6ZXNbc2l6ZV19cHhgIH07XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiB7IHdpZHRoOiBgJHtpY29uU2l6ZXNbJzQwJ119cHhgLCBoZWlnaHQ6IGAke2ljb25TaXplc1snNDAnXX1weGAgfTtcbiAgfVxufTtcbmNvbnN0IGdldFNpemVTdHlsZSA9IChzaXplOiBUSWNvblByb3BzWydzaXplJ10pID0+IHtcbiAgY29uc3QgZGltZW5zaW9ucyA9IGdldFNpemVEaW1lbnNpb25zKHNpemUpO1xuICBzd2l0Y2ggKHNpemUpIHtcbiAgICBjYXNlICdzY2FsZSc6XG4gICAgICByZXR1cm4gYFxuICAgICAgICAmOm5vdCg6cm9vdCkge1xuICAgICAgICAgIHdpZHRoOiAke2RpbWVuc2lvbnMud2lkdGh9O1xuICAgICAgICAgIGhlaWdodDogJHtkaW1lbnNpb25zLmhlaWdodH07XG4gICAgICAgIH1cbiAgICAgIGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiBgXG4gICAgICAgIHdpZHRoOiAke2RpbWVuc2lvbnMud2lkdGh9O1xuICAgICAgICBoZWlnaHQ6ICR7ZGltZW5zaW9ucy5oZWlnaHR9O1xuICAgICAgYDtcbiAgfVxufTtcblxuY29uc3QgZ2V0Q29sb3IgPSAoY29sb3I6IFRJY29uUHJvcHNbJ2NvbG9yJ10pID0+IHtcbiAgaWYgKCFjb2xvcikgcmV0dXJuICdpbmhlcml0JztcblxuICBsZXQgaWNvbkNvbG9yO1xuICBzd2l0Y2ggKGNvbG9yKSB7XG4gICAgY2FzZSAnc29saWQnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yU29saWQ7XG4gICAgICBicmVhaztcbiAgICBjYXNlICduZXV0cmFsNjAnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yTmV1dHJhbDYwO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnc3VyZmFjZSc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JTdXJmYWNlO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnaW5mbyc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JJbmZvO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAncHJpbWFyeSc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JQcmltYXJ5O1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAncHJpbWFyeTQwJzpcbiAgICAgIGljb25Db2xvciA9IGRlc2lnblRva2Vucy5jb2xvclByaW1hcnk0MDtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ3dhcm5pbmcnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yV2FybmluZztcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ2Vycm9yJzpcbiAgICAgIGljb25Db2xvciA9IGRlc2lnblRva2Vucy5jb2xvckVycm9yO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnc3VjY2Vzcyc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JTdWNjZXNzO1xuICAgICAgYnJlYWs7XG4gICAgZGVmYXVsdDpcbiAgICAgIGJyZWFrO1xuICB9XG5cbiAgaWYgKCFpY29uQ29sb3IpIHtcbiAgICByZXR1cm4gJ2luaGVyaXQnO1xuICB9XG5cbiAgcmV0dXJuIGljb25Db2xvcjtcbn07XG5cbmV4cG9ydCBjb25zdCBnZXRJY29uU3R5bGVzID0gKHByb3BzOiBUSWNvblByb3BzKSA9PiBjc3NgXG4gICo6bm90KFtmaWxsPSdub25lJ10pIHtcbiAgICBmaWxsOiAke2dldENvbG9yKHByb3BzLmNvbG9yKX07XG4gIH1cbiAgJixcbiAgaW1hZ2Uge1xuICAgICR7Z2V0U2l6ZVN0eWxlKHByb3BzLnNpemUpfTtcbiAgfVxuICBmbGV4LXNocmluazogMDtcbmA7XG4iXX0= */");
+
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.18.0";
+var version = "19.19.0";
 
 exports.ThemeProvider = ThemeProvider;
 exports.customProperties = designTokens$1;
 exports.designTokens = designTokens$1;
+exports.getIconStyles = getIconStyles;
 exports.themes = themes;
 exports.transformTokensToCssVarsReferences = transformTokensToCssVarsReferences;
 exports.transformTokensToCssVarsValues = transformTokensToCssVarsValues;

package/dist/commercetools-uikit-design-system.cjs.prod.js

@@ -24,6 +24,7 @@ var _Object$fromEntries = require('@babel/runtime-corejs3/core-js-stable/object/
 var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
 var kebabCase = require('lodash/kebabCase');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
+var react$1 = require('@emotion/react');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -662,12 +663,104 @@ const withThemeContext = WrappedComponent => {
   };
 };
 
+/* eslint-disable @typescript-eslint/no-unused-vars */
+const iconSizes = {
+  small: 12,
+  medium: 16,
+  big: 24,
+  '10': 12,
+  '20': 16,
+  '30': 20,
+  '40': 24
+};
+const getSizeDimensions = size => {
+  switch (size) {
+    case 'scale':
+      return {
+        width: '100%',
+        height: 'auto'
+      };
+    case 'small':
+    case 'medium':
+    case 'big':
+    case '10':
+    case '20':
+    case '30':
+    case '40':
+      return {
+        width: `${iconSizes[size]}px`,
+        height: `${iconSizes[size]}px`
+      };
+    default:
+      return {
+        width: `${iconSizes['40']}px`,
+        height: `${iconSizes['40']}px`
+      };
+  }
+};
+const getSizeStyle = size => {
+  const dimensions = getSizeDimensions(size);
+  switch (size) {
+    case 'scale':
+      return `
+        &:not(:root) {
+          width: ${dimensions.width};
+          height: ${dimensions.height};
+        }
+      `;
+    default:
+      return `
+        width: ${dimensions.width};
+        height: ${dimensions.height};
+      `;
+  }
+};
+const getColor = color => {
+  if (!color) return 'inherit';
+  let iconColor;
+  switch (color) {
+    case 'solid':
+      iconColor = designTokens$1.colorSolid;
+      break;
+    case 'neutral60':
+      iconColor = designTokens$1.colorNeutral60;
+      break;
+    case 'surface':
+      iconColor = designTokens$1.colorSurface;
+      break;
+    case 'info':
+      iconColor = designTokens$1.colorInfo;
+      break;
+    case 'primary':
+      iconColor = designTokens$1.colorPrimary;
+      break;
+    case 'primary40':
+      iconColor = designTokens$1.colorPrimary40;
+      break;
+    case 'warning':
+      iconColor = designTokens$1.colorWarning;
+      break;
+    case 'error':
+      iconColor = designTokens$1.colorError;
+      break;
+    case 'success':
+      iconColor = designTokens$1.colorSuccess;
+      break;
+  }
+  if (!iconColor) {
+    return 'inherit';
+  }
+  return iconColor;
+};
+const getIconStyles = props => /*#__PURE__*/react$1.css("*:not([fill='none']){fill:", getColor(props.color), ";}&,image{", getSizeStyle(props.size), ";}flex-shrink:0;" + ("" ), "" );
+
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.18.0";
+var version = "19.19.0";
 
 exports.ThemeProvider = ThemeProvider;
 exports.customProperties = designTokens$1;
 exports.designTokens = designTokens$1;
+exports.getIconStyles = getIconStyles;
 exports.themes = themes;
 exports.transformTokensToCssVarsReferences = transformTokensToCssVarsReferences;
 exports.transformTokensToCssVarsValues = transformTokensToCssVarsValues;

package/dist/commercetools-uikit-design-system.esm.js

@@ -20,6 +20,7 @@ import _Object$fromEntries from '@babel/runtime-corejs3/core-js-stable/object/fr
 import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
 import kebabCase from 'lodash/kebabCase';
 import { jsx } from '@emotion/react/jsx-runtime';
+import { css } from '@emotion/react';
 
 /*
   THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
@@ -638,7 +639,98 @@ const withThemeContext = WrappedComponent => {
   };
 };
 
+/* eslint-disable @typescript-eslint/no-unused-vars */
+const iconSizes = {
+  small: 12,
+  medium: 16,
+  big: 24,
+  '10': 12,
+  '20': 16,
+  '30': 20,
+  '40': 24
+};
+const getSizeDimensions = size => {
+  switch (size) {
+    case 'scale':
+      return {
+        width: '100%',
+        height: 'auto'
+      };
+    case 'small':
+    case 'medium':
+    case 'big':
+    case '10':
+    case '20':
+    case '30':
+    case '40':
+      return {
+        width: `${iconSizes[size]}px`,
+        height: `${iconSizes[size]}px`
+      };
+    default:
+      return {
+        width: `${iconSizes['40']}px`,
+        height: `${iconSizes['40']}px`
+      };
+  }
+};
+const getSizeStyle = size => {
+  const dimensions = getSizeDimensions(size);
+  switch (size) {
+    case 'scale':
+      return `
+        &:not(:root) {
+          width: ${dimensions.width};
+          height: ${dimensions.height};
+        }
+      `;
+    default:
+      return `
+        width: ${dimensions.width};
+        height: ${dimensions.height};
+      `;
+  }
+};
+const getColor = color => {
+  if (!color) return 'inherit';
+  let iconColor;
+  switch (color) {
+    case 'solid':
+      iconColor = designTokens$1.colorSolid;
+      break;
+    case 'neutral60':
+      iconColor = designTokens$1.colorNeutral60;
+      break;
+    case 'surface':
+      iconColor = designTokens$1.colorSurface;
+      break;
+    case 'info':
+      iconColor = designTokens$1.colorInfo;
+      break;
+    case 'primary':
+      iconColor = designTokens$1.colorPrimary;
+      break;
+    case 'primary40':
+      iconColor = designTokens$1.colorPrimary40;
+      break;
+    case 'warning':
+      iconColor = designTokens$1.colorWarning;
+      break;
+    case 'error':
+      iconColor = designTokens$1.colorError;
+      break;
+    case 'success':
+      iconColor = designTokens$1.colorSuccess;
+      break;
+  }
+  if (!iconColor) {
+    return 'inherit';
+  }
+  return iconColor;
+};
+const getIconStyles = props => /*#__PURE__*/css("*:not([fill='none']){fill:", getColor(props.color), ";}&,image{", getSizeStyle(props.size), ";}flex-shrink:0;" + (process.env.NODE_ENV === "production" ? "" : ";label:getIconStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImljb24tdXRpbHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEd1RCIsImZpbGUiOiJpY29uLXV0aWxzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyogZXNsaW50LWRpc2FibGUgQHR5cGVzY3JpcHQtZXNsaW50L25vLXVudXNlZC12YXJzICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgZGVzaWduVG9rZW5zIGZyb20gJy4vZGVzaWduLXRva2Vucyc7XG5cbmV4cG9ydCB0eXBlIFRJY29uUHJvcHMgPSB7XG4gIGNvbG9yPzpcbiAgICB8ICdzb2xpZCdcbiAgICB8ICduZXV0cmFsNjAnXG4gICAgfCAnc3VyZmFjZSdcbiAgICB8ICdpbmZvJ1xuICAgIHwgJ3ByaW1hcnknXG4gICAgfCAncHJpbWFyeTQwJ1xuICAgIHwgJ3dhcm5pbmcnXG4gICAgfCAnZXJyb3InXG4gICAgfCAnc3VjY2Vzcyc7XG4gIC8qKlxuICAgKiBUaGUgc2l6ZSBvZiB0aGUgaWNvbi4gJ3NtYWxsJywgJ21lZGl1bScsICdiaWcnIGhhdmUgYmVlbiBkZXByZWNhdGVkIGluIGZhdm9yIG9mICcxMCcsICcyMCcsICczMCcsICc0MCcuXG4gICAqL1xuICBzaXplPzogJ3NtYWxsJyB8ICdtZWRpdW0nIHwgJ2JpZycgfCAnc2NhbGUnIHwgJzEwJyB8ICcyMCcgfCAnMzAnIHwgJzQwJztcbn07XG5leHBvcnQgdHlwZSBUU1ZHUHJvcHMgPSBUSWNvblByb3BzICYgeyBjbGFzc05hbWU6IHN0cmluZyB9O1xuXG5jb25zdCBpY29uU2l6ZXMgPSB7XG4gIHNtYWxsOiAxMixcbiAgbWVkaXVtOiAxNixcbiAgYmlnOiAyNCxcbiAgJzEwJzogMTIsXG4gICcyMCc6IDE2LFxuICAnMzAnOiAyMCxcbiAgJzQwJzogMjQsXG59IGFzIGNvbnN0O1xuY29uc3QgZ2V0U2l6ZURpbWVuc2lvbnMgPSAoc2l6ZTogVEljb25Qcm9wc1snc2l6ZSddKSA9PiB7XG4gIHN3aXRjaCAoc2l6ZSkge1xuICAgIGNhc2UgJ3NjYWxlJzpcbiAgICAgIHJldHVybiB7IHdpZHRoOiAnMTAwJScsIGhlaWdodDogJ2F1dG8nIH07XG4gICAgY2FzZSAnc21hbGwnOlxuICAgIGNhc2UgJ21lZGl1bSc6XG4gICAgY2FzZSAnYmlnJzpcbiAgICBjYXNlICcxMCc6XG4gICAgY2FzZSAnMjAnOlxuICAgIGNhc2UgJzMwJzpcbiAgICBjYXNlICc0MCc6XG4gICAgICByZXR1cm4geyB3aWR0aDogYCR7aWNvblNpemVzW3NpemVdfXB4YCwgaGVpZ2h0OiBgJHtpY29uU2l6ZXNbc2l6ZV19cHhgIH07XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiB7IHdpZHRoOiBgJHtpY29uU2l6ZXNbJzQwJ119cHhgLCBoZWlnaHQ6IGAke2ljb25TaXplc1snNDAnXX1weGAgfTtcbiAgfVxufTtcbmNvbnN0IGdldFNpemVTdHlsZSA9IChzaXplOiBUSWNvblByb3BzWydzaXplJ10pID0+IHtcbiAgY29uc3QgZGltZW5zaW9ucyA9IGdldFNpemVEaW1lbnNpb25zKHNpemUpO1xuICBzd2l0Y2ggKHNpemUpIHtcbiAgICBjYXNlICdzY2FsZSc6XG4gICAgICByZXR1cm4gYFxuICAgICAgICAmOm5vdCg6cm9vdCkge1xuICAgICAgICAgIHdpZHRoOiAke2RpbWVuc2lvbnMud2lkdGh9O1xuICAgICAgICAgIGhlaWdodDogJHtkaW1lbnNpb25zLmhlaWdodH07XG4gICAgICAgIH1cbiAgICAgIGA7XG4gICAgZGVmYXVsdDpcbiAgICAgIHJldHVybiBgXG4gICAgICAgIHdpZHRoOiAke2RpbWVuc2lvbnMud2lkdGh9O1xuICAgICAgICBoZWlnaHQ6ICR7ZGltZW5zaW9ucy5oZWlnaHR9O1xuICAgICAgYDtcbiAgfVxufTtcblxuY29uc3QgZ2V0Q29sb3IgPSAoY29sb3I6IFRJY29uUHJvcHNbJ2NvbG9yJ10pID0+IHtcbiAgaWYgKCFjb2xvcikgcmV0dXJuICdpbmhlcml0JztcblxuICBsZXQgaWNvbkNvbG9yO1xuICBzd2l0Y2ggKGNvbG9yKSB7XG4gICAgY2FzZSAnc29saWQnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yU29saWQ7XG4gICAgICBicmVhaztcbiAgICBjYXNlICduZXV0cmFsNjAnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yTmV1dHJhbDYwO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnc3VyZmFjZSc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JTdXJmYWNlO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnaW5mbyc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JJbmZvO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAncHJpbWFyeSc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JQcmltYXJ5O1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAncHJpbWFyeTQwJzpcbiAgICAgIGljb25Db2xvciA9IGRlc2lnblRva2Vucy5jb2xvclByaW1hcnk0MDtcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ3dhcm5pbmcnOlxuICAgICAgaWNvbkNvbG9yID0gZGVzaWduVG9rZW5zLmNvbG9yV2FybmluZztcbiAgICAgIGJyZWFrO1xuICAgIGNhc2UgJ2Vycm9yJzpcbiAgICAgIGljb25Db2xvciA9IGRlc2lnblRva2Vucy5jb2xvckVycm9yO1xuICAgICAgYnJlYWs7XG4gICAgY2FzZSAnc3VjY2Vzcyc6XG4gICAgICBpY29uQ29sb3IgPSBkZXNpZ25Ub2tlbnMuY29sb3JTdWNjZXNzO1xuICAgICAgYnJlYWs7XG4gICAgZGVmYXVsdDpcbiAgICAgIGJyZWFrO1xuICB9XG5cbiAgaWYgKCFpY29uQ29sb3IpIHtcbiAgICByZXR1cm4gJ2luaGVyaXQnO1xuICB9XG5cbiAgcmV0dXJuIGljb25Db2xvcjtcbn07XG5cbmV4cG9ydCBjb25zdCBnZXRJY29uU3R5bGVzID0gKHByb3BzOiBUSWNvblByb3BzKSA9PiBjc3NgXG4gICo6bm90KFtmaWxsPSdub25lJ10pIHtcbiAgICBmaWxsOiAke2dldENvbG9yKHByb3BzLmNvbG9yKX07XG4gIH1cbiAgJixcbiAgaW1hZ2Uge1xuICAgICR7Z2V0U2l6ZVN0eWxlKHByb3BzLnNpemUpfTtcbiAgfVxuICBmbGV4LXNocmluazogMDtcbmA7XG4iXX0= */");
+
 // NOTE: This string will be replaced on build time with the package version.
-var version = "19.18.0";
+var version = "19.19.0";
 
-export { ThemeProvider, designTokens$1 as customProperties, designTokens$1 as designTokens, themes, transformTokensToCssVarsReferences, transformTokensToCssVarsValues, useTheme, version, withThemeContext };
+export { ThemeProvider, designTokens$1 as customProperties, designTokens$1 as designTokens, getIconStyles, themes, transformTokensToCssVarsReferences, transformTokensToCssVarsValues, useTheme, version, withThemeContext };

package/dist/declarations/src/icon-utils.d.ts

@@ -0,0 +1,11 @@
+export type TIconProps = {
+    color?: 'solid' | 'neutral60' | 'surface' | 'info' | 'primary' | 'primary40' | 'warning' | 'error' | 'success';
+    /**
+     * The size of the icon. 'small', 'medium', 'big' have been deprecated in favor of '10', '20', '30', '40'.
+     */
+    size?: 'small' | 'medium' | 'big' | 'scale' | '10' | '20' | '30' | '40';
+};
+export type TSVGProps = TIconProps & {
+    className: string;
+};
+export declare const getIconStyles: (props: TIconProps) => import("@emotion/react").SerializedStyles;

package/dist/declarations/src/index.d.ts

@@ -4,4 +4,5 @@ default as customProperties, themes, } from "./design-tokens.js";
 export { ThemeProvider, useTheme, withThemeContext } from "./theme-provider.js";
 export * from "./export-types.js";
 export * from "./utils.js";
+export * from "./icon-utils.js";
 export { default as version } from "./version.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@commercetools-uikit/design-system",
   "description": "Core package of the commercetools design system.",
-  "version": "19.18.0",
+  "version": "19.19.0",
   "bugs": "https://github.com/commercetools/ui-kit/issues",
   "repository": {
     "type": "git",
@@ -25,7 +25,7 @@
   "dependencies": {
     "@babel/runtime": "^7.20.13",
     "@babel/runtime-corejs3": "^7.20.13",
-    "@commercetools-uikit/hooks": "19.18.0",
+    "@commercetools-uikit/hooks": "19.19.0",
     "@emotion/react": "^11.10.5",
     "lodash": "4.17.21",
     "prop-types": "15.8.1",