design-zystem 1.0.281 → 1.0.282

package/dist/index.js

@@ -687,6 +687,8 @@ var Icon_default = Icon;
 // src/Components/Divider/Divider.tsx
 var import_styled_components7 = __toESM(require("styled-components"));
 var import_jsx_runtime8 = require("react/jsx-runtime");
+var isColorToken = (value) => Object.prototype.hasOwnProperty.call(colors, value);
+var resolveColor = (value) => isColorToken(value) ? colors[value] : value;
 var StyledDivider = import_styled_components7.default.div`
   background-color: ${({ $color }) => $color || "#DCDCDC"};
   ${({ $orientation, $thickness }) => $orientation === "vertical" ? `
@@ -719,7 +721,7 @@ var Divider = (_a) => {
     StyledDivider,
     __spreadValues({
       $orientation: orientation,
-      $color: color,
+      $color: resolveColor(color),
       $thickness: thickness,
       $ySpacing: ySpacing,
       className,
@@ -2141,7 +2143,7 @@ var Initials = import_styled_components18.default.span`
   line-height: 1;
   user-select: none;
 `;
-var resolveColor = (token, fallback) => {
+var resolveColor2 = (token, fallback) => {
   if (!token) return fallback;
   return colors[token] || token;
 };
@@ -2157,8 +2159,8 @@ var Avatar = ({
 }) => {
   var _a, _b, _c;
   const [hasImageError, setHasImageError] = (0, import_react9.useState)(false);
-  const resolvedBackground = resolveColor(backgroundColor, colors.grey_300);
-  const resolvedText = resolveColor(textColor, colors.dark);
+  const resolvedBackground = resolveColor2(backgroundColor, colors.grey_300);
+  const resolvedText = resolveColor2(textColor, colors.dark);
   const initials = getInitials(name);
   const sizePx = `${size}px`;
   const borderRadius = shape === "circle" ? "50%" : "4px";

package/dist/index.mjs

@@ -548,6 +548,8 @@ var Icon_default = Icon;
 // src/Components/Divider/Divider.tsx
 import styled7 from "styled-components";
 import { jsx as jsx8 } from "react/jsx-runtime";
+var isColorToken = (value) => Object.prototype.hasOwnProperty.call(colors, value);
+var resolveColor = (value) => isColorToken(value) ? colors[value] : value;
 var StyledDivider = styled7.div`
   background-color: ${({ $color }) => $color || "#DCDCDC"};
   ${({ $orientation, $thickness }) => $orientation === "vertical" ? `
@@ -580,7 +582,7 @@ var Divider = (_a) => {
     StyledDivider,
     __spreadValues({
       $orientation: orientation,
-      $color: color,
+      $color: resolveColor(color),
       $thickness: thickness,
       $ySpacing: ySpacing,
       className,
@@ -2002,7 +2004,7 @@ var Initials = styled18.span`
   line-height: 1;
   user-select: none;
 `;
-var resolveColor = (token, fallback) => {
+var resolveColor2 = (token, fallback) => {
   if (!token) return fallback;
   return colors[token] || token;
 };
@@ -2018,8 +2020,8 @@ var Avatar = ({
 }) => {
   var _a, _b, _c;
   const [hasImageError, setHasImageError] = useState5(false);
-  const resolvedBackground = resolveColor(backgroundColor, colors.grey_300);
-  const resolvedText = resolveColor(textColor, colors.dark);
+  const resolvedBackground = resolveColor2(backgroundColor, colors.grey_300);
+  const resolvedText = resolveColor2(textColor, colors.dark);
   const initials = getInitials(name);
   const sizePx = `${size}px`;
   const borderRadius = shape === "circle" ? "50%" : "4px";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "design-zystem",
-  "version": "1.0.281",
+  "version": "1.0.282",
   "description": "A React design system of importable components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",