revdev-components 0.198.0 → 0.201.0

package/build/badges/level/index.d.ts

@@ -7,7 +7,7 @@ export interface LevelBadgeProps {
     levels: LevelGen[];
     className?: string;
     children?: React.ReactNode;
-    mode?: "default" | "compact";
+    mode?: "compact";
     texts?: {
         refersTo?: (param: LevelGen) => string;
     };

package/build/index.js

@@ -5809,10 +5809,11 @@ var HelpTip = function (_a) {
     return (React.createElement(AppTooltip, { title: title || children, placement: "top" }, href ? (React.createElement(AppLink, { href: href, target: target }, iconNode)) : (iconNode)));
 };
 
-var s = {"root":"index-module_root__W7fFh","level":"index-module_level__J8dSJ","bar":"index-module_bar__V-ymE","bar__compact":"index-module_bar__compact__foL3T","bar__rate":"index-module_bar__rate__w6r3z","code":"index-module_code__aAnic","label":"index-module_label__gftYy","label__compact":"index-module_label__compact__-5Wt0"};
+var s = {"root":"index-module_root__W7fFh","root__default":"index-module_root__default__cjtzX","level":"index-module_level__J8dSJ","bar":"index-module_bar__V-ymE","bar__rate":"index-module_bar__rate__w6r3z","code":"index-module_code__aAnic","label":"index-module_label__gftYy","label__compact":"index-module_label__compact__-5Wt0"};
 
 var LevelBadge = function (_a) {
-    var levels = _a.levels, className = _a.className, texts = _a.texts, children = _a.children, _b = _a.mode, mode = _b === void 0 ? "default" : _b;
+    var _b;
+    var levels = _a.levels, className = _a.className, texts = _a.texts, children = _a.children, mode = _a.mode;
     var bars = React.useMemo(function () {
         var maxRate = Math.max.apply(Math, levels.map(function (x) { return x.rate; }));
         return levels.map(function (x) { return [x.code.toUpperCase(), x.rate, x.rate / maxRate]; });
@@ -5823,23 +5824,20 @@ var LevelBadge = function (_a) {
             refersTo: (_a = texts === null || texts === void 0 ? void 0 : texts.refersTo) !== null && _a !== void 0 ? _a : (function (level) { return "Level ".concat(level.code, " at ").concat(numeral(level.rate).format("0%")); }),
         };
     }, [texts]);
-    var renderCode = React.useCallback(function (code) {
-        return mode === "compact" ? (React.createElement("div", { className: s.code },
-            React.createElement("span", null, code))) : null;
-    }, [levels, mode]);
     if (bars.length === 0) {
         return null;
     }
-    return (React.createElement("div", { className: classNames(s.root, className) },
+    return (React.createElement("div", { className: classNames(s.root, (_b = {}, _b[s.root__default] = !mode, _b), className) },
         bars.map(function (_a) {
-            var _b, _c;
             var code = _a[0], rate = _a[1], normalizedRate = _a[2];
             return (React.createElement(AppTooltip, { key: code, title: interText.refersTo({ code: code, rate: rate }), placement: "top" },
                 React.createElement("div", { key: code, className: s.level },
-                    React.createElement("div", { className: classNames(s.bar, (_b = {}, _b[s.bar__compact] = mode === "compact", _b)) },
-                        React.createElement("div", { className: s.bar__rate, style: { height: "".concat(normalizedRate * 100, "%") } }, renderCode(code)),
-                        renderCode(code)),
-                    React.createElement("div", { className: classNames(s.label, (_c = {}, _c[s.label__compact] = mode === "compact", _c)) }, code))));
+                    React.createElement("div", { className: s.bar },
+                        React.createElement("div", { className: s.bar__rate, style: { height: "".concat(normalizedRate * 100, "%") } }, mode === "compact" ? (React.createElement("div", { className: s.code },
+                            React.createElement("span", null, code))) : null),
+                        mode === "compact" ? (React.createElement("div", { className: s.code },
+                            React.createElement("span", null, code))) : null),
+                    mode === "compact" ? null : React.createElement("div", { className: s.label }, code))));
         }),
         children));
 };

package/build/styles.css

@@ -38,6 +38,8 @@
   --helpTipFontSize: 0.8em;
   --levelBadgeBarBackgroundColor: #e4e4e4;
   --levelBadgeColor: #555;
+  --levelBadgeFrontColor: white;
+  --levelBadgeBackColor: #111;
 }
 
 html,
@@ -676,6 +678,9 @@ body {
   gap: 0.3em;
   color: var(--levelBadgeColor);
 }
+.index-module_root__default__cjtzX {
+  width: auto;
+}
 
 .index-module_level__J8dSJ {
   display: flex;
@@ -685,17 +690,15 @@ body {
 
 .index-module_bar__V-ymE {
   height: 1.2em;
+  width: 1.4em;
   display: flex;
   align-items: flex-end;
   justify-content: center;
   position: relative;
   background-color: var(--levelBadgeBarBackgroundColor);
-  color: var(--levelBadgeColor);
+  color: var(--levelBadgeBackColor);
   z-index: 0;
 }
-.index-module_bar__compact__foL3T {
-  width: 1.4em;
-}
 
 .index-module_bar__rate__w6r3z {
   width: 100%;
@@ -707,7 +710,7 @@ body {
   z-index: 1;
 }
 .index-module_bar__rate__w6r3z .index-module_code__aAnic {
-  color: var(--levelBadgeBarBackgroundColor);
+  color: var(--levelBadgeFrontColor);
   z-index: 2;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "revdev-components",
-  "version": "0.198.0",
+  "version": "0.201.0",
   "main": "build/index.js",
   "module": "build/index.esm.js",
   "scripts": {