ranui 0.2.0-alpha.0 → 0.2.0-alpha.2

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 (82) hide show
  1. package/README.md +26 -0
  2. package/README.zh-CN.md +26 -0
  3. package/dist/bin/build-iife.d.ts +1 -0
  4. package/dist/button-BstLjXNe.js +117 -0
  5. package/dist/button.js +1 -1
  6. package/dist/colorpicker-CGh8pRqo.js +315 -0
  7. package/dist/colorpicker.js +1 -1
  8. package/dist/components/colorpicker/index.d.ts +11 -0
  9. package/dist/components/dropdown/index.d.ts +0 -2
  10. package/dist/components/image/index.d.ts +6 -0
  11. package/dist/components/input/index.d.ts +13 -20
  12. package/dist/components/player/core/view.d.ts +0 -1
  13. package/dist/components/player/index.d.ts +0 -1
  14. package/dist/components/popover/index.d.ts +0 -2
  15. package/dist/components/select/index.d.ts +15 -0
  16. package/dist/{dropdown-C5362qTy.js → dropdown-RqHMRhFE.js} +0 -6
  17. package/dist/dropdown.js +1 -1
  18. package/dist/{icon-DmoEnao5.js → icon-Blm7AbyY.js} +2 -0
  19. package/dist/icon.js +1 -1
  20. package/dist/iife/button.iife.js +1 -0
  21. package/dist/iife/card.iife.js +1 -0
  22. package/dist/iife/checkbox.iife.js +1 -0
  23. package/dist/iife/colorpicker.iife.js +5 -0
  24. package/dist/iife/dropdown.iife.js +1 -0
  25. package/dist/iife/form.iife.js +1 -0
  26. package/dist/iife/icon.iife.js +1 -0
  27. package/dist/iife/image.iife.js +3 -0
  28. package/dist/iife/input.iife.js +1 -0
  29. package/dist/iife/link.iife.js +1 -0
  30. package/dist/iife/loading.iife.js +1 -0
  31. package/dist/iife/math.iife.js +261 -0
  32. package/dist/iife/message.iife.js +1 -0
  33. package/dist/iife/modal.iife.js +1 -0
  34. package/dist/iife/player.iife.js +31 -0
  35. package/dist/iife/popover.iife.js +1 -0
  36. package/dist/iife/progress.iife.js +1 -0
  37. package/dist/iife/radar.iife.js +1 -0
  38. package/dist/iife/route.iife.js +1 -0
  39. package/dist/iife/router.iife.js +1 -0
  40. package/dist/iife/scratch.iife.js +1 -0
  41. package/dist/iife/section.iife.js +1 -0
  42. package/dist/iife/select.iife.js +5 -0
  43. package/dist/iife/skeleton.iife.js +1 -0
  44. package/dist/iife/tab.iife.js +1 -0
  45. package/dist/iife/tabpane.iife.js +1 -0
  46. package/dist/{image-6GayFDqX.js → image-DKm6z7YQ.js} +17 -15
  47. package/dist/image.js +1 -1
  48. package/dist/index.cjs +16 -16
  49. package/dist/index.iife.js +35 -35
  50. package/dist/index.js +16 -16
  51. package/dist/input-Dskw1bAl.js +186 -0
  52. package/dist/input.js +1 -1
  53. package/dist/{katex-es-Cnq5Pk8K.cjs → katex-es-BTpuCxxV.cjs} +7 -7
  54. package/dist/{katex-es-Bpesphgp.js → katex-es-CKRwcaiU.js} +606 -606
  55. package/dist/{loading-Mko22ncl.js → loading-C4QUpm70.js} +1 -1
  56. package/dist/loading.js +1 -1
  57. package/dist/{math-B5PpSnFR.js → math-Dv4nXSoI.js} +1 -1
  58. package/dist/math.js +1 -1
  59. package/dist/{message-CQENvkoi.js → message-De5e1txT.js} +1 -1
  60. package/dist/message.js +1 -1
  61. package/dist/{player-CvfmwWUa.js → player-CqTAmg_E.js} +636 -638
  62. package/dist/player.js +1 -1
  63. package/dist/{popover-BCvHwLZb.js → popover-BY32HNMl.js} +19 -26
  64. package/dist/popover.js +1 -1
  65. package/dist/{progress-BWkNf2J5.js → progress-gZo0knzu.js} +11 -11
  66. package/dist/progress.js +1 -1
  67. package/dist/{radar-CWsawt2g.js → radar-19P5Mtld.js} +17 -17
  68. package/dist/radar.js +1 -1
  69. package/dist/ranui.css +1 -1
  70. package/dist/{select-BmhCUTLb.js → select-BVdUtQX5.js} +72 -51
  71. package/dist/select.js +1 -1
  72. package/dist/{skeleton-DPv9nFhL.js → skeleton-BAdJ6vyA.js} +1 -1
  73. package/dist/skeleton.js +1 -1
  74. package/dist/{tab-C9swK-hm.js → tab-DH2owP2V.js} +0 -1
  75. package/dist/tab.js +1 -1
  76. package/dist/vite.config.d.ts +4 -0
  77. package/docs/COMPONENTS.md +10 -12
  78. package/docs/DESIGN.md +16 -0
  79. package/package.json +3 -3
  80. package/dist/button-DukaD6uL.js +0 -117
  81. package/dist/colorpicker-Ch67dWa_.js +0 -302
  82. package/dist/input-DoraIb3x.js +0 -198
package/dist/player.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as e, t as r } from "./player-CvfmwWUa.js";
1
+ import { n as e, t as r } from "./player-CqTAmg_E.js";
2
2
  export {
3
3
  r as RanPlayer,
4
4
  e as default
@@ -1,8 +1,8 @@
1
- import { c as f, d as I, g as u, h as n, l as s, s as b, u as p } from "./utils-D4pPF77E.js";
1
+ import { c as f, d as I, g as u, h as n, l as d, s as b, u as l } from "./utils-D4pPF77E.js";
2
2
  import { t as T } from "./events-C59wGdni.js";
3
3
  import { _ as k, i as g, p as C } from "./factory-BdsO0dEW.js";
4
4
  import { a as y, n as D } from "./ssr-DSGwPtEd.js";
5
- import "./dropdown-C5362qTy.js";
5
+ import "./dropdown-RqHMRhFE.js";
6
6
  var P = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{visibility:hidden;position:absolute}", x = class extends D {
7
7
  observer;
8
8
  _shadowDom;
@@ -36,7 +36,7 @@ var P = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
36
36
  }
