@xenosystem/components 0.7.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/auth/index.js +3 -0
  2. package/dist/catalog.json +1026 -0
  3. package/dist/chrome/index.d.ts +1182 -0
  4. package/dist/chrome/index.js +1917 -0
  5. package/package.json +5 -1
package/dist/catalog.json CHANGED
@@ -332,6 +332,1032 @@
332
332
  "propList": []
333
333
  }
334
334
  ]
335
+ },
336
+ {
337
+ "family": "chrome",
338
+ "units": [
339
+ {
340
+ "name": "SearchGlyph",
341
+ "file": "controls.tsx",
342
+ "doc": "Lucide `search` geometry.",
343
+ "props": null,
344
+ "propList": []
345
+ },
346
+ {
347
+ "name": "ClearGlyph",
348
+ "file": "controls.tsx",
349
+ "doc": "Lucide `x` geometry.",
350
+ "props": null,
351
+ "propList": []
352
+ },
353
+ {
354
+ "name": "ChevronGlyph",
355
+ "file": "controls.tsx",
356
+ "doc": "Lucide `chevron-right` geometry — rotated by CSS when a section expands.",
357
+ "props": null,
358
+ "propList": []
359
+ },
360
+ {
361
+ "name": "IconButton",
362
+ "file": "controls.tsx",
363
+ "doc": "A square icon-only button — the toolbar/row workhorse.\r\n\n@example\r\n```tsx\r\n<IconButton icon={<TrashGlyph />} label=\"Delete layer\" onClick={remove} disabled={!selection} />\r\n```",
364
+ "props": "IconButtonProps",
365
+ "propList": [
366
+ {
367
+ "name": "icon",
368
+ "type": "ReactNode",
369
+ "optional": false,
370
+ "doc": "The glyph. Any node — the primitives never import an icon library."
371
+ },
372
+ {
373
+ "name": "label",
374
+ "type": "string",
375
+ "optional": false,
376
+ "doc": "Accessible name; also used as the native tooltip. Required — an icon alone is not a name."
377
+ },
378
+ {
379
+ "name": "onClick",
380
+ "type": "() => void",
381
+ "optional": true,
382
+ "doc": "Click handler."
383
+ },
384
+ {
385
+ "name": "active",
386
+ "type": "boolean",
387
+ "optional": true,
388
+ "doc": "Pressed/latched treatment (`aria-pressed`)."
389
+ },
390
+ {
391
+ "name": "disabled",
392
+ "type": "boolean",
393
+ "optional": true,
394
+ "doc": "Disabled treatment (`disabled`, `cursor: not-allowed`)."
395
+ },
396
+ {
397
+ "name": "size",
398
+ "type": "'sm' | 'md'",
399
+ "optional": true,
400
+ "doc": "`sm` = 20px (inside rows), `md` = 24px (toolbars, default)."
401
+ },
402
+ {
403
+ "name": "className",
404
+ "type": "string",
405
+ "optional": true,
406
+ "doc": "Extra classes."
407
+ }
408
+ ]
409
+ },
410
+ {
411
+ "name": "TextButton",
412
+ "file": "controls.tsx",
413
+ "doc": "A borderless text action — the inline `+ Add` / `Clear` / `Unbind` affordance. Muted by default so\r\nit reads as secondary; `strong` promotes it. Never a filled button: `DESIGN_SYSTEM.md` §7 allows\r\nexactly one primary action on screen and a panel is rarely the place for it.",
414
+ "props": "TextButtonProps",
415
+ "propList": [
416
+ {
417
+ "name": "children",
418
+ "type": "ReactNode",
419
+ "optional": true,
420
+ "doc": "Label. Census copy patterns: `+ Add`, `Clear`, `Cancel`, `Unbind`."
421
+ },
422
+ {
423
+ "name": "onClick",
424
+ "type": "() => void",
425
+ "optional": true,
426
+ "doc": "Click handler."
427
+ },
428
+ {
429
+ "name": "disabled",
430
+ "type": "boolean",
431
+ "optional": true,
432
+ "doc": "Disabled treatment."
433
+ },
434
+ {
435
+ "name": "strong",
436
+ "type": "boolean",
437
+ "optional": true,
438
+ "doc": "Render at full body brightness instead of muted."
439
+ },
440
+ {
441
+ "name": "className",
442
+ "type": "string",
443
+ "optional": true,
444
+ "doc": "Extra classes."
445
+ }
446
+ ]
447
+ },
448
+ {
449
+ "name": "SearchField",
450
+ "file": "controls.tsx",
451
+ "doc": "The canonical filter input: recessed well, leading glyph, Escape-to-clear, and a clear button\r\nthat only appears when there is something to clear.\r\n\n@example\r\n```tsx\r\n<SearchField value={query} onChange={setQuery} placeholder=\"Filter layers…\" />\r\n```",
452
+ "props": "SearchFieldProps",
453
+ "propList": [
454
+ {
455
+ "name": "value",
456
+ "type": "string",
457
+ "optional": false,
458
+ "doc": "Current query (controlled)."
459
+ },
460
+ {
461
+ "name": "onChange",
462
+ "type": "(value: string) => void",
463
+ "optional": false,
464
+ "doc": "Called with the new query on every keystroke."
465
+ },
466
+ {
467
+ "name": "placeholder",
468
+ "type": "string",
469
+ "optional": true,
470
+ "doc": "Placeholder text. Default `Search…`."
471
+ },
472
+ {
473
+ "name": "label",
474
+ "type": "string",
475
+ "optional": true,
476
+ "doc": "Accessible name. Default matches the placeholder."
477
+ },
478
+ {
479
+ "name": "onClear",
480
+ "type": "() => void",
481
+ "optional": true,
482
+ "doc": "Called when the clear affordance or Escape empties the field. Defaults to `onChange('')`."
483
+ },
484
+ {
485
+ "name": "disabled",
486
+ "type": "boolean",
487
+ "optional": true,
488
+ "doc": "Disable the input."
489
+ },
490
+ {
491
+ "name": "autoFocus",
492
+ "type": "boolean",
493
+ "optional": true,
494
+ "doc": "Focus on mount."
495
+ },
496
+ {
497
+ "name": "className",
498
+ "type": "string",
499
+ "optional": true,
500
+ "doc": "Extra classes."
501
+ }
502
+ ]
503
+ },
504
+ {
505
+ "name": "SegmentedControl",
506
+ "file": "controls.tsx",
507
+ "doc": "",
508
+ "props": "SegmentedControlProps",
509
+ "propList": [
510
+ {
511
+ "name": "options",
512
+ "type": "ReadonlyArray<SegmentOption<T>>",
513
+ "optional": false,
514
+ "doc": "The options, in display order."
515
+ },
516
+ {
517
+ "name": "value",
518
+ "type": "T",
519
+ "optional": false,
520
+ "doc": "The selected value."
521
+ },
522
+ {
523
+ "name": "onChange",
524
+ "type": "(value: T) => void",
525
+ "optional": false,
526
+ "doc": "Called with the newly selected value. Not called for the already-selected segment."
527
+ },
528
+ {
529
+ "name": "label",
530
+ "type": "string",
531
+ "optional": true,
532
+ "doc": "Accessible name for the group."
533
+ },
534
+ {
535
+ "name": "size",
536
+ "type": "'sm' | 'md'",
537
+ "optional": true,
538
+ "doc": "`sm` = 20px, `md` = 24px (default)."
539
+ },
540
+ {
541
+ "name": "stretch",
542
+ "type": "boolean",
543
+ "optional": true,
544
+ "doc": "Stretch segments to fill the available width."
545
+ },
546
+ {
547
+ "name": "className",
548
+ "type": "string",
549
+ "optional": true,
550
+ "doc": "Extra classes."
551
+ }
552
+ ]
553
+ },
554
+ {
555
+ "name": "Toggle",
556
+ "file": "controls.tsx",
557
+ "doc": "The signature XENO toggle: a rectangular track with a SQUARE knob whose corner radius softens\r\nwhen it moves to the ON position (DESIGN_SYSTEM §3 \"The Toggle Switch\"). Never a pill.",
558
+ "props": "ToggleProps",
559
+ "propList": [
560
+ {
561
+ "name": "checked",
562
+ "type": "boolean",
563
+ "optional": false,
564
+ "doc": "On/off state."
565
+ },
566
+ {
567
+ "name": "onChange",
568
+ "type": "(checked: boolean) => void",
569
+ "optional": false,
570
+ "doc": "Called with the next state."
571
+ },
572
+ {
573
+ "name": "label",
574
+ "type": "string",
575
+ "optional": false,
576
+ "doc": "Accessible name. Required — a bare switch has no visible label."
577
+ },
578
+ {
579
+ "name": "disabled",
580
+ "type": "boolean",
581
+ "optional": true,
582
+ "doc": "Disabled treatment."
583
+ },
584
+ {
585
+ "name": "size",
586
+ "type": "'sm' | 'md'",
587
+ "optional": true,
588
+ "doc": "`sm` = 16px track height, `md` = 18px (default)."
589
+ },
590
+ {
591
+ "name": "className",
592
+ "type": "string",
593
+ "optional": true,
594
+ "doc": "Extra classes."
595
+ }
596
+ ]
597
+ },
598
+ {
599
+ "name": "FieldGroup",
600
+ "file": "controls.tsx",
601
+ "doc": "A label-column layout: every {@link Field} inside shares ONE label width, so labels start at the\r\nsame x and controls end at the same x — the column alignment DESIGN_SYSTEM §5 requires and the\r\nthing hand-rolled property grids always get wrong.\r\n\n@example\r\n```tsx\r\n<FieldGroup labelWidth={64}>\r\n <Field label=\"Opacity\"><Slider … /></Field>\r\n <Field label=\"Blend\"><Select … /></Field>\r\n</FieldGroup>\r\n```",
602
+ "props": "FieldGroupProps",
603
+ "propList": [
604
+ {
605
+ "name": "children",
606
+ "type": "ReactNode",
607
+ "optional": true,
608
+ "doc": "{@link Field} children."
609
+ },
610
+ {
611
+ "name": "labelWidth",
612
+ "type": "number",
613
+ "optional": true,
614
+ "doc": "Width of the shared label column, in px. Default `PANEL_METRICS.fieldLabelWidth` (76)."
615
+ },
616
+ {
617
+ "name": "className",
618
+ "type": "string",
619
+ "optional": true,
620
+ "doc": "Extra classes."
621
+ }
622
+ ]
623
+ },
624
+ {
625
+ "name": "Field",
626
+ "file": "controls.tsx",
627
+ "doc": "One label + control row inside a {@link FieldGroup}.",
628
+ "props": "FieldProps",
629
+ "propList": [
630
+ {
631
+ "name": "label",
632
+ "type": "ReactNode",
633
+ "optional": false,
634
+ "doc": "The label text."
635
+ },
636
+ {
637
+ "name": "children",
638
+ "type": "ReactNode",
639
+ "optional": true,
640
+ "doc": "The control."
641
+ },
642
+ {
643
+ "name": "hint",
644
+ "type": "ReactNode",
645
+ "optional": true,
646
+ "doc": "Muted explanatory line under the control."
647
+ },
648
+ {
649
+ "name": "htmlFor",
650
+ "type": "string",
651
+ "optional": true,
652
+ "doc": "Id of the control the label points at. Generated when omitted and `children` is a single input."
653
+ },
654
+ {
655
+ "name": "stacked",
656
+ "type": "boolean",
657
+ "optional": true,
658
+ "doc": "Stack the label above the control instead of beside it."
659
+ },
660
+ {
661
+ "name": "className",
662
+ "type": "string",
663
+ "optional": true,
664
+ "doc": "Extra classes."
665
+ }
666
+ ]
667
+ },
668
+ {
669
+ "name": "PanelFrame",
670
+ "file": "frame.tsx",
671
+ "doc": "The canonical standalone panel frame — header bar + content well, separated by the panel gap.\r\n\n@example\r\n```tsx\r\n<PanelFrame title=\"Layers\" actions={<IconButton icon={<PlusIcon />} label=\"Add layer\" />}>\r\n <RowList>…</RowList>\r\n</PanelFrame>\r\n```",
672
+ "props": "PanelFrameProps",
673
+ "propList": [
674
+ {
675
+ "name": "title",
676
+ "type": "ReactNode",
677
+ "optional": true,
678
+ "doc": "Uppercase title shown in the header bar. Omit (with `showHeader` unset) to render no header."
679
+ },
680
+ {
681
+ "name": "actions",
682
+ "type": "ReactNode",
683
+ "optional": true,
684
+ "doc": "Trailing controls in the header bar."
685
+ },
686
+ {
687
+ "name": "showHeader",
688
+ "type": "boolean",
689
+ "optional": true,
690
+ "doc": "Force the header on/off. Defaults to \"on when `title` or `actions` is present\"."
691
+ },
692
+ {
693
+ "name": "children",
694
+ "type": "ReactNode",
695
+ "optional": true,
696
+ "doc": "Panel body."
697
+ },
698
+ {
699
+ "name": "className",
700
+ "type": "string",
701
+ "optional": true,
702
+ "doc": "Extra classes on the outer frame."
703
+ },
704
+ {
705
+ "name": "contentClassName",
706
+ "type": "string",
707
+ "optional": true,
708
+ "doc": "Extra classes on the content well."
709
+ }
710
+ ]
711
+ },
712
+ {
713
+ "name": "Toolbar",
714
+ "file": "frame.tsx",
715
+ "doc": "A dense horizontal control strip. Height matches the panel header so a toolbar stacked under a\r\nframe header reads as one continuous chrome band.\r\n\n@example\r\n```tsx\r\n<Toolbar left={<SearchField value={q} onChange={setQ} />} right={<IconButton … />} />\r\n```",
716
+ "props": "ToolbarProps",
717
+ "propList": [
718
+ {
719
+ "name": "left",
720
+ "type": "ReactNode",
721
+ "optional": true,
722
+ "doc": "Leading cluster (filters, title, counts)."
723
+ },
724
+ {
725
+ "name": "right",
726
+ "type": "ReactNode",
727
+ "optional": true,
728
+ "doc": "Trailing cluster (actions). Right-aligned."
729
+ },
730
+ {
731
+ "name": "children",
732
+ "type": "ReactNode",
733
+ "optional": true,
734
+ "doc": "Free-form children, rendered between the clusters."
735
+ },
736
+ {
737
+ "name": "divided",
738
+ "type": "boolean",
739
+ "optional": true,
740
+ "doc": "Render a hairline under the strip. Default `true`."
741
+ },
742
+ {
743
+ "name": "className",
744
+ "type": "string",
745
+ "optional": true,
746
+ "doc": "Extra classes."
747
+ }
748
+ ]
749
+ },
750
+ {
751
+ "name": "ToolbarGroup",
752
+ "file": "frame.tsx",
753
+ "doc": "A cluster of controls inside a {@link Toolbar}.",
754
+ "props": "ToolbarGroupProps",
755
+ "propList": [
756
+ {
757
+ "name": "children",
758
+ "type": "ReactNode",
759
+ "optional": true,
760
+ "doc": "Cluster contents."
761
+ },
762
+ {
763
+ "name": "end",
764
+ "type": "boolean",
765
+ "optional": true,
766
+ "doc": "Push the cluster to the right edge."
767
+ },
768
+ {
769
+ "name": "className",
770
+ "type": "string",
771
+ "optional": true,
772
+ "doc": "Extra classes."
773
+ }
774
+ ]
775
+ },
776
+ {
777
+ "name": "Divider",
778
+ "file": "frame.tsx",
779
+ "doc": "A hairline rule. Horizontal by default; `vertical` for inline separation inside a strip.",
780
+ "props": "DividerProps",
781
+ "propList": [
782
+ {
783
+ "name": "vertical",
784
+ "type": "boolean",
785
+ "optional": true,
786
+ "doc": "Render a short vertical rule (for inline use inside a toolbar)."
787
+ },
788
+ {
789
+ "name": "className",
790
+ "type": "string",
791
+ "optional": true,
792
+ "doc": "Extra classes."
793
+ }
794
+ ]
795
+ },
796
+ {
797
+ "name": "ScrollArea",
798
+ "file": "frame.tsx",
799
+ "doc": "A flex-filling scroll container with the canonical thin rectangular thumb and an unbroken\r\nheight chain (`flex: 1 1 0; min-height: 0`) — the shape DESIGN_SYSTEM §3.1 requires so panels\r\nnever reach for `max-height: calc(100vh - N)`.",
800
+ "props": "ScrollAreaProps",
801
+ "propList": [
802
+ {
803
+ "name": "children",
804
+ "type": "ReactNode",
805
+ "optional": true,
806
+ "doc": "Scrollable content."
807
+ },
808
+ {
809
+ "name": "className",
810
+ "type": "string",
811
+ "optional": true,
812
+ "doc": "Extra classes."
813
+ }
814
+ ]
815
+ },
816
+ {
817
+ "name": "Badge",
818
+ "file": "indicators.tsx",
819
+ "doc": "A small rectangular chip. Never interactive — `DESIGN_SYSTEM.md` §7: \"If a badge needs to be\r\nclickable, it's a ghost button, not a badge.\"",
820
+ "props": "BadgeProps",
821
+ "propList": [
822
+ {
823
+ "name": "children",
824
+ "type": "ReactNode",
825
+ "optional": true,
826
+ "doc": "Contents — a count, a unit, a state word."
827
+ },
828
+ {
829
+ "name": "tone",
830
+ "type": "PanelTone",
831
+ "optional": true,
832
+ "doc": "Semantic tone. Default `neutral` (monochromatic)."
833
+ },
834
+ {
835
+ "name": "size",
836
+ "type": "'sm' | 'md'",
837
+ "optional": true,
838
+ "doc": "`sm` = 12px (in-panel, default), `md` = 18px (DESIGN_SYSTEM §7 standard)."
839
+ },
840
+ {
841
+ "name": "title",
842
+ "type": "string",
843
+ "optional": true,
844
+ "doc": "Native tooltip. A chip is often the only place a long value can be read in full."
845
+ },
846
+ {
847
+ "name": "className",
848
+ "type": "string",
849
+ "optional": true,
850
+ "doc": "Extra classes."
851
+ }
852
+ ]
853
+ },
854
+ {
855
+ "name": "StatusDot",
856
+ "file": "indicators.tsx",
857
+ "doc": "A 2px-radius SQUARE status dot. Never a circle (`DESIGN_SYSTEM.md` §3 / §13).",
858
+ "props": "StatusDotProps",
859
+ "propList": [
860
+ {
861
+ "name": "tone",
862
+ "type": "PanelTone",
863
+ "optional": true,
864
+ "doc": "Semantic tone."
865
+ },
866
+ {
867
+ "name": "label",
868
+ "type": "string",
869
+ "optional": true,
870
+ "doc": "Accessible label. Supply it when the dot is the ONLY carrier of the state."
871
+ },
872
+ {
873
+ "name": "className",
874
+ "type": "string",
875
+ "optional": true,
876
+ "doc": "Extra classes."
877
+ }
878
+ ]
879
+ },
880
+ {
881
+ "name": "StatusBadge",
882
+ "file": "indicators.tsx",
883
+ "doc": "Dot + label. Color is never the sole indicator (`DESIGN_SYSTEM.md` §11) — the word carries the\r\nstate and the dot reinforces it.",
884
+ "props": "StatusBadgeProps",
885
+ "propList": [
886
+ {
887
+ "name": "children",
888
+ "type": "ReactNode",
889
+ "optional": true,
890
+ "doc": "The state text."
891
+ },
892
+ {
893
+ "name": "tone",
894
+ "type": "PanelTone",
895
+ "optional": true,
896
+ "doc": "Semantic tone."
897
+ },
898
+ {
899
+ "name": "className",
900
+ "type": "string",
901
+ "optional": true,
902
+ "doc": "Extra classes."
903
+ }
904
+ ]
905
+ },
906
+ {
907
+ "name": "IconFrame",
908
+ "file": "indicators.tsx",
909
+ "doc": "A flat outlined icon container — a thumbnail stand-in when there is no thumbnail.",
910
+ "props": "IconFrameProps",
911
+ "propList": [
912
+ {
913
+ "name": "icon",
914
+ "type": "ReactNode",
915
+ "optional": false,
916
+ "doc": "The glyph."
917
+ },
918
+ {
919
+ "name": "size",
920
+ "type": "number",
921
+ "optional": true,
922
+ "doc": "Box edge in px. Default 20."
923
+ },
924
+ {
925
+ "name": "className",
926
+ "type": "string",
927
+ "optional": true,
928
+ "doc": "Extra classes."
929
+ }
930
+ ]
931
+ },
932
+ {
933
+ "name": "StatTile",
934
+ "file": "indicators.tsx",
935
+ "doc": "Label + big value tile — the KPI unit of the future `metrics` panel.\r\n\n@example\r\n```tsx\r\n<StatTile label=\"p95 frame\" value=\"14.2 ms\" sub=\"last 60 s\" />\r\n```",
936
+ "props": "StatTileProps",
937
+ "propList": [
938
+ {
939
+ "name": "label",
940
+ "type": "ReactNode",
941
+ "optional": false,
942
+ "doc": "Uppercase label."
943
+ },
944
+ {
945
+ "name": "value",
946
+ "type": "ReactNode",
947
+ "optional": false,
948
+ "doc": "The value. Rendered with `tabular-nums` so a grid of tiles aligns."
949
+ },
950
+ {
951
+ "name": "sub",
952
+ "type": "ReactNode",
953
+ "optional": true,
954
+ "doc": "Supporting line under the value (delta, window, unit)."
955
+ },
956
+ {
957
+ "name": "icon",
958
+ "type": "ReactNode",
959
+ "optional": true,
960
+ "doc": "Trailing glyph in the label row."
961
+ },
962
+ {
963
+ "name": "title",
964
+ "type": "string",
965
+ "optional": true,
966
+ "doc": "Native tooltip — where a metric's longer explanation goes."
967
+ },
968
+ {
969
+ "name": "className",
970
+ "type": "string",
971
+ "optional": true,
972
+ "doc": "Extra classes."
973
+ }
974
+ ]
975
+ },
976
+ {
977
+ "name": "ProportionBar",
978
+ "file": "indicators.tsx",
979
+ "doc": "A horizontal stacked bar — the monochromatic replacement for a pie/donut chart.\r\n\nSlices are separated by white ALPHA, not hue: `DESIGN_SYSTEM.md` §13 forbids chromatic color\r\noutside status contexts, and a categorical palette is exactly that. When no `opacity` is supplied\r\nthe bar ramps evenly from bright to dim across the slices.",
980
+ "props": "ProportionBarProps",
981
+ "propList": [
982
+ {
983
+ "name": "segments",
984
+ "type": "ReadonlyArray<ProportionSegment>",
985
+ "optional": false,
986
+ "doc": "The slices, in display order."
987
+ },
988
+ {
989
+ "name": "label",
990
+ "type": "string",
991
+ "optional": true,
992
+ "doc": "Accessible description of the whole bar."
993
+ },
994
+ {
995
+ "name": "className",
996
+ "type": "string",
997
+ "optional": true,
998
+ "doc": "Extra classes."
999
+ }
1000
+ ]
1001
+ },
1002
+ {
1003
+ "name": "StatusBar",
1004
+ "file": "indicators.tsx",
1005
+ "doc": "The panel footer strip. Census: layers and history already ship a byte-identical one\r\n(`2px 6px`, 9px, muted, header surface, space-between) — this is that, once.",
1006
+ "props": "StatusBarProps",
1007
+ "propList": [
1008
+ {
1009
+ "name": "left",
1010
+ "type": "ReactNode",
1011
+ "optional": true,
1012
+ "doc": "Left cluster — counts, selection summary."
1013
+ },
1014
+ {
1015
+ "name": "right",
1016
+ "type": "ReactNode",
1017
+ "optional": true,
1018
+ "doc": "Right cluster — mode, state."
1019
+ },
1020
+ {
1021
+ "name": "children",
1022
+ "type": "ReactNode",
1023
+ "optional": true,
1024
+ "doc": "Free-form children (used instead of the clusters)."
1025
+ },
1026
+ {
1027
+ "name": "className",
1028
+ "type": "string",
1029
+ "optional": true,
1030
+ "doc": "Extra classes."
1031
+ }
1032
+ ]
1033
+ },
1034
+ {
1035
+ "name": "Sparkline",
1036
+ "file": "indicators.tsx",
1037
+ "doc": "A monochrome trend line.\r\n\nLifted from `xeno-post`'s `ui/kit.tsx`, which is the only sparkline implementation in the\r\necosystem. It lives here rather than in a panel because three consumers want it — `metrics` (which\r\nshipped a local copy first), `chart`, and the future `runs` panel — and three copies of a mark is\r\nhow a design system stops being one.\r\n\nDistinct from {@link ProportionBar}: a line is a different MARK, not a variant. The two are not\r\ninterchangeable and neither is a special case of the other.\r\n\nDegenerate inputs render an empty well rather than throwing: a series of one point has no slope,\r\nand a flat series has no range to normalize against (it draws a centred straight line).",
1038
+ "props": "SparklineProps",
1039
+ "propList": [
1040
+ {
1041
+ "name": "data",
1042
+ "type": "readonly number[]",
1043
+ "optional": false,
1044
+ "doc": "The series, oldest first."
1045
+ },
1046
+ {
1047
+ "name": "width",
1048
+ "type": "number",
1049
+ "optional": true,
1050
+ "doc": "Width in px."
1051
+ },
1052
+ {
1053
+ "name": "height",
1054
+ "type": "number",
1055
+ "optional": true,
1056
+ "doc": "Height in px."
1057
+ },
1058
+ {
1059
+ "name": "label",
1060
+ "type": "string",
1061
+ "optional": true,
1062
+ "doc": "Accessible description. Without one the mark is decorative and hidden from AT."
1063
+ },
1064
+ {
1065
+ "name": "title",
1066
+ "type": "string",
1067
+ "optional": true,
1068
+ "doc": "Native tooltip."
1069
+ },
1070
+ {
1071
+ "name": "className",
1072
+ "type": "string",
1073
+ "optional": true,
1074
+ "doc": "Extra classes."
1075
+ }
1076
+ ]
1077
+ },
1078
+ {
1079
+ "name": "RowList",
1080
+ "file": "rows.tsx",
1081
+ "doc": "A vertical list container for {@link Row}s.\r\n\n@example\r\n```tsx\r\n<RowList role=\"listbox\" aria-label=\"Layers\">\r\n {items.map((it) => <Row key={it.id} …/>)}\r\n</RowList>\r\n```",
1082
+ "props": "RowListProps",
1083
+ "propList": [
1084
+ {
1085
+ "name": "children",
1086
+ "type": "ReactNode",
1087
+ "optional": true,
1088
+ "doc": "Rows."
1089
+ },
1090
+ {
1091
+ "name": "divided",
1092
+ "type": "boolean",
1093
+ "optional": true,
1094
+ "doc": "Draw hairlines between rows. Default `false` (dense lists read better undivided)."
1095
+ },
1096
+ {
1097
+ "name": "role",
1098
+ "type": "string",
1099
+ "optional": true,
1100
+ "doc": "ARIA role for the container. Default `list`; use `listbox` / `tree` for selectable sets."
1101
+ }
1102
+ ]
1103
+ },
1104
+ {
1105
+ "name": "Row",
1106
+ "file": "rows.tsx",
1107
+ "doc": "One dense list row.\r\n\nInteraction contract: when `onClick` is supplied the row becomes keyboard-operable\r\n(`tabIndex=0`, Enter/Space activate). When `disabled`, pointer and keyboard activation are both\r\nsuppressed — the handler is not called, rather than being called and ignored.\r\n\n@example\r\n```tsx\r\n<Row\r\n icon={<EyeIcon />}\r\n label={layer.name}\r\n meta={layer.kind}\r\n trailing={<Badge>{layer.opacity}%</Badge>}\r\n depth={layer.depth}\r\n selected={layer.id === selectedId}\r\n onClick={() => select(layer.id)}\r\n/>\r\n```",
1108
+ "props": "RowProps",
1109
+ "propList": [
1110
+ {
1111
+ "name": "icon",
1112
+ "type": "ReactNode",
1113
+ "optional": true,
1114
+ "doc": "Leading icon/graphic. Rendered in a fixed-width slot even when `undefined`, to hold the column."
1115
+ },
1116
+ {
1117
+ "name": "label",
1118
+ "type": "ReactNode",
1119
+ "optional": true,
1120
+ "doc": "Primary text. Truncates with an ellipsis."
1121
+ },
1122
+ {
1123
+ "name": "meta",
1124
+ "type": "ReactNode",
1125
+ "optional": true,
1126
+ "doc": "Secondary text after the label (counts, types, paths)."
1127
+ },
1128
+ {
1129
+ "name": "trailing",
1130
+ "type": "ReactNode",
1131
+ "optional": true,
1132
+ "doc": "Right-aligned controls (toggles, badges, icon buttons)."
1133
+ },
1134
+ {
1135
+ "name": "children",
1136
+ "type": "ReactNode",
1137
+ "optional": true,
1138
+ "doc": "Free-form content, rendered INSTEAD of the label/meta pair when provided."
1139
+ },
1140
+ {
1141
+ "name": "depth",
1142
+ "type": "number",
1143
+ "optional": true,
1144
+ "doc": "Nesting depth for trees; each level indents by `PANEL_METRICS.rowIndent`."
1145
+ },
1146
+ {
1147
+ "name": "selected",
1148
+ "type": "boolean",
1149
+ "optional": true,
1150
+ "doc": "Row is the current selection (`aria-selected`)."
1151
+ },
1152
+ {
1153
+ "name": "active",
1154
+ "type": "boolean",
1155
+ "optional": true,
1156
+ "doc": "Row is active — being dragged, renamed, or otherwise operated on."
1157
+ },
1158
+ {
1159
+ "name": "disabled",
1160
+ "type": "boolean",
1161
+ "optional": true,
1162
+ "doc": "Row is non-interactive: dimmed, `aria-disabled`, click/keyboard suppressed."
1163
+ },
1164
+ {
1165
+ "name": "noIcon",
1166
+ "type": "boolean",
1167
+ "optional": true,
1168
+ "doc": "Hide the leading icon slot entirely (for lists with no icons at all)."
1169
+ },
1170
+ {
1171
+ "name": "role",
1172
+ "type": "string",
1173
+ "optional": true,
1174
+ "doc": "ARIA role for the row. Defaults to `listitem`, or `option` when `selected` is supplied."
1175
+ }
1176
+ ]
1177
+ },
1178
+ {
1179
+ "name": "Section",
1180
+ "file": "section.tsx",
1181
+ "doc": "A collapsible titled group.\r\n\n@example\r\n```tsx\r\n<Section\r\n title=\"Transform\"\r\n badge={<Badge>3</Badge>}\r\n enabled={fx.enabled}\r\n onEnabledChange={(on) => host.emit('intent', { kind: 'toggle', on })}\r\n actions={<IconButton icon={<ResetGlyph />} label=\"Reset transform\" onClick={reset} />}\r\n>\r\n <FieldGroup>…</FieldGroup>\r\n</Section>\r\n```",
1182
+ "props": "SectionProps",
1183
+ "propList": [
1184
+ {
1185
+ "name": "title",
1186
+ "type": "ReactNode",
1187
+ "optional": false,
1188
+ "doc": "Uppercase section label."
1189
+ },
1190
+ {
1191
+ "name": "children",
1192
+ "type": "ReactNode",
1193
+ "optional": true,
1194
+ "doc": "Body."
1195
+ },
1196
+ {
1197
+ "name": "badge",
1198
+ "type": "ReactNode",
1199
+ "optional": true,
1200
+ "doc": "Small chip after the title (a count, a unit, a state word)."
1201
+ },
1202
+ {
1203
+ "name": "actions",
1204
+ "type": "ReactNode",
1205
+ "optional": true,
1206
+ "doc": "Trailing controls (icon buttons, a select). Rendered outside the collapse trigger."
1207
+ },
1208
+ {
1209
+ "name": "collapsible",
1210
+ "type": "boolean",
1211
+ "optional": true,
1212
+ "doc": "Whether the section can collapse. Default `true`."
1213
+ },
1214
+ {
1215
+ "name": "collapsed",
1216
+ "type": "boolean",
1217
+ "optional": true,
1218
+ "doc": "Controlled collapsed state. Omit for uncontrolled."
1219
+ },
1220
+ {
1221
+ "name": "defaultCollapsed",
1222
+ "type": "boolean",
1223
+ "optional": true,
1224
+ "doc": "Initial collapsed state when uncontrolled. Default `false`."
1225
+ },
1226
+ {
1227
+ "name": "onCollapsedChange",
1228
+ "type": "(collapsed: boolean) => void",
1229
+ "optional": true,
1230
+ "doc": "Called with the next collapsed state. Required for the controlled form to do anything."
1231
+ },
1232
+ {
1233
+ "name": "enabled",
1234
+ "type": "boolean",
1235
+ "optional": true,
1236
+ "doc": "Presence of this prop renders the enable toggle. `false` dims the body and blocks pointer\r\nevents — the section stays visible and readable, it just stops applying."
1237
+ },
1238
+ {
1239
+ "name": "onEnabledChange",
1240
+ "type": "(enabled: boolean) => void",
1241
+ "optional": true,
1242
+ "doc": "Called with the next enabled state."
1243
+ },
1244
+ {
1245
+ "name": "flush",
1246
+ "type": "boolean",
1247
+ "optional": true,
1248
+ "doc": "Render the body with no vertical padding (for a flush `RowList`)."
1249
+ },
1250
+ {
1251
+ "name": "className",
1252
+ "type": "string",
1253
+ "optional": true,
1254
+ "doc": "Extra classes on the wrapper."
1255
+ },
1256
+ {
1257
+ "name": "bodyClassName",
1258
+ "type": "string",
1259
+ "optional": true,
1260
+ "doc": "Extra classes on the body."
1261
+ }
1262
+ ]
1263
+ },
1264
+ {
1265
+ "name": "EmptyState",
1266
+ "file": "states.tsx",
1267
+ "doc": "The canonical zero-content state.\r\n\n@example\r\n```tsx\r\n<EmptyState\r\n title=\"No tokens\"\r\n hint=\"A token is a named value other layers bind to. Add one to start a palette.\"\r\n action={<TextButton onClick={createToken}>+ Add token</TextButton>}\r\n/>\r\n```",
1268
+ "props": "EmptyStateProps",
1269
+ "propList": [
1270
+ {
1271
+ "name": "title",
1272
+ "type": "ReactNode",
1273
+ "optional": false,
1274
+ "doc": "Names the state. Keep it short: `No layers`, `Nothing selected`."
1275
+ },
1276
+ {
1277
+ "name": "hint",
1278
+ "type": "ReactNode",
1279
+ "optional": true,
1280
+ "doc": "The ACTIONABLE line: what this panel holds and how to put something in it. Omit rather than\r\nrestate the title."
1281
+ },
1282
+ {
1283
+ "name": "icon",
1284
+ "type": "ReactNode",
1285
+ "optional": true,
1286
+ "doc": "Optional glyph, shown in a hairline chip above the title."
1287
+ },
1288
+ {
1289
+ "name": "action",
1290
+ "type": "ReactNode",
1291
+ "optional": true,
1292
+ "doc": "Optional call to action (usually a {@link TextButton})."
1293
+ },
1294
+ {
1295
+ "name": "className",
1296
+ "type": "string",
1297
+ "optional": true,
1298
+ "doc": "Extra classes."
1299
+ }
1300
+ ]
1301
+ },
1302
+ {
1303
+ "name": "LoadingState",
1304
+ "file": "states.tsx",
1305
+ "doc": "The canonical busy state — an indeterminate BAR, never a spinner.\r\n\n`DESIGN_SYSTEM.md` §3 bans circles and §10 prefers skeletons over spinning indicators; a 2px\r\nindeterminate bar satisfies both and costs one element.",
1306
+ "props": "LoadingStateProps",
1307
+ "propList": [
1308
+ {
1309
+ "name": "label",
1310
+ "type": "ReactNode",
1311
+ "optional": true,
1312
+ "doc": "What is loading. Default `Loading…`."
1313
+ },
1314
+ {
1315
+ "name": "className",
1316
+ "type": "string",
1317
+ "optional": true,
1318
+ "doc": "Extra classes."
1319
+ }
1320
+ ]
1321
+ },
1322
+ {
1323
+ "name": "ErrorState",
1324
+ "file": "states.tsx",
1325
+ "doc": "The canonical failure state. The title is the only place a panel renders status red by default.",
1326
+ "props": "ErrorStateProps",
1327
+ "propList": [
1328
+ {
1329
+ "name": "title",
1330
+ "type": "ReactNode",
1331
+ "optional": true,
1332
+ "doc": "Headline. Default `Something went wrong`."
1333
+ },
1334
+ {
1335
+ "name": "message",
1336
+ "type": "ReactNode",
1337
+ "optional": true,
1338
+ "doc": "The failure detail — the message, not a stack."
1339
+ },
1340
+ {
1341
+ "name": "onRetry",
1342
+ "type": "() => void",
1343
+ "optional": true,
1344
+ "doc": "Retry handler; renders a retry action when supplied."
1345
+ },
1346
+ {
1347
+ "name": "retryLabel",
1348
+ "type": "string",
1349
+ "optional": true,
1350
+ "doc": "Label for the retry action. Default `Retry`."
1351
+ },
1352
+ {
1353
+ "name": "className",
1354
+ "type": "string",
1355
+ "optional": true,
1356
+ "doc": "Extra classes."
1357
+ }
1358
+ ]
1359
+ }
1360
+ ]
335
1361
  }
336
1362
  ]
337
1363
  }