triafly-ui-kit 1.0.30 → 1.0.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/_virtual/dayjs.min.js +7 -0
  2. package/dist/_virtual/dayjs.min2.js +4 -0
  3. package/dist/_virtual/ru.js +2 -0
  4. package/dist/_virtual/ru2.js +4 -0
  5. package/dist/assets/src/components/Ui/DatePicker/DatePicker.css +1 -1
  6. package/dist/assets/src/components/Ui/DateRangePicker/DateRangePicker.css +1 -0
  7. package/dist/components/Ui/DatePicker/DatePicker.js +6 -13
  8. package/dist/components/Ui/DatePicker/DatePicker.stories.js +33 -39
  9. package/dist/components/Ui/DatePicker/index.js +4 -0
  10. package/dist/components/Ui/DateRangePicker/DateRangePicker.js +195 -0
  11. package/dist/components/Ui/DateRangePicker/DateRangePicker.stories.js +84 -0
  12. package/dist/components/Ui/DateRangePicker/const.js +37 -0
  13. package/dist/components/Ui/DateRangePicker/hooks/useCalendarRenderer.js +48 -0
  14. package/dist/components/Ui/DateRangePicker/hooks/useChangeDate.js +28 -0
  15. package/dist/components/Ui/DateRangePicker/hooks/useDateNavigation.js +22 -0
  16. package/dist/components/Ui/DateRangePicker/hooks/useDateRangeState.js +24 -0
  17. package/dist/components/Ui/DateRangePicker/hooks/useQuickRange.js +77 -0
  18. package/dist/components/Ui/DateRangePicker/index.js +4 -0
  19. package/dist/main.d.ts +33 -0
  20. package/dist/main.js +157 -153
  21. package/dist/node_modules/dayjs/dayjs.min.js +282 -0
  22. package/dist/node_modules/dayjs/locale/ru.js +36 -0
  23. package/dist/styles/variables.scss +21 -17
  24. package/package.json +3 -2
  25. package/src/assets/fonts/FiraCode-Regular.ttf +0 -0
  26. package/src/assets/fonts/Manrope-Bold.ttf +0 -0
  27. package/src/assets/fonts/Manrope-Regular.ttf +0 -0
  28. package/src/assets/fonts/Manrope-SemiBold.ttf +0 -0
  29. package/src/assets/fonts/RobotoSlab-SemiBold.ttf +0 -0
  30. package/src/styles/variables.scss +4 -2