37
37
  };
38
38
  y("r-content", x);
39
- var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:var(--ran-popover-host-display, block)}.ran-popover{box-sizing:var(--ran-popover-box-sizing, border-box);position:var(--ran-popover-position, relative);display:var(--ran-popover-display, block);margin:var(--ran-popover-margin, 0);padding:var(--ran-popover-padding, 0)}.ran-popover-block{display:var(--ran-popover-block-display, block)}", a = 8, v = 300, h = 16, w = {
39
+ var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:var(--ran-popover-host-display, block)}.ran-popover{box-sizing:var(--ran-popover-box-sizing, border-box);position:var(--ran-popover-position, relative);display:var(--ran-popover-display, block);margin:var(--ran-popover-margin, 0);padding:var(--ran-popover-padding, 0)}.ran-popover-block{display:var(--ran-popover-block-display, block)}", s = 8, v = 300, p = 16, w = {
40
40
  bottom: {
41
41
  add: "ran-dropdown-down-in",
42
42
  remove: "ran-dropdown-down-out"
@@ -69,7 +69,6 @@ var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
69
69
  static get observedAttributes() {
70
70
  return [
71
71
  "placement",
72
- "arrow",
73
72
  "trigger",
74
73
  "sheet"
75
74
  ];
@@ -83,34 +82,28 @@ var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
83
82
  this.popoverBlock = t, this._slot = t.querySelector(".slot");
84
83
  }
85
84
  get placement() {
86
- return s(this, "placement", "top");
85
+ return d(this, "placement", "top");
87
86
  }
88
87
  set placement(t) {
89
- p(this, "placement", t);
90
- }
91
- get arrow() {
92
- return s(this, "arrow");
93
- }
94
- set arrow(t) {
95
- p(this, "arrow", t);
88
+ l(this, "placement", t);
96
89
  }
97
90
  get trigger() {
98
- return s(this, "trigger", "hover");
91
+ return d(this, "trigger", "hover");
99
92
  }
100
93
  set trigger(t) {
101
- p(this, "trigger", t);
94
+ l(this, "trigger", t);
102
95
  }
103
96
  get getPopupContainerId() {
104
- return s(this, "getPopupContainerId");
97
+ return d(this, "getPopupContainerId");
105
98
  }
106
99
  set getPopupContainerId(t) {
107
- p(this, "getPopupContainerId", t);
100
+ l(this, "getPopupContainerId", t);
108
101
  }
109
102
  get sheet() {
110
- return s(this, "sheet");
103
+ return d(this, "sheet");
111
104
  }
112
105
  set sheet(t) {
113
- p(this, "sheet", t);
106
+ l(this, "sheet", t);
114
107
  }
115
108
  handlerExternalCss = () => {
116
109
  I(this, this._shadowDom, "sheet", null, this.sheet);
@@ -147,26 +140,26 @@ var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
147
140
  this.removeTimeId && this.removeDropDownTimeId(), this.removeTimeId = setTimeout(() => {
148
141
  this.removeDropDownTimeId(), this.setDropdownDisplayNone();
149
142
  }, v);
150
- }, h);
143
+ }, p);
151
144
  removeDropDownTimeId = n(() => {
152
145
  this.trigger.includes("hover") && !u() && (clearTimeout(this.removeTimeId), this.removeTimeId = void 0);
153
- }, h);
146
+ }, p);
154
147
  setDropdownDisplayBlock = n(() => {
155
148
  this.dropDownInTimeId || (clearTimeout(this.dropDownInTimeId), this.dropDownInTimeId = void 0, clearTimeout(this.dropDownOutTimeId), this.dropDownOutTimeId = void 0, this.popoverContent && this.popoverContent.style.display !== "block" && (this.updateAriaExpanded(!0), this.popoverContent.setAttribute("transit", w[this.placement].add), this.popoverContent?.style.setProperty("display", "block"), this.placementPosition(), this.dropDownInTimeId = setTimeout(() => {
156
149
  this.popoverContent && this.popoverContent.removeAttribute("transit"), clearTimeout(this.dropDownInTimeId), this.dropDownInTimeId = void 0;
157
150
  }, v)));
158
- }, h);
151
+ }, p);
159
152
  setDropdownDisplayNone = n(() => {
160
153
  this.dropDownOutTimeId || (clearTimeout(this.dropDownInTimeId), this.dropDownInTimeId = void 0, clearTimeout(this.dropDownOutTimeId), this.dropDownOutTimeId = void 0, this.popoverContent && this.popoverContent.style.display !== "none" && (this.updateAriaExpanded(!1), this.popoverContent.setAttribute("transit", w[this.placement].remove), this.dropDownOutTimeId = setTimeout(() => {
161
154
  this.popoverContent?.style.setProperty("display", "none"), this.popoverContent && this.popoverContent.removeAttribute("transit"), clearTimeout(this.dropDownOutTimeId), this.dropDownOutTimeId = void 0;
162
155
  }, v)));
163
- }, h);
156
+ }, p);
164
157
  placementPosition = () => {
165
158
  if (!this.popoverContent) return;
166
159
  const { top: t, left: e, bottom: r, width: c, height: m } = this.getBoundingClientRect();
167
- let o = r + window.scrollY + a, i = e + window.scrollX;
168
- const d = document.getElementById(this.getPopupContainerId), l = this.popoverContent.getBoundingClientRect();
169
- this.placement === "top" && (o = t + window.scrollY - Math.max(l.height, m) - a, this.getPopupContainerId && d && (i = e - d.getBoundingClientRect().left, o = t - d.getBoundingClientRect().top - this.popoverContent.clientHeight - a, i = e - d.getBoundingClientRect().left)), this.placement === "left" && (i = e - Math.max(l.width, c) - a, o = t + window.scrollY), this.placement === "right" && (i = e + c + a, o = t + window.scrollY), this.popoverContent.style.setProperty("inset", `${o}px auto auto ${i}px`), this.popoverContent.style.setProperty("--ran-x", `${i}px`), this.popoverContent.style.setProperty("--ran-y", `${o}px`), this.popoverContent.style.setProperty("--ran-dropdown-arrow-anchor-width", `${c}px`), this.popoverContent.style.setProperty("--ran-dropdown-arrow-anchor-height", `${m}px`), this.popoverContent.style.setProperty("--ran-dropdown-min-width", `${l.width}px`), this.popoverContent.style.setProperty("--ran-dropdown-min-height", `${l.height}px`);
160
+ let o = r + window.scrollY + s, i = e + window.scrollX;
161
+ const a = document.getElementById(this.getPopupContainerId), h = this.popoverContent.getBoundingClientRect();
162
+ this.placement === "top" && (o = t + window.scrollY - Math.max(h.height, m) - s, this.getPopupContainerId && a && (i = e - a.getBoundingClientRect().left, o = t - a.getBoundingClientRect().top - this.popoverContent.clientHeight - s, i = e - a.getBoundingClientRect().left)), this.placement === "left" && (i = e - Math.max(h.width, c) - s, o = t + window.scrollY), this.placement === "right" && (i = e + c + s, o = t + window.scrollY), this.popoverContent.style.setProperty("inset", `${o}px auto auto ${i}px`), this.popoverContent.style.setProperty("--ran-x", `${i}px`), this.popoverContent.style.setProperty("--ran-y", `${o}px`), this.popoverContent.style.setProperty("--ran-dropdown-arrow-anchor-width", `${c}px`), this.popoverContent.style.setProperty("--ran-dropdown-arrow-anchor-height", `${m}px`), this.popoverContent.style.setProperty("--ran-dropdown-min-width", `${h.width}px`), this.popoverContent.style.setProperty("--ran-dropdown-min-height", `${h.height}px`);
170
163
  };
