@parto-system-design/ui 1.1.16 → 1.1.18

package/dist/components/ui/concept-card.cjs

@@ -41,6 +41,62 @@ function convertToLocalNumbers(text, locale) {
 }
 
 // src/lib/i18n.ts
+var EMOTION_KEYS = [
+  "anger",
+  "anticipation",
+  "joy",
+  "trust",
+  "fear",
+  "surprise",
+  "sadness",
+  "disgust",
+  "neutral"
+];
+var emotionLabels = {
+  fa: {
+    anger: "\u062E\u0634\u0645",
+    anticipation: "\u0627\u0646\u062A\u0638\u0627\u0631",
+    joy: "\u0634\u0627\u062F\u06CC",
+    trust: "\u0627\u0639\u062A\u0645\u0627\u062F",
+    fear: "\u062A\u0631\u0633",
+    surprise: "\u0634\u06AF\u0641\u062A\u06CC",
+    sadness: "\u063A\u0645",
+    disgust: "\u0627\u0646\u0632\u062C\u0627\u0631",
+    neutral: "\u062E\u0646\u062B\u06CC"
+  },
+  ar: {
+    anger: "\u063A\u0636\u0628",
+    anticipation: "\u062A\u0631\u0642\u0651\u0628",
+    joy: "\u0641\u0631\u062D",
+    trust: "\u062B\u0642\u0629",
+    fear: "\u062E\u0648\u0641",
+    surprise: "\u062F\u0647\u0634\u0629",
+    sadness: "\u062D\u0632\u0646",
+    disgust: "\u0627\u0634\u0645\u0626\u0632\u0627\u0632",
+    neutral: "\u0645\u062D\u0627\u064A\u062F"
+  },
+  en: {
+    anger: "Anger",
+    anticipation: "Anticipation",
+    joy: "Joy",
+    trust: "Trust",
+    fear: "Fear",
+    surprise: "Surprise",
+    sadness: "Sadness",
+    disgust: "Disgust",
+    neutral: "Neutral"
+  }
+};
+(() => {
+  const map = {};
+  for (const key of EMOTION_KEYS) map[key] = key;
+  for (const locale of Object.keys(emotionLabels)) {
+    for (const key of EMOTION_KEYS) {
+      map[emotionLabels[locale][key].toLowerCase()] = key;
+    }
+  }
+  return map;
+})();
 var FLOW_KEYS = [
   "pro-gov",
   "internal-critic",
@@ -50,37 +106,97 @@ var FLOW_KEYS = [
 ];
 var flowLabels = {
   fa: {
-    "pro-gov": "\u062D\u0627\u0645\u06CC",
-    "internal-critic": "\u0645\u0646\u062A\u0642\u062F \u0633\u0627\u0632\u0646\u062F\u0647",
-    "internal-opponent": "\u0645\u062E\u0627\u0644\u0641",
-    "external-opponent": "\u0645\u062E\u0627\u0644\u0641 \u062C\u062F\u06CC",
-    grey: "\u062E\u0646\u062B\u06CC"
+    "pro-gov": "\u062D\u0627\u0645\u06CC\u0627\u0646 \u062D\u06A9\u0648\u0645\u062A",
+    "internal-critic": "\u0645\u0646\u062A\u0642\u062F\u0627\u0646 \u062F\u0627\u062E\u0644\u06CC",
+    "internal-opponent": "\u0645\u062E\u0627\u0644\u0641\u0627\u0646 \u062F\u0627\u062E\u0644\u06CC",
+    "external-opponent": "\u0645\u062E\u0627\u0644\u0641\u0627\u0646 \u062E\u0627\u0631\u062C\u06CC",
+    grey: "\u0642\u0634\u0631 \u062E\u0627\u06A9\u0633\u062A\u0631\u06CC"
   },
   ar: {
-    "pro-gov": "\u0645\u0624\u064A\u062F",
-    "internal-critic": "\u0645\u0646\u062A\u0642\u062F \u0628\u0646\u0651\u0627\u0621",
-    "internal-opponent": "\u0645\u0639\u0627\u0631\u0636",
-    "external-opponent": "\u0645\u0639\u0627\u0631\u0636 \u0634\u062F\u064A\u062F",
-    grey: "\u0645\u062D\u0627\u064A\u062F"
+    "pro-gov": "\u0645\u0624\u064A\u062F\u0648 \u0627\u0644\u062D\u0643\u0648\u0645\u0629",
+    "internal-critic": "\u0645\u0646\u062A\u0642\u062F\u0648\u0646 \u062F\u0627\u062E\u0644\u064A\u0648\u0646",
+    "internal-opponent": "\u0645\u0639\u0627\u0631\u0636\u0648\u0646 \u062F\u0627\u062E\u0644\u064A\u0648\u0646",
+    "external-opponent": "\u0645\u0639\u0627\u0631\u0636\u0648\u0646 \u062E\u0627\u0631\u062C\u064A\u0648\u0646",
+    grey: "\u0627\u0644\u0641\u0626\u0629 \u0627\u0644\u0631\u0645\u0627\u062F\u064A\u0629"
   },
   en: {
-    "pro-gov": "Supporter",
-    "internal-critic": "Constructive Critic",
-    "internal-opponent": "Detractor",
-    "external-opponent": "Strong Detractor",
-    grey: "Undecided"
+    "pro-gov": "Pro-Government",
+    "internal-critic": "Internal Critic",
+    "internal-opponent": "Internal Opponent",
+    "external-opponent": "External Opponent",
+    grey: "Grey"
   }
 };
+(() => {
+  const map = {};
+  for (const key of FLOW_KEYS) map[key] = key;
+  for (const locale of Object.keys(flowLabels)) {
+    for (const key of FLOW_KEYS) {
+      map[flowLabels[locale][key].toLowerCase()] = key;
+    }
+  }
+  return map;
+})();
+var STATUS_KEYS = ["critical", "warning", "middle", "low"];
 var statusLabels = {
-  fa: { critical: "\u0628\u062D\u0631\u0627\u0646\u06CC", warning: "\u0647\u0634\u062F\u0627\u0631", normal: "\u0639\u0627\u062F\u06CC" },
-  ar: { critical: "\u062D\u0631\u062C", warning: "\u062A\u062D\u0630\u064A\u0631", normal: "\u0637\u0628\u064A\u0639\u064A" },
-  en: { critical: "Critical", warning: "Warning", normal: "Normal" }
+  fa: { critical: "\u0628\u062D\u0631\u0627\u0646\u06CC", warning: "\u0647\u0634\u062F\u0627\u0631", middle: "\u0645\u062A\u0648\u0633\u0637", low: "\u067E\u0627\u06CC\u06CC\u0646" },
+  ar: { critical: "\u062D\u0631\u062C", warning: "\u062A\u062D\u0630\u064A\u0631", middle: "\u0645\u062A\u0648\u0633\u0637", low: "\u0645\u0646\u062E\u0641\u0636" },
+  en: { critical: "Critical", warning: "Warning", middle: "Middle", low: "Low" }
+};
+var STATUS_VALUE_MAP = {
+  1: "critical",
+  2: "warning",
+  3: "middle",
+  4: "low"
 };
+var STATUS_LABEL_LOOKUP = (() => {
+  const map = { normal: "low" };
+  for (const key of STATUS_KEYS) map[key] = key;
+  for (const locale of Object.keys(statusLabels)) {
+    for (const key of STATUS_KEYS) {
+      map[statusLabels[locale][key].toLowerCase()] = key;
+    }
+  }
+  return map;
+})();
+function resolveStatus(input) {
+  if (input == null) return null;
+  if (typeof input === "number") return STATUS_VALUE_MAP[input] ?? null;
+  const raw = String(input).trim();
+  if (raw === "") return null;
+  if (/^\d+$/.test(raw)) return STATUS_VALUE_MAP[Number(raw)] ?? null;
+  return STATUS_LABEL_LOOKUP[raw.toLowerCase()] ?? null;
+}
+var SEVERITY_KEYS = ["urgent", "high", "medium", "low"];
 var severityLabels = {
   fa: { urgent: "\u0641\u0648\u0631\u06CC", high: "\u0628\u0627\u0644\u0627", medium: "\u0645\u062A\u0648\u0633\u0637", low: "\u067E\u0627\u06CC\u06CC\u0646" },
   ar: { urgent: "\u0639\u0627\u062C\u0644", high: "\u0645\u0631\u062A\u0641\u0639", medium: "\u0645\u062A\u0648\u0633\u0637", low: "\u0645\u0646\u062E\u0641\u0636" },
   en: { urgent: "Urgent", high: "High", medium: "Medium", low: "Low" }
 };
+var SEVERITY_VALUE_MAP = {
+  1: "urgent",
+  2: "high",
+  3: "medium",
+  4: "low"
+};
+var SEVERITY_LABEL_LOOKUP = (() => {
+  const map = {};
+  for (const key of SEVERITY_KEYS) map[key] = key;
+  for (const locale of Object.keys(severityLabels)) {
+    for (const key of SEVERITY_KEYS) {
+      map[severityLabels[locale][key].toLowerCase()] = key;
+    }
+  }
+  return map;
+})();
+function resolveSeverity(input) {
+  if (input == null) return null;
+  if (typeof input === "number") return SEVERITY_VALUE_MAP[input] ?? null;
+  const raw = String(input).trim();
+  if (raw === "") return null;
+  if (/^\d+$/.test(raw)) return SEVERITY_VALUE_MAP[Number(raw)] ?? null;
+  return SEVERITY_LABEL_LOOKUP[raw.toLowerCase()] ?? null;
+}
 var SIZE_CLASSES = {
   sm: { badge: "h-6 text-xs px-2 gap-1.5", dot: "size-1.5" },
   md: { badge: "h-7 text-sm px-2.5 gap-2", dot: "size-2" }
@@ -90,15 +206,17 @@ function tokenVar(status) {
 }
 var StatusBadge = React__namespace.forwardRef(
   ({ className, status, size = "md", showLabel = true, locale = "fa", animated, ...props }, ref) => {
-    const label = statusLabels[locale]?.[status] ?? statusLabels.fa[status];
-    const shouldPulse = animated ?? status === "critical";
-    const token = tokenVar(status);
+    const resolved = resolveStatus(status);
+    if (!resolved) return null;
+    const label = statusLabels[locale]?.[resolved] ?? statusLabels.fa[resolved];
+    const shouldPulse = animated ?? resolved === "critical";
+    const token = tokenVar(resolved);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "span",
       {
         ref,
         "data-slot": "status-badge",
-        "data-status": status,
+        "data-status": resolved,
         "aria-label": showLabel ? void 0 : label,
         className: cn(
           "inline-flex items-center rounded-full border font-medium transition-colors duration-150",
@@ -106,9 +224,9 @@ var StatusBadge = React__namespace.forwardRef(
           className
         ),
         style: {
-          backgroundColor: `hsl(var(${token}) / 0.1)`,
-          borderColor: `hsl(var(${token}) / 0.3)`,
-          color: `hsl(var(${token}))`
+          backgroundColor: `color-mix(in srgb, var(${token}) 10%, transparent)`,
+          borderColor: `color-mix(in srgb, var(${token}) 30%, transparent)`,
+          color: `var(${token})`
         },
         ...props,
         children: [
@@ -117,7 +235,7 @@ var StatusBadge = React__namespace.forwardRef(
               "span",
               {
                 className: "absolute inset-0 rounded-full animate-pulse-subtle",
-                style: { backgroundColor: `hsl(var(${token}) / 0.5)` },
+                style: { backgroundColor: `color-mix(in srgb, var(${token}) 50%, transparent)` },
                 "aria-hidden": "true"
               }
             ),
@@ -125,7 +243,7 @@ var StatusBadge = React__namespace.forwardRef(
               "span",
               {
                 className: cn("relative inline-block rounded-full", SIZE_CLASSES[size].dot),
-                style: { backgroundColor: `hsl(var(${token}))` },
+                style: { backgroundColor: `var(${token})` },
                 "aria-hidden": "true"
               }
             )
@@ -152,25 +270,27 @@ function tokenVar2(severity) {
 }
 var SeverityBadge = React__namespace.forwardRef(
   ({ className, severity, size = "md", showLabel = true, variant = "soft", locale = "fa", ...props }, ref) => {
-    const label = severityLabels[locale]?.[severity] ?? severityLabels.fa[severity];
-    const Icon = SEVERITY_ICON[severity];
-    const token = tokenVar2(severity);
+    const resolved = resolveSeverity(severity);
+    if (!resolved) return null;
+    const label = severityLabels[locale]?.[resolved] ?? severityLabels.fa[resolved];
+    const Icon = SEVERITY_ICON[resolved];
+    const token = tokenVar2(resolved);
     const softStyle = {
-      backgroundColor: `hsl(var(${token}) / 0.1)`,
-      borderColor: `hsl(var(${token}) / 0.3)`,
-      color: `hsl(var(${token}))`
+      backgroundColor: `color-mix(in srgb, var(${token}) 10%, transparent)`,
+      borderColor: `color-mix(in srgb, var(${token}) 30%, transparent)`,
+      color: `var(${token})`
     };
     const solidStyle = {
-      backgroundColor: `hsl(var(${token}))`,
-      borderColor: `hsl(var(${token}))`,
-      color: "hsl(var(--foreground-contrast))"
+      backgroundColor: `var(${token})`,
+      borderColor: `var(${token})`,
+      color: "var(--foreground-contrast)"
     };
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "span",
       {
         ref,
         "data-slot": "severity-badge",
-        "data-severity": severity,
+        "data-severity": resolved,
         "data-variant": variant,
         "aria-label": showLabel ? void 0 : label,
         className: cn(
@@ -242,7 +362,7 @@ var FlowDistribution = React__namespace.forwardRef(
           "div",
           {
             className: "transition-all duration-500",
-            style: { width: `${percents[k]}%`, backgroundColor: `hsl(var(${tokenVar3(k)}))` }
+            style: { width: `${percents[k]}%`, backgroundColor: `var(${tokenVar3(k)})` }
           },
           k
         )) }),
@@ -251,11 +371,11 @@ var FlowDistribution = React__namespace.forwardRef(
             "span",
             {
               className: "inline-block h-2 w-2 rounded-full",
-              style: { backgroundColor: `hsl(var(${tokenVar3(k)}))` }
+              style: { backgroundColor: `var(${tokenVar3(k)})` }
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-foreground-light", children: labels[k] }),
-          showPercent && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs font-medium tabular-nums", style: { color: `hsl(var(${tokenVar3(k)}))` }, children: [
+          showPercent && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs font-medium tabular-nums", style: { color: `var(${tokenVar3(k)})` }, children: [
             convertToLocalNumbers(percents[k], locale),
             percentSign
           ] }),
@@ -281,8 +401,8 @@ var FlowDistribution = React__namespace.forwardRef(
             {
               className: "inline-flex items-center gap-1 rounded-full px-2 py-0.5",
               style: {
-                backgroundColor: `hsl(var(${tokenVar3(k)}) / 0.12)`,
-                color: `hsl(var(${tokenVar3(k)}))`
+                backgroundColor: `color-mix(in srgb, var(${tokenVar3(k)}) 12%, transparent)`,
+                color: `var(${tokenVar3(k)})`
               },
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs font-medium", children: labels[k] }),
@@ -311,7 +431,7 @@ var FlowDistribution = React__namespace.forwardRef(
           className: "absolute inset-y-0 start-0 rounded-full transition-all duration-500",
           style: {
             width: `${percents[k]}%`,
-            backgroundColor: `hsl(var(${tokenVar3(k)}))`
+            backgroundColor: `var(${tokenVar3(k)})`
           },
           role: "progressbar",
           "aria-valuenow": percents[k],
@@ -324,7 +444,7 @@ var FlowDistribution = React__namespace.forwardRef(
         "span",
         {
           className: "w-12 shrink-0 text-xs font-medium tabular-nums text-start",
-          style: { color: `hsl(var(${tokenVar3(k)}))` },
+          style: { color: `var(${tokenVar3(k)})` },
           children: showCounts ? convertToLocalNumbers((data[k] ?? 0).toLocaleString(), locale) : `${convertToLocalNumbers(percents[k], locale)}${percentSign}`
         }
       )
@@ -339,24 +459,24 @@ var LABELS = {
 };
 var SENTIMENT_STYLES = {
   positive: {
-    bar: "bg-[hsl(var(--sentiment-positive))]",
-    text: "text-[hsl(var(--sentiment-positive))]",
-    bg: "bg-[hsl(var(--sentiment-positive)/0.12)]"
+    bar: "bg-[var(--sentiment-positive)]",
+    text: "text-[var(--sentiment-positive)]",
+    bg: "bg-[color-mix(in_srgb,var(--sentiment-positive)_12%,transparent)]"
   },
   negative: {
-    bar: "bg-[hsl(var(--sentiment-negative))]",
-    text: "text-[hsl(var(--sentiment-negative))]",
-    bg: "bg-[hsl(var(--sentiment-negative)/0.12)]"
+    bar: "bg-[var(--sentiment-negative)]",
+    text: "text-[var(--sentiment-negative)]",
+    bg: "bg-[color-mix(in_srgb,var(--sentiment-negative)_12%,transparent)]"
   },
   neutral: {
-    bar: "bg-[hsl(var(--sentiment-neutral))]",
-    text: "text-[hsl(var(--sentiment-neutral))]",
-    bg: "bg-[hsl(var(--sentiment-neutral)/0.12)]"
+    bar: "bg-[var(--sentiment-neutral)]",
+    text: "text-[var(--sentiment-neutral)]",
+    bg: "bg-[color-mix(in_srgb,var(--sentiment-neutral)_12%,transparent)]"
   },
   mixed: {
-    bar: "bg-[hsl(var(--sentiment-mixed))]",
-    text: "text-[hsl(var(--sentiment-mixed))]",
-    bg: "bg-[hsl(var(--sentiment-mixed)/0.12)]"
+    bar: "bg-[var(--sentiment-mixed)]",
+    text: "text-[var(--sentiment-mixed)]",
+    bg: "bg-[color-mix(in_srgb,var(--sentiment-mixed)_12%,transparent)]"
   }
 };
 function calcPercents2(data) {
@@ -486,9 +606,9 @@ var SentimentDistribution = React__namespace.forwardRef(
 );
 SentimentDistribution.displayName = "SentimentDistribution";
 var TREND_CLASSES = {
-  up: "text-[hsl(var(--sentiment-positive))]",
-  down: "text-[hsl(var(--sentiment-negative))]",
-  neutral: "text-[hsl(var(--sentiment-neutral))]"
+  up: "text-[var(--sentiment-positive)]",
+  down: "text-[var(--sentiment-negative)]",
+  neutral: "text-[var(--sentiment-neutral)]"
 };
 function resolveTrend(data, trend) {
   if (trend !== "auto") return trend;
@@ -731,5 +851,3 @@ var ConceptCard = React__namespace.forwardRef(
 ConceptCard.displayName = "ConceptCard";
 
 exports.ConceptCard = ConceptCard;
-//# sourceMappingURL=concept-card.cjs.map
-//# sourceMappingURL=concept-card.cjs.map

package/dist/components/ui/concept-card.d.cts

@@ -1,5 +1,5 @@
 import 'react';
-import '../../utils-DlXWmDZ-.cjs';
-export { C as ConceptCard, a as ConceptCardProps } from '../../concept-card-BXra9mr0.cjs';
-import '../../i18n-BfRhV5aw.cjs';
+import '../../utils-Czyp5Ned.cjs';
+export { C as ConceptCard, a as ConceptCardProps } from '../../concept-card-BU8JL-gj.cjs';
+import '../../i18n-DD3DMY8O.cjs';
 import 'clsx';

package/dist/components/ui/concept-card.d.ts

@@ -1,5 +1,5 @@
 import 'react';
-import '../../utils-DlXWmDZ-.js';
-export { C as ConceptCard, a as ConceptCardProps } from '../../concept-card-BoJ5gIJD.js';
-import '../../i18n-ewyqbKM-.js';
+import '../../utils-Czyp5Ned.js';
+export { C as ConceptCard, a as ConceptCardProps } from '../../concept-card-D7PfDkNR.js';
+import '../../i18n-UEClNsBy.js';
 import 'clsx';