@cfx-dev/ui-components 1.0.0 → 1.0.2

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2024 FiveM
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+MIT License
+
+Copyright (c) 2024 FiveM
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.

package/dist/{Icons-BlBKvJD8.js → Icons-NE1cibCU.js}

@@ -1,69 +1,72 @@
 import { jsx as a } from "react/jsx-runtime";
-import { G as r, b as n } from "./index.esm-BkynlSN6.js";
-function o(t) {
+import { G as r, b as o } from "./index.esm-BkynlSN6.js";
+import n from "./style-guide/Icons/NewIcons/UpvotesBurst.js";
+import c from "./style-guide/Icons/NewIcons/UpvotesRecurring.js";
+import g from "./style-guide/Icons/NewIcons/UpArrow.js";
+function s(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z" } }, { tag: "path", attr: { d: "M13 7h-2v6h6v-2h-4z" } }] })(t);
 }
-function c(t) {
+function d(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { fillRule: "evenodd", d: "M15.854 5.146a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 0 1 .708-.708L12.5 7.793l2.646-2.647a.5.5 0 0 1 .708 0z" } }, { tag: "path", attr: { d: "M1 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H1zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" } }] })(t);
 }
-function g(t) {
+function h(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" } }] })(t);
 }
-function s(t) {
+function v(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" } }, { tag: "path", attr: { d: "M10.97 4.97a.235.235 0 0 0-.02.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-1.071-1.05z" } }] })(t);
 }
-function d(t) {
+function u(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M10.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425a.267.267 0 0 1 .02-.022z" } }] })(t);
 }
-function b(t) {
+function T(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { fillRule: "evenodd", d: "M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z" } }] })(t);
 }
-function S(t) {
+function j(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { fillRule: "evenodd", d: "M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z" } }] })(t);
 }