171
164
  hoverPopover = (t) => {
172
165
  this.clickPopover(t);
@@ -193,7 +186,7 @@ var _ = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
193
186
  };
194
187
  changePlacement = n(() => {
195
188
  this.placement === "top" && this.popoverContent?.setAttribute("arrow", "bottom"), this.placement === "bottom" && this.popoverContent?.setAttribute("arrow", "top"), this.placement === "left" && this.popoverContent?.setAttribute("arrow", "right"), this.placement === "right" && this.popoverContent?.setAttribute("arrow", "left");
196
- }, h);
189
+ }, p);
197
190
  connectedCallback() {
198
191
  this.initAria(), this.handlerExternalCss();
199
192
  for (const t of this.children) t.tagName === "R-CONTENT" && this.createContent(t.children);
package/dist/popover.js CHANGED
@@ -1,4 +1,4 @@
1
- import { n as a, t as r } from "./popover-BCvHwLZb.js";
1
+ import { n as a, t as r } from "./popover-BY32HNMl.js";
2
2
  export {
3
3
  r as PLACEMENT_TYPE,
4
4
  a as Popover,
@@ -2,13 +2,13 @@ import { c as n, d as p, l as h, s as g, u, y as i } from "./utils-D4pPF77E.js";
2
2
  import { t as l } from "./events-C59wGdni.js";
3
3
  import { i as o } from "./factory-BdsO0dEW.js";
4
4
  import { a as c, n as d } from "./ssr-DSGwPtEd.js";
5
- var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:block;height:var(--ran-progress-height, 20px)}:host:active,:host:focus{outline:0;-webkit-tap-highlight-color:transparent}:host(:focus-visible){outline:var(--ran-progress-focus-outline, 2px solid var(--ran-color-primary, #006bff));outline-offset:var(--ran-progress-focus-outline-offset, 2px);border-radius:var(--ran-radius-full, 9999px)}.ran-progress{position:var(--ran-progress-position, relative);cursor:var(--ran-progress-cursor, pointer);width:var(--ran-progress-width, 100%);height:100%}.ran-progress:active,.ran-progress:focus{outline:0;-webkit-tap-highlight-color:transparent}.ran-progress-wrap{width:var(--ran-progress-wrap-width, 100%);height:var(--ran-progress-wrap-height, 8px);border-radius:var(--ran-progress-wrap-border-radius, 20px);background:var(--ran-progress-wrap-background, var(--ran-gray-200, #ebebeb));position:var(--ran-progress-wrap-position, relative);overflow:var(--ran-progress-wrap-overflow, hidden)}.ran-progress-wrap-value{position:var(--ran-progress-wrap-value-position, absolute);top:var(--ran-progress-wrap-value-top, 0);left:var(--ran-progress-wrap-value-left, 0);height:var(--ran-progress-wrap-value-height, 100%);width:var(--ran-progress-wrap-value-width, 100%);transform:scaleX(var(--progress-percent, 0));transform-origin:var(--ran-progress-wrap-value-transform-origin, 0 0);will-change:var(--ran-progress-wrap-value-will-change, transform);background:var(--ran-progress-wrap-value-background, linear-gradient(90deg, #0bc8bb 2.42%, #00d297 98.79%));border-radius:var(--ran-progress-wrap-value-border-radius, 20px)}.ran-progress-dot{position:var(--ran-progress-dot-position, absolute);top:var(--ran-progress-dot-top, -5px);left:calc(var(--progress-percent, 0) * 100%);transform:translate(-50%);border-radius:var(--ran-progress-dot-border-radius, 50%);width:var(--ran-progress-dot-width, 18px);height:var(--ran-progress-dot-height, 18px);background:var(--ran-progress-dot-background, linear-gradient(90deg, #0bc8bb 2.42%, #00d297 98.79%));cursor:var(--ran-progress-dot-cursor, pointer)}", f = [
5
+ var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{display:block;height:var(--ran-progress-height, 20px)}:host:active,:host:focus{outline:0;-webkit-tap-highlight-color:transparent}:host(:focus-visible){outline:var(--ran-progress-focus-outline, 2px solid var(--ran-color-primary, #006bff));outline-offset:var(--ran-progress-focus-outline-offset, 2px);border-radius:var(--ran-radius-full, 9999px)}.ran-progress{position:var(--ran-progress-position, relative);cursor:var(--ran-progress-cursor, pointer);width:var(--ran-progress-width, 100%);height:100%}.ran-progress:active,.ran-progress:focus{outline:0;-webkit-tap-highlight-color:transparent}.ran-progress-wrap{width:var(--ran-progress-wrap-width, 100%);height:var(--ran-progress-wrap-height, 8px);border-radius:var(--ran-progress-wrap-border-radius, 20px);background:var(--ran-progress-wrap-background, var(--ran-gray-200, #ebebeb));position:var(--ran-progress-wrap-position, relative);overflow:var(--ran-progress-wrap-overflow, hidden)}.ran-progress-wrap-value{position:var(--ran-progress-wrap-value-position, absolute);top:var(--ran-progress-wrap-value-top, 0);left:var(--ran-progress-wrap-value-left, 0);height:var(--ran-progress-wrap-value-height, 100%);width:var(--ran-progress-wrap-value-width, 100%);transform:scaleX(var(--progress-percent, 0));transform-origin:var(--ran-progress-wrap-value-transform-origin, 0 0);will-change:var(--ran-progress-wrap-value-will-change, transform);background:var(--ran-progress-wrap-value-background, linear-gradient(90deg, #0bc8bb 2.42%, #00d297 98.79%));border-radius:var(--ran-progress-wrap-value-border-radius, 20px)}.ran-progress-dot{position:var(--ran-progress-dot-position, absolute);top:var(--ran-progress-dot-top, -5px);left:calc(var(--progress-percent, 0) * 100%);transform:translate(-50%);border-radius:var(--ran-progress-dot-border-radius, 50%);width:var(--ran-progress-dot-width, 18px);height:var(--ran-progress-dot-height, 18px);background:var(--ran-progress-dot-background, linear-gradient(90deg, #0bc8bb 2.42%, #00d297 98.79%));cursor:var(--ran-progress-dot-cursor, pointer)}", b = [
6
6
  "percent",
7
7
  "type",
8
8
  "total",
9
9
  "dot",
10
10
  "sheet"
11
- ], b = class extends d {
11
+ ], f = class extends d {
12
12
  _progress;
13
13
  _progressWrap;
14
14
  _progressWrapValue;
@@ -17,7 +17,7 @@ var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
17
17
  _events = new l();
18
18
  moveProgress = { mouseDown: !1 };
19
19
  static get observedAttributes() {
20
- return f;
20
+ return b;
21
21
  }
22
22
  constructor() {
23
23
  super(), this._shadowDom = n(this, v);
@@ -63,10 +63,8 @@ var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
63
63
  };
64
64
  progressClick = (r) => {
65
65
  if (this.type !== "drag") return;
66
- const t = this._progress.getBoundingClientRect(), e = r.clientX - t.left, s = Math.min(1, Math.max(0, e / this._progress.offsetWidth));
67
- r.clientX, t.left, this._progress.offsetWidth;
68
- const a = s * Number(this.total);
69
- this.percent = String(a), this.total, this.percent, this.updateUI(s), this.change();
66
+ const t = this._progress.getBoundingClientRect(), e = r.clientX - t.left, s = Math.min(1, Math.max(0, e / this._progress.offsetWidth)), a = s * Number(this.total);
67
+ this.percent = String(a), this.updateUI(s), this.change();
70
68
  };
71
69
  progressDotMouseDown = (r) => {
72
70
  this.moveProgress.mouseDown = !0, r.stopPropagation();
@@ -94,7 +92,9 @@ var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
94
92
  } }));
95
93
  };
96
94
  appendProgressDot = () => {
97
- !this._progress || !this._progressDot || (this.dot === "true" && !this._progress.contains(this._progressDot) && this._progress.appendChild(this._progressDot), this.dot === "false" && this._progress.contains(this._progressDot) && this._progress.removeChild(this._progressDot));
95
+ if (!this._progress || !this._progressDot) return;
96
+ const r = this.dot === "true" && this.type === "drag";
97
+ r && !this._progress.contains(this._progressDot) && this._progress.appendChild(this._progressDot), !r && this._progress.contains(this._progressDot) && this._progress.removeChild(this._progressDot);
98
98
  };
99
99
  updateCurrentProgress = () => {
100
100
  if (!this._progress) return;
@@ -114,10 +114,10 @@ var v = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
114
114
  this._events.abort();
115
115
  }
116
116
  attributeChangedCallback(r, t, e) {
117
- t !== e && (r === "dot" && this.appendProgressDot(), (r === "percent" || r === "total") && this.updateCurrentProgress(), r === "sheet" && this.handlerExternalCss());
117
+ t !== e && ((r === "dot" || r === "type") && this.appendProgressDot(), (r === "percent" || r === "total") && this.updateCurrentProgress(), r === "sheet" && this.handlerExternalCss());
118
118
  }
119
119
  };
120
- c("r-progress", b);
120
+ c("r-progress", f);
121
121
  export {
122
- b as t
122
+ f as t
123
123
  };
package/dist/progress.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as o } from "./progress-BWkNf2J5.js";
1
+ import { t as o } from "./progress-gZo0knzu.js";
2
2
  export {
3
3
  o as Progress,
4
4
  o as default
@@ -1,7 +1,7 @@
1
1
  import { _ as m, c as f, d as y, l as R, s as A, u as v } from "./utils-D4pPF77E.js";
2
- import { _ as P, i as w } from "./factory-BdsO0dEW.js";
3
- import { a as p, n as D } from "./ssr-DSGwPtEd.js";
4
- var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{--ran-radar-polygon-color: var(--ran-color-border, #e6e6e6);--ran-radar-line-color: var(--ran-color-border, #e6e6e6);--ran-radar-fill-color: rgba(255, 121, 35, .6);--ran-radar-stroke-color: rgba(255, 121, 35, .6)}.ran-radar{position:var(--ran-radar-position, relative);width:var(--ran-radar-width, 100%);height:var(--ran-radar-height, 100%);display:var(--ran-radar-display, block)}.ran-radar canvas{width:100%;height:100%}", M = "rgba(0,0,0,0)", S = "rgba(0,0,0,1)", d = "#e6e6e6", C = "#e6e6e6", O = "黑体", g = "rgba(255,121,35,0.60)", u = "rgba(255,121,35,0.60)", L = class extends D {
2
+ import { _ as P, i as p } from "./factory-BdsO0dEW.js";
3
+ import { a as w, n as D } from "./ssr-DSGwPtEd.js";
4
+ var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:host{--ran-radar-polygon-color: var(--ran-color-border, #e6e6e6);--ran-radar-line-color: var(--ran-color-border, #e6e6e6);--ran-radar-fill-color: rgba(255, 121, 35, .6);--ran-radar-stroke-color: rgba(255, 121, 35, .6)}.ran-radar{position:var(--ran-radar-position, relative);width:var(--ran-radar-width, 100%);height:var(--ran-radar-height, 100%);display:var(--ran-radar-display, block)}.ran-radar canvas{width:100%;height:100%}", M = "rgba(0,0,0,0)", S = "rgba(0,0,0,1)", d = "#e6e6e6", C = "#e6e6e6", O = "黑体", g = "rgba(255,121,35,0.60)", u = "rgba(255,121,35,0.60)", _ = class extends D {
5
5
  mData;
6
6
  mCount;
7
7
  mW;
@@ -11,10 +11,10 @@ var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
11
11
  static get observedAttributes() {
12
12
  return [
13
13
  "abilitys",
14
- "colorPolygon",
15
- "colorLine",
16
- "fillColor",
17
- "strokeColor",
14
+ "colorpolygon",
15
+ "colorline",
16
+ "fillcolor",
17
+ "strokecolor",
18
18
  "sheet"
19
19
  ];
20
20
  }
@@ -25,7 +25,7 @@ var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
25
25
  resizeObserver;
26
26
  constructor() {
27
27
  super(), this._shadowDom = f(this, k);
28
- const t = A(this._shadowDom, ".ran-radar", () => w().class("ran-radar").children(P("canvas").build()).build()), e = t.querySelector("canvas");
28
+ const t = A(this._shadowDom, ".ran-radar", () => p().class("ran-radar").children(P("canvas").build()).build()), e = t.querySelector("canvas");
29
29
  this.abilityRadarChartContainer = t, this.abilityRadarChart = e, this.resizeObserver = new ResizeObserver(this.resize), this.resizeObserver.observe(this.abilityRadarChartContainer);
30
30
  }
31
31
  resize = () => {
@@ -134,10 +134,10 @@ var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
134
134
  }
135
135
  t.restore();
136
136
  }
137
- drawButton(t, e, r, i, a, o, s, l, n, h, b) {
137
+ drawButton(t, e, r, i, a, o, s, l, n, h, c) {
138
138
  t.beginPath();
139
- const c = m(t);
140
- t.fillStyle = e, t.moveTo(r + s, i), t.lineTo(r + a - s, i), t.arc(r + a - s, i + s, s, Math.PI * 3 / 2, Math.PI * 2), t.lineTo(r + a, i + o - s), t.arc(r + a - s, i + o - s, s, Math.PI, Math.PI / 2), t.lineTo(r + s, i + o), t.arc(r + s, i + o - s, s, Math.PI / 2, Math.PI), t.lineTo(r, i + s), t.arc(r + s, i + s, s, Math.PI, Math.PI * 3 / 2), t.fill(), t.closePath(), t.beginPath(), t.fillStyle = n, t.font = `${b || 12 * c}px ${h}`, t.textAlign = "center", t.textBaseline = "middle", t.fillText(l, r + a / 2, i + o / 2);
139
+ const b = m(t);
140
+ t.fillStyle = e, t.moveTo(r + s, i), t.lineTo(r + a - s, i), t.arc(r + a - s, i + s, s, Math.PI * 3 / 2, Math.PI * 2), t.lineTo(r + a, i + o - s), t.arc(r + a - s, i + o - s, s, Math.PI, Math.PI / 2), t.lineTo(r + s, i + o), t.arc(r + s, i + o - s, s, Math.PI / 2, Math.PI), t.lineTo(r, i + s), t.arc(r + s, i + s, s, Math.PI, Math.PI * 3 / 2), t.fill(), t.closePath(), t.beginPath(), t.fillStyle = n, t.font = `${c || 12 * b}px ${h}`, t.textAlign = "center", t.textBaseline = "middle", t.fillText(l, r + a / 2, i + o / 2);
141
141
  }
142
142
  drawRegion(t) {
143
143
  if (!this.mRadius || !this.mCount || !this.mCenter || !this.mAngle || !this.mData) return;
@@ -168,14 +168,14 @@ var k = ".remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transpar
168
168
  attributeChangedCallback(t, e, r) {
169
169
  e !== r && ([
170
170
  "abilitys",
171
- "colorPolygon",
172
- "colorLine",
173
- "fillColor",
174
- "strokeColor"
171
+ "colorpolygon",
172
+ "colorline",
173
+ "fillcolor",
174
+ "strokecolor"
175
175
  ].includes(t) && this.abilityRadarChartContainer && this.refreshData(), t === "sheet" && this.handlerExternalCss());
176
176
  }
177
177
  };
178
- p("r-radar", L);
178
+ w("r-radar", _);
179
179
  export {
180
- L as t
180
+ _ as t
181
181
  };
package/dist/radar.js CHANGED
@@ -1,4 +1,4 @@
1
- import { t as r } from "./radar-CWsawt2g.js";
1
+ import { t as r } from "./radar-19P5Mtld.js";
2
2
  export {
3
3
  r as RadarChart,
4
4
  r as default
package/dist/ranui.css CHANGED
@@ -1 +1 @@
1
- .remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:root{--ran-background-100: #ffffff;--ran-background-200: #fafafa;--ran-gray-100: #f2f2f2;--ran-gray-200: #ebebeb;--ran-gray-300: #e6e6e6;--ran-gray-400: #eaeaea;--ran-gray-500: #c9c9c9;--ran-gray-600: #a8a8a8;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #4d4d4d;--ran-gray-1000: #171717;--ran-gray-alpha-100: #0000000d;--ran-gray-alpha-200: #00000015;--ran-gray-alpha-300: #0000001a;--ran-gray-alpha-400: #00000014;--ran-gray-alpha-500: #00000036;--ran-gray-alpha-600: #0000003d;--ran-gray-alpha-700: #00000070;--ran-gray-alpha-800: #00000082;--ran-gray-alpha-900: #000000b3;--ran-gray-alpha-1000: #000000e8;--ran-blue-100: #f0f7ff;--ran-blue-200: #e9f4ff;--ran-blue-300: #dfefff;--ran-blue-400: #cae7ff;--ran-blue-500: #94ccff;--ran-blue-600: #48aeff;--ran-blue-700: #006bff;--ran-blue-800: #0059ec;--ran-blue-900: #005ff2;--ran-blue-1000: #002359;--ran-red-100: #ffeeef;--ran-red-200: #ffe8ea;--ran-red-300: #ffe3e4;--ran-red-400: #ffd7d6;--ran-red-500: #ffb1b3;--ran-red-600: #ff676d;--ran-red-700: #fc0035;--ran-red-800: #ea001d;--ran-red-900: #d8001b;--ran-red-1000: #47000c;--ran-amber-100: #fff6de;--ran-amber-200: #fff4cf;--ran-amber-300: #fff1c1;--ran-amber-400: #ffdc73;--ran-amber-500: #ffc543;--ran-amber-600: #ffa600;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #aa4d00;--ran-amber-1000: #561900;--ran-green-100: #ecfdec;--ran-green-200: #e5fce7;--ran-green-300: #d3fad1;--ran-green-400: #b9f5bc;--ran-green-500: #82eb8d;--ran-green-600: #4ce15e;--ran-green-700: #28a948;--ran-green-800: #279141;--ran-green-900: #107d32;--ran-green-1000: #003a00;--ran-color-primary: var(--ran-blue-700);--ran-color-primary-hover: var(--ran-blue-800);--ran-color-primary-active: var(--ran-blue-900);--ran-color-success: var(--ran-green-700);--ran-color-warning: var(--ran-amber-700);--ran-color-danger: var(--ran-red-700);--ran-color-bg: var(--ran-background-100);--ran-color-bg-subtle: var(--ran-background-200);--ran-color-bg-elevated: var(--ran-background-100);--ran-color-bg-muted: var(--ran-gray-100);--ran-color-bg-hover: var(--ran-gray-200);--ran-color-bg-active: var(--ran-gray-300);--ran-color-text: var(--ran-gray-1000);--ran-color-text-secondary: var(--ran-gray-900);--ran-color-text-disabled: var(--ran-gray-700);--ran-color-border: var(--ran-gray-400);--ran-color-border-secondary: var(--ran-gray-300);--ran-color-border-hover: var(--ran-gray-500);--ran-color-border-active: var(--ran-gray-600);--ran-color-link: var(--ran-blue-700);--ran-font-family: "Geist", "Geist Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--ran-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--ran-font-size: 14px;--ran-line-height: 1.5715;--ran-radius-sm: 6px;--ran-radius-md: 12px;--ran-radius-lg: 16px;--ran-radius-full: 9999px;--ran-space-1: 4px;--ran-space-2: 8px;--ran-space-3: 12px;--ran-space-4: 16px;--ran-space-6: 24px;--ran-space-8: 32px;--ran-space-10: 40px;--ran-space-16: 64px;--ran-space-24: 96px;--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .04), 0 2px 4px -2px rgba(0, 0, 0, .05);--ran-shadow-menu: 0 2px 4px rgba(0, 0, 0, .05), 0 8px 24px -6px rgba(0, 0, 0, .14);--ran-shadow-modal: 0 4px 12px rgba(0, 0, 0, .08), 0 20px 48px -12px rgba(0, 0, 0, .22);--ran-z-modal: 1000;--ran-z-dropdown: 1100;--ran-z-message: 1200;--ran-focus-ring: 0 0 0 2px var(--ran-background-100), 0 0 0 4px var(--ran-color-primary);--ran-motion-duration-fast: .15s;--ran-motion-duration-base: .2s;--ran-skin-border-width: 1px;--ran-skin-border-style: solid;--ran-skin-raised-shadow: var(--ran-shadow-elevated);--ran-skin-font-family: var(--ran-font-family)}@media(prefers-color-scheme:dark){:root:not([data-ran-theme=light]):not([theme=light]){--ran-background-100: #000000;--ran-background-200: #000000;--ran-gray-100: #1a1a1a;--ran-gray-200: #1f1f1f;--ran-gray-300: #292929;--ran-gray-400: #2e2e2e;--ran-gray-500: #454545;--ran-gray-600: #878787;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #a0a0a0;--ran-gray-1000: #ededed;--ran-gray-alpha-100: #ffffff12;--ran-gray-alpha-200: #ffffff17;--ran-gray-alpha-300: #ffffff21;--ran-gray-alpha-400: #ffffff24;--ran-gray-alpha-500: #ffffff3d;--ran-gray-alpha-600: #ffffff82;--ran-gray-alpha-700: #ffffff8a;--ran-gray-alpha-800: #ffffff78;--ran-gray-alpha-900: #ffffff9c;--ran-gray-alpha-1000: #ffffffeb;--ran-blue-100: #06193a;--ran-blue-200: #022248;--ran-blue-300: #002f62;--ran-blue-400: #003674;--ran-blue-500: #00418b;--ran-blue-600: #0090ff;--ran-blue-700: #006efe;--ran-blue-800: #005be7;--ran-blue-900: #47a8ff;--ran-blue-1000: #eaf6ff;--ran-red-100: #330a11;--ran-red-200: #440d13;--ran-red-300: #5d0e17;--ran-red-400: #6f101b;--ran-red-500: #88151f;--ran-red-600: #f32e40;--ran-red-700: #f13242;--ran-red-800: #e2162a;--ran-red-900: #ff565f;--ran-red-1000: #ffe9ed;--ran-amber-100: #2a1700;--ran-amber-200: #361900;--ran-amber-300: #502800;--ran-amber-400: #5b3000;--ran-amber-500: #703e00;--ran-amber-600: #ed9a00;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #ff9300;--ran-amber-1000: #fff3d5;--ran-green-100: #002608;--ran-green-200: #00320b;--ran-green-300: #003a0e;--ran-green-400: #004615;--ran-green-500: #006717;--ran-green-600: #00952d;--ran-green-700: #00ac3a;--ran-green-800: #009432;--ran-green-900: #00ca50;--ran-green-1000: #d8ffe4;--ran-color-bg-elevated: var(--ran-gray-100);--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .16);--ran-shadow-menu: 0 1px 1px rgba(0, 0, 0, .2), 0 4px 8px -4px rgba(0, 0, 0, .4), 0 16px 24px -8px rgba(0, 0, 0, .5);--ran-shadow-modal: 0 1px 1px rgba(0, 0, 0, .2), 0 8px 16px -4px rgba(0, 0, 0, .4), 0 24px 32px -8px rgba(0, 0, 0, .5)}}:root[data-ran-theme=dark],:root[theme=dark]{--ran-background-100: #000000;--ran-background-200: #000000;--ran-gray-100: #1a1a1a;--ran-gray-200: #1f1f1f;--ran-gray-300: #292929;--ran-gray-400: #2e2e2e;--ran-gray-500: #454545;--ran-gray-600: #878787;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #a0a0a0;--ran-gray-1000: #ededed;--ran-gray-alpha-100: #ffffff12;--ran-gray-alpha-200: #ffffff17;--ran-gray-alpha-300: #ffffff21;--ran-gray-alpha-400: #ffffff24;--ran-gray-alpha-500: #ffffff3d;--ran-gray-alpha-600: #ffffff82;--ran-gray-alpha-700: #ffffff8a;--ran-gray-alpha-800: #ffffff78;--ran-gray-alpha-900: #ffffff9c;--ran-gray-alpha-1000: #ffffffeb;--ran-blue-100: #06193a;--ran-blue-200: #022248;--ran-blue-300: #002f62;--ran-blue-400: #003674;--ran-blue-500: #00418b;--ran-blue-600: #0090ff;--ran-blue-700: #006efe;--ran-blue-800: #005be7;--ran-blue-900: #47a8ff;--ran-blue-1000: #eaf6ff;--ran-red-100: #330a11;--ran-red-200: #440d13;--ran-red-300: #5d0e17;--ran-red-400: #6f101b;--ran-red-500: #88151f;--ran-red-600: #f32e40;--ran-red-700: #f13242;--ran-red-800: #e2162a;--ran-red-900: #ff565f;--ran-red-1000: #ffe9ed;--ran-amber-100: #2a1700;--ran-amber-200: #361900;--ran-amber-300: #502800;--ran-amber-400: #5b3000;--ran-amber-500: #703e00;--ran-amber-600: #ed9a00;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #ff9300;--ran-amber-1000: #fff3d5;--ran-green-100: #002608;--ran-green-200: #00320b;--ran-green-300: #003a0e;--ran-green-400: #004615;--ran-green-500: #006717;--ran-green-600: #00952d;--ran-green-700: #00ac3a;--ran-green-800: #009432;--ran-green-900: #00ca50;--ran-green-1000: #d8ffe4;--ran-color-bg-elevated: var(--ran-gray-100);--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .16);--ran-shadow-menu: 0 1px 1px rgba(0, 0, 0, .2), 0 4px 8px -4px rgba(0, 0, 0, .4), 0 16px 24px -8px rgba(0, 0, 0, .5);--ran-shadow-modal: 0 1px 1px rgba(0, 0, 0, .2), 0 8px 16px -4px rgba(0, 0, 0, .4), 0 24px 32px -8px rgba(0, 0, 0, .5)}
1
+ .remove-wap-active-focus{outline:0;-webkit-tap-highlight-color:transparent}.remove-wap-active-focus:active,.remove-wap-active-focus:focus{outline:0;-webkit-tap-highlight-color:transparent}:root{--ran-background-100: #ffffff;--ran-background-200: #fafafa;--ran-gray-100: #f2f2f2;--ran-gray-200: #ebebeb;--ran-gray-300: #e6e6e6;--ran-gray-400: #eaeaea;--ran-gray-500: #c9c9c9;--ran-gray-600: #a8a8a8;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #4d4d4d;--ran-gray-1000: #171717;--ran-gray-alpha-100: #0000000d;--ran-gray-alpha-200: #00000015;--ran-gray-alpha-300: #0000001a;--ran-gray-alpha-400: #00000014;--ran-gray-alpha-500: #00000036;--ran-gray-alpha-600: #0000003d;--ran-gray-alpha-700: #00000070;--ran-gray-alpha-800: #00000082;--ran-gray-alpha-900: #000000b3;--ran-gray-alpha-1000: #000000e8;--ran-blue-100: #f0f7ff;--ran-blue-200: #e9f4ff;--ran-blue-300: #dfefff;--ran-blue-400: #cae7ff;--ran-blue-500: #94ccff;--ran-blue-600: #48aeff;--ran-blue-700: #006bff;--ran-blue-800: #0059ec;--ran-blue-900: #005ff2;--ran-blue-1000: #002359;--ran-red-100: #ffeeef;--ran-red-200: #ffe8ea;--ran-red-300: #ffe3e4;--ran-red-400: #ffd7d6;--ran-red-500: #ffb1b3;--ran-red-600: #ff676d;--ran-red-700: #fc0035;--ran-red-800: #ea001d;--ran-red-900: #d8001b;--ran-red-1000: #47000c;--ran-amber-100: #fff6de;--ran-amber-200: #fff4cf;--ran-amber-300: #fff1c1;--ran-amber-400: #ffdc73;--ran-amber-500: #ffc543;--ran-amber-600: #ffa600;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #aa4d00;--ran-amber-1000: #561900;--ran-green-100: #ecfdec;--ran-green-200: #e5fce7;--ran-green-300: #d3fad1;--ran-green-400: #b9f5bc;--ran-green-500: #82eb8d;--ran-green-600: #4ce15e;--ran-green-700: #28a948;--ran-green-800: #279141;--ran-green-900: #107d32;--ran-green-1000: #003a00;--ran-color-primary: var(--ran-blue-700);--ran-color-primary-hover: var(--ran-blue-800);--ran-color-primary-active: var(--ran-blue-900);--ran-color-success: var(--ran-green-700);--ran-color-warning: var(--ran-amber-700);--ran-color-danger: var(--ran-red-700);--ran-color-bg: var(--ran-background-100);--ran-color-bg-subtle: var(--ran-background-200);--ran-color-bg-elevated: var(--ran-background-100);--ran-color-bg-muted: var(--ran-gray-100);--ran-color-bg-hover: var(--ran-gray-200);--ran-color-bg-active: var(--ran-gray-300);--ran-color-text: var(--ran-gray-1000);--ran-color-text-secondary: var(--ran-gray-900);--ran-color-text-disabled: var(--ran-gray-700);--ran-color-border: var(--ran-gray-400);--ran-color-border-secondary: var(--ran-gray-300);--ran-color-border-hover: var(--ran-gray-500);--ran-color-border-active: var(--ran-gray-600);--ran-color-link: var(--ran-blue-700);--ran-font-family: "Geist", "Geist Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--ran-font-mono: "Geist Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--ran-font-size: 14px;--ran-line-height: 1.5715;--ran-radius-sm: 6px;--ran-radius-md: 12px;--ran-radius-lg: 16px;--ran-radius-full: 9999px;--ran-space-1: 4px;--ran-space-2: 8px;--ran-space-3: 12px;--ran-space-4: 16px;--ran-space-6: 24px;--ran-space-8: 32px;--ran-space-10: 40px;--ran-space-16: 64px;--ran-space-24: 96px;--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .04), 0 2px 4px -2px rgba(0, 0, 0, .05);--ran-shadow-menu: 0 2px 4px rgba(0, 0, 0, .05), 0 8px 24px -6px rgba(0, 0, 0, .14);--ran-shadow-modal: 0 4px 12px rgba(0, 0, 0, .08), 0 20px 48px -12px rgba(0, 0, 0, .22);--ran-z-modal: 1000;--ran-z-dropdown: 1100;--ran-z-message: 1200;--ran-focus-ring: 0 0 0 2px var(--ran-background-100), 0 0 0 4px var(--ran-color-primary);--ran-motion-duration-fast: .15s;--ran-motion-duration-base: .2s;--ran-skin-border-width: 1px;--ran-skin-border-style: solid;--ran-skin-raised-shadow: var(--ran-shadow-elevated);--ran-skin-font-family: var(--ran-font-family)}@media(prefers-color-scheme:dark){:root:not([data-ran-theme=light]):not([theme=light]):not(.light){--ran-background-100: #000000;--ran-background-200: #000000;--ran-gray-100: #1a1a1a;--ran-gray-200: #1f1f1f;--ran-gray-300: #292929;--ran-gray-400: #2e2e2e;--ran-gray-500: #454545;--ran-gray-600: #878787;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #a0a0a0;--ran-gray-1000: #ededed;--ran-gray-alpha-100: #ffffff12;--ran-gray-alpha-200: #ffffff17;--ran-gray-alpha-300: #ffffff21;--ran-gray-alpha-400: #ffffff24;--ran-gray-alpha-500: #ffffff3d;--ran-gray-alpha-600: #ffffff82;--ran-gray-alpha-700: #ffffff8a;--ran-gray-alpha-800: #ffffff78;--ran-gray-alpha-900: #ffffff9c;--ran-gray-alpha-1000: #ffffffeb;--ran-blue-100: #06193a;--ran-blue-200: #022248;--ran-blue-300: #002f62;--ran-blue-400: #003674;--ran-blue-500: #00418b;--ran-blue-600: #0090ff;--ran-blue-700: #006efe;--ran-blue-800: #005be7;--ran-blue-900: #47a8ff;--ran-blue-1000: #eaf6ff;--ran-red-100: #330a11;--ran-red-200: #440d13;--ran-red-300: #5d0e17;--ran-red-400: #6f101b;--ran-red-500: #88151f;--ran-red-600: #f32e40;--ran-red-700: #f13242;--ran-red-800: #e2162a;--ran-red-900: #ff565f;--ran-red-1000: #ffe9ed;--ran-amber-100: #2a1700;--ran-amber-200: #361900;--ran-amber-300: #502800;--ran-amber-400: #5b3000;--ran-amber-500: #703e00;--ran-amber-600: #ed9a00;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #ff9300;--ran-amber-1000: #fff3d5;--ran-green-100: #002608;--ran-green-200: #00320b;--ran-green-300: #003a0e;--ran-green-400: #004615;--ran-green-500: #006717;--ran-green-600: #00952d;--ran-green-700: #00ac3a;--ran-green-800: #009432;--ran-green-900: #00ca50;--ran-green-1000: #d8ffe4;--ran-color-bg-elevated: var(--ran-gray-100);--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .16);--ran-shadow-menu: 0 1px 1px rgba(0, 0, 0, .2), 0 4px 8px -4px rgba(0, 0, 0, .4), 0 16px 24px -8px rgba(0, 0, 0, .5);--ran-shadow-modal: 0 1px 1px rgba(0, 0, 0, .2), 0 8px 16px -4px rgba(0, 0, 0, .4), 0 24px 32px -8px rgba(0, 0, 0, .5)}}:root[data-ran-theme=dark],:root[theme=dark],:root.dark{--ran-background-100: #000000;--ran-background-200: #000000;--ran-gray-100: #1a1a1a;--ran-gray-200: #1f1f1f;--ran-gray-300: #292929;--ran-gray-400: #2e2e2e;--ran-gray-500: #454545;--ran-gray-600: #878787;--ran-gray-700: #8f8f8f;--ran-gray-800: #7d7d7d;--ran-gray-900: #a0a0a0;--ran-gray-1000: #ededed;--ran-gray-alpha-100: #ffffff12;--ran-gray-alpha-200: #ffffff17;--ran-gray-alpha-300: #ffffff21;--ran-gray-alpha-400: #ffffff24;--ran-gray-alpha-500: #ffffff3d;--ran-gray-alpha-600: #ffffff82;--ran-gray-alpha-700: #ffffff8a;--ran-gray-alpha-800: #ffffff78;--ran-gray-alpha-900: #ffffff9c;--ran-gray-alpha-1000: #ffffffeb;--ran-blue-100: #06193a;--ran-blue-200: #022248;--ran-blue-300: #002f62;--ran-blue-400: #003674;--ran-blue-500: #00418b;--ran-blue-600: #0090ff;--ran-blue-700: #006efe;--ran-blue-800: #005be7;--ran-blue-900: #47a8ff;--ran-blue-1000: #eaf6ff;--ran-red-100: #330a11;--ran-red-200: #440d13;--ran-red-300: #5d0e17;--ran-red-400: #6f101b;--ran-red-500: #88151f;--ran-red-600: #f32e40;--ran-red-700: #f13242;--ran-red-800: #e2162a;--ran-red-900: #ff565f;--ran-red-1000: #ffe9ed;--ran-amber-100: #2a1700;--ran-amber-200: #361900;--ran-amber-300: #502800;--ran-amber-400: #5b3000;--ran-amber-500: #703e00;--ran-amber-600: #ed9a00;--ran-amber-700: #ffae00;--ran-amber-800: #ff9300;--ran-amber-900: #ff9300;--ran-amber-1000: #fff3d5;--ran-green-100: #002608;--ran-green-200: #00320b;--ran-green-300: #003a0e;--ran-green-400: #004615;--ran-green-500: #006717;--ran-green-600: #00952d;--ran-green-700: #00ac3a;--ran-green-800: #009432;--ran-green-900: #00ca50;--ran-green-1000: #d8ffe4;--ran-color-bg-elevated: var(--ran-gray-100);--ran-shadow-elevated: 0 1px 2px rgba(0, 0, 0, .16);--ran-shadow-menu: 0 1px 1px rgba(0, 0, 0, .2), 0 4px 8px -4px rgba(0, 0, 0, .4), 0 16px 24px -8px rgba(0, 0, 0, .5);--ran-shadow-modal: 0 1px 1px rgba(0, 0, 0, .2), 0 8px 16px -4px rgba(0, 0, 0, .4), 0 24px 32px -8px rgba(0, 0, 0, .5)}