@nonoun/native-tokens 0.4.0 → 0.4.1

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.d.ts CHANGED
@@ -1,11 +1,11 @@
1
- import { NuiTokensVariable } from './nui-tokens-variable-element.ts';
2
- import { NuiTokensColors } from './nui-tokens-colors-element.ts';
3
- import { NuiTokensColorSwatch } from './nui-tokens-color-swatch-element.ts';
4
- import { NuiTokensThemes } from './nui-tokens-themes-element.ts';
5
- import { NuiTokens } from './nui-tokens-element.ts';
1
+ import { NTokensVariable } from './tokens-variable-element.ts';
2
+ import { NTokensColors } from './tokens-colors-element.ts';
3
+ import { NTokensColorSwatch } from './tokens-color-swatch-element.ts';
4
+ import { NTokensThemes } from './tokens-themes-element.ts';
5
+ import { NTokens } from './tokens-element.ts';
6
6
  import { buildTokens } from './build-tokens.ts';
7
- export { NuiTokens, NuiTokensVariable, NuiTokensColors, NuiTokensColorSwatch, NuiTokensThemes, buildTokens, };
8
- export type { NuiTokensVariableData } from './nui-tokens-variable-element.ts';
9
- export type { NuiTokensColorEntry } from './nui-tokens-colors-element.ts';
10
- export type { NuiTokensThemeEntry } from './nui-tokens-themes-element.ts';
7
+ export { NTokens, NTokensVariable, NTokensColors, NTokensColorSwatch, NTokensThemes, buildTokens, };
8
+ export type { NTokensVariableData } from './tokens-variable-element.ts';
9
+ export type { NTokensColorEntry } from './tokens-colors-element.ts';
10
+ export type { NTokensThemeEntry } from './tokens-themes-element.ts';
11
11
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAC5E,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAsBhD,OAAO,EACL,SAAS,EACT,iBAAiB,EACjB,eAAe,EACf,oBAAoB,EACpB,eAAe,EACf,WAAW,GACZ,CAAC;AACF,YAAY,EAAE,qBAAqB,EAAE,MAAM,kCAAkC,CAAC;AAC9E,YAAY,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAC1E,YAAY,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAsBhD,OAAO,EACL,OAAO,EACP,eAAe,EACf,aAAa,EACb,kBAAkB,EAClB,aAAa,EACb,WAAW,GACZ,CAAC;AACF,YAAY,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AACxE,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpE,YAAY,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC"}
@@ -1,13 +1,15 @@
1
1
  /* ──────────────────────────────────────────────────────────────────────────────
2
- nui-tokens — Design system token inspector styles.
3
- Opt-in via: @import '@nonoun/nui-tokens/css';
2
+ native-tokens — Design system token inspector styles.
3
+ Opt-in via: @import '@nonoun/native-tokens/css';
4
4
  ────────────────────────────────────────────────────────────────────────────── */
5
5
 
