@harnessio/ui 1.3.33 → 1.3.34

package/dist/tailwind.config.js

@@ -1380,7 +1380,7 @@ const ce = {
       opacity: "0"
     }
   }
-}, he = {
+}, ue = {
   ".cn-drawer": {
     "&-content": {
       userSelect: "auto !important",
@@ -1788,7 +1788,7 @@ const ce = {
       }
     }
   }
-}, ue = [
+}, he = [
   "gray",
   "green",
   "red",
@@ -1805,7 +1805,7 @@ const ce = {
   "violet"
 ], me = () => {
   const r = {};
-  return ue.forEach((e) => {
+  return he.forEach((e) => {
     r[`&.cn-dropdown-menu-item-indicator-${e}`] = {
       backgroundColor: `var(--cn-set-${e}-solid-bg)`
     };
@@ -2304,7 +2304,7 @@ const Se = {
     ...Ce()
   }
 }, ze = ["2xs", "xs", "sm", "md", "lg", "xl"], $e = ["xs", "sm", "md", "lg"];
-function h(r) {
+function u(r) {
   const e = r === "icon" ? ze : $e, n = r === "symbol" ? "logo" : r, a = {};
   return e.forEach((t) => {
     const o = {};
@@ -2313,13 +2313,13 @@ function h(r) {
 }
 const Ie = {
   ".cn-icon": {
-    ...h("icon")
+    ...u("icon")
   },
   ".cn-logo": {
-    ...h("logo")
+    ...u("logo")
   },
   ".cn-symbol": {
-    ...h("symbol")
+    ...u("symbol")
   }
 }, Re = ["danger", "warning", "success"];
 function We() {
@@ -2807,12 +2807,12 @@ const Ee = {
     progressBg: "danger",
     color: "text-danger"
   }
-}, u = "var(--cn-comp-slider-track-progress-stripes)", Ne = `linear-gradient(45deg,
-  ${u} 18.75%,
+}, h = "var(--cn-comp-slider-track-progress-stripes)", Ne = `linear-gradient(45deg,
+  ${h} 18.75%,
   transparent 18.75%,
   transparent 50%,
-  ${u} 50%,
-  ${u} 68.75%,
+  ${h} 50%,
+  ${h} 68.75%,
   transparent 68.75%,
   transparent)`, Ve = (r) => r === "sm" ? "8px 8px" : r === "lg" ? "32px 32px" : "16px 16px";
 function Me() {
@@ -3937,7 +3937,7 @@ const tr = {
     padding: "var(--cn-spacing-4) var(--cn-spacing-10) var(--cn-spacing-4)"
   }
 }, pr = ["sm", "md", "lg", "xs"], gr = ["2xs", "xs", "sm", "md", "lg", "xl"], br = ["xs", "sm", "md", "lg"], vr = ["sm"];
-function hr() {
+function ur() {
   const r = {};
   return pr.forEach((e) => {
     r[`&:where(.cn-skeleton-avatar-${e})`] = {
@@ -3953,7 +3953,7 @@ function S(r) {
     t.width = `var(--cn-${r}-size-${a})`, t["min-width"] = `var(--cn-${r}-size-${a})`, t.height = `var(--cn-${r}-size-${a})`, t["min-height"] = `var(--cn-${r}-size-${a})`, n[`&:where(.cn-skeleton-${r}-${a})`] = t;
   }), n;
 }
-function ur() {
+function hr() {
   const r = {};
   return vr.forEach((e) => {
     r[`&.cn-skeleton-form-item-${e}`] = {
@@ -3977,7 +3977,7 @@ const mr = {
       "&:where(.cn-skeleton-avatar-rounded)": {
         borderRadius: "var(--cn-avatar-radius-rounded)"
       },
-      ...hr()
+      ...ur()
     },
     "&-icon": {
       ...S("icon")
@@ -4015,7 +4015,7 @@ const mr = {
         border: "var(--cn-input-border) solid var(--cn-border-2)",
         borderRadius: "var(--cn-input-radius)",
         backgroundColor: "var(--cn-comp-input-bg)",
-        ...ur()
+        ...hr()
       }
     },
     "&-list": {
@@ -5245,8 +5245,15 @@ const mr = {
       '&[data-theme="danger"]': {
         border: "1px solid var(--cn-border-danger) !important",
         boxShadow: "0 0 0 3px color-mix(in srgb, var(--cn-border-danger) 20%, transparent) !important"
+      },
+      '&[data-theme="info"]': {
+        border: "1px solid var(--cn-set-blue-outline-border) !important",
+        boxShadow: "0 0 0 3px color-mix(in srgb, var(--cn-set-blue-outline-border) 20%, transparent) !important"
       }
     },
+    '&[data-theme="info"]': {
+      backgroundColor: "var(--cn-set-blue-outline-bg)"
+    },
     "&:has(.cn-studio-card-group:hover)": {
       backgroundColor: "lch(from var(--cn-bg-3) l c h / 0.45) !important",
       ...I,
@@ -5411,9 +5418,22 @@ const mr = {
   ".cn-studio-card-tag": {
     "@apply flex gap-cn-3xs p-cn-2xs border rounded-t-cn-4 top-[-28px] right-0 absolute select-none": "",
     maxWidth: R,
-    color: "var(--cn-set-purple-secondary-text)",
-    "background-color": "var(--cn-set-purple-outline-bg)",
-    "border-color": "var(--cn-set-purple-outline-border)",
+    "--cn-studio-card-tag-text": "var(--cn-set-purple-secondary-text)",
+    "--cn-studio-card-tag-outline-bg": "var(--cn-set-purple-outline-bg)",
+    "--cn-studio-card-tag-outline-border": "var(--cn-set-purple-outline-border)",
+    color: "var(--cn-studio-card-tag-text)",
+    "background-color": "var(--cn-studio-card-tag-outline-bg)",
+    "border-color": "var(--cn-studio-card-tag-outline-border)",
+    '&[data-theme="blue"]': {
+      "--cn-studio-card-tag-text": "var(--cn-set-blue-secondary-text)",
+      "--cn-studio-card-tag-outline-bg": "var(--cn-set-blue-outline-bg)",
+      "--cn-studio-card-tag-outline-border": "var(--cn-set-blue-outline-border)"
+    },
+    '&[data-theme="gray"]': {
+      "--cn-studio-card-tag-text": "var(--cn-set-gray-secondary-text)",
+      "--cn-studio-card-tag-outline-bg": "var(--cn-set-gray-outline-bg)",
+      "--cn-studio-card-tag-outline-border": "var(--cn-set-gray-outline-border)"
+    },
     // NOT a reusable pattern — values are hand-tuned to --cn-rounded-6.
     // Width, height, bottom offset, and gradient stops must all be
     // recalculated together if the card's corner radius changes.
@@ -5424,8 +5444,8 @@ const mr = {
       right: "-1px",
       width: "var(--cn-rounded-6)",
       height: "var(--cn-rounded-6)",
-      background: "radial-gradient(circle at bottom left, transparent 0px, transparent calc(var(--cn-rounded-6) - 1px), var(--cn-set-purple-outline-border) calc(var(--cn-rounded-6) - 1px), var(--cn-set-purple-outline-border) var(--cn-rounded-6), var(--cn-set-purple-outline-bg) calc(var(--cn-rounded-6) - 1px))",
-      borderRight: "1px solid var(--cn-set-purple-outline-border)"
+      background: "radial-gradient(circle at bottom left, transparent 0px, transparent calc(var(--cn-rounded-6) - 1px), var(--cn-studio-card-tag-outline-border) calc(var(--cn-rounded-6) - 1px), var(--cn-studio-card-tag-outline-border) var(--cn-rounded-6), var(--cn-studio-card-tag-outline-bg) calc(var(--cn-rounded-6) - 1px))",
+      borderRight: "1px solid var(--cn-studio-card-tag-outline-border)"
     }
   },
   // Message Component
@@ -6666,7 +6686,7 @@ const Hr = {
   Oe,
   Ue,
   Se,
-  he,
+  ue,
   de,
   $r,
   ve,