@@ -0,0 +1,282 @@
1
+ import { __module as C } from "../../_virtual/dayjs.min2.js";
2
+ var G = C.exports, V;
3
+ function tt() {
4
+ return V ? C.exports : (V = 1, function(B, K) {
5
+ (function(A, k) {
6
+ B.exports = k();
7
+ })(G, function() {
8
+ var A = 1e3, k = 6e4, q = 36e5, I = "millisecond", S = "second", w = "minute", _ = "hour", M = "day", T = "week", m = "month", F = "quarter", y = "year", O = "date", J = "Invalid Date", E = /^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/, P = /\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g, Q = { name: "en", weekdays: "Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"), months: "January_February_March_April_May_June_July_August_September_October_November_December".split("_"), ordinal: function(i) {
9
+ var n = ["th", "st", "nd", "rd"], t = i % 100;
10
+ return "[" + i + (n[(t - 20) % 10] || n[t] || n[0]) + "]";
11
+ } }, N = function(i, n, t) {
12
+ var r = String(i);
13
+ return !r || r.length >= n ? i : "" + Array(n + 1 - r.length).join(t) + i;
14
+ }, R = { s: N, z: function(i) {
15
+ var n = -i.utcOffset(), t = Math.abs(n), r = Math.floor(t / 60), e = t % 60;
16
+ return (n <= 0 ? "+" : "-") + N(r, 2, "0") + ":" + N(e, 2, "0");
17
+ }, m: function i(n, t) {
18
+ if (n.date() < t.date()) return -i(t, n);
19
+ var r = 12 * (t.year() - n.year()) + (t.month() - n.month()), e = n.clone().add(r, m), s = t - e < 0, u = n.clone().add(r + (s ? -1 : 1), m);
20
+ return +(-(r + (t - e) / (s ? e - u : u - e)) || 0);
21
+ }, a: function(i) {
22
+ return i < 0 ? Math.ceil(i) || 0 : Math.floor(i);
23
+ }, p: function(i) {
24
+ return { M: m, y, w: T, d: M, D: O, h: _, m: w, s: S, ms: I, Q: F }[i] || String(i || "").toLowerCase().replace(/s$/, "");
25
+ }, u: function(i) {
26
+ return i === void 0;
27
+ } }, x = "en", D = {};
28
+ D[x] = Q;
29
+ var Z = "$isDayjsObject", U = function(i) {
30
+ return i instanceof L || !(!i || !i[Z]);
31
+ }, j = function i(n, t, r) {
32
+ var e;
33
+ if (!n) return x;
34
+ if (typeof n == "string") {
35
+ var s = n.toLowerCase();
36
+ D[s] && (e = s), t && (D[s] = t, e = s);
37
+ var u = n.split("-");
38
+ if (!e && u.length > 1) return i(u[0]);
39
+ } else {
40
+ var o = n.name;
41
+ D[o] = n, e = o;
42
+ }
43
+ return !r && e && (x = e), e || !r && x;
44
+ }, f = function(i, n) {
45
+ if (U(i)) return i.clone();
46
+ var t = typeof n == "object" ? n : {};
47
+ return t.date = i, t.args = arguments, new L(t);
48
+ }, a = R;
49
+ a.l = j, a.i = U, a.w = function(i, n) {
50
+ return f(i, { locale: n.$L, utc: n.$u, x: n.$x, $offset: n.$offset });
51
+ };
52
+ var L = function() {
53
+ function i(t) {
54
+ this.$L = j(t.locale, null, !0), this.parse(t), this.$x = this.$x || t.x || {}, this[Z] = !0;
55
+ }
56
+ var n = i.prototype;
57
+ return n.parse = function(t) {
58
+ this.$d = function(r) {
59
+ var e = r.date, s = r.utc;
60
+ if (e === null) return /* @__PURE__ */ new Date(NaN);
61
+ if (a.u(e)) return /* @__PURE__ */ new Date();
62
+ if (e instanceof Date) return new Date(e);
63
+ if (typeof e == "string" && !/Z$/i.test(e)) {
64
+ var u = e.match(E);
65
+ if (u) {
66
+ var o = u[2] - 1 || 0, c = (u[7] || "0").substring(0, 3);
67
+ return s ? new Date(Date.UTC(u[1], o, u[3] || 1, u[4] || 0, u[5] || 0, u[6] || 0, c)) : new Date(u[1], o, u[3] || 1, u[4] || 0, u[5] || 0, u[6] || 0, c);
68
+ }
69
+ }
70
+ return new Date(e);
71
+ }(t), this.init();
72
+ }, n.init = function() {
73
+ var t = this.$d;
74
+ this.$y = t.getFullYear(), this.$M = t.getMonth(), this.$D = t.getDate(), this.$W = t.getDay(), this.$H = t.getHours(), this.$m = t.getMinutes(), this.$s = t.getSeconds(), this.$ms = t.getMilliseconds();
75
+ }, n.$utils = function() {
76
+ return a;
77
+ }, n.isValid = function() {
78
+ return this.$d.toString() !== J;
79
+ }, n.isSame = function(t, r) {
80
+ var e = f(t);
81
+ return this.startOf(r) <= e && e <= this.endOf(r);
82
+ }, n.isAfter = function(t, r) {
83
+ return f(t) < this.startOf(r);
84
+ }, n.isBefore = function(t, r) {
85
+ return this.endOf(r) < f(t);
86
+ }, n.$g = function(t, r, e) {
87
+ return a.u(t) ? this[r] : this.set(e, t);
88
+ }, n.unix = function() {
89
+ return Math.floor(this.valueOf() / 1e3);
90
+ }, n.valueOf = function() {
91
+ return this.$d.getTime();
92
+ }, n.startOf = function(t, r) {
93
+ var e = this, s = !!a.u(r) || r, u = a.p(t), o = function(p, $) {
94
+ var v = a.w(e.$u ? Date.UTC(e.$y, $, p) : new Date(e.$y, $, p), e);
95
+ return s ? v : v.endOf(M);
96
+ }, c = function(p, $) {
97
+ return a.w(e.toDate()[p].apply(e.toDate("s"), (s ? [0, 0, 0, 0] : [23, 59, 59, 999]).slice($)), e);
98
+ }, h = this.$W, d = this.$M, l = this.$D, b = "set" + (this.$u ? "UTC" : "");
99
+ switch (u) {
100
+ case y:
101
+ return s ? o(1, 0) : o(31, 11);
102
+ case m:
103
+ return s ? o(1, d) : o(0, d + 1);
104
+ case T:
105
+ var g = this.$locale().weekStart || 0, Y = (h < g ? h + 7 : h) - g;
106
+ return o(s ? l - Y : l + (6 - Y), d);
107
+ case M:
108
+ case O:
109
+ return c(b + "Hours", 0);
110
+ case _:
111
+ return c(b + "Minutes", 1);
112
+ case w:
113
+ return c(b + "Seconds", 2);
114
+ case S:
115
+ return c(b + "Milliseconds", 3);
116
+ default:
117
+ return this.clone();
118
+ }
119
+ }, n.endOf = function(t) {
120
+ return this.startOf(t, !1);
121
+ }, n.$set = function(t, r) {
122
+ var e, s = a.p(t), u = "set" + (this.$u ? "UTC" : ""), o = (e = {}, e[M] = u + "Date", e[O] = u + "Date", e[m] = u + "Month", e[y] = u + "FullYear", e[_] = u + "Hours", e[w] = u + "Minutes", e[S] = u + "Seconds", e[I] = u + "Milliseconds", e)[s], c = s === M ? this.$D + (r - this.$W) : r;
123
+ if (s === m || s === y) {
124
+ var h = this.clone().set(O, 1);
125
+ h.$d[o](c), h.init(), this.$d = h.set(O, Math.min(this.$D, h.daysInMonth())).$d;
126
+ } else o && this.$d[o](c);
127
+ return this.init(), this;
128
+ }, n.set = function(t, r) {
129
+ return this.clone().$set(t, r);
130
+ }, n.get = function(t) {
131
+ return this[a.p(t)]();
132
+ }, n.add = function(t, r) {
133
+ var e, s = this;
134
+ t = Number(t);
135
+ var u = a.p(r), o = function(d) {
136
+ var l = f(s);
137
+ return a.w(l.date(l.date() + Math.round(d * t)), s);
138
+ };
139
+ if (u === m) return this.set(m, this.$M + t);
140
+ if (u === y) return this.set(y, this.$y + t);
141
+ if (u === M) return o(1);
142
+ if (u === T) return o(7);
143
+ var c = (e = {}, e[w] = k, e[_] = q, e[S] = A, e)[u] || 1, h = this.$d.getTime() + t * c;
144
+ return a.w(h, this);
145
+ }, n.subtract = function(t, r) {
146
+ return this.add(-1 * t, r);
147
+ }, n.format = function(t) {
148
+ var r = this, e = this.$locale();
149
+ if (!this.isValid()) return e.invalidDate || J;
150
+ var s = t || "YYYY-MM-DDTHH:mm:ssZ", u = a.z(this), o = this.$H, c = this.$m, h = this.$M, d = e.weekdays, l = e.months, b = e.meridiem, g = function($, v, H, W) {
151
+ return $ && ($[v] || $(r, s)) || H[v].slice(0, W);
152
+ }, Y = function($) {
153
+ return a.s(o % 12 || 12, $, "0");
154
+ }, p = b || function($, v, H) {
155
+ var W = $ < 12 ? "AM" : "PM";
156
+ return H ? W.toLowerCase() : W;
157
+ };
158
+ return s.replace(P, function($, v) {
159
+ return v || function(H) {
160
+ switch (H) {
161
+ case "YY":
162
+ return String(r.$y).slice(-2);
163
+ case "YYYY":
164
+ return a.s(r.$y, 4, "0");
165
+ case "M":
166
+ return h + 1;
167
+ case "MM":
168
+ return a.s(h + 1, 2, "0");
169
+ case "MMM":
170
+ return g(e.monthsShort, h, l, 3);
171
+ case "MMMM":
172
+ return g(l, h);
173
+ case "D":
174
+ return r.$D;
175
+ case "DD":
176
+ return a.s(r.$D, 2, "0");
177
+ case "d":
178
+ return String(r.$W);
179
+ case "dd":
180
+ return g(e.weekdaysMin, r.$W, d, 2);
181
+ case "ddd":
182
+ return g(e.weekdaysShort, r.$W, d, 3);
183
+ case "dddd":
184
+ return d[r.$W];
185
+ case "H":
186
+ return String(o);
187
+ case "HH":
188
+ return a.s(o, 2, "0");
189
+ case "h":
190
+ return Y(1);
191
+ case "hh":
192
+ return Y(2);
193
+ case "a":
194
+ return p(o, c, !0);
195
+ case "A":
196
+ return p(o, c, !1);
197
+ case "m":
198
+ return String(c);
199
+ case "mm":
200
+ return a.s(c, 2, "0");
201
+ case "s":
202
+ return String(r.$s);
203
+ case "ss":
204
+ return a.s(r.$s, 2, "0");
205
+ case "SSS":
206
+ return a.s(r.$ms, 3, "0");
207
+ case "Z":
208
+ return u;
209
+ }
210
+ return null;
211
+ }($) || u.replace(":", "");
212
+ });
213
+ }, n.utcOffset = function() {
214
+ return 15 * -Math.round(this.$d.getTimezoneOffset() / 15);
215
+ }, n.diff = function(t, r, e) {
216
+ var s, u = this, o = a.p(r), c = f(t), h = (c.utcOffset() - this.utcOffset()) * k, d = this - c, l = function() {
217
+ return a.m(u, c);
218
+ };
219
+ switch (o) {
220
+ case y:
221
+ s = l() / 12;
222
+ break;
223
+ case m:
224
+ s = l();
225
+ break;
226
+ case F:
227
+ s = l() / 3;
228
+ break;
229
+ case T:
230
+ s = (d - h) / 6048e5;
231
+ break;
232
+ case M:
233
+ s = (d - h) / 864e5;
234
+ break;
235
+ case _:
236
+ s = d / q;
237
+ break;
238
+ case w:
239
+ s = d / k;
240
+ break;
241
+ case S:
242
+ s = d / A;
243
+ break;
244
+ default:
245
+ s = d;
246
+ }
247
+ return e ? s : a.a(s);
248
+ }, n.daysInMonth = function() {
249
+ return this.endOf(m).$D;
250
+ }, n.$locale = function() {
251
+ return D[this.$L];
252
+ }, n.locale = function(t, r) {
253
+ if (!t) return this.$L;
254
+ var e = this.clone(), s = j(t, r, !0);
255
+ return s && (e.$L = s), e;
256
+ }, n.clone = function() {
257
+ return a.w(this.$d, this);
258
+ }, n.toDate = function() {
259
+ return new Date(this.valueOf());
260
+ }, n.toJSON = function() {
261
+ return this.isValid() ? this.toISOString() : null;
262
+ }, n.toISOString = function() {
263
+ return this.$d.toISOString();
264
+ }, n.toString = function() {
265
+ return this.$d.toUTCString();
266
+ }, i;
267
+ }(), z = L.prototype;
268
+ return f.prototype = z, [["$ms", I], ["$s", S], ["$m", w], ["$H", _], ["$W", M], ["$M", m], ["$y", y], ["$D", O]].forEach(function(i) {
269
+ z[i[1]] = function(n) {
270
+ return this.$g(n, i[0], i[1]);
271
+ };
272
+ }), f.extend = function(i, n) {
273
+ return i.$i || (i(n, L, f), i.$i = !0), f;
274
+ }, f.locale = j, f.isDayjs = U, f.unix = function(i) {
275
+ return f(1e3 * i);
276
+ }, f.en = D[x], f.Ls = D, f.p = {}, f;
277
+ });
278
+ }(C), C.exports);
279
+ }
280
+ export {
281
+ tt as __require
282
+ };
@@ -0,0 +1,36 @@
1
+ import { __module as u } from "../../../_virtual/ru2.js";
2
+ import { __require as y } from "../dayjs.min.js";
3
+ var v = u.exports, h;
4
+ function S() {
5
+ return h ? u.exports : (h = 1, function(c, D) {
6
+ (function(m, s) {
7
+ c.exports = s(y());
8
+ })(v, function(m) {
9
+ function s(_) {
10
+ return _ && typeof _ == "object" && "default" in _ ? _ : { default: _ };
11
+ }
12
+ var L = s(m), a = "января_февраля_марта_апреля_мая_июня_июля_августа_сентября_октября_ноября_декабря".split("_"), M = "январь_февраль_март_апрель_май_июнь_июль_август_сентябрь_октябрь_ноябрь_декабрь".split("_"), f = "янв._февр._мар._апр._мая_июня_июля_авг._сент._окт._нояб._дек.".split("_"), d = "янв._февр._март_апр._май_июнь_июль_авг._сент._окт._нояб._дек.".split("_"), l = /D[oD]?(\[[^[\]]*\]|\s)+MMMM?/;
13
+ function r(_, e, Y) {
14
+ var t, n;
15
+ return Y === "m" ? e ? "минута" : "минуту" : _ + " " + (t = +_, n = { mm: e ? "минута_минуты_минут" : "минуту_минуты_минут", hh: "час_часа_часов", dd: "день_дня_дней", MM: "месяц_месяца_месяцев", yy: "год_года_лет" }[Y].split("_"), t % 10 == 1 && t % 100 != 11 ? n[0] : t % 10 >= 2 && t % 10 <= 4 && (t % 100 < 10 || t % 100 >= 20) ? n[1] : n[2]);
16
+ }
17
+ var o = function(_, e) {
18
+ return l.test(e) ? a[_.month()] : M[_.month()];
19
+ };
20
+ o.s = M, o.f = a;
21
+ var i = function(_, e) {
22
+ return l.test(e) ? f[_.month()] : d[_.month()];
23
+ };
24
+ i.s = d, i.f = f;
25
+ var p = { name: "ru", weekdays: "воскресенье_понедельник_вторник_среда_четверг_пятница_суббота".split("_"), weekdaysShort: "вск_пнд_втр_срд_чтв_птн_сбт".split("_"), weekdaysMin: "вс_пн_вт_ср_чт_пт_сб".split("_"), months: o, monthsShort: i, weekStart: 1, yearStart: 4, formats: { LT: "H:mm", LTS: "H:mm:ss", L: "DD.MM.YYYY", LL: "D MMMM YYYY г.", LLL: "D MMMM YYYY г., H:mm", LLLL: "dddd, D MMMM YYYY г., H:mm" }, relativeTime: { future: "через %s", past: "%s назад", s: "несколько секунд", m: r, mm: r, h: "час", hh: r, d: "день", dd: r, M: "месяц", MM: r, y: "год", yy: r }, ordinal: function(_) {
26
+ return _;
27
+ }, meridiem: function(_) {
28
+ return _ < 4 ? "ночи" : _ < 12 ? "утра" : _ < 17 ? "дня" : "вечера";
29
+ } };
30
+ return L.default.locale(p, null, !0), p;
31
+ });
32
+ }(u), u.exports);
33
+ }
34
+ export {
35
+ S as __require
36
+ };
@@ -62,7 +62,24 @@
62
62
 
