@tanstack/router-devtools 1.16.6 → 1.17.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/cjs/Explorer.cjs +152 -92
- package/dist/cjs/Explorer.cjs.map +1 -1
- package/dist/cjs/Explorer.d.cts +0 -7
- package/dist/cjs/devtools.cjs +924 -905
- package/dist/cjs/devtools.cjs.map +1 -1
- package/dist/cjs/logo.cjs +1012 -0
- package/dist/cjs/logo.cjs.map +1 -0
- package/dist/cjs/logo.d.cts +2 -0
- package/dist/cjs/tokens.cjs +302 -0
- package/dist/cjs/tokens.cjs.map +1 -0
- package/dist/cjs/tokens.d.cts +298 -0
- package/dist/cjs/utils.cjs +5 -33
- package/dist/cjs/utils.cjs.map +1 -1
- package/dist/cjs/utils.d.cts +2 -2
- package/dist/esm/Explorer.d.ts +0 -7
- package/dist/esm/Explorer.js +153 -93
- package/dist/esm/Explorer.js.map +1 -1
- package/dist/esm/devtools.js +924 -905
- package/dist/esm/devtools.js.map +1 -1
- package/dist/esm/logo.d.ts +2 -0
- package/dist/esm/logo.js +1012 -0
- package/dist/esm/logo.js.map +1 -0
- package/dist/esm/tokens.d.ts +298 -0
- package/dist/esm/tokens.js +302 -0
- package/dist/esm/tokens.js.map +1 -0
- package/dist/esm/utils.d.ts +2 -2
- package/dist/esm/utils.js +5 -33
- package/dist/esm/utils.js.map +1 -1
- package/package.json +5 -2
- package/src/Explorer.tsx +155 -93
- package/src/devtools.tsx +974 -860
- package/src/logo.tsx +817 -0
- package/src/tokens.ts +305 -0
- package/src/utils.ts +12 -11
- package/dist/cjs/styledComponents.cjs +0 -93
- package/dist/cjs/styledComponents.cjs.map +0 -1
- package/dist/cjs/styledComponents.d.cts +0 -7
- package/dist/cjs/theme.cjs +0 -28
- package/dist/cjs/theme.cjs.map +0 -1
- package/dist/cjs/useMediaQuery.cjs +0 -27
- package/dist/cjs/useMediaQuery.cjs.map +0 -1
- package/dist/esm/styledComponents.d.ts +0 -7
- package/dist/esm/styledComponents.js +0 -93
- package/dist/esm/styledComponents.js.map +0 -1
- package/dist/esm/theme.js +0 -28
- package/dist/esm/theme.js.map +0 -1
- package/dist/esm/useMediaQuery.js +0 -28
- package/dist/esm/useMediaQuery.js.map +0 -1
- package/src/styledComponents.ts +0 -106
|
@@ -0,0 +1,302 @@
|
|
|
1
|
+
const tokens = {
|
|
2
|
+
colors: {
|
|
3
|
+
inherit: "inherit",
|
|
4
|
+
current: "currentColor",
|
|
5
|
+
transparent: "transparent",
|
|
6
|
+
black: "#000000",
|
|
7
|
+
white: "#ffffff",
|
|
8
|
+
neutral: {
|
|
9
|
+
50: "#f9fafb",
|
|
10
|
+
100: "#f2f4f7",
|
|
11
|
+
200: "#eaecf0",
|
|
12
|
+
300: "#d0d5dd",
|
|
13
|
+
400: "#98a2b3",
|
|
14
|
+
500: "#667085",
|
|
15
|
+
600: "#475467",
|
|
16
|
+
700: "#344054",
|
|
17
|
+
800: "#1d2939",
|
|
18
|
+
900: "#101828"
|
|
19
|
+
},
|
|
20
|
+
darkGray: {
|
|
21
|
+
50: "#525c7a",
|
|
22
|
+
100: "#49536e",
|
|
23
|
+
200: "#414962",
|
|
24
|
+
300: "#394056",
|
|
25
|
+
400: "#313749",
|
|
26
|
+
500: "#292e3d",
|
|
27
|
+
600: "#212530",
|
|
28
|
+
700: "#191c24",
|
|
29
|
+
800: "#111318",
|
|
30
|
+
900: "#0b0d10"
|
|
31
|
+
},
|
|
32
|
+
gray: {
|
|
33
|
+
50: "#f9fafb",
|
|
34
|
+
100: "#f2f4f7",
|
|
35
|
+
200: "#eaecf0",
|
|
36
|
+
300: "#d0d5dd",
|
|
37
|
+
400: "#98a2b3",
|
|
38
|
+
500: "#667085",
|
|
39
|
+
600: "#475467",
|
|
40
|
+
700: "#344054",
|
|
41
|
+
800: "#1d2939",
|
|
42
|
+
900: "#101828"
|
|
43
|
+
},
|
|
44
|
+
blue: {
|
|
45
|
+
25: "#F5FAFF",
|
|
46
|
+
50: "#EFF8FF",
|
|
47
|
+
100: "#D1E9FF",
|
|
48
|
+
200: "#B2DDFF",
|
|
49
|
+
300: "#84CAFF",
|
|
50
|
+
400: "#53B1FD",
|
|
51
|
+
500: "#2E90FA",
|
|
52
|
+
600: "#1570EF",
|
|
53
|
+
700: "#175CD3",
|
|
54
|
+
800: "#1849A9",
|
|
55
|
+
900: "#194185"
|
|
56
|
+
},
|
|
57
|
+
green: {
|
|
58
|
+
25: "#F6FEF9",
|
|
59
|
+
50: "#ECFDF3",
|
|
60
|
+
100: "#D1FADF",
|
|
61
|
+
200: "#A6F4C5",
|
|
62
|
+
300: "#6CE9A6",
|
|
63
|
+
400: "#32D583",
|
|
64
|
+
500: "#12B76A",
|
|
65
|
+
600: "#039855",
|
|
66
|
+
700: "#027A48",
|
|
67
|
+
800: "#05603A",
|
|
68
|
+
900: "#054F31"
|
|
69
|
+
},
|
|
70
|
+
red: {
|
|
71
|
+
50: "#fef2f2",
|
|
72
|
+
100: "#fee2e2",
|
|
73
|
+
200: "#fecaca",
|
|
74
|
+
300: "#fca5a5",
|
|
75
|
+
400: "#f87171",
|
|
76
|
+
500: "#ef4444",
|
|
77
|
+
600: "#dc2626",
|
|
78
|
+
700: "#b91c1c",
|
|
79
|
+
800: "#991b1b",
|
|
80
|
+
900: "#7f1d1d",
|
|
81
|
+
950: "#450a0a"
|
|
82
|
+
},
|
|
83
|
+
yellow: {
|
|
84
|
+
25: "#FFFCF5",
|
|
85
|
+
50: "#FFFAEB",
|
|
86
|
+
100: "#FEF0C7",
|
|
87
|
+
200: "#FEDF89",
|
|
88
|
+
300: "#FEC84B",
|
|
89
|
+
400: "#FDB022",
|
|
90
|
+
500: "#F79009",
|
|
91
|
+
600: "#DC6803",
|
|
92
|
+
700: "#B54708",
|
|
93
|
+
800: "#93370D",
|
|
94
|
+
900: "#7A2E0E"
|
|
95
|
+
},
|
|
96
|
+
purple: {
|
|
97
|
+
25: "#FAFAFF",
|
|
98
|
+
50: "#F4F3FF",
|
|
99
|
+
100: "#EBE9FE",
|
|
100
|
+
200: "#D9D6FE",
|
|
101
|
+
300: "#BDB4FE",
|
|
102
|
+
400: "#9B8AFB",
|
|
103
|
+
500: "#7A5AF8",
|
|
104
|
+
600: "#6938EF",
|
|
105
|
+
700: "#5925DC",
|
|
106
|
+
800: "#4A1FB8",
|
|
107
|
+
900: "#3E1C96"
|
|
108
|
+
},
|
|
109
|
+
teal: {
|
|
110
|
+
25: "#F6FEFC",
|
|
111
|
+
50: "#F0FDF9",
|
|
112
|
+
100: "#CCFBEF",
|
|
113
|
+
200: "#99F6E0",
|
|
114
|
+
300: "#5FE9D0",
|
|
115
|
+
400: "#2ED3B7",
|
|
116
|
+
500: "#15B79E",
|
|
117
|
+
600: "#0E9384",
|
|
118
|
+
700: "#107569",
|
|
119
|
+
800: "#125D56",
|
|
120
|
+
900: "#134E48"
|
|
121
|
+
},
|
|
122
|
+
pink: {
|
|
123
|
+
25: "#fdf2f8",
|
|
124
|
+
50: "#fce7f3",
|
|
125
|
+
100: "#fbcfe8",
|
|
126
|
+
200: "#f9a8d4",
|
|
127
|
+
300: "#f472b6",
|
|
128
|
+
400: "#ec4899",
|
|
129
|
+
500: "#db2777",
|
|
130
|
+
600: "#be185d",
|
|
131
|
+
700: "#9d174d",
|
|
132
|
+
800: "#831843",
|
|
133
|
+
900: "#500724"
|
|
134
|
+
},
|
|
135
|
+
cyan: {
|
|
136
|
+
25: "#ecfeff",
|
|
137
|
+
50: "#cffafe",
|
|
138
|
+
100: "#a5f3fc",
|
|
139
|
+
200: "#67e8f9",
|
|
140
|
+
300: "#22d3ee",
|
|
141
|
+
400: "#06b6d4",
|
|
142
|
+
500: "#0891b2",
|
|
143
|
+
600: "#0e7490",
|
|
144
|
+
700: "#155e75",
|
|
145
|
+
800: "#164e63",
|
|
146
|
+
900: "#083344"
|
|
147
|
+
}
|
|
148
|
+
},
|
|
149
|
+
alpha: {
|
|
150
|
+
100: "ff",
|
|
151
|
+
90: "e5",
|
|
152
|
+
80: "cc",
|
|
153
|
+
70: "b3",
|
|
154
|
+
60: "99",
|
|
155
|
+
50: "80",
|
|
156
|
+
40: "66",
|
|
157
|
+
30: "4d",
|
|
158
|
+
20: "33",
|
|
159
|
+
10: "1a",
|
|
160
|
+
0: "00"
|
|
161
|
+
},
|
|
162
|
+
font: {
|
|
163
|
+
size: {
|
|
164
|
+
"2xs": "calc(var(--tsrd-font-size) * 0.625)",
|
|
165
|
+
xs: "calc(var(--tsrd-font-size) * 0.75)",
|
|
166
|
+
sm: "calc(var(--tsrd-font-size) * 0.875)",
|
|
167
|
+
md: "var(--tsrd-font-size)",
|
|
168
|
+
lg: "calc(var(--tsrd-font-size) * 1.125)",
|
|
169
|
+
xl: "calc(var(--tsrd-font-size) * 1.25)",
|
|
170
|
+
"2xl": "calc(var(--tsrd-font-size) * 1.5)",
|
|
171
|
+
"3xl": "calc(var(--tsrd-font-size) * 1.875)",
|
|
172
|
+
"4xl": "calc(var(--tsrd-font-size) * 2.25)",
|
|
173
|
+
"5xl": "calc(var(--tsrd-font-size) * 3)",
|
|
174
|
+
"6xl": "calc(var(--tsrd-font-size) * 3.75)",
|
|
175
|
+
"7xl": "calc(var(--tsrd-font-size) * 4.5)",
|
|
176
|
+
"8xl": "calc(var(--tsrd-font-size) * 6)",
|
|
177
|
+
"9xl": "calc(var(--tsrd-font-size) * 8)"
|
|
178
|
+
},
|
|
179
|
+
lineHeight: {
|
|
180
|
+
"3xs": "calc(var(--tsrd-font-size) * 0.75)",
|
|
181
|
+
"2xs": "calc(var(--tsrd-font-size) * 0.875)",
|
|
182
|
+
xs: "calc(var(--tsrd-font-size) * 1)",
|
|
183
|
+
sm: "calc(var(--tsrd-font-size) * 1.25)",
|
|
184
|
+
md: "calc(var(--tsrd-font-size) * 1.5)",
|
|
185
|
+
lg: "calc(var(--tsrd-font-size) * 1.75)",
|
|
186
|
+
xl: "calc(var(--tsrd-font-size) * 2)",
|
|
187
|
+
"2xl": "calc(var(--tsrd-font-size) * 2.25)",
|
|
188
|
+
"3xl": "calc(var(--tsrd-font-size) * 2.5)",
|
|
189
|
+
"4xl": "calc(var(--tsrd-font-size) * 2.75)",
|
|
190
|
+
"5xl": "calc(var(--tsrd-font-size) * 3)",
|
|
191
|
+
"6xl": "calc(var(--tsrd-font-size) * 3.25)",
|
|
192
|
+
"7xl": "calc(var(--tsrd-font-size) * 3.5)",
|
|
193
|
+
"8xl": "calc(var(--tsrd-font-size) * 3.75)",
|
|
194
|
+
"9xl": "calc(var(--tsrd-font-size) * 4)"
|
|
195
|
+
},
|
|
196
|
+
weight: {
|
|
197
|
+
thin: "100",
|
|
198
|
+
extralight: "200",
|
|
199
|
+
light: "300",
|
|
200
|
+
normal: "400",
|
|
201
|
+
medium: "500",
|
|
202
|
+
semibold: "600",
|
|
203
|
+
bold: "700",
|
|
204
|
+
extrabold: "800",
|
|
205
|
+
black: "900"
|
|
206
|
+
},
|
|
207
|
+
fontFamily: {
|
|
208
|
+
sans: "ui-sans-serif, Inter, system-ui, sans-serif, sans-serif",
|
|
209
|
+
mono: `ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace`
|
|
210
|
+
}
|
|
211
|
+
},
|
|
212
|
+
breakpoints: {
|
|
213
|
+
xs: "320px",
|
|
214
|
+
sm: "640px",
|
|
215
|
+
md: "768px",
|
|
216
|
+
lg: "1024px",
|
|
217
|
+
xl: "1280px",
|
|
218
|
+
"2xl": "1536px"
|
|
219
|
+
},
|
|
220
|
+
border: {
|
|
221
|
+
radius: {
|
|
222
|
+
none: "0px",
|
|
223
|
+
xs: "calc(var(--tsrd-font-size) * 0.125)",
|
|
224
|
+
sm: "calc(var(--tsrd-font-size) * 0.25)",
|
|
225
|
+
md: "calc(var(--tsrd-font-size) * 0.375)",
|
|
226
|
+
lg: "calc(var(--tsrd-font-size) * 0.5)",
|
|
227
|
+
xl: "calc(var(--tsrd-font-size) * 0.75)",
|
|
228
|
+
"2xl": "calc(var(--tsrd-font-size) * 1)",
|
|
229
|
+
"3xl": "calc(var(--tsrd-font-size) * 1.5)",
|
|
230
|
+
full: "9999px"
|
|
231
|
+
}
|
|
232
|
+
},
|
|
233
|
+
size: {
|
|
234
|
+
0: "0px",
|
|
235
|
+
0.25: "calc(var(--tsrd-font-size) * 0.0625)",
|
|
236
|
+
0.5: "calc(var(--tsrd-font-size) * 0.125)",
|
|
237
|
+
1: "calc(var(--tsrd-font-size) * 0.25)",
|
|
238
|
+
1.5: "calc(var(--tsrd-font-size) * 0.375)",
|
|
239
|
+
2: "calc(var(--tsrd-font-size) * 0.5)",
|
|
240
|
+
2.5: "calc(var(--tsrd-font-size) * 0.625)",
|
|
241
|
+
3: "calc(var(--tsrd-font-size) * 0.75)",
|
|
242
|
+
3.5: "calc(var(--tsrd-font-size) * 0.875)",
|
|
243
|
+
4: "calc(var(--tsrd-font-size) * 1)",
|
|
244
|
+
4.5: "calc(var(--tsrd-font-size) * 1.125)",
|
|
245
|
+
5: "calc(var(--tsrd-font-size) * 1.25)",
|
|
246
|
+
5.5: "calc(var(--tsrd-font-size) * 1.375)",
|
|
247
|
+
6: "calc(var(--tsrd-font-size) * 1.5)",
|
|
248
|
+
6.5: "calc(var(--tsrd-font-size) * 1.625)",
|
|
249
|
+
7: "calc(var(--tsrd-font-size) * 1.75)",
|
|
250
|
+
8: "calc(var(--tsrd-font-size) * 2)",
|
|
251
|
+
9: "calc(var(--tsrd-font-size) * 2.25)",
|
|
252
|
+
10: "calc(var(--tsrd-font-size) * 2.5)",
|
|
253
|
+
11: "calc(var(--tsrd-font-size) * 2.75)",
|
|
254
|
+
12: "calc(var(--tsrd-font-size) * 3)",
|
|
255
|
+
14: "calc(var(--tsrd-font-size) * 3.5)",
|
|
256
|
+
16: "calc(var(--tsrd-font-size) * 4)",
|
|
257
|
+
20: "calc(var(--tsrd-font-size) * 5)",
|
|
258
|
+
24: "calc(var(--tsrd-font-size) * 6)",
|
|
259
|
+
28: "calc(var(--tsrd-font-size) * 7)",
|
|
260
|
+
32: "calc(var(--tsrd-font-size) * 8)",
|
|
261
|
+
36: "calc(var(--tsrd-font-size) * 9)",
|
|
262
|
+
40: "calc(var(--tsrd-font-size) * 10)",
|
|
263
|
+
44: "calc(var(--tsrd-font-size) * 11)",
|
|
264
|
+
48: "calc(var(--tsrd-font-size) * 12)",
|
|
265
|
+
52: "calc(var(--tsrd-font-size) * 13)",
|
|
266
|
+
56: "calc(var(--tsrd-font-size) * 14)",
|
|
267
|
+
60: "calc(var(--tsrd-font-size) * 15)",
|
|
268
|
+
64: "calc(var(--tsrd-font-size) * 16)",
|
|
269
|
+
72: "calc(var(--tsrd-font-size) * 18)",
|
|
270
|
+
80: "calc(var(--tsrd-font-size) * 20)",
|
|
271
|
+
96: "calc(var(--tsrd-font-size) * 24)"
|
|
272
|
+
},
|
|
273
|
+
shadow: {
|
|
274
|
+
xs: (_ = "rgb(0 0 0 / 0.1)") => `0 1px 2px 0 rgb(0 0 0 / 0.05)`,
|
|
275
|
+
sm: (color = "rgb(0 0 0 / 0.1)") => `0 1px 3px 0 ${color}, 0 1px 2px -1px ${color}`,
|
|
276
|
+
md: (color = "rgb(0 0 0 / 0.1)") => `0 4px 6px -1px ${color}, 0 2px 4px -2px ${color}`,
|
|
277
|
+
lg: (color = "rgb(0 0 0 / 0.1)") => `0 10px 15px -3px ${color}, 0 4px 6px -4px ${color}`,
|
|
278
|
+
xl: (color = "rgb(0 0 0 / 0.1)") => `0 20px 25px -5px ${color}, 0 8px 10px -6px ${color}`,
|
|
279
|
+
"2xl": (color = "rgb(0 0 0 / 0.25)") => `0 25px 50px -12px ${color}`,
|
|
280
|
+
inner: (color = "rgb(0 0 0 / 0.05)") => `inset 0 2px 4px 0 ${color}`,
|
|
281
|
+
none: () => `none`
|
|
282
|
+
},
|
|
283
|
+
zIndices: {
|
|
284
|
+
hide: -1,
|
|
285
|
+
auto: "auto",
|
|
286
|
+
base: 0,
|
|
287
|
+
docked: 10,
|
|
288
|
+
dropdown: 1e3,
|
|
289
|
+
sticky: 1100,
|
|
290
|
+
banner: 1200,
|
|
291
|
+
overlay: 1300,
|
|
292
|
+
modal: 1400,
|
|
293
|
+
popover: 1500,
|
|
294
|
+
skipLink: 1600,
|
|
295
|
+
toast: 1700,
|
|
296
|
+
tooltip: 1800
|
|
297
|
+
}
|
|
298
|
+
};
|
|
299
|
+
export {
|
|
300
|
+
tokens
|
|
301
|
+
};
|
|
302
|
+
//# sourceMappingURL=tokens.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"tokens.js","sources":["../../src/tokens.ts"],"sourcesContent":["export const tokens = {\n colors: {\n inherit: 'inherit',\n current: 'currentColor',\n transparent: 'transparent',\n black: '#000000',\n white: '#ffffff',\n neutral: {\n 50: '#f9fafb',\n 100: '#f2f4f7',\n 200: '#eaecf0',\n 300: '#d0d5dd',\n 400: '#98a2b3',\n 500: '#667085',\n 600: '#475467',\n 700: '#344054',\n 800: '#1d2939',\n 900: '#101828',\n },\n darkGray: {\n 50: '#525c7a',\n 100: '#49536e',\n 200: '#414962',\n 300: '#394056',\n 400: '#313749',\n 500: '#292e3d',\n 600: '#212530',\n 700: '#191c24',\n 800: '#111318',\n 900: '#0b0d10',\n },\n gray: {\n 50: '#f9fafb',\n 100: '#f2f4f7',\n 200: '#eaecf0',\n 300: '#d0d5dd',\n 400: '#98a2b3',\n 500: '#667085',\n 600: '#475467',\n 700: '#344054',\n 800: '#1d2939',\n 900: '#101828',\n },\n blue: {\n 25: '#F5FAFF',\n 50: '#EFF8FF',\n 100: '#D1E9FF',\n 200: '#B2DDFF',\n 300: '#84CAFF',\n 400: '#53B1FD',\n 500: '#2E90FA',\n 600: '#1570EF',\n 700: '#175CD3',\n 800: '#1849A9',\n 900: '#194185',\n },\n green: {\n 25: '#F6FEF9',\n 50: '#ECFDF3',\n 100: '#D1FADF',\n 200: '#A6F4C5',\n 300: '#6CE9A6',\n 400: '#32D583',\n 500: '#12B76A',\n 600: '#039855',\n 700: '#027A48',\n 800: '#05603A',\n 900: '#054F31',\n },\n red: {\n 50: '#fef2f2',\n 100: '#fee2e2',\n 200: '#fecaca',\n 300: '#fca5a5',\n 400: '#f87171',\n 500: '#ef4444',\n 600: '#dc2626',\n 700: '#b91c1c',\n 800: '#991b1b',\n 900: '#7f1d1d',\n 950: '#450a0a',\n },\n yellow: {\n 25: '#FFFCF5',\n 50: '#FFFAEB',\n 100: '#FEF0C7',\n 200: '#FEDF89',\n 300: '#FEC84B',\n 400: '#FDB022',\n 500: '#F79009',\n 600: '#DC6803',\n 700: '#B54708',\n 800: '#93370D',\n 900: '#7A2E0E',\n },\n purple: {\n 25: '#FAFAFF',\n 50: '#F4F3FF',\n 100: '#EBE9FE',\n 200: '#D9D6FE',\n 300: '#BDB4FE',\n 400: '#9B8AFB',\n 500: '#7A5AF8',\n 600: '#6938EF',\n 700: '#5925DC',\n 800: '#4A1FB8',\n 900: '#3E1C96',\n },\n teal: {\n 25: '#F6FEFC',\n 50: '#F0FDF9',\n 100: '#CCFBEF',\n 200: '#99F6E0',\n 300: '#5FE9D0',\n 400: '#2ED3B7',\n 500: '#15B79E',\n 600: '#0E9384',\n 700: '#107569',\n 800: '#125D56',\n 900: '#134E48',\n },\n pink: {\n 25: '#fdf2f8',\n 50: '#fce7f3',\n 100: '#fbcfe8',\n 200: '#f9a8d4',\n 300: '#f472b6',\n 400: '#ec4899',\n 500: '#db2777',\n 600: '#be185d',\n 700: '#9d174d',\n 800: '#831843',\n 900: '#500724',\n },\n cyan: {\n 25: '#ecfeff',\n 50: '#cffafe',\n 100: '#a5f3fc',\n 200: '#67e8f9',\n 300: '#22d3ee',\n 400: '#06b6d4',\n 500: '#0891b2',\n 600: '#0e7490',\n 700: '#155e75',\n 800: '#164e63',\n 900: '#083344',\n },\n },\n alpha: {\n 100: 'ff',\n 90: 'e5',\n 80: 'cc',\n 70: 'b3',\n 60: '99',\n 50: '80',\n 40: '66',\n 30: '4d',\n 20: '33',\n 10: '1a',\n 0: '00',\n },\n font: {\n size: {\n '2xs': 'calc(var(--tsrd-font-size) * 0.625)',\n xs: 'calc(var(--tsrd-font-size) * 0.75)',\n sm: 'calc(var(--tsrd-font-size) * 0.875)',\n md: 'var(--tsrd-font-size)',\n lg: 'calc(var(--tsrd-font-size) * 1.125)',\n xl: 'calc(var(--tsrd-font-size) * 1.25)',\n '2xl': 'calc(var(--tsrd-font-size) * 1.5)',\n '3xl': 'calc(var(--tsrd-font-size) * 1.875)',\n '4xl': 'calc(var(--tsrd-font-size) * 2.25)',\n '5xl': 'calc(var(--tsrd-font-size) * 3)',\n '6xl': 'calc(var(--tsrd-font-size) * 3.75)',\n '7xl': 'calc(var(--tsrd-font-size) * 4.5)',\n '8xl': 'calc(var(--tsrd-font-size) * 6)',\n '9xl': 'calc(var(--tsrd-font-size) * 8)',\n },\n lineHeight: {\n '3xs': 'calc(var(--tsrd-font-size) * 0.75)',\n '2xs': 'calc(var(--tsrd-font-size) * 0.875)',\n xs: 'calc(var(--tsrd-font-size) * 1)',\n sm: 'calc(var(--tsrd-font-size) * 1.25)',\n md: 'calc(var(--tsrd-font-size) * 1.5)',\n lg: 'calc(var(--tsrd-font-size) * 1.75)',\n xl: 'calc(var(--tsrd-font-size) * 2)',\n '2xl': 'calc(var(--tsrd-font-size) * 2.25)',\n '3xl': 'calc(var(--tsrd-font-size) * 2.5)',\n '4xl': 'calc(var(--tsrd-font-size) * 2.75)',\n '5xl': 'calc(var(--tsrd-font-size) * 3)',\n '6xl': 'calc(var(--tsrd-font-size) * 3.25)',\n '7xl': 'calc(var(--tsrd-font-size) * 3.5)',\n '8xl': 'calc(var(--tsrd-font-size) * 3.75)',\n '9xl': 'calc(var(--tsrd-font-size) * 4)',\n },\n weight: {\n thin: '100',\n extralight: '200',\n light: '300',\n normal: '400',\n medium: '500',\n semibold: '600',\n bold: '700',\n extrabold: '800',\n black: '900',\n },\n fontFamily: {\n sans: 'ui-sans-serif, Inter, system-ui, sans-serif, sans-serif',\n mono: `ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace`,\n },\n },\n breakpoints: {\n xs: '320px',\n sm: '640px',\n md: '768px',\n lg: '1024px',\n xl: '1280px',\n '2xl': '1536px',\n },\n border: {\n radius: {\n none: '0px',\n xs: 'calc(var(--tsrd-font-size) * 0.125)',\n sm: 'calc(var(--tsrd-font-size) * 0.25)',\n md: 'calc(var(--tsrd-font-size) * 0.375)',\n lg: 'calc(var(--tsrd-font-size) * 0.5)',\n xl: 'calc(var(--tsrd-font-size) * 0.75)',\n '2xl': 'calc(var(--tsrd-font-size) * 1)',\n '3xl': 'calc(var(--tsrd-font-size) * 1.5)',\n full: '9999px',\n },\n },\n size: {\n 0: '0px',\n 0.25: 'calc(var(--tsrd-font-size) * 0.0625)',\n 0.5: 'calc(var(--tsrd-font-size) * 0.125)',\n 1: 'calc(var(--tsrd-font-size) * 0.25)',\n 1.5: 'calc(var(--tsrd-font-size) * 0.375)',\n 2: 'calc(var(--tsrd-font-size) * 0.5)',\n 2.5: 'calc(var(--tsrd-font-size) * 0.625)',\n 3: 'calc(var(--tsrd-font-size) * 0.75)',\n 3.5: 'calc(var(--tsrd-font-size) * 0.875)',\n 4: 'calc(var(--tsrd-font-size) * 1)',\n 4.5: 'calc(var(--tsrd-font-size) * 1.125)',\n 5: 'calc(var(--tsrd-font-size) * 1.25)',\n 5.5: 'calc(var(--tsrd-font-size) * 1.375)',\n 6: 'calc(var(--tsrd-font-size) * 1.5)',\n 6.5: 'calc(var(--tsrd-font-size) * 1.625)',\n 7: 'calc(var(--tsrd-font-size) * 1.75)',\n 8: 'calc(var(--tsrd-font-size) * 2)',\n 9: 'calc(var(--tsrd-font-size) * 2.25)',\n 10: 'calc(var(--tsrd-font-size) * 2.5)',\n 11: 'calc(var(--tsrd-font-size) * 2.75)',\n 12: 'calc(var(--tsrd-font-size) * 3)',\n 14: 'calc(var(--tsrd-font-size) * 3.5)',\n 16: 'calc(var(--tsrd-font-size) * 4)',\n 20: 'calc(var(--tsrd-font-size) * 5)',\n 24: 'calc(var(--tsrd-font-size) * 6)',\n 28: 'calc(var(--tsrd-font-size) * 7)',\n 32: 'calc(var(--tsrd-font-size) * 8)',\n 36: 'calc(var(--tsrd-font-size) * 9)',\n 40: 'calc(var(--tsrd-font-size) * 10)',\n 44: 'calc(var(--tsrd-font-size) * 11)',\n 48: 'calc(var(--tsrd-font-size) * 12)',\n 52: 'calc(var(--tsrd-font-size) * 13)',\n 56: 'calc(var(--tsrd-font-size) * 14)',\n 60: 'calc(var(--tsrd-font-size) * 15)',\n 64: 'calc(var(--tsrd-font-size) * 16)',\n 72: 'calc(var(--tsrd-font-size) * 18)',\n 80: 'calc(var(--tsrd-font-size) * 20)',\n 96: 'calc(var(--tsrd-font-size) * 24)',\n },\n shadow: {\n xs: (_: string = 'rgb(0 0 0 / 0.1)') =>\n `0 1px 2px 0 rgb(0 0 0 / 0.05)` as const,\n sm: (color: string = 'rgb(0 0 0 / 0.1)') =>\n `0 1px 3px 0 ${color}, 0 1px 2px -1px ${color}` as const,\n md: (color: string = 'rgb(0 0 0 / 0.1)') =>\n `0 4px 6px -1px ${color}, 0 2px 4px -2px ${color}` as const,\n lg: (color: string = 'rgb(0 0 0 / 0.1)') =>\n `0 10px 15px -3px ${color}, 0 4px 6px -4px ${color}` as const,\n xl: (color: string = 'rgb(0 0 0 / 0.1)') =>\n `0 20px 25px -5px ${color}, 0 8px 10px -6px ${color}` as const,\n '2xl': (color: string = 'rgb(0 0 0 / 0.25)') =>\n `0 25px 50px -12px ${color}` as const,\n inner: (color: string = 'rgb(0 0 0 / 0.05)') =>\n `inset 0 2px 4px 0 ${color}` as const,\n none: () => `none` as const,\n },\n zIndices: {\n hide: -1,\n auto: 'auto',\n base: 0,\n docked: 10,\n dropdown: 1000,\n sticky: 1100,\n banner: 1200,\n overlay: 1300,\n modal: 1400,\n popover: 1500,\n skipLink: 1600,\n toast: 1700,\n tooltip: 1800,\n },\n} as const\n"],"names":[],"mappings":"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"}
|
package/dist/esm/utils.d.ts
CHANGED
|
@@ -3,8 +3,8 @@ import { AnyRootRoute, AnyRoute, AnyRouteMatch } from '@tanstack/react-router';
|
|
|
3
3
|
import { Theme } from './theme.js';
|
|
4
4
|
export declare const isServer: boolean;
|
|
5
5
|
type StyledComponent<T> = T extends 'button' ? React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> : T extends 'input' ? React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> : T extends 'select' ? React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement> : T extends keyof HTMLElementTagNameMap ? React.HTMLAttributes<HTMLElementTagNameMap[T]> : never;
|
|
6
|
-
export declare function getStatusColor(match: AnyRouteMatch
|
|
7
|
-
export declare function getRouteStatusColor(matches: AnyRouteMatch[], route: AnyRoute | AnyRootRoute
|
|
6
|
+
export declare function getStatusColor(match: AnyRouteMatch): "blue" | "yellow" | "red" | "green" | "gray";
|
|
7
|
+
export declare function getRouteStatusColor(matches: AnyRouteMatch[], route: AnyRoute | AnyRootRoute): "blue" | "yellow" | "red" | "green" | "gray";
|
|
8
8
|
type Styles = React.CSSProperties | ((props: Record<string, any>, theme: Theme) => React.CSSProperties);
|
|
9
9
|
export declare function styled<T extends keyof HTMLElementTagNameMap>(type: T, newStyles: Styles, queries?: Record<string, Styles>): React.ForwardRefExoticComponent<React.PropsWithoutRef<StyledComponent<T>> & React.RefAttributes<HTMLElementTagNameMap[T]>>;
|
|
10
10
|
export declare function useIsMounted(): () => boolean;
|
package/dist/esm/utils.js
CHANGED
|
@@ -1,40 +1,13 @@
|
|
|
1
1
|
import React__default from "react";
|
|
2
|
-
import { useTheme } from "./theme.js";
|
|
3
|
-
import useMediaQuery from "./useMediaQuery.js";
|
|
4
2
|
const isServer = typeof window === "undefined";
|
|
5
|
-
function getStatusColor(match
|
|
6
|
-
return match.status === "
|
|
3
|
+
function getStatusColor(match) {
|
|
4
|
+
return match.status === "success" && match.isFetching ? "blue" : match.status === "pending" ? "yellow" : match.status === "error" ? "red" : match.status === "success" ? "green" : "gray";
|
|
7
5
|
}
|
|
8
|
-
function getRouteStatusColor(matches, route
|
|
6
|
+
function getRouteStatusColor(matches, route) {
|
|
9
7
|
const found = matches.find((d) => d.routeId === route.id);
|
|
10
8
|
if (!found)
|
|
11
|
-
return
|
|
12
|
-
return getStatusColor(found
|
|
13
|
-
}
|
|
14
|
-
function styled(type, newStyles, queries = {}) {
|
|
15
|
-
return React__default.forwardRef(
|
|
16
|
-
({ style, ...rest }, ref) => {
|
|
17
|
-
const theme = useTheme();
|
|
18
|
-
const mediaStyles = Object.entries(queries).reduce(
|
|
19
|
-
(current, [key, value]) => {
|
|
20
|
-
return useMediaQuery(key) ? {
|
|
21
|
-
...current,
|
|
22
|
-
...typeof value === "function" ? value(rest, theme) : value
|
|
23
|
-
} : current;
|
|
24
|
-
},
|
|
25
|
-
{}
|
|
26
|
-
);
|
|
27
|
-
return React__default.createElement(type, {
|
|
28
|
-
...rest,
|
|
29
|
-
style: {
|
|
30
|
-
...typeof newStyles === "function" ? newStyles(rest, theme) : newStyles,
|
|
31
|
-
...style,
|
|
32
|
-
...mediaStyles
|
|
33
|
-
},
|
|
34
|
-
ref
|
|
35
|
-
});
|
|
36
|
-
}
|
|
37
|
-
);
|
|
9
|
+
return "gray";
|
|
10
|
+
return getStatusColor(found);
|
|
38
11
|
}
|
|
39
12
|
function useIsMounted() {
|
|
40
13
|
const mountedRef = React__default.useRef(false);
|
|
@@ -103,7 +76,6 @@ export {
|
|
|
103
76
|
getStatusColor,
|
|
104
77
|
isServer,
|
|
105
78
|
multiSortBy,
|
|
106
|
-
styled,
|
|
107
79
|
useIsMounted,
|
|
108
80
|
useSafeState
|
|
109
81
|
};
|
package/dist/esm/utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../src/utils.ts"],"sourcesContent":["import React from 'react'\nimport { AnyRootRoute, AnyRoute, AnyRouteMatch } from '@tanstack/react-router'\n\nimport { Theme, useTheme } from './theme'\nimport useMediaQuery from './useMediaQuery'\n\nexport const isServer = typeof window === 'undefined'\n\ntype StyledComponent<T> = T extends 'button'\n ? React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >\n : T extends 'input'\n ? React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >\n : T extends 'select'\n ? React.DetailedHTMLProps<\n React.SelectHTMLAttributes<HTMLSelectElement>,\n HTMLSelectElement\n >\n : T extends keyof HTMLElementTagNameMap\n ? React.HTMLAttributes<HTMLElementTagNameMap[T]>\n : never\n\nexport function getStatusColor(match: AnyRouteMatch
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../src/utils.ts"],"sourcesContent":["import React from 'react'\nimport { AnyRootRoute, AnyRoute, AnyRouteMatch } from '@tanstack/react-router'\n\nimport { Theme, useTheme } from './theme'\nimport useMediaQuery from './useMediaQuery'\n\nexport const isServer = typeof window === 'undefined'\n\ntype StyledComponent<T> = T extends 'button'\n ? React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >\n : T extends 'input'\n ? React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >\n : T extends 'select'\n ? React.DetailedHTMLProps<\n React.SelectHTMLAttributes<HTMLSelectElement>,\n HTMLSelectElement\n >\n : T extends keyof HTMLElementTagNameMap\n ? React.HTMLAttributes<HTMLElementTagNameMap[T]>\n : never\n\nexport function getStatusColor(match: AnyRouteMatch) {\n return match.status === 'success' && match.isFetching\n ? 'blue'\n : match.status === 'pending'\n ? 'yellow'\n : match.status === 'error'\n ? 'red'\n : match.status === 'success'\n ? 'green'\n : 'gray'\n}\n\nexport function getRouteStatusColor(\n matches: AnyRouteMatch[],\n route: AnyRoute | AnyRootRoute,\n) {\n const found = matches.find((d) => d.routeId === route.id)\n if (!found) return 'gray'\n return getStatusColor(found)\n}\n\ntype Styles =\n | React.CSSProperties\n | ((props: Record<string, any>, theme: Theme) => React.CSSProperties)\n\nexport function styled<T extends keyof HTMLElementTagNameMap>(\n type: T,\n newStyles: Styles,\n queries: Record<string, Styles> = {},\n) {\n return React.forwardRef<HTMLElementTagNameMap[T], StyledComponent<T>>(\n ({ style, ...rest }, ref) => {\n const theme = useTheme()\n\n const mediaStyles = Object.entries(queries).reduce(\n (current, [key, value]) => {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useMediaQuery(key)\n ? {\n ...current,\n ...(typeof value === 'function' ? value(rest, theme) : value),\n }\n : current\n },\n {},\n )\n\n return React.createElement(type, {\n ...rest,\n style: {\n ...(typeof newStyles === 'function'\n ? newStyles(rest, theme)\n : newStyles),\n ...style,\n ...mediaStyles,\n },\n ref,\n })\n },\n )\n}\n\nexport function useIsMounted() {\n const mountedRef = React.useRef(false)\n const isMounted = React.useCallback(() => mountedRef.current, [])\n\n React[isServer ? 'useEffect' : 'useLayoutEffect'](() => {\n mountedRef.current = true\n return () => {\n mountedRef.current = false\n }\n }, [])\n\n return isMounted\n}\n\n/**\n * Displays a string regardless the type of the data\n * @param {unknown} value Value to be stringified\n */\nexport const displayValue = (value: unknown) => {\n const name = Object.getOwnPropertyNames(Object(value))\n const newValue = typeof value === 'bigint' ? `${value.toString()}n` : value\n try {\n return JSON.stringify(newValue, name)\n } catch (e) {\n return `unable to stringify`\n }\n}\n\n/**\n * This hook is a safe useState version which schedules state updates in microtasks\n * to prevent updating a component state while React is rendering different components\n * or when the component is not mounted anymore.\n */\nexport function useSafeState<T>(initialState: T): [T, (value: T) => void] {\n const isMounted = useIsMounted()\n const [state, setState] = React.useState(initialState)\n\n const safeSetState = React.useCallback(\n (value: T) => {\n scheduleMicrotask(() => {\n if (isMounted()) {\n setState(value)\n }\n })\n },\n [isMounted],\n )\n\n return [state, safeSetState]\n}\n\n/**\n * Schedules a microtask.\n * This can be useful to schedule state updates after rendering.\n */\nfunction scheduleMicrotask(callback: () => void) {\n Promise.resolve()\n .then(callback)\n .catch((error) =>\n setTimeout(() => {\n throw error\n }),\n )\n}\n\nexport function multiSortBy<T>(\n arr: T[],\n accessors: ((item: T) => any)[] = [(d) => d],\n): T[] {\n return arr\n .map((d, i) => [d, i] as const)\n .sort(([a, ai], [b, bi]) => {\n for (const accessor of accessors) {\n const ao = accessor(a)\n const bo = accessor(b)\n\n if (typeof ao === 'undefined') {\n if (typeof bo === 'undefined') {\n continue\n }\n return 1\n }\n\n if (ao === bo) {\n continue\n }\n\n return ao > bo ? 1 : -1\n }\n\n return ai - bi\n })\n .map(([d]) => d)\n}\n"],"names":["React"],"mappings":";AAMa,MAAA,WAAW,OAAO,WAAW;AAqBnC,SAAS,eAAe,OAAsB;AACnD,SAAO,MAAM,WAAW,aAAa,MAAM,aACvC,SACA,MAAM,WAAW,YACf,WACA,MAAM,WAAW,UACf,QACA,MAAM,WAAW,YACf,UACA;AACZ;AAEgB,SAAA,oBACd,SACA,OACA;AACM,QAAA,QAAQ,QAAQ,KAAK,CAAC,MAAM,EAAE,YAAY,MAAM,EAAE;AACxD,MAAI,CAAC;AAAc,WAAA;AACnB,SAAO,eAAe,KAAK;AAC7B;AA2CO,SAAS,eAAe;AACvB,QAAA,aAAaA,eAAM,OAAO,KAAK;AACrC,QAAM,YAAYA,eAAM,YAAY,MAAM,WAAW,SAAS,CAAA,CAAE;AAEhEA,iBAAM,WAAW,cAAc,iBAAiB,EAAE,MAAM;AACtD,eAAW,UAAU;AACrB,WAAO,MAAM;AACX,iBAAW,UAAU;AAAA,IAAA;AAAA,EAEzB,GAAG,CAAE,CAAA;AAEE,SAAA;AACT;AAMa,MAAA,eAAe,CAAC,UAAmB;AAC9C,QAAM,OAAO,OAAO,oBAAoB,OAAO,KAAK,CAAC;AAC/C,QAAA,WAAW,OAAO,UAAU,WAAW,GAAG,MAAM,SAAU,CAAA,MAAM;AAClE,MAAA;AACK,WAAA,KAAK,UAAU,UAAU,IAAI;AAAA,WAC7B,GAAG;AACH,WAAA;AAAA,EACT;AACF;AAOO,SAAS,aAAgB,cAA0C;AACxE,QAAM,YAAY;AAClB,QAAM,CAAC,OAAO,QAAQ,IAAIA,eAAM,SAAS,YAAY;AAErD,QAAM,eAAeA,eAAM;AAAA,IACzB,CAAC,UAAa;AACZ,wBAAkB,MAAM;AACtB,YAAI,aAAa;AACf,mBAAS,KAAK;AAAA,QAChB;AAAA,MAAA,CACD;AAAA,IACH;AAAA,IACA,CAAC,SAAS;AAAA,EAAA;AAGL,SAAA,CAAC,OAAO,YAAY;AAC7B;AAMA,SAAS,kBAAkB,UAAsB;AAC/C,UAAQ,QAAQ,EACb,KAAK,QAAQ,EACb;AAAA,IAAM,CAAC,UACN,WAAW,MAAM;AACT,YAAA;AAAA,IAAA,CACP;AAAA,EAAA;AAEP;AAEO,SAAS,YACd,KACA,YAAkC,CAAC,CAAC,MAAM,CAAC,GACtC;AACL,SAAO,IACJ,IAAI,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAU,EAC7B,KAAK,CAAC,CAAC,GAAG,EAAE,GAAG,CAAC,GAAG,EAAE,MAAM;AAC1B,eAAW,YAAY,WAAW;AAC1B,YAAA,KAAK,SAAS,CAAC;AACf,YAAA,KAAK,SAAS,CAAC;AAEjB,UAAA,OAAO,OAAO,aAAa;AACzB,YAAA,OAAO,OAAO,aAAa;AAC7B;AAAA,QACF;AACO,eAAA;AAAA,MACT;AAEA,UAAI,OAAO,IAAI;AACb;AAAA,MACF;AAEO,aAAA,KAAK,KAAK,IAAI;AAAA,IACvB;AAEA,WAAO,KAAK;AAAA,EACb,CAAA,EACA,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AACnB;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/router-devtools",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.17.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"author": "Tanner Linsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -49,13 +49,16 @@
|
|
|
49
49
|
"src"
|
|
50
50
|
],
|
|
51
51
|
"dependencies": {
|
|
52
|
+
"clsx": "^2.1.0",
|
|
52
53
|
"date-fns": "^2.29.1",
|
|
54
|
+
"goober": "^2.1.14",
|
|
53
55
|
"@tanstack/react-router": "1.16.6"
|
|
54
56
|
},
|
|
55
57
|
"devDependencies": {
|
|
56
58
|
"@vitejs/plugin-react": "^4.2.1",
|
|
57
59
|
"react": "^18.2.0",
|
|
58
|
-
"react-dom": "^18.2.0"
|
|
60
|
+
"react-dom": "^18.2.0",
|
|
61
|
+
"vite": "^5.0.12"
|
|
59
62
|
},
|
|
60
63
|
"peerDependencies": {
|
|
61
64
|
"react": ">=16",
|