@uniformdev/design-system 20.39.3-alpha.1 → 20.39.3-alpha.11

package/dist/esm/index.js

@@ -2275,7 +2275,15 @@ var IconInner = ({ icon, iconColor = "default", size = "1.5rem", ...otherProps }
     );
     return null;
   }
-  return /* @__PURE__ */ jsx16(IconComponent, { role: "img", size, ...otherProps, css: [IconImg, customColor[iconColor]] });
+  return /* @__PURE__ */ jsx16(
+    IconComponent,
+    {
+      role: "img",
+      size,
+      ...otherProps,
+      css: [IconImg, iconColor ? functionalColors : void 0, customColor[iconColor]]
+    }
+  );
 };
 var Icon = React3.memo(IconInner);
 
@@ -7103,12 +7111,13 @@ var Counter = ({
   if (typeof count === "undefined") {
     return null;
   }
-  const isTripleDigits = count > 99 ? /* @__PURE__ */ jsxs39("span", { css: counterTripleValue, title: `${count}`, children: [
+  const isNumber = typeof count === "number";
+  const isTripleDigits = isNumber && count > 99 ? /* @__PURE__ */ jsxs39("span", { css: counterTripleValue, title: `${count}`, children: [
     "99",
     /* @__PURE__ */ jsx60(Icon, { icon: "math-plus", iconColor: "currentColor", size: "0.5rem", css: counterIcon.tripleValue })
   ] }) : count;
   const formatCount = count === 0 ? /* @__PURE__ */ jsx60("span", { css: counterZeroValue, title: `${count}` }) : isTripleDigits;
-  return /* @__PURE__ */ jsxs39("div", { css: [counterContainer(bgColor, Boolean(icon)), sizeStyles[size]], ...props, children: [
+  return /* @__PURE__ */ jsxs39("div", { css: [counterContainer(bgColor, Boolean(icon || !isNumber)), sizeStyles[size]], ...props, children: [
     icon ? /* @__PURE__ */ jsx60(
       "span",
       {

package/dist/index.d.mts

@@ -1502,8 +1502,10 @@ declare const MultilineChip: ({ children, onClick, ...props }: MultilineChipProp
 type CounterBgColors = 'var(--white)' | 'var(--gray-50)' | 'var(--accent-light)' | 'var(--accent-dark)' | 'transparent';
 type CounterIconColors = 'auto' | 'var(--utility-caution-icon)' | 'var(--utility-danger-icon)' | 'var(--utility-info-icon)' | 'var(--utility-success-icon)' | 'red';
 type CounterProps = {
-    /** sets the count value, a 0 will show a dot instead of a number. Undefined will cause the counter to disappear. */
-    count: number | undefined;
+    /** sets the count value, a 0 will show a dot instead of a number. Undefined will cause the counter to disappear.
+     * String can be used for formatting purposes, e.g. "1.2k" or regionalized number, e.g. "1,200"
+     */
+    count: number | string | undefined;
     /** sets the background color
      * @default 'transparent'
      */

package/dist/index.d.ts

@@ -1502,8 +1502,10 @@ declare const MultilineChip: ({ children, onClick, ...props }: MultilineChipProp
 type CounterBgColors = 'var(--white)' | 'var(--gray-50)' | 'var(--accent-light)' | 'var(--accent-dark)' | 'transparent';
 type CounterIconColors = 'auto' | 'var(--utility-caution-icon)' | 'var(--utility-danger-icon)' | 'var(--utility-info-icon)' | 'var(--utility-success-icon)' | 'red';
 type CounterProps = {
-    /** sets the count value, a 0 will show a dot instead of a number. Undefined will cause the counter to disappear. */
-    count: number | undefined;
+    /** sets the count value, a 0 will show a dot instead of a number. Undefined will cause the counter to disappear.
+     * String can be used for formatting purposes, e.g. "1.2k" or regionalized number, e.g. "1,200"
+     */
+    count: number | string | undefined;
     /** sets the background color
      * @default 'transparent'
      */

package/dist/index.js

@@ -3989,7 +3989,15 @@ var IconInner = ({ icon, iconColor = "default", size = "1.5rem", ...otherProps }
     );
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(IconComponent, { role: "img", size, ...otherProps, css: [IconImg, customColor[iconColor]] });
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    IconComponent,
+    {
+      role: "img",
+      size,
+      ...otherProps,
+      css: [IconImg, iconColor ? functionalColors : void 0, customColor[iconColor]]
+    }
+  );
 };
 var Icon = import_react24.default.memo(IconInner);
 
@@ -8900,12 +8908,13 @@ var Counter = ({
   if (typeof count === "undefined") {
     return null;
   }
-  const isTripleDigits = count > 99 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("span", { css: counterTripleValue, title: `${count}`, children: [
+  const isNumber = typeof count === "number";
+  const isTripleDigits = isNumber && count > 99 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("span", { css: counterTripleValue, title: `${count}`, children: [
     "99",
     /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(Icon, { icon: "math-plus", iconColor: "currentColor", size: "0.5rem", css: counterIcon.tripleValue })
   ] }) : count;
   const formatCount = count === 0 ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { css: counterZeroValue, title: `${count}` }) : isTripleDigits;
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { css: [counterContainer(bgColor, Boolean(icon)), sizeStyles[size]], ...props, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { css: [counterContainer(bgColor, Boolean(icon || !isNumber)), sizeStyles[size]], ...props, children: [
     icon ? /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       "span",
       {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "20.39.3-alpha.1+5c5ebdb625",
+  "version": "20.39.3-alpha.11+b3ab5fb305",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "exports": {
@@ -38,8 +38,8 @@
     "@storybook/theming": "^8.3.3",
     "@types/react": "18.3.24",
     "@types/react-dom": "18.3.7",
-    "@uniformdev/canvas": "^20.39.3-alpha.1+5c5ebdb625",
-    "@uniformdev/richtext": "^20.39.3-alpha.1+5c5ebdb625",
+    "@uniformdev/canvas": "^20.39.3-alpha.11+b3ab5fb305",
+    "@uniformdev/richtext": "^20.39.3-alpha.11+b3ab5fb305",
     "@vitest/coverage-v8": "3.2.4",
     "autoprefixer": "10.4.21",
     "hygen": "6.2.11",
@@ -93,5 +93,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5c5ebdb6256f19b67d7941890176e63f3d60b8f4"
+  "gitHead": "b3ab5fb305533690de4bbd859a69196b6c26ee2f"
 }