63
63
  /* Shadows & Effects */
64
64
  --color-fader: #12121220;
65
+ }
65
66
 
67
+ /* Primitives - Test Client */
68
+ html[data-client="test"] {
69
+ --light-brand-20: #F3E8FF;
70
+ --light-brand-50: #D8B4FE;
71
+ --light-brand-100: #A855F7;
72
+ --light-brand-200: #7E22CE;
73
+ --light-brand-300: #4C1D95;
74
+
75
+ --dark-brand-20: #5B21B6;
76
+ --dark-brand-50: #7C3AED;
77
+ --dark-brand-100: #A78BFA;
78
+ --dark-brand-200: #C4B5FD;
79
+ --dark-brand-300: #DDD6FE;
80
+ }
81
+
82
+ html[data-theme="light"] {
66
83
  /* Light Theme */
67
84
 
68
85
  --default-font-color: var(--base-dark);
@@ -83,9 +100,10 @@
83
100
  --color-bg-page-primary-default: var(--light-neutral-50);
84
101
  --color-bg-page-secondary-default: var(--light-neutral-0);
85
102
  --color-bg-neutral-basic-default: var(--light-neutral-0);
86
- --color-bg-neutral-basic-inversed: var(--light-neutral-300);
87
103
  --color-bg-neutral-lightest-default: var(--light-neutral-20);
104
+ --color-bg-neutral-light-default: var(--light-neutral-50);
88
105
  --color-bg-neutral-medium-default: var(--light-neutral-100);
106
+ --color-bg-neutral-basic-inversed: var(--light-neutral-300);
89
107
 
90
108
  /* Light Theme - Border */
91
109
  --color-border-brand-default: var(--light-brand-100);
@@ -160,21 +178,6 @@
160
178
  --color-button-brandlight-filled-hover: var(--light-brand-50);
161
179
  }
