@gryt/theme 0.2.0 → 0.3.0

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.
package/dist/index.js CHANGED
@@ -1,10 +1,10 @@
1
1
  function G(r) {
2
2
  return r <= 0.04045 ? r / 12.92 : ((r + 0.055) / 1.055) ** 2.4;
3
3
  }
4
- function k(r) {
4
+ function v(r) {
5
5
  return r <= 31308e-7 ? 12.92 * r : 1.055 * r ** (1 / 2.4) - 0.055;
6
6
  }
7
- function p(r) {
7
+ function L(r) {
8
8
  return Math.min(1, Math.max(0, r));
9
9
  }
10
10
  function x(r) {
@@ -16,7 +16,7 @@ function x(r) {
16
16
  ];
17
17
  }
18
18
  function N([r, a, t]) {
19
- const e = (o) => Math.round(p(o) * 255).toString(16).padStart(2, "0");
19
+ const e = (o) => Math.round(L(o) * 255).toString(16).padStart(2, "0");
20
20
  return `#${e(r)}${e(a)}${e(t)}`;
21
21
  }
22
22
  function S(r) {
@@ -36,19 +36,19 @@ function S(r) {
36
36
  function y({ l: r, c: a, h: t }) {
37
37
  const e = a * Math.cos(t * Math.PI / 180), o = a * Math.sin(t * Math.PI / 180), c = (r + 0.3963377774 * e + 0.2158037573 * o) ** 3, n = (r - 0.1055613458 * e - 0.0638541728 * o) ** 3, f = (r - 0.0894841775 * e - 1.291485548 * o) ** 3;
38
38
  return N([
39
- k(p(4.0767416621 * c - 3.3077115913 * n + 0.2309699292 * f)),
40
- k(p(-1.2684380046 * c + 2.6097574011 * n - 0.3413193965 * f)),
41
- k(p(-0.0041960863 * c - 0.7034186147 * n + 1.707614701 * f))
39
+ v(L(4.0767416621 * c - 3.3077115913 * n + 0.2309699292 * f)),
40
+ v(L(-1.2684380046 * c + 2.6097574011 * n - 0.3413193965 * f)),
41
+ v(L(-0.0041960863 * c - 0.7034186147 * n + 1.707614701 * f))
42
42
  ]);
43
43
  }
44
- const F = [0.195, 0.24, 0.27, 0.3, 0.33, 0.37, 0.43, 0.52], W = [0.014, 0.026, 0.04, 0.052, 0.062, 0.072, 0.084, 0.1];
44
+ const B = [0.195, 0.24, 0.27, 0.3, 0.33, 0.37, 0.43, 0.52], F = [0.014, 0.026, 0.04, 0.052, 0.062, 0.072, 0.084, 0.1];
45
45
  function h(r, a) {
46
- const { h: t } = S(r), e = F.map((f, d) => y({ l: f, c: W[d], h: t }));
46
+ const { h: t } = S(r), e = B.map((f, d) => y({ l: f, c: F[d], h: t }));
47
47
  e.push(r, a);
48
48
  const o = S(a).l, c = Math.min(0.95, Math.max(0.84, o + 0.04)), n = Math.min(0.98, Math.max(c + 0.06, 0.93));
49
49
  return e.push(y({ l: c, c: 0.11, h: t })), e.push(y({ l: n, c: 0.055, h: t })), e;
50
50
  }
51
- const B = [
51
+ const W = [
52
52
  0.187,
53
53
  0.231,
54
54
  0.245,
@@ -84,11 +84,11 @@ function I(r) {
84
84
  10: r.muted,
85
85
  11: r.text
86
86
  }, t = S(r.border).h;
87
- return B.map(
87
+ return W.map(
88
88
  (e, o) => a[o] ?? y({ l: e, c: K[o], h: t })
89
89
  );
90
90
  }
91
- function R(r, a) {
91
+ function w(r, a) {
92
92
  const t = x(a);
93
93
  return r.map((e) => {
94
94
  const o = x(e);
@@ -99,7 +99,7 @@ function R(r, a) {
99
99
  }
100
100
  if (c < 1e-6) return "transparent";
101
101
  const n = N(
102
- o.map((u, i) => p(t[i] + (u - t[i]) / c))
102
+ o.map((u, i) => L(t[i] + (u - t[i]) / c))
103
103
  ), [f, d, g] = x(n).map((u) => Math.round(u * 255));
104
104
  return `rgb(${f} ${d} ${g} / ${(c * 100).toFixed(1)}%)`;
105
105
  });
@@ -221,11 +221,11 @@ const s = {
221
221
  danger: b(s.color.danger),
222
222
  warning: b(s.color.warning)
223
223
  }, C = T.neutral[3], se = {
224
- neutral: R(_.neutral, s.color.bg),
225
- accent: R(_.accent, s.color.bg)
224
+ neutral: w(_.neutral, s.color.bg),
225
+ accent: w(_.accent, s.color.bg)
226
226
  }, fe = {
227
- neutral: R(T.neutral, l.bg),
228
- accent: R(T.accent, l.bg)
227
+ neutral: w(T.neutral, l.bg),
228
+ accent: w(T.accent, l.bg)
229
229
  };
230
230
  function de(r = {}) {
231
231
  const a = r.appearance === "light", e = { ...a ? {
@@ -259,7 +259,7 @@ function de(r = {}) {
259
259
  f[`--gryt-${d}-${i + 1}`] = u, f[`--color-gryt-${d}-${i + 1}`] = u;
260
260
  });
261
261
  for (const d of ["neutral", "accent"])
262
- R(n[d], e.bg).forEach((g, u) => {
262
+ w(n[d], e.bg).forEach((g, u) => {
263
263
  f[`--gryt-${d}-a${u + 1}`] = g, f[`--color-gryt-${d}-a${u + 1}`] = g;
264
264
  });
265
265
  return {
@@ -310,7 +310,7 @@ function de(r = {}) {
310
310
  "--gryt-radius-full": `${o.full}px`
311
311
  };
312
312
  }
313
- const w = [
313
+ const R = [
314
314
  "accent",
315
315
  "accentLight",
316
316
  "secondary",
@@ -334,7 +334,7 @@ const w = [
334
334
  function $(r) {
335
335
  return r.replace(/\s+/g, " ").trim().slice(0, V);
336
336
  }
337
- const L = {
337
+ const p = {
338
338
  hue: {
339
339
  accent: s.color.accent,
340
340
  accentLight: s.color.accentLight,
@@ -420,18 +420,18 @@ function D(r) {
420
420
  function ge(r, a) {
421
421
  const t = new URLSearchParams(), e = (c) => D(c).slice(1), o = $(r.name ?? "");
422
422
  o !== "" && t.set("name", o);
423
- for (const c of w)
424
- r.hue[c] !== L.hue[c] && t.set(H[c], e(r.hue[c]));
423
+ for (const c of R)
424
+ r.hue[c] !== p.hue[c] && t.set(H[c], e(r.hue[c]));
425
425
  if (r.lightHue !== null)
426
- for (const c of w)
426
+ for (const c of R)
427
427
  t.set(`lh-${H[c]}`, e(r.lightHue[c]));
428
428
  for (const c of ["dark", "light"]) {
429
429
  const n = c === "dark" ? "d" : "l";
430
430
  for (const f of O)
431
- r[c][f] !== L[c][f] && t.set(`${n}-${Y[f]}`, e(r[c][f]));
431
+ r[c][f] !== p[c][f] && t.set(`${n}-${Y[f]}`, e(r[c][f]));
432
432
  }
433
433
  for (const c of M)
434
- r.radius[c] !== L.radius[c] && t.set(`r-${c}`, String(r.radius[c]));
434
+ r.radius[c] !== p.radius[c] && t.set(`r-${c}`, String(r.radius[c]));
435
435
  return a === "light" && t.set("mode", "light"), t;
436
436
  }
437
437
  function ie(r) {
@@ -442,7 +442,7 @@ function ie(r) {
442
442
  return re(new URLSearchParams(t));
443
443
  }
444
444
  function re(r) {
445
- const a = j(L);
445
+ const a = j(p);
446
446
  let t = !1;
447
447
  const e = (c) => {
448
448
  const n = r.get(c);
@@ -451,13 +451,13 @@ function re(r) {
451
451
  return z(f) ? (t = !0, D(f)) : null;
452
452
  }, o = $(r.get("name") ?? "");
453
453
  o !== "" && (a.name = o, t = !0);
454
- for (const c of w) {
454
+ for (const c of R) {
455
455
  const n = e(H[c]);
456
456
  n !== null && (a.hue[c] = n);
457
457
  }
458
458
  if (r.has(`lh-${H.accent}`)) {
459
459
  const c = { ...a.hue };
460
- for (const n of w) {
460
+ for (const n of R) {
461
461
  const f = e(`lh-${H[n]}`);
462
462
  f !== null && (c[n] = f);
463
463
  }
@@ -487,7 +487,7 @@ function ae(r) {
487
487
  return null;
488
488
  }
489
489
  if (typeof a != "object" || a === null) return null;
490
- const t = a, e = j(L);
490
+ const t = a, e = j(p);
491
491
  let o = !1;
492
492
  const c = (n, f) => {
493
493
  if (!(typeof n != "object" || n === null))
@@ -511,14 +511,14 @@ function ae(r) {
511
511
  }
512
512
  return o ? { theme: e, appearance: "dark" } : null;
513
513
  }
514
- const v = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg: 14, xl: 18, full: 999 }, ce = { sm: 4, md: 6, lg: 10, xl: 14, full: 6 }, te = { sm: 6, md: 8, lg: 10, xl: 14, full: 10 }, P = { sm: 2, md: 4, lg: 6, xl: 8, full: 4 }, ne = [
514
+ const k = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg: 14, xl: 18, full: 999 }, ce = { sm: 4, md: 6, lg: 10, xl: 14, full: 6 }, te = { sm: 6, md: 8, lg: 10, xl: 14, full: 10 }, P = { sm: 2, md: 4, lg: 6, xl: 8, full: 4 }, ne = [
515
515
  {
516
516
  id: "gryt",
517
517
  name: "Gryt",
518
518
  note: "What the library ships, from the Gryt code-theme.",
519
519
  group: "Gryt",
520
520
  source: "github.com/Gryt-chat/code-theme",
521
- theme: L
521
+ theme: p
522
522
  },
523
523
  {
524
524
  id: "ember",
@@ -559,7 +559,7 @@ const v = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg:
559
559
  muted: "#6b5b50",
560
560
  text: "#241a14"
561
561
  },
562
- radius: v
562
+ radius: k
563
563
  }
564
564
  },
565
565
  {
@@ -819,7 +819,7 @@ const v = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg:
819
819
  muted: "#6c6f85",
820
820
  text: "#4c4f69"
821
821
  },
822
- radius: v
822
+ radius: k
823
823
  }
824
824
  },
825
825
  {
@@ -927,7 +927,7 @@ const v = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg:
927
927
  muted: "#87867f",
928
928
  text: "#141413"
929
929
  },
930
- radius: v
930
+ radius: k
931
931
  }
932
932
  },
933
933
  {
@@ -1105,9 +1105,14 @@ const v = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, A = { sm: 6, md: 8, lg:
1105
1105
  fast: 150
1106
1106
  }, me = {
1107
1107
  button: { hover: 1.03, press: 0.96 },
1108
+ iconButton: { hover: 1.06, press: 0.94 },
1109
+ checkbox: { hover: 1.08, press: 0.92 },
1110
+ radio: { hover: 1.08, press: 0.92 },
1111
+ switch: { hover: 1.05, press: 0.95 },
1112
+ toggle: { hover: 1.06, press: 0.94 },
1108
1113
  toast: { hover: 1.04, press: 0.96 },
1109
1114
  sliderThumb: { hover: 1.12, press: 0.94 }
1110
- };
1115
+ }, pe = 64;
1111
1116
  function Le(r, a) {
1112
1117
  if (r.length === 0) return a;
1113
1118
  if (a <= 0) return r[0];
@@ -1116,11 +1121,11 @@ function Le(r, a) {
1116
1121
  return c + (n - c) * o;
1117
1122
  }
1118
1123
  export {
1119
- w as GRYT_HUE_KEYS,
1124
+ R as GRYT_HUE_KEYS,
1120
1125
  O as GRYT_NEUTRAL_KEYS,
1121
1126
  M as GRYT_RADIUS_KEYS,
1122
1127
  V as GRYT_THEME_NAME_MAX,
1123
- R as alphaScale,
1128
+ w as alphaScale,
1124
1129
  j as cloneGrytTheme,
1125
1130
  oe as contrast,
1126
1131
  de as createGrytTheme,
@@ -1128,6 +1133,7 @@ export {
1128
1133
  ge as encodeGrytTheme,
1129
1134
  se as grytAlphaScales,
1130
1135
  fe as grytAlphaScalesLight,
1136
+ pe as grytDrawerBleed,
1131
1137
  ye as grytDurations,
1132
1138
  l as grytLightTokens,
1133
1139
  ne as grytPresets,
@@ -1135,7 +1141,7 @@ export {
1135
1141
  me as grytScaleSteps,
1136
1142
  _ as grytScales,
1137
1143
  T as grytScalesLight,
1138
- L as grytTheme,
1144
+ p as grytTheme,
1139
1145
  Z as grytThemeHues,
1140
1146
  ue as grytThemeToOptions,
1141
1147
  s as grytTokens,