6
6
  @layer ui {
7
7
 
8
8
  /* ── Toolbar ── */
9
9
 
10
- .nui-tokens-toolbar {
10
+ .native-tokens-toolbar {
11
+ --n-ground: var(--n-panel);
12
+
11
13
  position: sticky;
12
14
  top: 0;
13
15
  z-index: 1;
@@ -15,30 +17,30 @@
15
17
  gap: 0.5rem;
16
18
  padding-block: 0.5rem;
17
19
  margin-block-end: 0.5rem;
18
- background: var(--n-ground, var(--n-panel));
20
+ background: var(--n-ground);
19
21
  }
20
22
 
21
- .nui-tokens-toolbar > * {
23
+ .native-tokens-toolbar > * {
22
24
  flex: 1;
23
25
  min-width: 0;
24
26
  }
25
27
 
26
28
  /* ── Section Structure ── */
27
29
 
28
- .nui-tokens-section {
30
+ .native-tokens-section {
29
31
  margin-block-end: 1rem;
30
32
  }
31
33
 
32
- .nui-tokens-section[hidden] {
34
+ .native-tokens-section[hidden] {
33
35
  display: none;
34
36
  }
35
37
 
36
- .nui-tokens-section + .nui-tokens-section:not([hidden]) {
38
+ .native-tokens-section + .native-tokens-section:not([hidden]) {
37
39
  padding-block-start: 0.5rem;
38
40
  border-block-start: 1px solid var(--n-border-muted-neutral);
39
41
  }
40
42
 
41
- .nui-tokens-heading {
43
+ .native-tokens-heading {
42
44
  font-size: 0.6875rem;
43
45
  font-weight: 600;
44
46
  text-transform: uppercase;
@@ -47,20 +49,20 @@
47
49
  margin: 0 0 0.5rem;
48
50
  }
49
51
 
50
- .nui-tokens-subheading {
52
+ .native-tokens-subheading {
51
53
  font-size: 0.625rem;
52
54
  font-weight: 500;
53
55
  color: var(--n-ink-placeholder-neutral);
54
56
  margin: 0.5rem 0 0.25rem;
55
57
  }
56
58
 
57
- /* ── nui-tokens-variable ── */
59
+ /* ── native-tokens-variable ── */
58
60
 
59
- :where(nui-tokens-variable) {
61
+ :where(native-tokens-variable) {
60
62
  display: block;
61
63
  }
62
64
 
63
- .nui-tokens-variable-row {
65
+ .native-tokens-variable-row {
64
66
  display: grid;
65
67
  grid-template-columns: auto 1fr auto;
66
68
  align-items: center;
@@ -68,7 +70,7 @@
68
70
  padding-block: 0.125rem;
69
71
  }
70
72
 
71
- .nui-tokens-variable-label {
73
+ .native-tokens-variable-label {
72
74
  font-size: 0.6875rem;
73
75
  color: var(--n-ink-neutral);
74
76
  white-space: nowrap;
@@ -78,7 +80,7 @@
78
80
  max-width: 5rem;
79
81
  }
80
82
 
81
- .nui-tokens-variable-value {
83
+ .native-tokens-variable-value {
82
84
  font-size: 0.625rem;
83
85
  font-family: ui-monospace, monospace;
84
86
  color: var(--n-ink-muted-neutral);
@@ -90,22 +92,22 @@
90
92
  max-width: 5rem;
91
93
  }
92
94
 
93
- /* ── nui-tokens-colors ── */
95
+ /* ── native-tokens-colors ── */
94
96
 
95
- :where(nui-tokens-colors) {
97
+ :where(native-tokens-colors) {
96
98
  display: block;
97
99
  }
98
100
 
99
- .nui-tokens-colors-strip {
101
+ .native-tokens-colors-strip {
100
102
  display: flex;
101
103
  gap: 2px;
102
104
  border-radius: 0.375rem;
103
105
  overflow: hidden;
104
106
  }
105
107
 
106
- /* ── nui-tokens-color-swatch ── */
108
+ /* ── native-tokens-color-swatch ── */
107
109
 
108
- :where(nui-tokens-color-swatch) {
110
+ :where(native-tokens-color-swatch) {
109
111
  flex: 1;
110
112
  aspect-ratio: 1;
111
113
  min-width: 0;
@@ -116,7 +118,7 @@
116
118
  cursor: pointer;
117
119
  }
118
120
 
119
- .nui-tokens-swatch-label {
121
+ .native-tokens-swatch-label {
120
122
  font-size: 0.5rem;
121
123
  line-height: 1;
122
124
  text-align: center;
@@ -130,7 +132,7 @@
130
132
 
131
133
  /* ── Swatch Popover ── */
132
134
 
133
- .nui-tokens-swatch-popover {
135
+ .native-tokens-swatch-popover {
134
136
  position: fixed;
135
137
  position-area: block-end;
136
138
  position-try-fallbacks: flip-block;
@@ -144,7 +146,7 @@
144
146
  background: var(--n-modal-neutral);
145
147
  border: 1px solid var(--n-border-muted-neutral);
146
148
  border-radius: 0.375rem;
147
- box-shadow: var(--ui-shadow-md);
149
+ box-shadow: var(--n-shadow-md);
148
150
 
149
151
  /* Override UA popover styles */
150
152
  inset: unset;
@@ -159,23 +161,23 @@
159
161
  overlay 150ms ease allow-discrete;
160
162
  }
161
163
 
162
- .nui-tokens-swatch-popover:popover-open {
164
+ .native-tokens-swatch-popover:popover-open {
163
165
  opacity: 1;
164
166
  transform: scale(1);
165
167
  }
166
168
 
167
169
  @starting-style {
168
- .nui-tokens-swatch-popover:popover-open {
170
+ .native-tokens-swatch-popover:popover-open {
169
171
  opacity: 0;
170
172
  transform: scale(0.96);
171
173
  }
172
174
  }
173
175
 
174
- .nui-tokens-swatch-popover[popover]:not(:popover-open) {
176
+ .native-tokens-swatch-popover[popover]:not(:popover-open) {
175
177
  display: none;
176
178
  }
177
179
 
178
- .nui-tokens-swatch-popover-header {
180
+ .native-tokens-swatch-popover-header {
179
181
  font-size: 0.5625rem;
180
182
  font-family: ui-monospace, monospace;
181
183
  color: var(--n-ink-muted-neutral);
@@ -187,7 +189,7 @@
187
189
  text-overflow: ellipsis;
188
190
  }
189
191
 
190
- .nui-tokens-swatch-popover-row {
192
+ .native-tokens-swatch-popover-row {
191
193
  display: flex;
192
194
  align-items: center;
193
195
  gap: 0.5rem;
@@ -202,18 +204,18 @@
202
204
  text-align: left;
203
205
  }
204
206
 
205
- .nui-tokens-swatch-popover-row:hover {
207
+ .native-tokens-swatch-popover-row:hover {
206
208
  background: var(--n-control-neutral);
207
209
  }
208
210
 
209
- .nui-tokens-swatch-popover-label {
211
+ .native-tokens-swatch-popover-label {
210
212
  font-size: 0.5625rem;
211
213
  font-weight: 600;
212
214
  color: var(--n-ink-muted-neutral);
213
215
  min-width: 2.5rem;
214
216
  }
215
217
 
216
- .nui-tokens-swatch-popover-value {
218
+ .native-tokens-swatch-popover-value {
217
219
  font-size: 0.5625rem;
218
220
  font-family: ui-monospace, monospace;
219
221
  color: var(--n-ink-neutral);
@@ -222,9 +224,9 @@
222
224
  text-overflow: ellipsis;
223
225
  }
224
226
 
225
- /* ── nui-tokens-themes ── */
227
+ /* ── native-tokens-themes ── */
226
228
 
227
- :where(nui-tokens-themes) {
229
+ :where(native-tokens-themes) {
228
230
  display: contents;
229
231
  }
230
232
 
@@ -1,5 +1,5 @@
1
- import { UIButton as e, UIElement as t, UIIcon as n, UIListbox as r, UIOption as i, UIRange as a, UISelect as o, define as s, uid as c } from "@nonoun/native-ui";
2
- var l = class extends t {
1
+ import { NButton as e, NIcon as t, NListbox as n, NOption as r, NRange as i, NSelect as a, NativeElement as o, define as s, uid as c } from "@nonoun/native-ui";
2
+ var l = class extends o {
3
3
  static observedAttributes = ["data"];
4
4
  #e = null;
5
5
  #t = null;
@@ -18,10 +18,10 @@ var l = class extends t {
18
18
  if (e) try {
19
19
  this.#e = JSON.parse(e);
20
20
  } catch {}
21
- this.#a(), this.addEventListener("nui-tokens-theme-change", this.#r);
21
+ this.#a(), this.addEventListener("native-tokens-theme-change", this.#r);
22
22
  }
23
23
  teardown() {
24
- this.removeEventListener("nui-tokens-theme-change", this.#r), this.innerHTML = "", this.#t = null, this.#n = null, super.teardown();
24
+ this.removeEventListener("native-tokens-theme-change", this.#r), this.innerHTML = "", this.#t = null, this.#n = null, super.teardown();
25
25
  }
26
26
  #r = () => {
27
27
  requestAnimationFrame(() => this.#i());
@@ -43,17 +43,17 @@ var l = class extends t {
43
43
  let e = this.#e;
44
44
  this.innerHTML = "";
45
45
  let t = document.createElement("div");
46
- t.className = "nui-tokens-variable-row";
46
+ t.className = "native-tokens-variable-row";
47
47
  let n = document.createElement("label");
48
- n.className = "nui-tokens-variable-label", n.textContent = e.name;
49
- let r = document.createElement("ui-range");
48
+ n.className = "native-tokens-variable-label", n.textContent = e.name;
49
+ let r = document.createElement("n-range");
50
50
  r.setAttribute("min", String(e.min ?? 0)), r.setAttribute("max", String(e.max ?? 1)), r.setAttribute("step", String(e.step ?? .01)), r.setAttribute("size", "xs");
51
51
  let i = getComputedStyle(document.documentElement).getPropertyValue(e.token).trim(), a = i ? parseFloat(i) : e.value;
52
52
  r.setAttribute("value", String(a));
53
53
  let o = e.step ?? .01, s = document.createElement("span");
54
- s.className = "nui-tokens-variable-value", s.textContent = a.toFixed(o < .01 ? 3 : 2), r.addEventListener("ui-input", ((t) => {
54
+ s.className = "native-tokens-variable-value", s.textContent = a.toFixed(o < .01 ? 3 : 2), r.addEventListener("native:input", ((t) => {
55
55
  let n = t.detail.value;
56
- document.documentElement.style.setProperty(e.token, String(n)), s.textContent = n.toFixed(o < .01 ? 3 : 2), this.dispatchEvent(new CustomEvent("nui-tokens-change", {
56
+ document.documentElement.style.setProperty(e.token, String(n)), s.textContent = n.toFixed(o < .01 ? 3 : 2), this.dispatchEvent(new CustomEvent("native-tokens-change", {
57
57
  bubbles: !0,
58
58
  detail: {
59
59
  token: e.token,
@@ -62,7 +62,7 @@ var l = class extends t {
62
62
  }));
63
63
  })), this.#t = r, this.#n = s, t.append(n, r, s), this.appendChild(t);
64
64
  }
65
- }, u = class extends t {
65
+ }, u = class extends o {
66
66
  static observedAttributes = ["data"];
67
67
  #e = [];
68
68
  attributeChangedCallback(e, t, n) {
@@ -79,10 +79,10 @@ var l = class extends t {
79
79
  if (e) try {
80
80
  this.#e = JSON.parse(e);
81
81
  } catch {}
82
- this.#n(), this.addEventListener("nui-tokens-change", this.#t), this.addEventListener("nui-tokens-theme-change", this.#t);
82
+ this.#n(), this.addEventListener("native-tokens-change", this.#t), this.addEventListener("native-tokens-theme-change", this.#t);
83
83
  }
84
84
  teardown() {
85
- this.removeEventListener("nui-tokens-change", this.#t), this.removeEventListener("nui-tokens-theme-change", this.#t), this.innerHTML = "", super.teardown();
85
+ this.removeEventListener("native-tokens-change", this.#t), this.removeEventListener("native-tokens-theme-change", this.#t), this.innerHTML = "", super.teardown();
86
86
  }
87
87
  #t = () => {
88
88
  requestAnimationFrame(() => this.#r());
@@ -93,15 +93,15 @@ var l = class extends t {
93
93
  #n() {
94
94
  this.innerHTML = "";
95
95
  let e = document.createElement("div");
96
- e.className = "nui-tokens-colors-strip";
96
+ e.className = "native-tokens-colors-strip";
97
97
  for (let t of this.#e) {
98
- let n = document.createElement("nui-tokens-color-swatch");
98
+ let n = document.createElement("native-tokens-color-swatch");
99
99
  n.setAttribute("token", t.token), n.setAttribute("name", t.name), e.appendChild(n);
100
100
  }
101
101
  this.appendChild(e);
102
102
  }
103
103
  #r() {
104
- this.querySelectorAll("nui-tokens-color-swatch").forEach((e) => e.refresh());
104
+ this.querySelectorAll("native-tokens-color-swatch").forEach((e) => e.refresh());
105
105
  }
106
106
  };
107
107
  /** Parse a computed `rgb(...)` / `rgba(...)` string into [r, g, b, a] (0–255, 0–1). */
@@ -217,7 +217,7 @@ var C = [
217
217
  label: "HSB",
218
218
  fn: S
219
219
  }
220
- ], w = class extends t {
220
+ ], w = class extends o {
221
221
  static observedAttributes = ["token", "name"];
222
222
  #e = null;
223
223
  #t = null;
@@ -240,12 +240,12 @@ var C = [
240
240
  setup() {
241
241
  super.setup(), this.token && (this.style.background = `var(${this.token})`, this.title = `${this.name}\n${this.token}`);
242
242
  let e = document.createElement("span");
243
- e.className = "nui-tokens-swatch-label", e.textContent = this.name, this.#t = e, this.appendChild(e), this.#n = c("swatch"), this.style.setProperty("anchor-name", `--${this.#n}`);
243
+ e.className = "native-tokens-swatch-label", e.textContent = this.name, this.#t = e, this.appendChild(e), this.#n = c("swatch"), this.style.setProperty("anchor-name", `--${this.#n}`);
244
244
  let t = document.createElement("div");
245
- t.className = "nui-tokens-swatch-popover", t.setAttribute("popover", "auto"), t.style.setProperty("position-anchor", `--${this.#n}`), this.#e = t, this.appendChild(t), this.addEventListener("click", this.#i), this.addEventListener("nui-tokens-change", this.#r), this.addEventListener("nui-tokens-theme-change", this.#r), requestAnimationFrame(() => this.#a());
245
+ t.className = "native-tokens-swatch-popover", t.setAttribute("popover", "auto"), t.style.setProperty("position-anchor", `--${this.#n}`), this.#e = t, this.appendChild(t), this.addEventListener("click", this.#i), this.addEventListener("native-tokens-change", this.#r), this.addEventListener("native-tokens-theme-change", this.#r), requestAnimationFrame(() => this.#a());
246
246
  }
247
247
  teardown() {
248
- this.removeEventListener("click", this.#i), this.removeEventListener("nui-tokens-change", this.#r), this.removeEventListener("nui-tokens-theme-change", this.#r), this.#e = null, this.#t = null, this.innerHTML = "", super.teardown();
248
+ this.removeEventListener("click", this.#i), this.removeEventListener("native-tokens-change", this.#r), this.removeEventListener("native-tokens-theme-change", this.#r), this.#e = null, this.#t = null, this.innerHTML = "", super.teardown();
249
249
  }
250
250
  /** Refresh background and contrast from current token value. */
251
251
  refresh() {
@@ -255,7 +255,7 @@ var C = [
255
255
  requestAnimationFrame(() => this.refresh());
256
256
  };
257
257
  #i = (e) => {
258
- if (!(this.#e && e.target.closest(".nui-tokens-swatch-popover")) && this.#e) {
258
+ if (!(this.#e && e.target.closest(".native-tokens-swatch-popover")) && this.#e) {
259
259
  this.#o();
260
260
  try {
261
261
  this.#e.showPopover();
@@ -270,14 +270,14 @@ var C = [
270
270
  if (!this.#e) return;
271
271
  this.#e.innerHTML = "";
272
272
  let e = getComputedStyle(this).backgroundColor, [t, n, r, i] = d(e), a = document.createElement("div");
273
- a.className = "nui-tokens-swatch-popover-header", a.textContent = this.token, this.#e.appendChild(a);
273
+ a.className = "native-tokens-swatch-popover-header", a.textContent = this.token, this.#e.appendChild(a);
274
274
  for (let e of C) {
275
275
  let a = e.fn(t, n, r, i), o = document.createElement("button");
276
- o.className = "nui-tokens-swatch-popover-row", o.type = "button";
276
+ o.className = "native-tokens-swatch-popover-row", o.type = "button";
277
277
  let s = document.createElement("span");
278
- s.className = "nui-tokens-swatch-popover-label", s.textContent = e.label;
278
+ s.className = "native-tokens-swatch-popover-label", s.textContent = e.label;
279
279
  let c = document.createElement("span");
280
- c.className = "nui-tokens-swatch-popover-value", c.textContent = a, o.append(s, c), o.addEventListener("click", (e) => {
280
+ c.className = "native-tokens-swatch-popover-value", c.textContent = a, o.append(s, c), o.addEventListener("click", (e) => {
281
281
  e.stopPropagation(), navigator.clipboard.writeText(a).then(() => {
282
282
  c.textContent = "Copied!", setTimeout(() => {
283
283
  c.textContent = a;
@@ -286,7 +286,7 @@ var C = [
286
286
  }), this.#e.appendChild(o);
287
287
  }
288
288
  }
289
- }, T = /* @__PURE__ */ "color-env-lightness-min.color-env-lightness-max.color-env-lightness-delta.color-env-chroma.color-env-chroma-k-muted.color-env-chroma-k-vivid.color-env-chroma-k-edge.color-env-alpha.color-env-alpha-delta.color-env-hue-neutral.color-env-chroma-neutral.color-env-lightness-neutral.color-env-hue-accent.color-env-chroma-accent.color-env-lightness-accent.color-env-hue-info.color-env-chroma-info.color-env-lightness-info.color-env-hue-success.color-env-chroma-success.color-env-lightness-success.color-env-hue-warning.color-env-chroma-warning.color-env-lightness-warning.color-env-hue-danger.color-env-chroma-danger.color-env-lightness-danger".split("."), E = class extends t {
289
+ }, T = /* @__PURE__ */ "n-env-lightness-min.n-env-lightness-max.n-env-lightness-delta.n-env-chroma.n-env-chroma-k-muted.n-env-chroma-k-vivid.n-env-chroma-k-edge.n-env-alpha.n-env-alpha-delta.n-env-hue-neutral.n-env-chroma-neutral.n-env-lightness-neutral.n-env-hue-accent.n-env-chroma-accent.n-env-lightness-accent.n-env-hue-info.n-env-chroma-info.n-env-lightness-info.n-env-hue-success.n-env-chroma-success.n-env-lightness-success.n-env-hue-warning.n-env-chroma-warning.n-env-lightness-warning.n-env-hue-danger.n-env-chroma-danger.n-env-lightness-danger".split("."), E = class extends o {
290
290
  static observedAttributes = ["data"];
291
291
  #e = [];
292
292
  attributeChangedCallback(e, t, n) {
@@ -310,18 +310,18 @@ var C = [
310
310
  }
311
311
  #t() {
312
312
  this.innerHTML = "";
313
- let e = document.documentElement.getAttribute("theme") ?? "", t = document.createElement("ui-select");
313
+ let e = document.documentElement.getAttribute("theme") ?? "", t = document.createElement("n-select");
314
314
  t.setAttribute("size", "xs"), t.setAttribute("placeholder", "Theme..."), t.setAttribute("options", JSON.stringify(this.#e.map((e) => ({
315
315
  value: e.value,
316
316
  label: e.name
317
- })))), t.setAttribute("value", e), t.addEventListener("ui-change", ((e) => {
317
+ })))), t.setAttribute("value", e), t.addEventListener("native:change", ((e) => {
318
318
  this.#n(e.detail.value);
319
319
  })), this.appendChild(t);
320
320
  }
321
321
  #n(e) {
322
322
  let t = document.documentElement;
323
323
  for (let e of T) t.style.removeProperty("--" + e);
324
- e ? t.setAttribute("theme", e) : t.removeAttribute("theme"), this.dispatchEvent(new CustomEvent("nui-tokens-theme-change", {
324
+ e ? t.setAttribute("theme", e) : t.removeAttribute("theme"), this.dispatchEvent(new CustomEvent("native-tokens-theme-change", {
325
325
  bubbles: !0,
326
326
  detail: { theme: e }
327
327
  }));
@@ -346,7 +346,7 @@ var C = [
346
346
  ], O = [
347
347
  {
348
348
  name: "L min",
349
- token: "--color-env-lightness-min",
349
+ token: "--n-env-lightness-min",
350
350
  value: .15,
351
351
  step: .01,
352
352
  min: 0,
@@ -355,7 +355,7 @@ var C = [
355
355
  },
356
356
  {
357
357
  name: "L max",
358
- token: "--color-env-lightness-max",
358
+ token: "--n-env-lightness-max",
359
359
  value: 1,
360
360
  step: .01,
361
361
  min: 0,
@@ -364,7 +364,7 @@ var C = [
364
364
  },
365
365
  {
366
366
  name: "L delta",
367
- token: "--color-env-lightness-delta",
367
+ token: "--n-env-lightness-delta",
368
368
  value: .015,
369
369
  step: .005,
370
370
  min: 0,
@@ -373,7 +373,7 @@ var C = [
373
373
  },
374
374
  {
375
375
  name: "Chroma",
376
- token: "--color-env-chroma",
376
+ token: "--n-env-chroma",
377
377
  value: .2,
378
378
  step: .005,
379
379
  min: 0,
@@ -382,7 +382,7 @@ var C = [
382
382
  },
383
383
  {
384
384
  name: "C muted",
385
- token: "--color-env-chroma-k-muted",
385
+ token: "--n-env-chroma-k-muted",
386
386
  value: .125,
387
387
  step: .01,
388
388
  min: 0,
@@ -391,7 +391,7 @@ var C = [
391
391
  },
392
392
  {
393
393
  name: "C vivid",
394
- token: "--color-env-chroma-k-vivid",
394
+ token: "--n-env-chroma-k-vivid",
395
395
  value: 1,
396
396
  step: .01,
397
397
  min: 0,
@@ -400,7 +400,7 @@ var C = [
400
400
  },
401
401
  {
402
402
  name: "C edge",
403
- token: "--color-env-chroma-k-edge",
403
+ token: "--n-env-chroma-k-edge",
404
404
  value: .05,
405
405
  step: .01,
406
406
  min: 0,
@@ -409,7 +409,7 @@ var C = [
409
409
  },
410
410
  {
411
411
  name: "Alpha",
412
- token: "--color-env-alpha",
412
+ token: "--n-env-alpha",
413
413
  value: .85,
414
414
  step: .01,
415
415
  min: 0,
@@ -418,7 +418,7 @@ var C = [
418
418
  },
419
419
  {
420
420
  name: "A delta",
421
- token: "--color-env-alpha-delta",
421
+ token: "--n-env-alpha-delta",
422
422
  value: .02,
423
423
  step: .005,
424
424
  min: 0,
@@ -483,20 +483,20 @@ var C = [
483
483
  ];
484
484
  function F(e, t) {
485
485
  let n = document.createElement("div");
486
- n.className = "nui-tokens-section", t && (n.dataset.family = t);
486
+ n.className = "native-tokens-section", t && (n.dataset.family = t);
487
487
  let r = document.createElement("h3");
488
- return r.className = "nui-tokens-heading", r.textContent = e, n.appendChild(r), n;
488
+ return r.className = "native-tokens-heading", r.textContent = e, n.appendChild(r), n;
489
489
  }
490
490
  function I(e) {
491
491
  let t = document.createElement("h4");
492
- return t.className = "nui-tokens-subheading", t.textContent = e, t;
492
+ return t.className = "native-tokens-subheading", t.textContent = e, t;
493
493
  }
494
494
  function L(e) {
495
- let t = document.createElement("nui-tokens-colors");
495
+ let t = document.createElement("native-tokens-colors");
496
496
  return t.setAttribute("data", JSON.stringify(e)), t;
497
497
  }
498
498
  function R(e) {
499
- let t = document.createElement("nui-tokens-variable");
499
+ let t = document.createElement("native-tokens-variable");
500
500
  return t.setAttribute("data", JSON.stringify({
501
501
  name: e.name,
502
502
  type: "number",
@@ -509,8 +509,8 @@ function R(e) {
509
509
  }
510
510
  function z(e) {
511
511
  let t = document.createElement("div");
512
- t.className = "nui-tokens-toolbar";
513
- let n = document.createElement("nui-tokens-themes");
512
+ t.className = "native-tokens-toolbar";
513
+ let n = document.createElement("native-tokens-themes");
514
514
  n.setAttribute("data", JSON.stringify(D)), t.appendChild(n);
515
515
  let r = [{
516
516
  value: "all",
@@ -518,7 +518,7 @@ function z(e) {
518
518
  }, ...k.map((e) => ({
519
519
  value: e,
520
520
  label: e.charAt(0).toUpperCase() + e.slice(1)
521
- }))], i = document.createElement("ui-select");
521
+ }))], i = document.createElement("n-select");
522
522
  i.setAttribute("size", "xs"), i.setAttribute("placeholder", "Family..."), i.setAttribute("options", JSON.stringify(r)), i.setAttribute("value", "all"), t.appendChild(i), e.appendChild(t);
523
523
  let a = "", o = null;
524
524
  for (let t of O) t.group !== a && (a = t.group, o = F(t.group, "env"), e.appendChild(o)), o.appendChild(R(t));
@@ -526,21 +526,21 @@ function z(e) {
526
526
  let n = F(t.charAt(0).toUpperCase() + t.slice(1), t);
527
527
  n.appendChild(R({
528
528
  name: "Hue",
529
- token: `--color-env-hue-${t}`,
529
+ token: `--n-env-hue-${t}`,
530
530
  value: 230,
531
531
  step: 1,
532
532
  min: 0,
533
533
  max: 360
534
534
  })), n.appendChild(R({
535
535
  name: "Chroma",
536
- token: `--color-env-chroma-${t}`,
536
+ token: `--n-env-chroma-${t}`,
537
537
  value: .5,
538
538
  step: .01,
539
539
  min: 0,
540
540
  max: 1
541
541
  })), n.appendChild(R({
542
542
  name: "Lightness",
543
- token: `--color-env-lightness-${t}`,
543
+ token: `--n-env-lightness-${t}`,
544
544
  value: .5,
545
545
  step: .01,
546
546
  min: 0,
@@ -571,18 +571,18 @@ function z(e) {
571
571
  token: `--${t}-scrim-shade-${e}`
572
572
  })))), e.appendChild(n);
573
573
  }
574
- i.addEventListener("ui-change", ((t) => {
575
- let n = t.detail.value, r = e.querySelectorAll(".nui-tokens-section[data-family]");
574
+ i.addEventListener("native:change", ((t) => {
575
+ let n = t.detail.value, r = e.querySelectorAll(".native-tokens-section[data-family]");
576
576
  for (let e of r) {
577
577
  let t = e.dataset.family;
578
578
  n === "all" || t === "env" ? e.hidden = !1 : e.hidden = t !== n;
579
579
  }
580
580
  requestAnimationFrame(() => {
581
- e.querySelectorAll("nui-tokens-colors").forEach((e) => e.refresh());
581
+ e.querySelectorAll("native-tokens-colors").forEach((e) => e.refresh());
582
582
  });
583
- })), e.addEventListener("nui-tokens-theme-change", () => {
583
+ })), e.addEventListener("native-tokens-theme-change", () => {
584
584
  requestAnimationFrame(() => {
585
- e.querySelectorAll("nui-tokens-variable").forEach((e) => e.sync());
585
+ e.querySelectorAll("native-tokens-variable").forEach((e) => e.sync());
586
586
  });
587
587
  });
588
588
  }
@@ -590,12 +590,12 @@ function z(e) {
590
590
  * Self-contained design system token inspector.
591
591
  *
592
592
  * Stamps the full color/variable inspector UI on connection.
593
- * Consumer usage: `<nui-tokens></nui-tokens>`.
593
+ * Consumer usage: `<native-tokens></native-tokens>`.
594
594
  *
595
- * All `nui-tokens-*` sub-elements are registered by the `@nonoun/nui-tokens`
595
+ * All `native-tokens-*` sub-elements are registered by the `@nonoun/native-tokens`
596
596
  * entry point as a side effect of import.
597
597
  */
598
- var B = class extends t {
598
+ var B = class extends o {
599
599
  setup() {
600
600
  super.setup(), z(this);
601
601
  }
@@ -603,5 +603,5 @@ var B = class extends t {
603
603
  this.innerHTML = "", super.teardown();
604
604
  }
605
605
  };
606
- s("nui-tokens", B), s("nui-tokens-variable", l), s("nui-tokens-colors", u), s("nui-tokens-color-swatch", w), s("nui-tokens-themes", E), s("ui-range", a), s("ui-select", o), s("ui-button", e), s("ui-icon", n), s("ui-listbox", r), s("ui-option", i);
607
- export { B as NuiTokens, w as NuiTokensColorSwatch, u as NuiTokensColors, E as NuiTokensThemes, l as NuiTokensVariable, z as buildTokens };
606
+ s("native-tokens", B), s("native-tokens-variable", l), s("native-tokens-colors", u), s("native-tokens-color-swatch", w), s("native-tokens-themes", E), s("n-range", i), s("n-select", a), s("n-button", e), s("n-icon", t), s("n-listbox", n), s("n-option", r);
607
+ export { B as NTokens, w as NTokensColorSwatch, u as NTokensColors, E as NTokensThemes, l as NTokensVariable, z as buildTokens };
@@ -1,5 +1,5 @@
1
- import { UIElement } from '@nonoun/native-ui';
2
- export declare class NuiTokensColorSwatch extends UIElement {
1
+ import { NativeElement } from '@nonoun/native-ui';
2
+ export declare class NTokensColorSwatch extends NativeElement {
3
3
  #private;
4
4
  static observedAttributes: string[];
5
5
  get token(): string;
@@ -12,4 +12,4 @@ export declare class NuiTokensColorSwatch extends UIElement {
12
12
  /** Refresh background and contrast from current token value. */
13
13
  refresh(): void;
14
14
  }
15
- //# sourceMappingURL=nui-tokens-color-swatch-element.d.ts.map
15
+ //# sourceMappingURL=tokens-color-swatch-element.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokens-color-swatch-element.d.ts","sourceRoot":"","sources":["../src/tokens-color-swatch-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAO,MAAM,mBAAmB,CAAC;AA8IvD,qBAAa,kBAAmB,SAAQ,aAAa;;IACnD,MAAM,CAAC,kBAAkB,WAAqB;IAM9C,IAAI,KAAK,IAAI,MAAM,CAA6C;IAChE,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EAAsC;IAE3D,IAAI,IAAI,IAAI,MAAM,CAA4C;IAC9D,IAAI,IAAI,CAAC,GAAG,EAAE,MAAM,EAAqC;IAEzD,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAapF,KAAK,IAAI,IAAI;IAqCb,QAAQ,IAAI,IAAI;IAUhB,gEAAgE;IAChE,OAAO,IAAI,IAAI;CAsEhB"}
@@ -1,9 +1,9 @@
1
- import { UIElement } from '@nonoun/native-ui';
2
- export interface NuiTokensColorEntry {
1
+ import { NativeElement } from '@nonoun/native-ui';
2
+ export interface NTokensColorEntry {
3
3
  name: string;
4
4
  token: string;
5
5
  }
6
- export declare class NuiTokensColors extends UIElement {
6
+ export declare class NTokensColors extends NativeElement {
7
7
  #private;
8
8
  static observedAttributes: string[];
9
9
  attributeChangedCallback(name: string, old: string | null, val: string | null): void;
@@ -11,4 +11,4 @@ export declare class NuiTokensColors extends UIElement {
11
11
  teardown(): void;
12
12
  refresh(): void;
13
13
  }
14
- //# sourceMappingURL=nui-tokens-colors-element.d.ts.map
14
+ //# sourceMappingURL=tokens-colors-element.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokens-colors-element.d.ts","sourceRoot":"","sources":["../src/tokens-colors-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGlD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBAAa,aAAc,SAAQ,aAAa;;IAC9C,MAAM,CAAC,kBAAkB,WAAY;IAIrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IAab,QAAQ,IAAI,IAAI;IAWhB,OAAO,IAAI,IAAI;CAuBhB"}
@@ -0,0 +1,15 @@
1
+ import { NativeElement } from '@nonoun/native-ui';
2
+ /**
3
+ * Self-contained design system token inspector.
4
+ *
5
+ * Stamps the full color/variable inspector UI on connection.
6
+ * Consumer usage: `<native-tokens></native-tokens>`.
7
+ *
8
+ * All `native-tokens-*` sub-elements are registered by the `@nonoun/native-tokens`
9
+ * entry point as a side effect of import.
10
+ */
11
+ export declare class NTokens extends NativeElement {
12
+ setup(): void;
13
+ teardown(): void;
14
+ }
15
+ //# sourceMappingURL=tokens-element.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokens-element.d.ts","sourceRoot":"","sources":["../src/tokens-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGlD;;;;;;;;GAQG;AACH,qBAAa,OAAQ,SAAQ,aAAa;IACxC,KAAK,IAAI,IAAI;IAKb,QAAQ,IAAI,IAAI;CAIjB"}
@@ -1,13 +1,13 @@
1
- import { UIElement } from '@nonoun/native-ui';
2
- export interface NuiTokensThemeEntry {
1
+ import { NativeElement } from '@nonoun/native-ui';
2
+ export interface NTokensThemeEntry {
3
3
  name: string;
4
4
  value: string;
5
5
  }
6
- export declare class NuiTokensThemes extends UIElement {
6
+ export declare class NTokensThemes extends NativeElement {
7
7
  #private;
8
8
  static observedAttributes: string[];
9
9
  attributeChangedCallback(name: string, old: string | null, val: string | null): void;
10
10
  setup(): void;
11
11
  teardown(): void;
12
12
  }
13
- //# sourceMappingURL=nui-tokens-themes-element.d.ts.map
13
+ //# sourceMappingURL=tokens-themes-element.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokens-themes-element.d.ts","sourceRoot":"","sources":["../src/tokens-themes-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAeD,qBAAa,aAAc,SAAQ,aAAa;;IAC9C,MAAM,CAAC,kBAAkB,WAAY;IAIrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;CA8CjB"}
@@ -1,5 +1,5 @@
1
- import { UIElement } from '@nonoun/native-ui';
2
- export interface NuiTokensVariableData {
1
+ import { NativeElement } from '@nonoun/native-ui';
2
+ export interface NTokensVariableData {
3
3
  name: string;
4
4
  type: 'number';
5
5
  token: string;
@@ -8,7 +8,7 @@ export interface NuiTokensVariableData {
8
8
  min?: number;
9
9
  max?: number;
10
10
  }
11
- export declare class NuiTokensVariable extends UIElement {
11
+ export declare class NTokensVariable extends NativeElement {
12
12
  #private;
13
13
  static observedAttributes: string[];
14
14
  attributeChangedCallback(name: string, old: string | null, val: string | null): void;
@@ -16,4 +16,4 @@ export declare class NuiTokensVariable extends UIElement {
16
16
  teardown(): void;
17
17
  sync(): void;
18
18
  }
19
- //# sourceMappingURL=nui-tokens-variable-element.d.ts.map
19
+ //# sourceMappingURL=tokens-variable-element.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tokens-variable-element.d.ts","sourceRoot":"","sources":["../src/tokens-variable-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,qBAAa,eAAgB,SAAQ,aAAa;;IAChD,MAAM,CAAC,kBAAkB,WAAY;IAMrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IAWb,QAAQ,IAAI,IAAI;IAYhB,IAAI,IAAI,IAAI;CA8Db"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nonoun/native-tokens",
3
- "version": "0.4.0",
3
+ "version": "0.4.1",
4
4
  "description": "OKLCH color token inspector for @nonoun/native-ui",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -26,7 +26,7 @@
26
26
  "scripts": {
27
27
  "build": "npm run build:js && npm run build:css && npm run build:types",
28
28
  "build:js": "vite build",
29
- "build:css": "cp src/native-tokens.css dist/native-tokens.css",
29
+ "build:css": "cp src/tokens.css dist/native-tokens.css",
30
30
  "build:types": "tsc -p tsconfig.build.json"
31
31
  },
32
32
  "publishConfig": {
@@ -1 +0,0 @@
1
- {"version":3,"file":"nui-tokens-color-swatch-element.d.ts","sourceRoot":"","sources":["../src/nui-tokens-color-swatch-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAO,MAAM,mBAAmB,CAAC;AA8InD,qBAAa,oBAAqB,SAAQ,SAAS;;IACjD,MAAM,CAAC,kBAAkB,WAAqB;IAM9C,IAAI,KAAK,IAAI,MAAM,CAA6C;IAChE,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EAAsC;IAE3D,IAAI,IAAI,IAAI,MAAM,CAA4C;IAC9D,IAAI,IAAI,CAAC,GAAG,EAAE,MAAM,EAAqC;IAEzD,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAapF,KAAK,IAAI,IAAI;IAqCb,QAAQ,IAAI,IAAI;IAUhB,gEAAgE;IAChE,OAAO,IAAI,IAAI;CAsEhB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"nui-tokens-colors-element.d.ts","sourceRoot":"","sources":["../src/nui-tokens-colors-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAG9C,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,qBAAa,eAAgB,SAAQ,SAAS;;IAC5C,MAAM,CAAC,kBAAkB,WAAY;IAIrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IAab,QAAQ,IAAI,IAAI;IAWhB,OAAO,IAAI,IAAI;CAuBhB"}
@@ -1,15 +0,0 @@
1
- import { UIElement } from '@nonoun/native-ui';
2
- /**
3
- * Self-contained design system token inspector.
4
- *
5
- * Stamps the full color/variable inspector UI on connection.
6
- * Consumer usage: `<nui-tokens></nui-tokens>`.
7
- *
8
- * All `nui-tokens-*` sub-elements are registered by the `@nonoun/native-tokens`
9
- * entry point as a side effect of import.
10
- */
11
- export declare class NuiTokens extends UIElement {
12
- setup(): void;
13
- teardown(): void;
14
- }
15
- //# sourceMappingURL=nui-tokens-element.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"nui-tokens-element.d.ts","sourceRoot":"","sources":["../src/nui-tokens-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAG9C;;;;;;;;GAQG;AACH,qBAAa,SAAU,SAAQ,SAAS;IACtC,KAAK,IAAI,IAAI;IAKb,QAAQ,IAAI,IAAI;CAIjB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"nui-tokens-themes-element.d.ts","sourceRoot":"","sources":["../src/nui-tokens-themes-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAeD,qBAAa,eAAgB,SAAQ,SAAS;;IAC5C,MAAM,CAAC,kBAAkB,WAAY;IAIrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;CA8CjB"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"nui-tokens-variable-element.d.ts","sourceRoot":"","sources":["../src/nui-tokens-variable-element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAED,qBAAa,iBAAkB,SAAQ,SAAS;;IAC9C,MAAM,CAAC,kBAAkB,WAAY;IAMrC,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQpF,KAAK,IAAI,IAAI;IAWb,QAAQ,IAAI,IAAI;IAYhB,IAAI,IAAI,IAAI;CA8Db"}