162
180
 
163
- /* Primitives - Test Client */
164
- html[data-client="test"] {
165
- --light-brand-20: #F3E8FF;
166
- --light-brand-50: #D8B4FE;
167
- --light-brand-100: #A855F7;
168
- --light-brand-200: #7E22CE;
169
- --light-brand-300: #4C1D95;
170
-
171
- --dark-brand-20: #5B21B6;
172
- --dark-brand-50: #7C3AED;
173
- --dark-brand-100: #A78BFA;
174
- --dark-brand-200: #C4B5FD;
175
- --dark-brand-300: #DDD6FE;
176
- }
177
-
178
181
  html[data-theme="dark"] {
179
182
  /* Dark Theme */
180
183
 
@@ -196,9 +199,10 @@ html[data-theme="dark"] {
196
199
  --color-bg-page-secondary-default: var(--dark-neutral-0);
197
200
  --color-bg-page-secondary-default: var(--dark-neutral-0);
198
201
  --color-bg-neutral-basic-default: var(--dark-neutral-20);
199
- --color-bg-neutral-basic-inversed: var(--dark-neutral-300);
200
202
  --color-bg-neutral-lightest-default: var(--dark-neutral-20);
203
+ --color-bg-neutral-light-default: var(--dark-neutral-50);
201
204
  --color-bg-neutral-medium-default: var(--dark-neutral-100);
205
+ --color-bg-neutral-basic-inversed: var(--dark-neutral-300);
202
206
 
203
207
  /* Dark Theme - Border */
204
208
  --color-border-brand-default: var(--dark-brand-100);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "triafly-ui-kit",
3
- "version": "1.0.30",
3
+ "version": "1.0.32",
4
4
  "description": "UI Kit from Triafly",
5
5
  "main": "./dist/main.js",
6
6
  "module": "./dist/main.js",
@@ -20,7 +20,8 @@
20
20
  },
21
21
  "files": [
22
22
  "dist",
23
- "src/styles"
23
+ "src/styles",
24
+ "src/assets/fonts"
24
25
  ],
25
26
  "scripts": {
26
27
  "build": "npm run build:types && vite build",
@@ -100,9 +100,10 @@ html[data-theme="light"] {
100
100
  --color-bg-page-primary-default: var(--light-neutral-50);
101
101
  --color-bg-page-secondary-default: var(--light-neutral-0);
102
102
  --color-bg-neutral-basic-default: var(--light-neutral-0);
103
- --color-bg-neutral-basic-inversed: var(--light-neutral-300);
104
103
  --color-bg-neutral-lightest-default: var(--light-neutral-20);
104
+ --color-bg-neutral-light-default: var(--light-neutral-50);
105
105
  --color-bg-neutral-medium-default: var(--light-neutral-100);
106
+ --color-bg-neutral-basic-inversed: var(--light-neutral-300);
106
107
 
107
108
  /* Light Theme - Border */
108
109
  --color-border-brand-default: var(--light-brand-100);
@@ -198,9 +199,10 @@ html[data-theme="dark"] {
198
199
  --color-bg-page-secondary-default: var(--dark-neutral-0);
199
200
  --color-bg-page-secondary-default: var(--dark-neutral-0);
200
201
  --color-bg-neutral-basic-default: var(--dark-neutral-20);
201
- --color-bg-neutral-basic-inversed: var(--dark-neutral-300);
202
202
  --color-bg-neutral-lightest-default: var(--dark-neutral-20);
203
+ --color-bg-neutral-light-default: var(--dark-neutral-50);
203
204
  --color-bg-neutral-medium-default: var(--dark-neutral-100);
205
+ --color-bg-neutral-basic-inversed: var(--dark-neutral-300);
204
206
 
205
207
  /* Dark Theme - Border */
206
208
  --color-border-brand-default: var(--dark-brand-100);