-function h(t) {
+function f(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z" } }, { tag: "path", attr: { d: "M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z" } }] })(t);
 }
-function v(t) {
+function L(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M4 10.781c.148 1.667 1.513 2.85 3.591 3.003V15h1.043v-1.216c2.27-.179 3.678-1.438 3.678-3.3 0-1.59-.947-2.51-2.956-3.028l-.722-.187V3.467c1.122.11 1.879.714 2.07 1.616h1.47c-.166-1.6-1.54-2.748-3.54-2.875V1H7.591v1.233c-1.939.23-3.27 1.472-3.27 3.156 0 1.454.966 2.483 2.661 2.917l.61.162v4.031c-1.149-.17-1.94-.8-2.131-1.718H4zm3.391-3.836c-1.043-.263-1.6-.825-1.6-1.616 0-.944.704-1.641 1.8-1.828v3.495l-.2-.05zm1.591 1.872c1.287.323 1.852.859 1.852 1.769 0 1.097-.826 1.828-2.2 1.939V8.73l.348.086z" } }] })(t);
 }
-function u(t) {
+function p(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" } }, { tag: "path", attr: { d: "M7.002 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 4.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 4.995z" } }] })(t);
 }
-function L(t) {
+function B(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M9.405 1.05c-.413-1.4-2.397-1.4-2.81 0l-.1.34a1.464 1.464 0 0 1-2.105.872l-.31-.17c-1.283-.698-2.686.705-1.987 1.987l.169.311c.446.82.023 1.841-.872 2.105l-.34.1c-1.4.413-1.4 2.397 0 2.81l.34.1a1.464 1.464 0 0 1 .872 2.105l-.17.31c-.698 1.283.705 2.686 1.987 1.987l.311-.169a1.464 1.464 0 0 1 2.105.872l.1.34c.413 1.4 2.397 1.4 2.81 0l.1-.34a1.464 1.464 0 0 1 2.105-.872l.31.17c1.283.698 2.686-.705 1.987-1.987l-.169-.311a1.464 1.464 0 0 1 .872-2.105l.34-.1c1.4-.413 1.4-2.397 0-2.81l-.34-.1a1.464 1.464 0 0 1-.872-2.105l.17-.31c.698-1.283-.705-2.686-1.987-1.987l-.311.169a1.464 1.464 0 0 1-2.105-.872l-.1-.34zM8 10.93a2.929 2.929 0 1 1 0-5.86 2.929 2.929 0 0 1 0 5.858z" } }] })(t);
 }
-function f(t) {
+function M(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { fillRule: "evenodd", d: "M8 1.314C12.438-3.248 23.534 4.735 8 15-7.534 4.736 3.562-3.248 8 1.314z" } }] })(t);
 }
-function p(t) {
+function C(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01L8 2.748zM8 15C-7.333 4.868 3.279-3.04 7.824 1.143c.06.055.119.112.176.171a3.12 3.12 0 0 1 .176-.17C12.72-3.042 23.333 4.867 8 15z" } }] })(t);
 }
-function M(t) {
+function z(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7Zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm-5.784 6A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216ZM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5Z" } }] })(t);
 }
-function B(t) {
+function x(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M10.804 8 5 4.633v6.734L10.804 8zm.792-.696a.802.802 0 0 1 0 1.392l-6.363 3.692C4.713 12.69 4 12.345 4 11.692V4.308c0-.653.713-.998 1.233-.696l6.363 3.692z" } }] })(t);
 }
-function C(t) {
+function m(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M5.255 5.786a.237.237 0 0 0 .241.247h.825c.138 0 .248-.113.266-.25.09-.656.54-1.134 1.342-1.134.686 0 1.314.343 1.314 1.168 0 .635-.374.927-.965 1.371-.673.489-1.206 1.06-1.168 1.987l.003.217a.25.25 0 0 0 .25.246h.811a.25.25 0 0 0 .25-.25v-.105c0-.718.273-.927 1.01-1.486.609-.463 1.244-.977 1.244-2.056 0-1.511-1.276-2.241-2.673-2.241-1.267 0-2.655.59-2.75 2.286zm1.557 5.763c0 .533.425.927 1.01.927.609 0 1.028-.394 1.028-.927 0-.552-.42-.94-1.029-.94-.584 0-1.009.388-1.009.94z" } }] })(t);
 }
-function z(t) {
+function w(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z" } }, { tag: "path", attr: { d: "M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM1 7.086a1 1 0 0 0 .293.707L8.75 15.25l-.043.043a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 0 7.586V3a1 1 0 0 1 1-1v5.086z" } }] })(t);
 }
-function x(t) {
+function y(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M5.5 5.5A.5.5 0 0 1 6 6v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm2.5 0a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-1 0V6a.5.5 0 0 1 .5-.5Zm3 .5a.5.5 0 0 0-1 0v6a.5.5 0 0 0 1 0V6Z" } }, { tag: "path", attr: { d: "M14.5 3a1 1 0 0 1-1 1H13v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V4h-.5a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1H6a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1h3.5a1 1 0 0 1 1 1v1ZM4.118 4 4 4.059V13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V4.059L11.882 4H4.118ZM2.5 3h11V2h-11v1Z" } }] })(t);
 }
-function m(t) {
+function H(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z" } }, { tag: "path", attr: { d: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" } }] })(t);
 }
-function w(t) {
+function V(t) {
   return r({ tag: "svg", attr: { fill: "currentColor", viewBox: "0 0 16 16" }, child: [{ tag: "path", attr: { d: "M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z" } }] })(t);
 }
-function y(t) {
+function k(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" } }, { tag: "polyline", attr: { points: "15 3 21 3 21 9" } }, { tag: "line", attr: { x1: "10", y1: "14", x2: "21", y2: "3" } }] })(t);
 }
-function N(t) {
+function P(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" } }, { tag: "polyline", attr: { points: "17 8 12 3 7 8" } }, { tag: "line", attr: { x1: "12", y1: "3", x2: "12", y2: "15" } }] })(t);
 }
 function l(t) {
@@ -72,23 +75,23 @@ function l(t) {
 function e(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M345.6 128l51.3 51.3-109.3 109.4-89.6-89.6L32 365.4 63.6 397 198 262.5l89.6 89.7 141.1-141 51.3 51.3V128H345.6z" } }] })(t);
 }
-function H(t) {
+function A(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M394.23 197.56a300.43 300.43 0 00-53.37-90C301.2 61.65 249.05 32 208 32a16 16 0 00-15.48 20c13.87 53-14.88 97.07-45.31 143.72C122 234.36 96 274.27 96 320c0 88.22 71.78 160 160 160s160-71.78 160-160c0-43.3-7.32-84.49-21.77-122.44zm-105.9 221.13C278 429.69 265.05 432 256 432s-22-2.31-32.33-13.31S208 390.24 208 368c0-25.14 8.82-44.28 17.34-62.78 4.95-10.74 10-21.67 13-33.37a8 8 0 0112.49-4.51A126.48 126.48 0 01275 292c18.17 24 29 52.42 29 76 0 22.24-5.42 39.77-15.67 50.69z" } }] })(t);
 }
-function V(t) {
+function F(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { fill: "none", d: "M0 0h24v24H0z" } }, { tag: "path", attr: { d: "M16 6l2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4 6.3-6.29L22 12V6z" } }] })(t);
 }
-function k(t) {
+function Z(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 24 24" }, child: [{ tag: "g", attr: { fill: "none" }, child: [{ tag: "path", attr: { d: "M0 0h24v24H0z" } }, { tag: "path", attr: { d: "M0 0h24v24H0z" } }, { tag: "path", attr: { d: "M0 0h24v24H0z" } }] }, { tag: "path", attr: { d: "M12 5V1L7 6l5 5V7c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H4c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8z" } }] })(t);
 }
-function A(t) {
+function b(t) {
   return r({ tag: "svg", attr: { viewBox: "0 0 16 16", fill: "currentColor" }, child: [{ tag: "rect", attr: { x: "2", y: "9", width: "9", height: "1" } }, { tag: "rect", attr: { x: "2", y: "12", width: "8", height: "1" } }, { tag: "rect", attr: { x: "2", y: "6", width: "12", height: "1" } }, { tag: "rect", attr: { x: "2", y: "3", width: "11", height: "1" } }] })(t);
 }
 var i;
 ((t) => {
-  t.exit = /* @__PURE__ */ a(w, { style: { fontSize: "1.75em" } }), t.settings = /* @__PURE__ */ a(L, {}), t.changelog = /* @__PURE__ */ a(n, {}), t.storymode = /* @__PURE__ */ a(B, {}), t.replayEditor = /* @__PURE__ */ a(k, {}), t.tipInfo = /* @__PURE__ */ a(C, {}), t.remove = /* @__PURE__ */ a(x, {}), t.externalLink = /* @__PURE__ */ a(y, {}), t.tags = /* @__PURE__ */ a(z, {}), t.checkmark = /* @__PURE__ */ a(d, {}), t.playersCount = /* @__PURE__ */ a(M, {}), t.last24h = /* @__PURE__ */ a(V, {}), t.statusLevelAllGood = /* @__PURE__ */ a(s, {}), t.statusLevelMinor = /* @__PURE__ */ a(u, {}), t.statusLevelMajor = /* @__PURE__ */ a(m, {}), t.favoriteInactive = /* @__PURE__ */ a(p, {}), t.favoriteActive = /* @__PURE__ */ a(f, { className: "cfx-color-primary" }), t.account = /* @__PURE__ */ a(g, {}), t.accountLoaded = /* @__PURE__ */ a(c, {}), t.serversListAll = /* @__PURE__ */ a(A, {}), t.serversListSupporters = /* @__PURE__ */ a(v, {}), t.serversListHistory = /* @__PURE__ */ a(h, {}), t.serversListFavorites = t.favoriteInactive, t.serverLastConnected = /* @__PURE__ */ a(o, {}), t.serversFeatured = /* @__PURE__ */ a(l, { style: { fill: "url(#pin-gradient)" } }), t.serversFeaturedUnstyled = /* @__PURE__ */ a(l, {}), t.serverBoost = /* @__PURE__ */ a(e, { style: { fill: "url(#boost-gradient)" } }), t.serverBoostUnstyled = /* @__PURE__ */ a(e, {}), t.serverBurst = /* @__PURE__ */ a(H, { style: { fill: "url(#burst-gradient)" } });
+  t.exit = /* @__PURE__ */ a(V, { style: { fontSize: "1.75em" } }), t.settings = /* @__PURE__ */ a(B, {}), t.changelog = /* @__PURE__ */ a(o, {}), t.storymode = /* @__PURE__ */ a(x, {}), t.replayEditor = /* @__PURE__ */ a(Z, {}), t.tipInfo = /* @__PURE__ */ a(m, {}), t.remove = /* @__PURE__ */ a(y, {}), t.externalLink = /* @__PURE__ */ a(k, {}), t.tags = /* @__PURE__ */ a(w, {}), t.checkmark = /* @__PURE__ */ a(u, {}), t.playersCount = /* @__PURE__ */ a(z, {}), t.last24h = /* @__PURE__ */ a(F, {}), t.statusLevelAllGood = /* @__PURE__ */ a(v, {}), t.statusLevelMinor = /* @__PURE__ */ a(p, {}), t.statusLevelMajor = /* @__PURE__ */ a(H, {}), t.favoriteInactive = /* @__PURE__ */ a(C, {}), t.favoriteActive = /* @__PURE__ */ a(M, { className: "cfx-color-primary" }), t.account = /* @__PURE__ */ a(h, {}), t.accountLoaded = /* @__PURE__ */ a(d, {}), t.serversListAll = /* @__PURE__ */ a(b, {}), t.serversListSupporters = /* @__PURE__ */ a(L, {}), t.serversListHistory = /* @__PURE__ */ a(f, {}), t.serversListFavorites = t.favoriteInactive, t.serverLastConnected = /* @__PURE__ */ a(s, {}), t.serversFeatured = /* @__PURE__ */ a(l, { style: { fill: "url(#pin-gradient)" } }), t.serversFeaturedUnstyled = /* @__PURE__ */ a(l, {}), t.serverBoost = /* @__PURE__ */ a(e, { style: { fill: "url(#boost-gradient)" } }), t.serverBoostUnstyled = /* @__PURE__ */ a(e, {}), t.serverBurst = /* @__PURE__ */ a(A, { style: { fill: "url(#burst-gradient)" } }), t.upvotesBurst = /* @__PURE__ */ a(n, { style: { width: "1.5em" } }), t.upvotesRecurring = /* @__PURE__ */ a(c, { style: { width: "1.5em" } }), t.upArrow = /* @__PURE__ */ a(g, { style: { width: "1.5em" } });
 })(i || (i = {}));
-const R = {
+const E = {
   gta5: /* @__PURE__ */ a("svg", { className: "brand-icon mirror", children: /* @__PURE__ */ a("use", { xlinkHref: "#logo-gta5" }) }),
   rdr3: /* @__PURE__ */ a("svg", { className: "brand-icon", children: /* @__PURE__ */ a("use", { xlinkHref: "#logo-rdr3" }) }),
   ny: /* @__PURE__ */ a("svg", { className: "brand-icon", children: /* @__PURE__ */ a("use", { xlinkHref: "#logo-ny" }) }),
@@ -96,9 +99,9 @@ const R = {
   ROS: /* @__PURE__ */ a("svg", { className: "brand-icon", viewBox: "0 0 128 128", version: "1.1", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ a("path", { d: "M126.7,82.9L99.6,82.9L95.3,55.9L79.5,82.7L76.5,82.7C74.7,79.6 74,75.1 74,72.3C74,67.7 74.3,63.2 74.3,57.3C74.3,49.5 72,45.4 65.9,43.9L65.9,43.7C78.8,41.9 84.7,33.3 84.7,21.3C84.7,4.2 73.3,0.5 58.4,0.5L18.3,0.5L1.3,80.9L22.6,80.9L28.8,51.6L43,51.6C50.6,51.6 53.7,55.3 53.7,62.4C53.7,67.8 53.1,72.1 53.1,76.2C53.1,77.7 53.4,81.3 54.5,82.7L69.9,99L56.6,127.5L85,110.6L106.2,126.9L102.3,100L126.7,82.9ZM49.4,36.6L32.4,36.6L36.5,17.2L52.3,17.2C57.9,17.2 63.8,18.7 63.8,25.5C63.8,34.2 57.1,36.6 49.4,36.6M85.4,105.9L65.6,117.7L74.7,98.3L63.7,86.7L81.8,86.7L93.2,67.4L96.3,86.9L114.3,86.9L98.1,98.2L101,118L85.4,105.9Z" }) })
 };
 export {
-  R as B,
-  N as F,
+  E as B,
+  P as F,
   i as I,
-  b as a,
-  S as b
+  T as a,
+  j as b
 };

package/dist/components/Flyout/Flyout.js

@@ -3,7 +3,7 @@ import _ from "react";
 import { F as p } from "../../Combination-Dp_plIQU.js";
 import { Button as h } from "../Button/Button.js";
 import { Interactive as f } from "../Interactive/Interactive.js";
-import { I as u } from "../../Icons-BlBKvJD8.js";
+import { I as u } from "../../Icons-NE1cibCU.js";
 import { clsx as l } from "../../utils/clsx.js";
 import { noop as v } from "../../utils/functional.js";
 import { useOutlet as b, useKeyboardClose as z } from "../../utils/hooks.js";

package/dist/components/Input/RichInput.js

@@ -1,7 +1,7 @@
 import { jsxs as B, jsx as o } from "react/jsx-runtime";
 import r from "react";
 import { Button as D } from "../Button/Button.js";
-import { I as F } from "../../Icons-BlBKvJD8.js";
+import { I as F } from "../../Icons-NE1cibCU.js";
 import { clsx as L } from "../../utils/clsx.js";
 import { useDynamicRef as i } from "../../utils/hooks.js";
 import '../../assets/RichInput.css';const T = "_root_16on4_1", j = "_renderer_16on4_1", z = "_small_16on4_8", E = "_large_16on4_13", H = "_clear_16on4_95", t = {

package/dist/components/InputDropzone/InputDropzone.js

@@ -2,7 +2,7 @@ import { jsxs as he, jsx as N } from "react/jsx-runtime";
 import er, { useMemo as L, useRef as te, useReducer as br, useEffect as De, useCallback as D, forwardRef as hr, useImperativeHandle as Dr, Fragment as Ar } from "react";
 import { P as l } from "../../index-DQMInta3.js";
 import { a as M, b as $, c as We, d as Be } from "../../tslib.es6-CBKHJX9H.js";
-import { F as wr } from "../../Icons-BlBKvJD8.js";
+import { F as wr } from "../../Icons-NE1cibCU.js";
 import { Icon as _r } from "../Icon/Icon.js";
 import { clsx as Fr } from "../../utils/clsx.js";
 import { ItemPreview as Or } from "./ItemPreview.js";

package/dist/components/InputDropzone/ItemPreview.js

@@ -1,7 +1,7 @@
 import { jsxs as l, jsx as s } from "react/jsx-runtime";
 import c from "react";
 import { Button as i } from "../Button/Button.js";
-import { I as m } from "../../Icons-BlBKvJD8.js";
+import { I as m } from "../../Icons-NE1cibCU.js";
 import '../../assets/ItemPreview.css';const h = "_root_15ual_1", p = "_filePath_15ual_13", n = {
   root: h,
   filePath: p

package/dist/components/Modal/Modal.js

@@ -1,7 +1,7 @@
 import { jsxs as c, jsx as o } from "react/jsx-runtime";
 import { Button as _ } from "../Button/Button.js";
 import { Overlay as s } from "../Overlay/Overlay.js";
-import { I as f } from "../../Icons-BlBKvJD8.js";
+import { I as f } from "../../Icons-NE1cibCU.js";
 import { noop as n } from "../../utils/functional.js";
 import { useKeyboardClose as h } from "../../utils/hooks.js";
 import '../../assets/Modal.css';const v = "_root_1v8ee_1", C = "_close_1v8ee_27", u = "_header_1v8ee_37", N = "_footer_1v8ee_47", r = {

package/dist/components/Select/Select.js

@@ -5,7 +5,7 @@ import ne, { createContext as st, useMemo as Me, createElement as S, useContext
 import { r as pt, $ as oo } from "../../index-C1KmDBa6.js";
 import { f as bn, _ as Ce, c as ro } from "../../tslib.es6-CBKHJX9H.js";
 import { a as io, u as co } from "../../medium-JVtzoF2c.js";
-import { a as Ut, b as so, I as ao } from "../../Icons-BlBKvJD8.js";
+import { a as Ut, b as so, I as ao } from "../../Icons-NE1cibCU.js";
 import { clsx as xn } from "../../utils/clsx.js";
 import '../../assets/Select.css';var yn = function(e) {
   var t = e.sideCar, n = bn(e, ["sideCar"]);

package/dist/main.js

@@ -54,7 +54,7 @@ import { Text as gr, TextBlock as hr } from "./components/Text/Text.js";
 import { Textarea as Cr } from "./components/Textarea/Textarea.js";
 import { TITLE_OUTLET_ID as Pr, Title as _r } from "./components/Title/Title.js";
 import { InputDropzone as Fr } from "./components/InputDropzone/InputDropzone.js";
-import { B as Ar, I as zr } from "./Icons-BlBKvJD8.js";
+import { B as Ar, I as zr } from "./Icons-NE1cibCU.js";
 import { OnScreenSensor as Vr } from "./components/OnScreenSensor.js";
 import { ui as Nr } from "./components/ui.js";
 import { Symbols as Gr } from "./components/Symbols.js";

package/dist/style-guide/Icons/IconDisplayGrid.js

@@ -1,5 +1,5 @@
 import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { I as s } from "../../Icons-BlBKvJD8.js";
+import { I as s } from "../../Icons-NE1cibCU.js";
 function a() {
   const i = Object.entries(s).map(([e, t]) => ({
     name: e,

package/dist/style-guide/Icons/Icons.d.ts

@@ -28,6 +28,9 @@ export declare namespace Icons {
     const serverBoost: import("react/jsx-runtime").JSX.Element;
     const serverBoostUnstyled: import("react/jsx-runtime").JSX.Element;
     const serverBurst: import("react/jsx-runtime").JSX.Element;
+    const upvotesBurst: import("react/jsx-runtime").JSX.Element;
+    const upvotesRecurring: import("react/jsx-runtime").JSX.Element;
+    const upArrow: import("react/jsx-runtime").JSX.Element;
 }
 export declare const BrandIcon: {
     gta5: import("react/jsx-runtime").JSX.Element;

package/dist/style-guide/Icons/Icons.js

@@ -1,7 +1,10 @@
 import "react/jsx-runtime";
-import { B as n, I as p } from "../../Icons-BlBKvJD8.js";
+import { B as n, I as s } from "../../Icons-NE1cibCU.js";
 import "../../index.esm-BkynlSN6.js";
+import "./NewIcons/UpvotesBurst.js";
+import "./NewIcons/UpvotesRecurring.js";
+import "./NewIcons/UpArrow.js";
 export {
   n as BrandIcon,
-  p as Icons
+  s as Icons
 };

package/dist/style-guide/Icons/NewIcons/UpArrow.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+
+declare function UpArrow(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof UpArrow>;
+export default _default;

package/dist/style-guide/Icons/NewIcons/UpArrow.js

@@ -0,0 +1,27 @@
+import { jsx as o } from "react/jsx-runtime";
+import t from "react";
+function e(r) {
+  return /* @__PURE__ */ o(
+    "svg",
+    {
+      viewBox: "0 0 16 16",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...r,
+      children: /* @__PURE__ */ o(
+        "path",
+        {
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          d: "M8 13V3M8 3L3 8M8 3L13 8"
+        }
+      )
+    }
+  );
+}
+const s = t.memo(e);
+export {
+  s as default
+};

package/dist/style-guide/Icons/NewIcons/UpvotesBurst.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+
+declare function UpvotesBurst(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof UpvotesBurst>;
+export default _default;

package/dist/style-guide/Icons/NewIcons/UpvotesBurst.js

@@ -0,0 +1,26 @@
+import { jsx as t } from "react/jsx-runtime";
+import r from "react";
+function e(o) {
+  return /* @__PURE__ */ t(
+    "svg",
+    {
+      viewBox: "0 0 16 16",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...o,
+      children: /* @__PURE__ */ t(
+        "path",
+        {
+          d: "M7.75 2.75V12.75M12.75 7.75H2.75M4.89 4.89L10.61 10.61M10.61 4.89L4.89 10.61",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    }
+  );
+}
+const i = r.memo(e);
+export {
+  i as default
+};

package/dist/style-guide/Icons/NewIcons/UpvotesRecurring.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+
+declare function UpvotesRecurring(props: React.SVGProps<SVGSVGElement>): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof UpvotesRecurring>;
+export default _default;

package/dist/style-guide/Icons/NewIcons/UpvotesRecurring.js

@@ -0,0 +1,27 @@
+import { jsx as o } from "react/jsx-runtime";
+import e from "react";
+function t(r) {
+  return /* @__PURE__ */ o(
+    "svg",
+    {
+      viewBox: "0 0 16 16",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...r,
+      children: /* @__PURE__ */ o(
+        "path",
+        {
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          d: "M12.33 9.75C11.56 11.52 9.8 12.75 7.75 12.75C4.99 12.75 2.75 10.51 2.75 7.75C2.75 4.99 4.99 2.75 7.75 2.75C9.8 2.75 11.56 3.98 12.33 5.75M13.76 4.13L12.89 7L10.02 6.13M7.53998 5.56995V8.51995L8.68998 9.67995"
+        }
+      )
+    }
+  );
+}
+const s = e.memo(t);
+export {
+  s as default
+};

package/dist/styles-scss/_colors.scss

@@ -1,211 +1,211 @@
-@use "sass:math";
-@use "sass:list";
-
-@function get-luminance($color) {
-  $colors: (
-    'red': red($color),
-    'green': green($color),
-    'blue': blue($color)
-  );
-
-  @each $name, $value in $colors {
-    $adjusted: 0;
-    $value: math.div($value, 255);
-
-    @if $value < 0.03928 {
-      $value: math.div($value, 12.92);
-    } @else {
-      $value: math.div($value + .055, 1.055);
-      $value: math.pow($value, 2.4);
-    }
-
-    $colors: map-merge($colors, ($name: $value));
-  }
-
-  @return (map-get($colors, 'red') * .2126) + (map-get($colors, 'green') * .7152) + (map-get($colors, 'blue') * .0722);
-}
-
-@function interpolate($c1, $c2, $f) {
-  $c1r: red($c1);
-  $c1g: green($c1);
-  $c1b: blue($c1);
-
-  $c2r: red($c2);
-  $c2g: green($c2);
-  $c2b: blue($c2);
-
-  @return rgb(
-    $c1r + $f * ($c2r - $c1r),
-    $c1g + $f * ($c2g - $c1g),
-    $c1b + $f * ($c2b - $c1b),
-  );
-}
-
-@function set-luminance($color, $lum) {
-  $itersLeft: 20;
-  $low: rgb(0, 0, 0);
-  $high: rgb(255, 255, 255);
-
-  @if get-luminance($color) > $lum {
-    $high: $color;
-  } @else {
-    $low: $color;
-  }
-
-  $mid: interpolate($low, $high, .5);
-  $lm: get-luminance($mid);
-
-  @while math.abs($lum - $lm) >= 1e-7 and $itersLeft > 0 {
-    $itersLeft: $itersLeft - 1;
-
-    $mid: interpolate($low, $high, .5);
-    $lm: get-luminance($mid);
-
-    @if $lm > $lum {
-      $high: $mid;
-    } @else {
-      $low: $mid;
-    }
-  }
-
-  @return $mid;
-}
-
-@function color-triplet($color) {
-  @return #{red($color)}, #{green($color)}, #{blue($color)};
-}
-
-
-// LAB <-> RGB
-$oneThird: math.div(1, 3);
-$_16OVER116: math.div(16, 116);
-$_1OVER2P4: math.div(1, 2.4);
-
-@function rgb2lab($color) {
-  $r: math.div(red($color), 255);
-  $g: math.div(green($color), 255);
-  $b: math.div(blue($color), 255);
-
-  @if $r > 0.04045 {
-    $r: math.pow(math.div($r + 0.055, 1.055), 2.4);
-  } @else {
-    $r: math.div($r, 12.92);
-  }
-  @if $g > 0.04045 {
-    $g: math.pow(math.div($g + 0.055, 1.055), 2.4);
-  } @else {
-    $g: math.div($g, 12.92);
-  }
-  @if $b > 0.04045 {
-    $b: math.pow(math.div($b + 0.055, 1.055), 2.4);
-  } @else {
-    $b: math.div($b, 12.92);
-  }
-
-  $x: math.div($r * 0.4124 + $g * 0.3576 + $b * 0.1805, 0.95047);
-  $y: math.div($r * 0.2126 + $g * 0.7152 + $b * 0.0722, 1.00000);
-  $z: math.div($r * 0.0193 + $g * 0.1192 + $b * 0.9505, 1.08883);
-
-  @if $x > 0.008856 {
-    $x: math.pow($x, $oneThird);
-  } @else {
-    $x: (7.787 * $x) + $_16OVER116;
-  }
-  @if $y > 0.008856 {
-    $y: math.pow($y, $oneThird);
-  } @else {
-    $y: (7.787 * $y) + $_16OVER116;
-  }
-  @if $z > 0.008856 {
-    $z: math.pow($z, $oneThird);
-  } @else {
-    $z: (7.787 * $z) + $_16OVER116;
-  }
-
-  @return (
-    'L': (116 * $y) - 16,
-    'a': 500 * ($x - $y),
-    'b': 200 * ($y - $z),
-  );
-}
-
-@function lab2rgb($lab) {
-  $y: math.div(map-get($lab, 'L') + 16, 116);
-  $x: math.div(map-get($lab, 'a'), 500) + $y;
-  $z: $y - math.div(map-get($lab, 'b'), 200);
-
-  $x3: math.pow($x, 3);
-  $y3: math.pow($y, 3);
-  $z3: math.pow($z, 3);
-
-  @if $x3 > 0.008856 {
-    $x: $x3;
-  } @else {
-    $x: math.div($x - $_16OVER116 , 7.787);
-  }
-  @if $y3 > 0.008856 {
-    $y: $y3;
-  } @else {
-    $y: math.div($y - $_16OVER116 , 7.787);
-  }
-  @if $z3 > 0.008856 {
-    $z: $z3;
-  } @else {
-    $z: math.div($z - $_16OVER116 , 7.787);
-  }
-
-  $x: $x * 0.95047;
-  $y: $y * 1.00000;
-  $z: $z * 1.08883;
-
-  $r: $x *  3.2406 + $y * -1.5372 + $z * -0.4986;
-  $g: $x * -0.9689 + $y *  1.8758 + $z *  0.0415;
-  $b: $x *  0.0557 + $y * -0.2040 + $z *  1.0570;
-
-  @if $r > 0.0031308 {
-    $r: 1.055 * math.pow($r, $_1OVER2P4) - 0.055;
-  } @else {
-    $r: 12.92 * $r;
-  }
-  @if $g > 0.0031308 {
-    $g: 1.055 * math.pow($g, $_1OVER2P4) - 0.055;
-  } @else {
-    $g: 12.92 * $g;
-  }
-  @if $b > 0.0031308 {
-    $b: 1.055 * math.pow($b, $_1OVER2P4) - 0.055;
-  } @else {
-    $b: 12.92 * $b;
-  }
-
-  @return rgb(
-    math.clamp(0, $r, 1) * 255,
-    math.clamp(0, $g, 1) * 255,
-    math.clamp(0, $b, 1) * 255,
-  );
-}
-
-@function lab-gradient($s, $e, $start, $stop) {
-  $lst: ();
-
-  @for $i from $start to $stop {
-    $lst: list.append($lst, lab-gradient-step($s, $e, $i, $stop));
-  }
-
-  @return $lst;
-}
-
-@function lab-gradient-step($s, $e, $i, $stop) {
-  $s: rgb2lab($s);
-  $e: rgb2lab($e);
-
-  $a: math.div($i, $stop - 1);
-  $ia: 1 - $a;
-
-  @return lab2rgb((
-    'L': $ia * map-get($s, 'L') + $a * map-get($e, 'L'),
-    'a': $ia * map-get($s, 'a') + $a * map-get($e, 'a'),
-    'b': $ia * map-get($s, 'b') + $a * map-get($e, 'b'),
-  ));
-}
-
+@use "sass:math";
+@use "sass:list";
+
+@function get-luminance($color) {
+  $colors: (
+    'red': red($color),
+    'green': green($color),
+    'blue': blue($color)
+  );
+
+  @each $name, $value in $colors {
+    $adjusted: 0;
+    $value: math.div($value, 255);
+
+    @if $value < 0.03928 {
+      $value: math.div($value, 12.92);
+    } @else {
+      $value: math.div($value + .055, 1.055);
+      $value: math.pow($value, 2.4);
+    }
+
+    $colors: map-merge($colors, ($name: $value));
+  }
+
+  @return (map-get($colors, 'red') * .2126) + (map-get($colors, 'green') * .7152) + (map-get($colors, 'blue') * .0722);
+}
+
+@function interpolate($c1, $c2, $f) {
+  $c1r: red($c1);
+  $c1g: green($c1);
+  $c1b: blue($c1);
+
+  $c2r: red($c2);
+  $c2g: green($c2);
+  $c2b: blue($c2);
+
+  @return rgb(
+    $c1r + $f * ($c2r - $c1r),
+    $c1g + $f * ($c2g - $c1g),
+    $c1b + $f * ($c2b - $c1b),
+  );
+}
+
+@function set-luminance($color, $lum) {
+  $itersLeft: 20;
+  $low: rgb(0, 0, 0);
+  $high: rgb(255, 255, 255);
+
+  @if get-luminance($color) > $lum {
+    $high: $color;
+  } @else {
+    $low: $color;
+  }
+
+  $mid: interpolate($low, $high, .5);
+  $lm: get-luminance($mid);
+
+  @while math.abs($lum - $lm) >= 1e-7 and $itersLeft > 0 {
+    $itersLeft: $itersLeft - 1;
+
+    $mid: interpolate($low, $high, .5);
+    $lm: get-luminance($mid);
+
+    @if $lm > $lum {
+      $high: $mid;
+    } @else {
+      $low: $mid;
+    }
+  }
+
+  @return $mid;
+}
+
+@function color-triplet($color) {
+  @return #{red($color)}, #{green($color)}, #{blue($color)};
+}
+
+
+// LAB <-> RGB
+$oneThird: math.div(1, 3);
+$_16OVER116: math.div(16, 116);
+$_1OVER2P4: math.div(1, 2.4);
+
+@function rgb2lab($color) {
+  $r: math.div(red($color), 255);
+  $g: math.div(green($color), 255);
+  $b: math.div(blue($color), 255);
+
+  @if $r > 0.04045 {
+    $r: math.pow(math.div($r + 0.055, 1.055), 2.4);
+  } @else {
+    $r: math.div($r, 12.92);
+  }
+  @if $g > 0.04045 {
+    $g: math.pow(math.div($g + 0.055, 1.055), 2.4);
+  } @else {
+    $g: math.div($g, 12.92);
+  }
+  @if $b > 0.04045 {
+    $b: math.pow(math.div($b + 0.055, 1.055), 2.4);
+  } @else {
+    $b: math.div($b, 12.92);
+  }
+
+  $x: math.div($r * 0.4124 + $g * 0.3576 + $b * 0.1805, 0.95047);
+  $y: math.div($r * 0.2126 + $g * 0.7152 + $b * 0.0722, 1.00000);
+  $z: math.div($r * 0.0193 + $g * 0.1192 + $b * 0.9505, 1.08883);
+
+  @if $x > 0.008856 {
+    $x: math.pow($x, $oneThird);
+  } @else {
+    $x: (7.787 * $x) + $_16OVER116;
+  }
+  @if $y > 0.008856 {
+    $y: math.pow($y, $oneThird);
+  } @else {
+    $y: (7.787 * $y) + $_16OVER116;
+  }
+  @if $z > 0.008856 {
+    $z: math.pow($z, $oneThird);
+  } @else {
+    $z: (7.787 * $z) + $_16OVER116;
+  }
+
+  @return (
+    'L': (116 * $y) - 16,
+    'a': 500 * ($x - $y),
+    'b': 200 * ($y - $z),
+  );
+}
+
+@function lab2rgb($lab) {
+  $y: math.div(map-get($lab, 'L') + 16, 116);
+  $x: math.div(map-get($lab, 'a'), 500) + $y;
+  $z: $y - math.div(map-get($lab, 'b'), 200);
+
+  $x3: math.pow($x, 3);
+  $y3: math.pow($y, 3);
+  $z3: math.pow($z, 3);
+
+  @if $x3 > 0.008856 {
+    $x: $x3;
+  } @else {
+    $x: math.div($x - $_16OVER116 , 7.787);
+  }
+  @if $y3 > 0.008856 {
+    $y: $y3;
+  } @else {
+    $y: math.div($y - $_16OVER116 , 7.787);
+  }
+  @if $z3 > 0.008856 {
+    $z: $z3;
+  } @else {
+    $z: math.div($z - $_16OVER116 , 7.787);
+  }
+
+  $x: $x * 0.95047;
+  $y: $y * 1.00000;
+  $z: $z * 1.08883;
+
+  $r: $x *  3.2406 + $y * -1.5372 + $z * -0.4986;
+  $g: $x * -0.9689 + $y *  1.8758 + $z *  0.0415;
+  $b: $x *  0.0557 + $y * -0.2040 + $z *  1.0570;
+
+  @if $r > 0.0031308 {
+    $r: 1.055 * math.pow($r, $_1OVER2P4) - 0.055;
+  } @else {
+    $r: 12.92 * $r;
+  }
+  @if $g > 0.0031308 {
+    $g: 1.055 * math.pow($g, $_1OVER2P4) - 0.055;
+  } @else {
+    $g: 12.92 * $g;
+  }
+  @if $b > 0.0031308 {
+    $b: 1.055 * math.pow($b, $_1OVER2P4) - 0.055;
+  } @else {
+    $b: 12.92 * $b;
+  }
+
+  @return rgb(
+    math.clamp(0, $r, 1) * 255,
+    math.clamp(0, $g, 1) * 255,
+    math.clamp(0, $b, 1) * 255,
+  );
+}
+
+@function lab-gradient($s, $e, $start, $stop) {
+  $lst: ();
+
+  @for $i from $start to $stop {
+    $lst: list.append($lst, lab-gradient-step($s, $e, $i, $stop));
+  }
+
+  @return $lst;
+}
+
+@function lab-gradient-step($s, $e, $i, $stop) {
+  $s: rgb2lab($s);
+  $e: rgb2lab($e);
+
+  $a: math.div($i, $stop - 1);
+  $ia: 1 - $a;
+
+  @return lab2rgb((
+    'L': $ia * map-get($s, 'L') + $a * map-get($e, 'L'),
+    'a': $ia * map-get($s, 'a') + $a * map-get($e, 'a'),
+    'b': $ia * map-get($s, 'b') + $a * map-get($e, 'b'),
+  ));
+}
+

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cfx-dev/ui-components",
   "private": false,
-  "version": "1.0.0",
+  "version": "1.0.2",
   "type": "module",
   "license": "MIT",
   "main": "dist/main.js",