@compose-market/theme 0.1.9 → 0.1.11
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/css/mirror.css +324 -63
- package/dist/mirror/index.d.ts +1 -1
- package/dist/mirror/index.d.ts.map +1 -1
- package/dist/mirror/index.js +324 -63
- package/dist/mirror/index.js.map +1 -1
- package/package.json +1 -1
package/dist/mirror/index.js
CHANGED
|
@@ -2,7 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
2
2
|
import { cx } from "../internal/cx";
|
|
3
3
|
export const mirrorStyles = /* css */ `
|
|
4
4
|
.cm-mirror-pane {
|
|
5
|
-
container-
|
|
5
|
+
container-name: cm-mirror;
|
|
6
|
+
container-type: size;
|
|
6
7
|
display: flex;
|
|
7
8
|
flex-direction: column;
|
|
8
9
|
width: 100%;
|
|
@@ -105,16 +106,20 @@ export const mirrorStyles = /* css */ `
|
|
|
105
106
|
}
|
|
106
107
|
|
|
107
108
|
.cm-mirror-pane__body {
|
|
108
|
-
--cm-mirror-logo: clamp(2.
|
|
109
|
+
--cm-mirror-logo: clamp(2.75rem, 7.2cqi, 3.2rem);
|
|
110
|
+
--cm-mirror-gap: clamp(0.36rem, 1.25cqi, 0.6rem);
|
|
111
|
+
--cm-mirror-pad: clamp(0.4rem, 1.25cqi, 0.6rem);
|
|
112
|
+
--cm-mirror-cell-min: clamp(1.82rem, 4.4cqb, 2.45rem);
|
|
113
|
+
--cm-mirror-option-min: clamp(1.55rem, 3.8cqb, 2rem);
|
|
109
114
|
flex: 1 1 auto;
|
|
110
115
|
display: grid;
|
|
111
116
|
grid-template-rows: auto minmax(0, 1fr);
|
|
112
117
|
align-content: stretch;
|
|
113
|
-
gap: clamp(0.42rem, 1.
|
|
118
|
+
gap: clamp(0.42rem, 1.6cqi, 0.72rem);
|
|
114
119
|
min-width: 0;
|
|
115
120
|
min-height: 0;
|
|
116
121
|
overflow: hidden;
|
|
117
|
-
padding: clamp(0.52rem, 1.
|
|
122
|
+
padding: clamp(0.52rem, 1.7cqi, 0.82rem);
|
|
118
123
|
}
|
|
119
124
|
|
|
120
125
|
.cm-mirror-pane__header {
|
|
@@ -225,9 +230,8 @@ export const mirrorStyles = /* css */ `
|
|
|
225
230
|
gap: 0.24rem;
|
|
226
231
|
min-width: 0;
|
|
227
232
|
max-width: 100%;
|
|
228
|
-
min-height: 1.
|
|
229
|
-
|
|
230
|
-
padding: 0 0.42rem;
|
|
233
|
+
min-height: clamp(1.22rem, 3.4cqi, 1.38rem);
|
|
234
|
+
padding: 0 clamp(0.34rem, 1.1cqi, 0.46rem);
|
|
231
235
|
border: 1px solid hsl(var(--accent) / 0.24);
|
|
232
236
|
border-radius: 999px;
|
|
233
237
|
background: hsl(var(--accent) / 0.1);
|
|
@@ -285,18 +289,28 @@ export const mirrorStyles = /* css */ `
|
|
|
285
289
|
|
|
286
290
|
.cm-mirror-pane__content {
|
|
287
291
|
display: grid;
|
|
292
|
+
grid-template-rows: minmax(0, 1fr);
|
|
293
|
+
align-items: stretch;
|
|
294
|
+
height: 100%;
|
|
288
295
|
min-width: 0;
|
|
289
296
|
min-height: 0;
|
|
290
297
|
overflow: hidden;
|
|
291
298
|
}
|
|
292
299
|
|
|
300
|
+
.cm-mirror-pane__body > .cm-mirror-pane__content:first-child:last-child {
|
|
301
|
+
grid-row: 1 / -1;
|
|
302
|
+
}
|
|
303
|
+
|
|
293
304
|
.cm-mirror-pane__details,
|
|
294
305
|
.cm-mirror-pane__custom-content {
|
|
295
306
|
display: grid;
|
|
296
|
-
|
|
307
|
+
grid-auto-rows: minmax(min-content, 1fr);
|
|
308
|
+
gap: var(--cm-mirror-gap);
|
|
309
|
+
height: 100%;
|
|
297
310
|
min-width: 0;
|
|
298
311
|
min-height: 0;
|
|
299
|
-
align-content:
|
|
312
|
+
align-content: stretch;
|
|
313
|
+
align-items: stretch;
|
|
300
314
|
overflow: hidden;
|
|
301
315
|
}
|
|
302
316
|
|
|
@@ -307,7 +321,8 @@ export const mirrorStyles = /* css */ `
|
|
|
307
321
|
.cm-mirror-pane__tool-group,
|
|
308
322
|
.cm-mirror-pane__no-params,
|
|
309
323
|
.cm-mirror-pane__text-area,
|
|
310
|
-
.cm-mirror-pane__field
|
|
324
|
+
.cm-mirror-pane__field,
|
|
325
|
+
.cm-mirror-pane__option {
|
|
311
326
|
border: 1px solid hsl(var(--primary) / 0.12);
|
|
312
327
|
border-radius: 12px;
|
|
313
328
|
background: hsl(221 50% 9% / 0.3);
|
|
@@ -333,24 +348,28 @@ export const mirrorStyles = /* css */ `
|
|
|
333
348
|
|
|
334
349
|
.cm-mirror-pane__section {
|
|
335
350
|
display: grid;
|
|
336
|
-
grid-template-columns:
|
|
337
|
-
grid-template-rows:
|
|
338
|
-
align-items:
|
|
339
|
-
gap: 0.
|
|
351
|
+
grid-template-columns: clamp(4.8rem, 18cqi, 5.85rem) minmax(0, 1fr);
|
|
352
|
+
grid-template-rows: auto;
|
|
353
|
+
align-items: stretch;
|
|
354
|
+
gap: clamp(0.34rem, 1.1cqi, 0.5rem);
|
|
340
355
|
min-width: 0;
|
|
341
356
|
min-height: 0;
|
|
342
357
|
overflow: hidden;
|
|
358
|
+
box-shadow:
|
|
359
|
+
inset 0 1px 0 hsl(0 0% 100% / 0.035),
|
|
360
|
+
0 0 18px hsl(var(--primary) / 0.035);
|
|
343
361
|
}
|
|
344
362
|
|
|
345
363
|
.cm-mirror-pane__section--compact {
|
|
346
|
-
padding:
|
|
364
|
+
padding: var(--cm-mirror-pad);
|
|
347
365
|
}
|
|
348
366
|
|
|
349
367
|
.cm-mirror-pane__section-label,
|
|
350
368
|
.cm-mirror-pane__tool-group-label {
|
|
351
369
|
display: inline-flex;
|
|
352
370
|
align-items: center;
|
|
353
|
-
justify-content:
|
|
371
|
+
justify-content: flex-start;
|
|
372
|
+
align-self: center;
|
|
354
373
|
min-width: 0;
|
|
355
374
|
color: hsl(var(--muted-foreground));
|
|
356
375
|
font-family: var(--font-mono), monospace;
|
|
@@ -369,10 +388,56 @@ export const mirrorStyles = /* css */ `
|
|
|
369
388
|
letter-spacing: 0;
|
|
370
389
|
}
|
|
371
390
|
|
|
372
|
-
.cm-mirror-pane__section--
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
391
|
+
.cm-mirror-pane__section--capability {
|
|
392
|
+
border-color: hsl(var(--primary) / 0.22);
|
|
393
|
+
background:
|
|
394
|
+
linear-gradient(135deg, hsl(var(--primary) / 0.1), transparent 42%),
|
|
395
|
+
hsl(221 50% 9% / 0.3);
|
|
396
|
+
}
|
|
397
|
+
|
|
398
|
+
.cm-mirror-pane__section--context {
|
|
399
|
+
border-color: hsl(142 71% 45% / 0.18);
|
|
400
|
+
background:
|
|
401
|
+
linear-gradient(135deg, hsl(142 71% 45% / 0.08), transparent 44%),
|
|
402
|
+
hsl(221 50% 9% / 0.28);
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
.cm-mirror-pane__section--pricing {
|
|
406
|
+
border-color: hsl(var(--accent) / 0.2);
|
|
407
|
+
background:
|
|
408
|
+
linear-gradient(135deg, hsl(var(--accent) / 0.09), transparent 44%),
|
|
409
|
+
hsl(221 50% 9% / 0.3);
|
|
410
|
+
}
|
|
411
|
+
|
|
412
|
+
.cm-mirror-pane__section--custom,
|
|
413
|
+
.cm-mirror-pane__section--param {
|
|
414
|
+
border-color: hsl(var(--primary) / 0.16);
|
|
415
|
+
background:
|
|
416
|
+
linear-gradient(135deg, hsl(var(--primary) / 0.065), hsl(var(--accent) / 0.045)),
|
|
417
|
+
hsl(221 50% 9% / 0.3);
|
|
418
|
+
}
|
|
419
|
+
|
|
420
|
+
.cm-mirror-pane__section--capability .cm-mirror-pane__section-label {
|
|
421
|
+
color: hsl(var(--primary));
|
|
422
|
+
}
|
|
423
|
+
|
|
424
|
+
.cm-mirror-pane__section--context .cm-mirror-pane__section-label {
|
|
425
|
+
color: hsl(142 71% 58%);
|
|
426
|
+
}
|
|
427
|
+
|
|
428
|
+
.cm-mirror-pane__section--pricing .cm-mirror-pane__section-label {
|
|
429
|
+
color: hsl(var(--accent));
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
.cm-mirror-pane__section--custom,
|
|
433
|
+
.cm-mirror-pane__section--param {
|
|
434
|
+
align-items: start;
|
|
435
|
+
}
|
|
436
|
+
|
|
437
|
+
.cm-mirror-pane__section--custom > .cm-mirror-pane__section-label,
|
|
438
|
+
.cm-mirror-pane__section--param > .cm-mirror-pane__section-label {
|
|
439
|
+
align-self: start;
|
|
440
|
+
padding-top: clamp(0.42rem, 1.25cqb, 0.64rem);
|
|
376
441
|
}
|
|
377
442
|
|
|
378
443
|
.cm-mirror-pane__io-row,
|
|
@@ -380,14 +445,14 @@ export const mirrorStyles = /* css */ `
|
|
|
380
445
|
.cm-mirror-pane__pricing-header,
|
|
381
446
|
.cm-mirror-pane__tool-toggle {
|
|
382
447
|
min-width: 0;
|
|
383
|
-
min-height:
|
|
448
|
+
min-height: 0;
|
|
384
449
|
}
|
|
385
450
|
|
|
386
451
|
.cm-mirror-pane__io-row {
|
|
387
452
|
display: grid;
|
|
388
|
-
grid-template-columns:
|
|
453
|
+
grid-template-columns: auto minmax(0, 1fr);
|
|
389
454
|
align-items: center;
|
|
390
|
-
gap: 0.
|
|
455
|
+
gap: clamp(0.34rem, 1.05cqi, 0.46rem);
|
|
391
456
|
min-width: 0;
|
|
392
457
|
}
|
|
393
458
|
|
|
@@ -410,7 +475,7 @@ export const mirrorStyles = /* css */ `
|
|
|
410
475
|
display: flex;
|
|
411
476
|
align-items: center;
|
|
412
477
|
justify-content: flex-start;
|
|
413
|
-
gap: 0.
|
|
478
|
+
gap: clamp(0.2rem, 0.8cqi, 0.3rem);
|
|
414
479
|
min-width: 0;
|
|
415
480
|
flex-wrap: wrap;
|
|
416
481
|
}
|
|
@@ -423,9 +488,9 @@ export const mirrorStyles = /* css */ `
|
|
|
423
488
|
display: inline-flex;
|
|
424
489
|
align-items: center;
|
|
425
490
|
justify-content: center;
|
|
426
|
-
width: 1.
|
|
427
|
-
height: 1.
|
|
428
|
-
min-width: 1.
|
|
491
|
+
width: clamp(1.32rem, 3.8cqi, 1.5rem);
|
|
492
|
+
height: clamp(1.32rem, 3.8cqi, 1.5rem);
|
|
493
|
+
min-width: clamp(1.32rem, 3.8cqi, 1.5rem);
|
|
429
494
|
border: 1px solid hsl(var(--primary) / 0.22);
|
|
430
495
|
border-radius: 999px;
|
|
431
496
|
background: hsl(var(--primary) / 0.08);
|
|
@@ -433,32 +498,32 @@ export const mirrorStyles = /* css */ `
|
|
|
433
498
|
}
|
|
434
499
|
|
|
435
500
|
.cm-mirror-pane__icon-label--section {
|
|
436
|
-
width: 1.
|
|
437
|
-
height: 1.
|
|
438
|
-
min-width: 1.
|
|
501
|
+
width: clamp(1.58rem, 4.6cqi, 1.78rem);
|
|
502
|
+
height: clamp(1.58rem, 4.6cqi, 1.78rem);
|
|
503
|
+
min-width: clamp(1.58rem, 4.6cqi, 1.78rem);
|
|
439
504
|
border-color: hsl(var(--primary) / 0.32);
|
|
440
505
|
background: hsl(var(--primary) / 0.1);
|
|
441
506
|
}
|
|
442
507
|
|
|
443
508
|
.cm-mirror-pane__icon-svg {
|
|
444
|
-
width: 0.
|
|
445
|
-
height: 0.
|
|
509
|
+
width: clamp(0.78rem, 2.25cqi, 0.9rem);
|
|
510
|
+
height: clamp(0.78rem, 2.25cqi, 0.9rem);
|
|
446
511
|
}
|
|
447
512
|
|
|
448
513
|
.cm-mirror-pane__icon-label--section .cm-mirror-pane__icon-svg {
|
|
449
|
-
width: 0.
|
|
450
|
-
height: 0.
|
|
514
|
+
width: clamp(0.96rem, 2.85cqi, 1.08rem);
|
|
515
|
+
height: clamp(0.96rem, 2.85cqi, 1.08rem);
|
|
451
516
|
}
|
|
452
517
|
|
|
453
|
-
.cm-mirror-pane__badge
|
|
518
|
+
.cm-mirror-pane__badge,
|
|
519
|
+
.cm-mirror-pane__format-badge {
|
|
454
520
|
display: inline-grid;
|
|
455
521
|
grid-template-columns: auto minmax(0, 1fr);
|
|
456
522
|
align-items: center;
|
|
457
523
|
justify-content: center;
|
|
458
524
|
gap: 0.24rem;
|
|
459
525
|
min-width: 0;
|
|
460
|
-
min-height: 1.36rem;
|
|
461
|
-
max-height: 1.36rem;
|
|
526
|
+
min-height: clamp(1.2rem, 3.2cqi, 1.36rem);
|
|
462
527
|
max-width: 100%;
|
|
463
528
|
border: 1px solid hsl(var(--primary) / 0.18);
|
|
464
529
|
border-radius: 999px;
|
|
@@ -476,6 +541,15 @@ export const mirrorStyles = /* css */ `
|
|
|
476
541
|
text-overflow: ellipsis;
|
|
477
542
|
}
|
|
478
543
|
|
|
544
|
+
.cm-mirror-pane__format-badge {
|
|
545
|
+
grid-template-columns: auto;
|
|
546
|
+
width: clamp(1.34rem, 3.65cqi, 1.48rem);
|
|
547
|
+
min-width: clamp(1.34rem, 3.65cqi, 1.48rem);
|
|
548
|
+
min-height: clamp(1.34rem, 3.65cqi, 1.48rem);
|
|
549
|
+
padding: 0;
|
|
550
|
+
border-radius: 999px;
|
|
551
|
+
}
|
|
552
|
+
|
|
479
553
|
.cm-mirror-pane__badge > span:last-child {
|
|
480
554
|
min-width: 0;
|
|
481
555
|
overflow: hidden;
|
|
@@ -484,18 +558,20 @@ export const mirrorStyles = /* css */ `
|
|
|
484
558
|
}
|
|
485
559
|
|
|
486
560
|
.cm-mirror-pane__format-icon {
|
|
487
|
-
width: 0.
|
|
488
|
-
height: 0.
|
|
561
|
+
width: clamp(0.64rem, 1.85cqi, 0.74rem);
|
|
562
|
+
height: clamp(0.64rem, 1.85cqi, 0.74rem);
|
|
489
563
|
flex: 0 0 auto;
|
|
490
564
|
}
|
|
491
565
|
|
|
492
|
-
.cm-mirror-pane__badge[data-tone="fuchsia"]
|
|
566
|
+
.cm-mirror-pane__badge[data-tone="fuchsia"],
|
|
567
|
+
.cm-mirror-pane__format-badge[data-tone="fuchsia"] {
|
|
493
568
|
border-color: hsl(var(--accent) / 0.24);
|
|
494
569
|
background: hsl(var(--accent) / 0.1);
|
|
495
570
|
color: hsl(var(--accent));
|
|
496
571
|
}
|
|
497
572
|
|
|
498
|
-
.cm-mirror-pane__badge[data-tone="green"]
|
|
573
|
+
.cm-mirror-pane__badge[data-tone="green"],
|
|
574
|
+
.cm-mirror-pane__format-badge[data-tone="green"] {
|
|
499
575
|
border-color: hsl(142 71% 45% / 0.28);
|
|
500
576
|
background: hsl(142 71% 45% / 0.1);
|
|
501
577
|
color: hsl(142 71% 55%);
|
|
@@ -514,28 +590,35 @@ export const mirrorStyles = /* css */ `
|
|
|
514
590
|
}
|
|
515
591
|
|
|
516
592
|
.cm-mirror-pane__kv-grid,
|
|
517
|
-
.cm-mirror-pane__pricing-entries
|
|
593
|
+
.cm-mirror-pane__pricing-entries,
|
|
594
|
+
.cm-mirror-pane__lane-grid {
|
|
518
595
|
display: grid;
|
|
519
596
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
520
|
-
grid-auto-rows: minmax(
|
|
521
|
-
gap: 0.
|
|
597
|
+
grid-auto-rows: minmax(0, 1fr);
|
|
598
|
+
gap: clamp(0.22rem, 0.8cqi, 0.34rem);
|
|
599
|
+
height: 100%;
|
|
522
600
|
min-width: 0;
|
|
523
601
|
min-height: 0;
|
|
524
|
-
align-content:
|
|
602
|
+
align-content: stretch;
|
|
603
|
+
align-items: stretch;
|
|
525
604
|
}
|
|
526
605
|
|
|
527
606
|
.cm-mirror-pane__kv-row,
|
|
607
|
+
.cm-mirror-pane__io-row,
|
|
528
608
|
.cm-mirror-pane__pricing-header {
|
|
529
609
|
display: grid;
|
|
530
610
|
grid-template-columns: auto minmax(0, 1fr);
|
|
531
611
|
align-items: center;
|
|
532
|
-
gap: 0.
|
|
612
|
+
gap: clamp(0.34rem, 1.05cqi, 0.48rem);
|
|
533
613
|
min-width: 0;
|
|
534
|
-
min-height:
|
|
535
|
-
|
|
614
|
+
min-height: var(--cm-mirror-cell-min);
|
|
615
|
+
height: 100%;
|
|
616
|
+
padding: clamp(0.3rem, 0.95cqi, 0.42rem) clamp(0.38rem, 1.2cqi, 0.52rem);
|
|
536
617
|
border: 1px solid hsl(var(--primary) / 0.11);
|
|
537
618
|
border-radius: 999px;
|
|
538
|
-
background:
|
|
619
|
+
background:
|
|
620
|
+
linear-gradient(180deg, hsl(0 0% 100% / 0.035), transparent),
|
|
621
|
+
hsl(221 50% 9% / 0.36);
|
|
539
622
|
}
|
|
540
623
|
|
|
541
624
|
.cm-mirror-pane__kv-value {
|
|
@@ -577,7 +660,9 @@ export const mirrorStyles = /* css */ `
|
|
|
577
660
|
.cm-mirror-pane__pricing-block,
|
|
578
661
|
.cm-mirror-pane__tool-group {
|
|
579
662
|
display: grid;
|
|
580
|
-
|
|
663
|
+
grid-template-rows: minmax(0, 1fr) auto;
|
|
664
|
+
gap: clamp(0.24rem, 0.82cqi, 0.34rem);
|
|
665
|
+
height: 100%;
|
|
581
666
|
min-width: 0;
|
|
582
667
|
min-height: 0;
|
|
583
668
|
}
|
|
@@ -588,12 +673,13 @@ export const mirrorStyles = /* css */ `
|
|
|
588
673
|
|
|
589
674
|
.cm-mirror-pane__pricing-block,
|
|
590
675
|
.cm-mirror-pane__tool-group {
|
|
591
|
-
padding: 0.
|
|
676
|
+
padding: clamp(0.42rem, 1.2cqi, 0.58rem);
|
|
592
677
|
}
|
|
593
678
|
|
|
594
679
|
.cm-mirror-pane__section--context .cm-mirror-pane__kv-grid,
|
|
595
|
-
.cm-mirror-pane__section--pricing .cm-mirror-pane__pricing-entries
|
|
596
|
-
|
|
680
|
+
.cm-mirror-pane__section--pricing .cm-mirror-pane__pricing-entries,
|
|
681
|
+
.cm-mirror-pane__section--capability .cm-mirror-pane__lane-grid {
|
|
682
|
+
gap: clamp(0.22rem, 0.78cqi, 0.32rem);
|
|
597
683
|
}
|
|
598
684
|
|
|
599
685
|
.cm-mirror-pane__section--pricing > .cm-mirror-pane__pricing-compact {
|
|
@@ -672,33 +758,106 @@ export const mirrorStyles = /* css */ `
|
|
|
672
758
|
display: grid;
|
|
673
759
|
grid-template-columns: minmax(0, 1fr) auto;
|
|
674
760
|
align-items: center;
|
|
675
|
-
gap: 0.58rem;
|
|
761
|
+
gap: clamp(0.36rem, 1.05cqi, 0.58rem);
|
|
676
762
|
}
|
|
677
763
|
|
|
678
764
|
.cm-mirror-pane__custom-section {
|
|
679
765
|
display: grid;
|
|
680
|
-
gap: 0.
|
|
766
|
+
gap: clamp(0.34rem, 1cqi, 0.46rem);
|
|
681
767
|
min-width: 0;
|
|
682
768
|
}
|
|
683
769
|
|
|
770
|
+
.cm-mirror-pane__param-body {
|
|
771
|
+
display: grid;
|
|
772
|
+
grid-template-rows: minmax(0, auto) auto;
|
|
773
|
+
align-content: start;
|
|
774
|
+
gap: clamp(0.28rem, 0.95cqi, 0.42rem);
|
|
775
|
+
height: 100%;
|
|
776
|
+
min-width: 0;
|
|
777
|
+
min-height: 0;
|
|
778
|
+
}
|
|
779
|
+
|
|
684
780
|
.cm-mirror-pane__text-area {
|
|
685
781
|
width: 100%;
|
|
686
|
-
|
|
687
|
-
|
|
782
|
+
height: 100%;
|
|
783
|
+
min-height: 0;
|
|
784
|
+
max-height: none;
|
|
785
|
+
padding: clamp(0.54rem, 1.5cqi, 0.72rem);
|
|
688
786
|
color: hsl(var(--foreground));
|
|
689
787
|
font-family: var(--font-mono), monospace;
|
|
690
788
|
font-size: 0.86rem;
|
|
691
|
-
resize:
|
|
789
|
+
resize: none;
|
|
692
790
|
}
|
|
693
791
|
|
|
694
792
|
.cm-mirror-pane__field {
|
|
695
793
|
width: 100%;
|
|
696
|
-
min-height: 2.45rem;
|
|
794
|
+
min-height: clamp(2.05rem, 5.4cqi, 2.45rem);
|
|
697
795
|
color: hsl(var(--foreground));
|
|
698
796
|
font-family: var(--font-mono), monospace;
|
|
699
797
|
font-size: 0.86rem;
|
|
700
798
|
}
|
|
701
799
|
|
|
800
|
+
.cm-mirror-pane__option-grid {
|
|
801
|
+
display: grid;
|
|
802
|
+
grid-template-columns: repeat(auto-fit, minmax(min(100%, 4.5rem), 1fr));
|
|
803
|
+
grid-auto-rows: minmax(var(--cm-mirror-option-min), auto);
|
|
804
|
+
align-items: stretch;
|
|
805
|
+
gap: clamp(0.24rem, 0.82cqi, 0.34rem);
|
|
806
|
+
width: 100%;
|
|
807
|
+
min-width: 0;
|
|
808
|
+
min-height: 0;
|
|
809
|
+
}
|
|
810
|
+
|
|
811
|
+
.cm-mirror-pane__option {
|
|
812
|
+
display: inline-flex;
|
|
813
|
+
align-items: center;
|
|
814
|
+
justify-content: center;
|
|
815
|
+
min-width: 0;
|
|
816
|
+
min-height: var(--cm-mirror-option-min);
|
|
817
|
+
height: 100%;
|
|
818
|
+
padding: 0 clamp(0.48rem, 1.45cqi, 0.68rem);
|
|
819
|
+
color: hsl(var(--muted-foreground));
|
|
820
|
+
cursor: pointer;
|
|
821
|
+
font-family: var(--font-mono), monospace;
|
|
822
|
+
font-size: 0.72rem;
|
|
823
|
+
font-weight: 800;
|
|
824
|
+
letter-spacing: 0.05em;
|
|
825
|
+
line-height: 1;
|
|
826
|
+
text-transform: uppercase;
|
|
827
|
+
transition:
|
|
828
|
+
border-color 160ms ease,
|
|
829
|
+
background-color 160ms ease,
|
|
830
|
+
color 160ms ease,
|
|
831
|
+
box-shadow 160ms ease;
|
|
832
|
+
}
|
|
833
|
+
|
|
834
|
+
.cm-mirror-pane__option[data-active="true"] {
|
|
835
|
+
border-color: hsl(var(--primary) / 0.34);
|
|
836
|
+
background: hsl(var(--primary) / 0.12);
|
|
837
|
+
color: hsl(var(--primary));
|
|
838
|
+
box-shadow: 0 0 14px hsl(var(--primary) / 0.1);
|
|
839
|
+
}
|
|
840
|
+
|
|
841
|
+
.cm-mirror-pane__option:hover,
|
|
842
|
+
.cm-mirror-pane__option:focus-visible {
|
|
843
|
+
outline: none;
|
|
844
|
+
border-color: hsl(var(--primary) / 0.3);
|
|
845
|
+
color: hsl(var(--foreground));
|
|
846
|
+
}
|
|
847
|
+
|
|
848
|
+
.cm-mirror-pane__option .cm-hint,
|
|
849
|
+
.cm-mirror-pane__option .cm-hint__trigger {
|
|
850
|
+
max-width: 100%;
|
|
851
|
+
min-width: 0;
|
|
852
|
+
}
|
|
853
|
+
|
|
854
|
+
.cm-mirror-pane__option span {
|
|
855
|
+
min-width: 0;
|
|
856
|
+
overflow: hidden;
|
|
857
|
+
text-overflow: ellipsis;
|
|
858
|
+
white-space: nowrap;
|
|
859
|
+
}
|
|
860
|
+
|
|
702
861
|
.cm-mirror-pane__field:focus,
|
|
703
862
|
.cm-mirror-pane__field:focus-visible,
|
|
704
863
|
.cm-mirror-pane__text-area:focus,
|
|
@@ -716,6 +875,16 @@ export const mirrorStyles = /* css */ `
|
|
|
716
875
|
line-height: 1.4;
|
|
717
876
|
}
|
|
718
877
|
|
|
878
|
+
.cm-mirror-pane__param-description,
|
|
879
|
+
.cm-mirror-pane__param-description .cm-excerpt,
|
|
880
|
+
.cm-mirror-pane__param-description .cm-excerpt__trigger,
|
|
881
|
+
.cm-mirror-pane__param-description .cm-excerpt__text,
|
|
882
|
+
.cm-mirror-pane__param-description .cm-hint,
|
|
883
|
+
.cm-mirror-pane__param-description .cm-hint__trigger {
|
|
884
|
+
width: 100%;
|
|
885
|
+
min-width: 0;
|
|
886
|
+
}
|
|
887
|
+
|
|
719
888
|
.cm-mirror-pane__no-params {
|
|
720
889
|
padding: 1rem;
|
|
721
890
|
text-align: center;
|
|
@@ -723,12 +892,12 @@ export const mirrorStyles = /* css */ `
|
|
|
723
892
|
|
|
724
893
|
@container (max-width: 28rem) {
|
|
725
894
|
.cm-mirror-pane__body {
|
|
726
|
-
gap: 0.54rem;
|
|
727
|
-
padding: 0.62rem;
|
|
895
|
+
gap: clamp(0.38rem, 1.35cqi, 0.54rem);
|
|
896
|
+
padding: clamp(0.48rem, 1.45cqi, 0.62rem);
|
|
728
897
|
}
|
|
729
898
|
|
|
730
|
-
.cm-mirror-pane__section
|
|
731
|
-
grid-template-columns: minmax(0, 1fr);
|
|
899
|
+
.cm-mirror-pane__section {
|
|
900
|
+
grid-template-columns: clamp(4.55rem, 21cqi, 5.45rem) minmax(0, 1fr);
|
|
732
901
|
}
|
|
733
902
|
|
|
734
903
|
.cm-mirror-pane__io-badges {
|
|
@@ -736,6 +905,83 @@ export const mirrorStyles = /* css */ `
|
|
|
736
905
|
}
|
|
737
906
|
}
|
|
738
907
|
|
|
908
|
+
@container cm-mirror (max-height: 44rem) {
|
|
909
|
+
.cm-mirror-pane__body {
|
|
910
|
+
--cm-mirror-gap: clamp(0.28rem, 1cqi, 0.48rem);
|
|
911
|
+
--cm-mirror-pad: clamp(0.32rem, 1cqi, 0.5rem);
|
|
912
|
+
--cm-mirror-cell-min: clamp(1.62rem, 4cqb, 2.1rem);
|
|
913
|
+
--cm-mirror-option-min: clamp(1.42rem, 3.4cqb, 1.82rem);
|
|
914
|
+
}
|
|
915
|
+
|
|
916
|
+
.cm-mirror-pane__toolbar {
|
|
917
|
+
min-height: 2.6rem;
|
|
918
|
+
padding-block: 0.28rem;
|
|
919
|
+
}
|
|
920
|
+
|
|
921
|
+
.cm-mirror-pane__body {
|
|
922
|
+
gap: var(--cm-mirror-gap);
|
|
923
|
+
padding: clamp(0.42rem, 1.35cqi, 0.64rem);
|
|
924
|
+
}
|
|
925
|
+
|
|
926
|
+
.cm-mirror-pane__description {
|
|
927
|
+
padding: clamp(0.38rem, 1.1cqi, 0.52rem);
|
|
928
|
+
line-height: 1.26;
|
|
929
|
+
}
|
|
930
|
+
|
|
931
|
+
.cm-mirror-pane__section--compact {
|
|
932
|
+
padding: var(--cm-mirror-pad);
|
|
933
|
+
}
|
|
934
|
+
}
|
|
935
|
+
|
|
936
|
+
@container cm-mirror (max-height: 34rem) {
|
|
937
|
+
.cm-mirror-pane__body {
|
|
938
|
+
--cm-mirror-gap: 0.26rem;
|
|
939
|
+
--cm-mirror-pad: 0.32rem;
|
|
940
|
+
--cm-mirror-cell-min: 1.48rem;
|
|
941
|
+
--cm-mirror-option-min: 1.36rem;
|
|
942
|
+
}
|
|
943
|
+
|
|
944
|
+
.cm-mirror-pane__toolbar {
|
|
945
|
+
min-height: 2.25rem;
|
|
946
|
+
}
|
|
947
|
+
|
|
948
|
+
.cm-mirror-pane__toolbar-btn {
|
|
949
|
+
min-width: 1.85rem;
|
|
950
|
+
min-height: 1.85rem;
|
|
951
|
+
padding-inline: 0.46rem;
|
|
952
|
+
}
|
|
953
|
+
|
|
954
|
+
.cm-mirror-pane__body {
|
|
955
|
+
gap: 0.3rem;
|
|
956
|
+
padding: 0.38rem;
|
|
957
|
+
}
|
|
958
|
+
|
|
959
|
+
.cm-mirror-pane__header {
|
|
960
|
+
gap: 0.48rem;
|
|
961
|
+
}
|
|
962
|
+
|
|
963
|
+
.cm-mirror-pane__description {
|
|
964
|
+
font-size: 0.78rem;
|
|
965
|
+
line-height: 1.2;
|
|
966
|
+
padding: 0.34rem 0.42rem;
|
|
967
|
+
}
|
|
968
|
+
|
|
969
|
+
.cm-mirror-pane__section-label,
|
|
970
|
+
.cm-mirror-pane__tool-group-label,
|
|
971
|
+
.cm-mirror-pane__kv-value,
|
|
972
|
+
.cm-mirror-pane__field,
|
|
973
|
+
.cm-mirror-pane__text-area,
|
|
974
|
+
.cm-mirror-pane__param-description,
|
|
975
|
+
.cm-mirror-pane__no-params {
|
|
976
|
+
font-size: 0.74rem;
|
|
977
|
+
}
|
|
978
|
+
|
|
979
|
+
.cm-mirror-pane__option {
|
|
980
|
+
font-size: 0.66rem;
|
|
981
|
+
padding-inline: 0.38rem;
|
|
982
|
+
}
|
|
983
|
+
}
|
|
984
|
+
|
|
739
985
|
@container (max-width: 22rem) {
|
|
740
986
|
.cm-mirror-pane__model-icon-box {
|
|
741
987
|
display: none;
|
|
@@ -745,6 +991,21 @@ export const mirrorStyles = /* css */ `
|
|
|
745
991
|
grid-template-columns: minmax(0, 1fr);
|
|
746
992
|
}
|
|
747
993
|
|
|
994
|
+
.cm-mirror-pane__section {
|
|
995
|
+
grid-template-columns: minmax(0, 1fr);
|
|
996
|
+
align-items: start;
|
|
997
|
+
}
|
|
998
|
+
|
|
999
|
+
.cm-mirror-pane__section-label {
|
|
1000
|
+
margin-bottom: -0.1rem;
|
|
1001
|
+
}
|
|
1002
|
+
|
|
1003
|
+
.cm-mirror-pane__kv-grid,
|
|
1004
|
+
.cm-mirror-pane__pricing-entries,
|
|
1005
|
+
.cm-mirror-pane__lane-grid {
|
|
1006
|
+
grid-template-columns: minmax(0, 1fr);
|
|
1007
|
+
}
|
|
1008
|
+
|
|
748
1009
|
.cm-mirror-pane__tool-toggle {
|
|
749
1010
|
grid-template-columns: minmax(0, 1fr);
|
|
750
1011
|
align-items: start;
|
package/dist/mirror/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/mirror/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAC;AAEpC,MAAM,CAAC,MAAM,YAAY,GAAG,SAAS,CAAC
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/mirror/index.tsx"],"names":[],"mappings":"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"}
|