@starci/grammar 0.12.14 → 0.14.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.
- package/LICENSE +21 -21
- package/README.md +34 -31
- package/dist/.build-stamp.json +4 -4
- package/dist/common/components-forms.css +28 -44
- package/dist/common/components-list-panel.css +8 -0
- package/dist/common/components-navigation.css +163 -6
- package/dist/common/components-overlays.css +41 -2
- package/dist/common/conformance.d.ts +3 -8
- package/dist/common/conformance.d.ts.map +1 -1
- package/dist/common/conformance.js +4 -9
- package/dist/common/conformance.js.map +1 -1
- package/dist/common/registry.d.ts +24 -21
- package/dist/common/registry.d.ts.map +1 -1
- package/dist/common/registry.js +4 -4
- package/dist/common/registry.js.map +1 -1
- package/dist/common/renderers-forms.d.ts +11 -11
- package/dist/common/renderers-navigation.d.ts +5 -5
- package/dist/common/renderers-navigation.d.ts.map +1 -1
- package/dist/common/renderers-navigation.js +1 -1
- package/dist/common/renderers-navigation.js.map +1 -1
- package/dist/common/renderers-overlays.d.ts +2 -2
- package/dist/common/renderers-overlays.d.ts.map +1 -1
- package/dist/common/renderers-overlays.js.map +1 -1
- package/dist/common/renderers.d.ts +4 -1
- package/dist/common/renderers.d.ts.map +1 -1
- package/dist/common/renderers.js +3 -0
- package/dist/common/renderers.js.map +1 -1
- package/dist/common/{rule-catalog.generated.d.ts → rule-catalog.d.ts} +1 -1
- package/dist/common/rule-catalog.d.ts.map +1 -0
- package/dist/common/{rule-catalog.generated.js → rule-catalog.js} +2 -4
- package/dist/common/rule-catalog.js.map +1 -0
- package/dist/common/styles.css +236 -48
- package/dist/core/branch/ComboBox/index.d.ts +5 -5
- package/dist/core/branch/ComboBox/index.d.ts.map +1 -1
- package/dist/core/branch/ComboBox/index.js +9 -2
- package/dist/core/branch/ComboBox/index.js.map +1 -1
- package/dist/core/branch/DataTable/index.d.ts +20 -3
- package/dist/core/branch/DataTable/index.d.ts.map +1 -1
- package/dist/core/branch/DataTable/index.js +45 -8
- package/dist/core/branch/DataTable/index.js.map +1 -1
- package/dist/core/branch/FlowGraph/index.d.ts +26 -7
- package/dist/core/branch/FlowGraph/index.d.ts.map +1 -1
- package/dist/core/branch/FlowGraph/index.js +132 -30
- package/dist/core/branch/FlowGraph/index.js.map +1 -1
- package/dist/core/branch/FlowGraph/layout.d.ts +34 -1
- package/dist/core/branch/FlowGraph/layout.d.ts.map +1 -1
- package/dist/core/branch/FlowGraph/layout.js +82 -0
- package/dist/core/branch/FlowGraph/layout.js.map +1 -1
- package/dist/core/branch/FlowGraph/types.d.ts +13 -1
- package/dist/core/branch/FlowGraph/types.d.ts.map +1 -1
- package/dist/core/branch/ListBox/index.d.ts +4 -2
- package/dist/core/branch/ListBox/index.d.ts.map +1 -1
- package/dist/core/branch/ListBox/index.js +2 -2
- package/dist/core/branch/ListBox/index.js.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.d.ts +7 -1
- package/dist/core/branch/MarkdownArticle/index.d.ts.map +1 -1
- package/dist/core/branch/MarkdownArticle/index.js +5 -2
- package/dist/core/branch/MarkdownArticle/index.js.map +1 -1
- package/dist/core/branch/Select/index.d.ts +6 -8
- package/dist/core/branch/Select/index.d.ts.map +1 -1
- package/dist/core/branch/Select/index.js +9 -5
- package/dist/core/branch/Select/index.js.map +1 -1
- package/dist/core/branch/SurfaceCard/index.d.ts +9 -0
- package/dist/core/branch/SurfaceCard/index.d.ts.map +1 -1
- package/dist/core/branch/SurfaceCard/index.js +3 -2
- package/dist/core/branch/SurfaceCard/index.js.map +1 -1
- package/dist/core/branch/Tabs/index.d.ts.map +1 -1
- package/dist/core/branch/Tabs/index.js +17 -0
- package/dist/core/branch/Tabs/index.js.map +1 -1
- package/dist/core/branch/Tooltip/index.d.ts +9 -1
- package/dist/core/branch/Tooltip/index.d.ts.map +1 -1
- package/dist/core/branch/Tooltip/index.js +2 -2
- package/dist/core/branch/Tooltip/index.js.map +1 -1
- package/dist/core/buttonIntent.d.ts.map +1 -1
- package/dist/core/buttonIntent.js +1 -2
- package/dist/core/buttonIntent.js.map +1 -1
- package/dist/core/collectionItem.d.ts +3 -3
- package/dist/core/collectionItem.d.ts.map +1 -1
- package/dist/core/collectionItem.js +1 -2
- package/dist/core/collectionItem.js.map +1 -1
- package/dist/core/composite/Alert/index.d.ts +5 -0
- package/dist/core/composite/Alert/index.d.ts.map +1 -1
- package/dist/core/composite/Alert/index.js +7 -2
- package/dist/core/composite/Alert/index.js.map +1 -1
- package/dist/core/composite/CheckboxGroup/index.d.ts +6 -5
- package/dist/core/composite/CheckboxGroup/index.d.ts.map +1 -1
- package/dist/core/composite/CheckboxGroup/index.js +10 -3
- package/dist/core/composite/CheckboxGroup/index.js.map +1 -1
- package/dist/core/composite/DescriptionList/index.d.ts +3 -2
- package/dist/core/composite/DescriptionList/index.d.ts.map +1 -1
- package/dist/core/composite/DescriptionList/index.js +5 -4
- package/dist/core/composite/DescriptionList/index.js.map +1 -1
- package/dist/core/composite/RadioGroup/index.d.ts +5 -3
- package/dist/core/composite/RadioGroup/index.d.ts.map +1 -1
- package/dist/core/composite/RadioGroup/index.js +9 -2
- package/dist/core/composite/RadioGroup/index.js.map +1 -1
- package/dist/core/composite/SegmentedControl/index.d.ts +6 -6
- package/dist/core/composite/SegmentedControl/index.d.ts.map +1 -1
- package/dist/core/composite/SegmentedControl/index.js +9 -5
- package/dist/core/composite/SegmentedControl/index.js.map +1 -1
- package/dist/core/composite/TagGroup/index.d.ts +27 -4
- package/dist/core/composite/TagGroup/index.d.ts.map +1 -1
- package/dist/core/composite/TagGroup/index.js +132 -2
- package/dist/core/composite/TagGroup/index.js.map +1 -1
- package/dist/core/composite/Timeline/index.d.ts +5 -0
- package/dist/core/composite/Timeline/index.d.ts.map +1 -1
- package/dist/core/composite/Timeline/index.js +1 -1
- package/dist/core/composite/Timeline/index.js.map +1 -1
- package/dist/core/composition/Sidebar/index.d.ts +4 -0
- package/dist/core/composition/Sidebar/index.d.ts.map +1 -1
- package/dist/core/composition/Sidebar/index.js +4 -2
- package/dist/core/composition/Sidebar/index.js.map +1 -1
- package/dist/core/dna.d.ts +1 -1
- package/dist/core/dna.js +1 -1
- package/dist/core/dna.js.map +1 -1
- package/dist/core/index.d.ts +1 -1
- package/dist/core/index.d.ts.map +1 -1
- package/dist/core/primitive/Avatar/index.d.ts +1 -1
- package/dist/core/primitive/Badge/index.d.ts +8 -5
- package/dist/core/primitive/Badge/index.d.ts.map +1 -1
- package/dist/core/primitive/Badge/index.js +14 -5
- package/dist/core/primitive/Badge/index.js.map +1 -1
- package/dist/core/primitive/Button/index.d.ts +10 -2
- package/dist/core/primitive/Button/index.d.ts.map +1 -1
- package/dist/core/primitive/Button/index.js +15 -4
- package/dist/core/primitive/Button/index.js.map +1 -1
- package/dist/core/primitive/Checkbox/index.d.ts +5 -3
- package/dist/core/primitive/Checkbox/index.d.ts.map +1 -1
- package/dist/core/primitive/Checkbox/index.js +9 -2
- package/dist/core/primitive/Checkbox/index.js.map +1 -1
- package/dist/core/primitive/Code/index.d.ts +10 -0
- package/dist/core/primitive/Code/index.d.ts.map +1 -0
- package/dist/core/primitive/Code/index.js +5 -0
- package/dist/core/primitive/Code/index.js.map +1 -0
- package/dist/core/primitive/Field/index.d.ts +12 -25
- package/dist/core/primitive/Field/index.d.ts.map +1 -1
- package/dist/core/primitive/Field/index.js +13 -14
- package/dist/core/primitive/Field/index.js.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.d.ts +8 -1
- package/dist/core/primitive/GrammarRoot/index.d.ts.map +1 -1
- package/dist/core/primitive/GrammarRoot/index.js +5 -1
- package/dist/core/primitive/GrammarRoot/index.js.map +1 -1
- package/dist/core/primitive/Icon/index.d.ts.map +1 -1
- package/dist/core/primitive/Icon/index.js +3 -2
- package/dist/core/primitive/Icon/index.js.map +1 -1
- package/dist/core/primitive/Input/index.d.ts +9 -4
- package/dist/core/primitive/Input/index.d.ts.map +1 -1
- package/dist/core/primitive/Input/index.js +13 -8
- package/dist/core/primitive/Input/index.js.map +1 -1
- package/dist/core/primitive/Meter/index.d.ts +4 -1
- package/dist/core/primitive/Meter/index.d.ts.map +1 -1
- package/dist/core/primitive/Meter/index.js +3 -3
- package/dist/core/primitive/Meter/index.js.map +1 -1
- package/dist/core/primitive/NumberField/index.d.ts +6 -5
- package/dist/core/primitive/NumberField/index.d.ts.map +1 -1
- package/dist/core/primitive/NumberField/index.js +10 -3
- package/dist/core/primitive/NumberField/index.js.map +1 -1
- package/dist/core/primitive/PinnedActionBar/index.d.ts +25 -6
- package/dist/core/primitive/PinnedActionBar/index.d.ts.map +1 -1
- package/dist/core/primitive/PinnedActionBar/index.js +9 -4
- package/dist/core/primitive/PinnedActionBar/index.js.map +1 -1
- package/dist/core/primitive/SearchField/index.d.ts +6 -5
- package/dist/core/primitive/SearchField/index.d.ts.map +1 -1
- package/dist/core/primitive/SearchField/index.js +10 -3
- package/dist/core/primitive/SearchField/index.js.map +1 -1
- package/dist/core/primitive/SectionHeader/index.d.ts +3 -3
- package/dist/core/primitive/SectionHeader/index.js +2 -2
- package/dist/core/primitive/SectionHeader/index.js.map +1 -1
- package/dist/core/primitive/Skeleton/index.d.ts +11 -0
- package/dist/core/primitive/Skeleton/index.d.ts.map +1 -1
- package/dist/core/primitive/Skeleton/index.js +12 -1
- package/dist/core/primitive/Skeleton/index.js.map +1 -1
- package/dist/core/primitive/StatusDot/index.d.ts +61 -0
- package/dist/core/primitive/StatusDot/index.d.ts.map +1 -0
- package/dist/core/primitive/StatusDot/index.js +55 -0
- package/dist/core/primitive/StatusDot/index.js.map +1 -0
- package/dist/core/primitive/Switch/index.d.ts +4 -3
- package/dist/core/primitive/Switch/index.d.ts.map +1 -1
- package/dist/core/primitive/Switch/index.js +5 -2
- package/dist/core/primitive/Switch/index.js.map +1 -1
- package/dist/core/primitive/Terminal/index.d.ts +20 -0
- package/dist/core/primitive/Terminal/index.d.ts.map +1 -0
- package/dist/core/primitive/Terminal/index.js +29 -0
- package/dist/core/primitive/Terminal/index.js.map +1 -0
- package/dist/core/primitive/Text/index.d.ts +5 -1
- package/dist/core/primitive/Text/index.d.ts.map +1 -1
- package/dist/core/primitive/Text/index.js +12 -7
- package/dist/core/primitive/Text/index.js.map +1 -1
- package/dist/core/primitive/TextAction/index.d.ts.map +1 -1
- package/dist/core/primitive/TextAction/index.js +9 -4
- package/dist/core/primitive/TextAction/index.js.map +1 -1
- package/dist/core/primitive/Textarea/index.d.ts +8 -4
- package/dist/core/primitive/Textarea/index.d.ts.map +1 -1
- package/dist/core/primitive/Textarea/index.js +9 -5
- package/dist/core/primitive/Textarea/index.js.map +1 -1
- package/dist/core/styles.css +18 -6
- package/dist/offset-pop/components-forms.css +0 -17
- package/dist/offset-pop/components-navigation.css +30 -4
- package/dist/offset-pop/components-overlays.css +5 -0
- package/dist/offset-pop/index.d.ts +1 -1
- package/dist/offset-pop/index.d.ts.map +1 -1
- package/dist/offset-pop/styles.css +44 -0
- package/package.json +7 -12
- package/dist/common/rule-catalog.generated.d.ts.map +0 -1
- package/dist/common/rule-catalog.generated.js.map +0 -1
- package/dist/heritage/dna.d.ts +0 -63
- package/dist/heritage/dna.d.ts.map +0 -1
- package/dist/heritage/dna.js +0 -37
- package/dist/heritage/dna.js.map +0 -1
- package/dist/heritage/index.d.ts +0 -27
- package/dist/heritage/index.d.ts.map +0 -1
- package/dist/heritage/index.js +0 -46
- package/dist/heritage/index.js.map +0 -1
- package/dist/heritage/styles.css +0 -187
package/dist/common/styles.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* Common owns only universal structure/scales. Families supply material DNA. */
|
|
2
|
-
@layer starci-grammar-common, starci-grammar-core, starci-grammar-
|
|
2
|
+
@layer starci-grammar-common, starci-grammar-core, starci-grammar-offset-pop;
|
|
3
3
|
@import "./components-forms.css";
|
|
4
4
|
@import "./components-surface-controls.css";
|
|
5
5
|
@import "./components-overlays.css";
|
|
@@ -327,15 +327,6 @@
|
|
|
327
327
|
overflow-wrap: anywhere;
|
|
328
328
|
}
|
|
329
329
|
|
|
330
|
-
/* Loading header (knowledge STATE-8): the same ranks and sizes, the copy drawn as Skeleton text, the action as a footprint. */
|
|
331
|
-
.starci-core-section-skeleton-title > .starci-core-skeleton-group { inline-size: min(60%, 20rem); }
|
|
332
|
-
.starci-core-section-skeleton-title .starci-core-skeleton { block-size: 1em; }
|
|
333
|
-
.starci-core-section-skeleton-description > .starci-core-skeleton-group { inline-size: min(90%, 28rem); }
|
|
334
|
-
.starci-core-section-skeleton-meta > .starci-core-skeleton-group { inline-size: 6rem; }
|
|
335
|
-
.starci-core-section-skeleton-meta .starci-core-skeleton { block-size: 0.75rem; }
|
|
336
|
-
.starci-core-section-skeleton-action { display: block; inline-size: 6rem; block-size: 2.5rem; }
|
|
337
|
-
.starci-core-section-skeleton-action > .starci-core-skeleton { block-size: 100%; aspect-ratio: auto; }
|
|
338
|
-
|
|
339
330
|
/*
|
|
340
331
|
* Keyboard-reachable scroll owners (VerticalScrollRegion / HorizontalScrollRegion when focusable,
|
|
341
332
|
* the Rail body, fenced code and Markdown table frames) draw the same inset focus ring the chat
|
|
@@ -1233,6 +1224,11 @@
|
|
|
1233
1224
|
margin-block-end: 0 !important;
|
|
1234
1225
|
}
|
|
1235
1226
|
|
|
1227
|
+
/* A label edit resizes the selected tab; the indicator tracks it without the vendor width animation. */
|
|
1228
|
+
.starci-core-tabs-frame[data-grammar-tabs-measuring="true"] .starci-core-tabs .tabs__indicator {
|
|
1229
|
+
transition-property: none;
|
|
1230
|
+
}
|
|
1231
|
+
|
|
1236
1232
|
.starci-core-tab-content {
|
|
1237
1233
|
display: flex;
|
|
1238
1234
|
min-width: 0;
|
|
@@ -2764,8 +2760,13 @@
|
|
|
2764
2760
|
width: min(100%, var(--starci-core-form-compact-measure, 28rem)) !important;
|
|
2765
2761
|
}
|
|
2766
2762
|
|
|
2763
|
+
/*
|
|
2764
|
+
* The vendor Card.Header pads the label row; the zero beats it from either side of `@heroui/styles`. A family that
|
|
2765
|
+
* insets the label sets `--starci-core-surface-label-padding` instead of a padding of its own: an important
|
|
2766
|
+
* declaration in this earlier layer outranks every normal or important padding a family layer could write.
|
|
2767
|
+
*/
|
|
2767
2768
|
.starci-core-surface-label {
|
|
2768
|
-
padding: 0 !important;
|
|
2769
|
+
padding: var(--starci-core-surface-label-padding, 0) !important;
|
|
2769
2770
|
}
|
|
2770
2771
|
|
|
2771
2772
|
.starci-core-surface {
|
|
@@ -2813,6 +2814,18 @@
|
|
|
2813
2814
|
flex: 1 1 0%;
|
|
2814
2815
|
}
|
|
2815
2816
|
|
|
2817
|
+
/*
|
|
2818
|
+
* Dividers are full bleed (DNA-COMMON-DIVIDER-FULL-BLEED): a horizontal hairline placed in a card's content region
|
|
2819
|
+
* runs from card edge to card edge, through the content inset, never inset from them; the content above and below
|
|
2820
|
+
* it keeps the card inset from the rule.
|
|
2821
|
+
*/
|
|
2822
|
+
.starci-core-surface-content > .starci-core-divider-bare:not([data-grammar-divider-orientation="vertical"]) {
|
|
2823
|
+
align-self: stretch;
|
|
2824
|
+
inline-size: auto !important;
|
|
2825
|
+
margin-inline: calc(-1 * var(--starci-core-surface-inset, 1rem)) !important;
|
|
2826
|
+
margin-block: var(--starci-core-surface-inset, 1rem);
|
|
2827
|
+
}
|
|
2828
|
+
|
|
2816
2829
|
/* A vertical hairline between touching columns of one joined surface: it fills the row, whatever its height. */
|
|
2817
2830
|
.starci-core-divider-bare[data-grammar-divider-orientation="vertical"] {
|
|
2818
2831
|
align-self: stretch;
|
|
@@ -2845,6 +2858,25 @@
|
|
|
2845
2858
|
overflow-x: auto;
|
|
2846
2859
|
}
|
|
2847
2860
|
|
|
2861
|
+
/* A disabled control wrapped by Tooltip: a focusable box that takes the control's own inline size. */
|
|
2862
|
+
.starci-core-tooltip-disabled-trigger {
|
|
2863
|
+
display: inline-flex;
|
|
2864
|
+
max-inline-size: 100%;
|
|
2865
|
+
}
|
|
2866
|
+
|
|
2867
|
+
/*
|
|
2868
|
+
* The wrapper takes the keyboard focus ring (the disabled control is faded, so a ring on it would fade too); it takes
|
|
2869
|
+
* the vendor Button's radius, so the ring follows the button's shape instead of drawing a square round a pill.
|
|
2870
|
+
*/
|
|
2871
|
+
.starci-core-tooltip-disabled-trigger:has(> [data-component="Button"]) {
|
|
2872
|
+
border-radius: calc(var(--radius) * 3);
|
|
2873
|
+
}
|
|
2874
|
+
|
|
2875
|
+
.starci-core-tooltip-disabled-trigger:has(> [data-component="Button"][data-width="fill"]) {
|
|
2876
|
+
display: flex;
|
|
2877
|
+
inline-size: 100%;
|
|
2878
|
+
}
|
|
2879
|
+
|
|
2848
2880
|
/* --- Pinned action bar (0.6.0): the narrow-screen page command, sticky at the bottom edge. --- */
|
|
2849
2881
|
.starci-core-pinned-action-bar {
|
|
2850
2882
|
position: sticky;
|
|
@@ -2859,6 +2891,29 @@
|
|
|
2859
2891
|
color: var(--surface-foreground, CanvasText);
|
|
2860
2892
|
}
|
|
2861
2893
|
|
|
2894
|
+
/* A summary bar lays the summary beside its actions and lets the actions drop below it when they do not fit. */
|
|
2895
|
+
.starci-core-pinned-action-bar[data-grammar-pinned-layout="summary"] {
|
|
2896
|
+
flex-flow: row wrap;
|
|
2897
|
+
align-items: center;
|
|
2898
|
+
justify-content: space-between;
|
|
2899
|
+
gap: 0.75rem;
|
|
2900
|
+
}
|
|
2901
|
+
|
|
2902
|
+
.starci-core-pinned-action-bar-summary {
|
|
2903
|
+
min-width: 0;
|
|
2904
|
+
flex: 1 1 12rem;
|
|
2905
|
+
overflow-wrap: anywhere;
|
|
2906
|
+
}
|
|
2907
|
+
|
|
2908
|
+
.starci-core-pinned-action-bar-actions {
|
|
2909
|
+
display: flex;
|
|
2910
|
+
flex: 0 1 auto;
|
|
2911
|
+
flex-wrap: wrap;
|
|
2912
|
+
align-items: center;
|
|
2913
|
+
justify-content: flex-end;
|
|
2914
|
+
gap: 0.5rem;
|
|
2915
|
+
}
|
|
2916
|
+
|
|
2862
2917
|
@media (min-width: 48rem) {
|
|
2863
2918
|
.starci-core-pinned-action-bar[data-grammar-pinned-visibility="narrow"] {
|
|
2864
2919
|
display: none;
|
|
@@ -2890,22 +2945,14 @@
|
|
|
2890
2945
|
height: 1rem;
|
|
2891
2946
|
}
|
|
2892
2947
|
|
|
2948
|
+
/* The resting glyph keeps the usage box of the glyph it stands for (skeleton parity); the size comes from data-usage. */
|
|
2893
2949
|
.starci-core-icon-skeleton {
|
|
2894
2950
|
display: inline-block;
|
|
2895
|
-
width: 1.25rem !important;
|
|
2896
|
-
height: 1.25rem !important;
|
|
2897
2951
|
flex: none;
|
|
2898
2952
|
border-radius: var(--starci-core-pill-radius, 999px) !important;
|
|
2899
2953
|
}
|
|
2900
2954
|
|
|
2901
2955
|
/* --- Icon button: a HeroUI `Button` worn as a circle. --- */
|
|
2902
|
-
.starci-core-control-size .starci-core-field-skeleton-control {
|
|
2903
|
-
box-sizing: border-box;
|
|
2904
|
-
block-size: var(--starci-core-control-min-size, 2.5rem) !important;
|
|
2905
|
-
min-block-size: var(--starci-core-control-min-size, 2.5rem) !important;
|
|
2906
|
-
max-block-size: var(--starci-core-control-min-size, 2.5rem) !important;
|
|
2907
|
-
}
|
|
2908
|
-
|
|
2909
2956
|
/*
|
|
2910
2957
|
* Owner ruling `control-height-40`: one control height, 2.5rem (40px, HeroUI's own h-10), is the default of every
|
|
2911
2958
|
* standalone control. `md` and `control` are the same square circle in both axes (the vendor's md:h-9 desktop step
|
|
@@ -3179,16 +3226,6 @@
|
|
|
3179
3226
|
font-size: 0.75rem;
|
|
3180
3227
|
}
|
|
3181
3228
|
|
|
3182
|
-
.starci-core-input-resting-label {
|
|
3183
|
-
width: 33.333333% !important;
|
|
3184
|
-
height: 1rem !important;
|
|
3185
|
-
}
|
|
3186
|
-
|
|
3187
|
-
.starci-core-input-resting-control {
|
|
3188
|
-
width: 100% !important;
|
|
3189
|
-
height: 2.5rem !important;
|
|
3190
|
-
}
|
|
3191
|
-
|
|
3192
3229
|
/* --- Heading: the FONT rank each level stamps, drawn from the family's own sheet. --- */
|
|
3193
3230
|
/*
|
|
3194
3231
|
* `Heading` renders through the vendor's `Typography.Heading`, which sizes `.typography--h1`
|
|
@@ -3310,19 +3347,32 @@
|
|
|
3310
3347
|
line-clamp: 2;
|
|
3311
3348
|
}
|
|
3312
3349
|
|
|
3313
|
-
/*
|
|
3350
|
+
/*
|
|
3351
|
+
* Skeleton parity: the loading line IS the ready line (same element, display, size and overflow), so its box never
|
|
3352
|
+
* moves. Nothing in it is painted; the shimmer bar wraps the copy as a measured placeholder, one line box tall per
|
|
3353
|
+
* line (`vertical-align: top` keeps the bar from growing the line box), or takes the size's default width when no
|
|
3354
|
+
* copy was passed. The start content keeps its place, unseen.
|
|
3355
|
+
*/
|
|
3314
3356
|
.starci-core-text[data-loading="true"] {
|
|
3315
|
-
display: inline-block;
|
|
3316
|
-
max-width: 100%;
|
|
3317
|
-
border-radius: var(--radius, 0.25rem);
|
|
3318
3357
|
color: transparent;
|
|
3319
3358
|
user-select: none;
|
|
3320
3359
|
}
|
|
3321
3360
|
|
|
3322
|
-
.starci-core-text[data-loading="true"]
|
|
3323
|
-
|
|
3324
|
-
.starci-core-text
|
|
3325
|
-
|
|
3361
|
+
.starci-core-text[data-loading="true"] > :not(.starci-core-text-skeleton) { visibility: hidden; }
|
|
3362
|
+
|
|
3363
|
+
.starci-core-text-skeleton {
|
|
3364
|
+
display: inline-block;
|
|
3365
|
+
max-inline-size: 100%;
|
|
3366
|
+
vertical-align: top;
|
|
3367
|
+
border-radius: var(--radius, 0.25rem);
|
|
3368
|
+
}
|
|
3369
|
+
|
|
3370
|
+
.starci-core-text[data-overflow="clamp-2"] > .starci-core-text-skeleton { max-block-size: 2lh; }
|
|
3371
|
+
.starci-core-text[data-overflow="truncate"] > .starci-core-text-skeleton { white-space: nowrap; }
|
|
3372
|
+
|
|
3373
|
+
.starci-core-text[data-size="xs"] > .starci-core-text-skeleton[data-empty="true"] { inline-size: 2.5rem; }
|
|
3374
|
+
.starci-core-text[data-size="sm"] > .starci-core-text-skeleton[data-empty="true"] { inline-size: 3rem; }
|
|
3375
|
+
.starci-core-text:is([data-size="md"], [data-size="metric-lead"]) > .starci-core-text-skeleton[data-empty="true"] { inline-size: 10rem; }
|
|
3326
3376
|
|
|
3327
3377
|
/* --- Text action: one recipe, eight appearances, selected by data attributes. --- */
|
|
3328
3378
|
/*
|
|
@@ -3444,14 +3494,19 @@
|
|
|
3444
3494
|
text-decoration-line: none;
|
|
3445
3495
|
}
|
|
3446
3496
|
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
|
|
3450
|
-
|
|
3497
|
+
/*
|
|
3498
|
+
* A loading TextAction (skeleton parity): the same recipe on an inert span keeps the ready box; the label is a measured
|
|
3499
|
+
* placeholder inside the shimmer bar and the start/end content keep their places, unseen.
|
|
3500
|
+
*/
|
|
3501
|
+
.starci-core-text-action[data-loading="true"] {
|
|
3451
3502
|
color: transparent;
|
|
3503
|
+
text-decoration-line: none;
|
|
3452
3504
|
user-select: none;
|
|
3453
3505
|
}
|
|
3454
3506
|
|
|
3507
|
+
.starci-core-text-action-resting { border-radius: var(--radius, 0.25rem); }
|
|
3508
|
+
.starci-core-text-action-placeholder { display: contents; visibility: hidden; }
|
|
3509
|
+
|
|
3455
3510
|
/*
|
|
3456
3511
|
* --- Button: full width ---
|
|
3457
3512
|
*
|
|
@@ -3481,13 +3536,146 @@
|
|
|
3481
3536
|
}
|
|
3482
3537
|
}
|
|
3483
3538
|
|
|
3484
|
-
/*
|
|
3485
|
-
|
|
3539
|
+
/*
|
|
3540
|
+
* StatusDot: three variants (text chip, echo, static) share ONE dot-size token and one tone set. The text
|
|
3541
|
+
* chip is HeroUI's soft Chip, so its padding, height and type are the vendor's per size (sm 4px/20px,
|
|
3542
|
+
* md 8px+2px/24px, lg 12px+4px/28px). The dot-to-text gap is gap-1 (0.25rem): the Chip's own gap-0.5
|
|
3543
|
+
* (0.125rem) plus the 0.125rem the dot adds after itself; no vendor property is overridden.
|
|
3544
|
+
*/
|
|
3545
|
+
.grammar-common-root {
|
|
3546
|
+
--starci-core-status-dot-size: 6px;
|
|
3547
|
+
}
|
|
3548
|
+
|
|
3549
|
+
.starci-core-status-dot-mark {
|
|
3550
|
+
--starci-core-status-dot-color: var(--muted, GrayText);
|
|
3551
|
+
position: relative;
|
|
3486
3552
|
display: inline-block;
|
|
3487
|
-
width:
|
|
3488
|
-
height:
|
|
3553
|
+
width: var(--starci-core-status-dot-size);
|
|
3554
|
+
height: var(--starci-core-status-dot-size);
|
|
3489
3555
|
flex: none;
|
|
3490
|
-
|
|
3556
|
+
border-radius: 999px;
|
|
3557
|
+
background: var(--starci-core-status-dot-color);
|
|
3558
|
+
/* The tone's light stop: the tone eased toward the surface. */
|
|
3559
|
+
--starci-core-status-dot-light: color-mix(in oklab, var(--starci-core-status-dot-color) 40%, var(--surface, Canvas));
|
|
3560
|
+
}
|
|
3561
|
+
|
|
3562
|
+
.starci-core-status-dot-mark[data-tone="accent"] { --starci-core-status-dot-color: var(--accent, Highlight); }
|
|
3563
|
+
.starci-core-status-dot-mark[data-tone="success"] { --starci-core-status-dot-color: var(--success, CanvasText); }
|
|
3564
|
+
.starci-core-status-dot-mark[data-tone="warning"] { --starci-core-status-dot-color: var(--warning, CanvasText); }
|
|
3565
|
+
.starci-core-status-dot-mark[data-tone="danger"] { --starci-core-status-dot-color: var(--danger, CanvasText); }
|
|
3566
|
+
|
|
3567
|
+
.starci-core-status-dot-chip > .starci-core-status-dot-mark {
|
|
3568
|
+
margin-inline-end: 0.125rem;
|
|
3569
|
+
}
|
|
3570
|
+
|
|
3571
|
+
.starci-core-status-dot-label {
|
|
3572
|
+
display: inline-block;
|
|
3573
|
+
}
|
|
3574
|
+
|
|
3575
|
+
.starci-core-status-dot-label::first-letter {
|
|
3576
|
+
text-transform: uppercase;
|
|
3577
|
+
}
|
|
3578
|
+
|
|
3579
|
+
/* Dot only (static and echo): a small focusable target, so the ring has room and the Tooltip has a trigger. */
|
|
3580
|
+
.starci-core-status-dot:not(.starci-core-status-dot-chip) {
|
|
3581
|
+
display: inline-flex;
|
|
3582
|
+
align-items: center;
|
|
3583
|
+
justify-content: center;
|
|
3584
|
+
padding: 0.25rem;
|
|
3585
|
+
border-radius: 999px;
|
|
3586
|
+
}
|
|
3587
|
+
|
|
3588
|
+
/* The echo is a ring outside the dot (a box-shadow, no fill), so the dot keeps its full tone under it. */
|
|
3589
|
+
.starci-core-status-dot-mark[data-echo="true"]::after {
|
|
3590
|
+
position: absolute;
|
|
3591
|
+
inset: 0;
|
|
3592
|
+
border-radius: inherit;
|
|
3593
|
+
box-shadow: 0 0 0 1.5px var(--starci-core-status-dot-light);
|
|
3594
|
+
content: "";
|
|
3595
|
+
animation: starci-core-status-dot-echo 1.6s ease-out infinite;
|
|
3596
|
+
}
|
|
3597
|
+
|
|
3598
|
+
@keyframes starci-core-status-dot-echo {
|
|
3599
|
+
from { opacity: 1; transform: scale(1); }
|
|
3600
|
+
to { opacity: 0; transform: scale(2.6); }
|
|
3601
|
+
}
|
|
3602
|
+
|
|
3603
|
+
@media (prefers-reduced-motion: reduce) {
|
|
3604
|
+
.starci-core-status-dot-mark[data-echo="true"]::after {
|
|
3605
|
+
display: none;
|
|
3606
|
+
animation: none;
|
|
3607
|
+
}
|
|
3608
|
+
}
|
|
3609
|
+
|
|
3610
|
+
/* Badge muted: the content carries the muted ink on HeroUI's transparent tertiary Chip. */
|
|
3611
|
+
.starci-core-badge-muted {
|
|
3612
|
+
display: inline-flex;
|
|
3613
|
+
align-items: center;
|
|
3614
|
+
gap: 0.125rem;
|
|
3615
|
+
color: var(--muted, GrayText);
|
|
3616
|
+
}
|
|
3617
|
+
|
|
3618
|
+
/* Text: monospace and tabular figures, opted into. */
|
|
3619
|
+
.starci-core-text[data-mono="true"] {
|
|
3620
|
+
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
|
|
3621
|
+
}
|
|
3622
|
+
|
|
3623
|
+
.starci-core-text[data-tabular="true"] {
|
|
3624
|
+
font-variant-numeric: tabular-nums;
|
|
3625
|
+
}
|
|
3626
|
+
|
|
3627
|
+
/* Code: inline code on a soft plate, the size of the line around it. */
|
|
3628
|
+
.starci-core-code {
|
|
3629
|
+
padding: 0.125em 0.375em;
|
|
3630
|
+
border-radius: 0.375rem;
|
|
3631
|
+
background: var(--default, var(--surface-secondary, Canvas));
|
|
3632
|
+
color: var(--foreground, CanvasText);
|
|
3633
|
+
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
|
|
3634
|
+
font-size: 0.875em;
|
|
3635
|
+
overflow-wrap: anywhere;
|
|
3636
|
+
}
|
|
3637
|
+
|
|
3638
|
+
/*
|
|
3639
|
+
* Terminal: a dark monospace log tail; dark in both themes (a console reads dark). Its colours are family tokens
|
|
3640
|
+
* (`--terminal-background`, `--terminal-foreground`, `--terminal-title-foreground`); bare Common inverts the
|
|
3641
|
+
* system colours.
|
|
3642
|
+
*/
|
|
3643
|
+
.starci-core-terminal {
|
|
3644
|
+
display: flex;
|
|
3645
|
+
min-width: 0;
|
|
3646
|
+
flex-direction: column;
|
|
3647
|
+
overflow: hidden;
|
|
3648
|
+
border-radius: 0.75rem;
|
|
3649
|
+
background: var(--terminal-background, CanvasText);
|
|
3650
|
+
color: var(--terminal-foreground, Canvas);
|
|
3651
|
+
}
|
|
3652
|
+
|
|
3653
|
+
.starci-core-terminal-title {
|
|
3654
|
+
padding: 0.5rem 0.75rem;
|
|
3655
|
+
border-block-end: 1px solid color-mix(in srgb, var(--terminal-foreground, Canvas) 14%, transparent);
|
|
3656
|
+
color: var(--terminal-title-foreground, var(--terminal-foreground, Canvas));
|
|
3657
|
+
font-size: 0.75rem;
|
|
3658
|
+
font-weight: 500;
|
|
3659
|
+
}
|
|
3660
|
+
|
|
3661
|
+
.starci-core-terminal-log {
|
|
3662
|
+
max-height: 16rem;
|
|
3663
|
+
min-height: 4rem;
|
|
3664
|
+
overflow: auto;
|
|
3665
|
+
padding: 0.5rem 0.75rem;
|
|
3666
|
+
font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
|
|
3667
|
+
font-size: 0.8125rem;
|
|
3668
|
+
line-height: 1.25rem;
|
|
3669
|
+
}
|
|
3670
|
+
|
|
3671
|
+
.starci-core-terminal-log:focus-visible {
|
|
3672
|
+
outline: 2px solid var(--focus, Highlight);
|
|
3673
|
+
outline-offset: -2px;
|
|
3674
|
+
}
|
|
3675
|
+
|
|
3676
|
+
.starci-core-terminal-line {
|
|
3677
|
+
white-space: pre-wrap;
|
|
3678
|
+
overflow-wrap: anywhere;
|
|
3491
3679
|
}
|
|
3492
3680
|
|
|
3493
3681
|
|
|
@@ -3614,7 +3802,7 @@
|
|
|
3614
3802
|
|
|
3615
3803
|
/* Loading bubble (knowledge STATE-8): the face on its side with two Skeleton lines; a thread alternates sides. */
|
|
3616
3804
|
.starci-core-chat-bubble-skeleton-body { inline-size: min(18rem, 70vw); white-space: normal; }
|
|
3617
|
-
.starci-core-chat-bubble-skeleton-body .starci-core-skeleton {
|
|
3805
|
+
.starci-core-chat-bubble-skeleton-body .starci-core-skeleton { --starci-core-skeleton-line: 0.875rem; }
|
|
3618
3806
|
.starci-core-chat-bubble-thread { display: flex; min-width: 0; flex-direction: column; gap: 1rem; }
|
|
3619
3807
|
|
|
3620
3808
|
@media (forced-colors: active) {
|
|
@@ -23,12 +23,12 @@ export type ComboBoxProps = FieldControlProps & {
|
|
|
23
23
|
readonly menuTrigger?: "input" | "focus" | "manual";
|
|
24
24
|
/** Defaults to `secondary` inside a Grammar surface and `primary` outside (ANATOMY-2 case-1). */
|
|
25
25
|
readonly variant?: "primary" | "secondary";
|
|
26
|
+
/** Initial unresolved content (knowledge STATE-8): the same anatomy, inert, its control painted as a Skeleton. */
|
|
27
|
+
readonly isSkeleton?: boolean;
|
|
26
28
|
};
|
|
27
29
|
/**
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
* The vendor owns the combobox role, `aria-expanded`, `aria-activedescendant`, arrow/Enter/Escape
|
|
31
|
-
* handling and the "contains" filter. Pending keeps the input editable and marks the list busy.
|
|
30
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
31
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
32
32
|
*/
|
|
33
|
-
export declare const ComboBox: ({
|
|
33
|
+
export declare const ComboBox: ({ isSkeleton, ...props }: ComboBoxProps) => import("react").JSX.Element;
|
|
34
34
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/ComboBox/index.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/ComboBox/index.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EASH,KAAK,iBAAiB,EACzB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAAe,KAAK,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAEjE,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG;IAC5C,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,OAAO,EAAE,aAAa,CAAC,UAAU,CAAC,CAAA;IAC3C,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,0BAA0B;IAC1B,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC9B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACrC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;IACvD,kEAAkE;IAClE,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IACnC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,8FAA8F;IAC9F,QAAQ,CAAC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IACpC,8EAA8E;IAC9E,QAAQ,CAAC,UAAU,CAAC,EAAE,SAAS,CAAA;IAC/B,oDAAoD;IACpD,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,kGAAkG;IAClG,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ,CAAA;IACnD,iGAAiG;IACjG,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IAC1C,kHAAkH;IAClH,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AAcD;;;GAGG;AACH,eAAO,MAAM,QAAQ,GAAI,0BAAkC,aAAa,gCAEpC,CAAA"}
|
|
@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { useFieldVariant } from "../../surfaceContext.js";
|
|
4
4
|
import { ComboBox as HeroComboBox, Input as HeroInput, ListBox as HeroListBox, Spinner as HeroSpinner, } from "@heroui/react";
|
|
5
5
|
import { useState } from "react";
|
|
6
|
-
import { FieldDescription, FieldErrorText, FieldLabel, fieldVariantAttributes, useGrammarPortal, vendorFieldProps, } from "../../primitive/Field/index.js";
|
|
6
|
+
import { FieldDescription, FieldErrorText, FieldLabel, FieldSkeletonScope, loadingFieldProps, fieldVariantAttributes, useGrammarPortal, vendorFieldProps, } from "../../primitive/Field/index.js";
|
|
7
7
|
import { ListOptions } from "../Select/index.js";
|
|
8
8
|
/*
|
|
9
9
|
* Consumer hook: `starci-core-combo-box` names this control's root for a consumer or family
|
|
@@ -15,13 +15,20 @@ import { ListOptions } from "../Select/index.js";
|
|
|
15
15
|
* paint Common leaves as it is. No shipped sheet paints them; the Grammar name lets a consumer or
|
|
16
16
|
* family select those parts without reaching for vendor class names.
|
|
17
17
|
*/
|
|
18
|
+
/**
|
|
19
|
+
* Skeleton parity (knowledge STATE-8): `isSkeleton` renders the ready anatomy at the same props inside
|
|
20
|
+
* `FieldSkeletonScope` (inert, `aria-busy`, control box painted as a Skeleton), so the loading field keeps the ready box.
|
|
21
|
+
*/
|
|
22
|
+
export const ComboBox = ({ isSkeleton = false, ...props }) => isSkeleton
|
|
23
|
+
? _jsx(FieldSkeletonScope, { component: "ComboBox", children: _jsx(ComboBoxControl, { ...loadingFieldProps(props) }) })
|
|
24
|
+
: _jsx(ComboBoxControl, { ...props });
|
|
18
25
|
/**
|
|
19
26
|
* Type to filter a list, then pick (combobox / autocomplete).
|
|
20
27
|
*
|
|
21
28
|
* The vendor owns the combobox role, `aria-expanded`, `aria-activedescendant`, arrow/Enter/Escape
|
|
22
29
|
* handling and the "contains" filter. Pending keeps the input editable and marks the list busy.
|
|
23
30
|
*/
|
|
24
|
-
|
|
31
|
+
const ComboBoxControl = ({ id, options, placeholder, value, defaultValue, onValueChange, inputValue, defaultInputValue, onInputChange, allowsCustomValue = false, emptyState, isPending = false, menuTrigger = "input", variant: requestedVariant, ...field }) => {
|
|
25
32
|
const variant = useFieldVariant(requestedVariant);
|
|
26
33
|
const { anchor, portalProps } = useGrammarPortal();
|
|
27
34
|
const [chosen, setChosen] = useState(defaultValue ?? null);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/branch/ComboBox/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EACH,QAAQ,IAAI,YAAY,EACxB,KAAK,IAAI,SAAS,EAClB,OAAO,IAAI,WAAW,EACtB,OAAO,IAAI,WAAW,GAEzB,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AAChD,OAAO,EACH,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,sBAAsB,EACtB,gBAAgB,EAChB,gBAAgB,GAEnB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAAE,WAAW,EAAmB,MAAM,oBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/branch/ComboBox/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAA;AACzD,OAAO,EACH,QAAQ,IAAI,YAAY,EACxB,KAAK,IAAI,SAAS,EAClB,OAAO,IAAI,WAAW,EACtB,OAAO,IAAI,WAAW,GAEzB,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AAChD,OAAO,EACH,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,kBAAkB,EAClB,iBAAiB,EACjB,sBAAsB,EACtB,gBAAgB,EAChB,gBAAgB,GAEnB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAAE,WAAW,EAAmB,MAAM,oBAAoB,CAAA;AA4BjE;;;;GAIG;AAEH;;;;GAIG;AAEH;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EAAE,UAAU,GAAG,KAAK,EAAE,GAAG,KAAK,EAAiB,EAAE,EAAE,CAAC,UAAU;IACnF,CAAC,CAAC,KAAC,kBAAkB,IAAC,SAAS,EAAC,UAAU,YAAC,KAAC,eAAe,OAAK,iBAAiB,CAAC,KAAK,CAAC,GAAI,GAAqB;IACjH,CAAC,CAAC,KAAC,eAAe,OAAK,KAAK,GAAI,CAAA;AAEpC;;;;;GAKG;AACH,MAAM,eAAe,GAAG,CAAC,EACrB,EAAE,EACF,OAAO,EACP,WAAW,EACX,KAAK,EACL,YAAY,EACZ,aAAa,EACb,UAAU,EACV,iBAAiB,EACjB,aAAa,EACb,iBAAiB,GAAG,KAAK,EACzB,UAAU,EACV,SAAS,GAAG,KAAK,EACjB,WAAW,GAAG,OAAO,EACrB,OAAO,EAAE,gBAAgB,EACzB,GAAG,KAAK,EACwB,EAAE,EAAE;IACpC,MAAM,OAAO,GAAG,eAAe,CAAC,gBAAgB,CAAC,CAAA;IACjD,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,gBAAgB,EAAE,CAAA;IAClD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAgB,YAAY,IAAI,IAAI,CAAC,CAAA;IACzE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAA;IACvD,oGAAoG;IACpG,MAAM,QAAQ,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAA;IACrD,MAAM,QAAQ,GAAG,UAAU,IAAI,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,KAAK,QAAQ,CAAC,EAAE,KAAK,CAAA;IAC/F,OAAO,CACH,MAAC,YAAY,iBACC,QAAQ,oBACH,UAAU,mBACX,2BAA2B,EACzC,SAAS,EAAC,yCAAyC,EACnD,SAAS,QACT,OAAO,EAAE,OAAO,KACZ,sBAAsB,CAAC,OAAO,CAAC,KAC/B,gBAAgB,CAAC,EAAE,GAAG,KAAK,EAAE,SAAS,EAAE,CAAC,EAC7C,UAAU,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,EACrC,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,WAAW,KACpB,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,KACtF,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,iBAAiB,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,iBAAiB,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,CAAC,EAC9G,aAAa,EAAE,CAAC,IAAY,EAAE,EAAE;YAC5B,QAAQ,CAAC,IAAI,CAAC,CAAA;YACd,aAAa,EAAE,CAAC,IAAI,CAAC,CAAA;QACzB,CAAC,EACD,QAAQ,EAAE,CAAC,GAAe,EAAE,EAAE;YAC1B,SAAS,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAA;YAC5C,QAAQ,CAAC,IAAI,CAAC,CAAA;YACd,aAAa,EAAE,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAA;QACtD,CAAC,aAEA,MAAM,EACP,KAAC,UAAU,IAAC,QAAQ,EAAE,KAAK,CAAC,aAAa,EAAE,UAAU,EAAE,KAAK,CAAC,UAAU,YAAG,KAAK,CAAC,KAAK,GAAc,EACnG,MAAC,YAAY,CAAC,UAAU,IAAC,SAAS,EAAC,6BAA6B,gCAA4B,MAAM,aAC9F,KAAC,SAAS,OACF,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,KAChC,CAAC,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,CAAC,EACtD,SAAS,EAAC,6BAA6B,KACnC,CAAC,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,KACtE,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAC9C,EACF,KAAC,YAAY,CAAC,OAAO,IAAC,SAAS,EAAC,+BAA+B,YAC1D,SAAS,CAAC,CAAC,CAAC,KAAC,WAAW,IAAC,IAAI,EAAC,IAAI,EAAC,KAAK,EAAC,SAAS,iBAAa,MAAM,EAAC,SAAS,EAAC,2BAA2B,GAAG,CAAC,CAAC,CAAC,SAAS,GACxG,IACD,EAC1B,KAAC,gBAAgB,cAAE,KAAK,CAAC,WAAW,GAAoB,EACxD,KAAC,cAAc,cAAE,KAAK,CAAC,YAAY,GAAkB,EACrD,KAAC,YAAY,CAAC,OAAO,IAAC,SAAS,EAAC,0BAA0B,0BAAsB,UAAU,mBAAe,UAAU,KAAK,WAAW,YAC/H,KAAC,WAAW,IACR,SAAS,EAAC,kBAAkB,KACxB,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,KACxC,CAAC,UAAU,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;wBAC3B,gBAAgB,EAAE,GAAG,EAAE,CAAC,cAAK,SAAS,EAAC,wBAAwB,6BAAyB,MAAM,mBAAe,SAAS,YAAE,UAAU,GAAO;qBAC5I,CAAC,YAEF,KAAC,WAAW,IAAC,OAAO,EAAE,OAAO,GAAI,GACvB,GACK,IACZ,CAClB,CAAA;AACL,CAAC,CAAA"}
|
|
@@ -1,11 +1,23 @@
|
|
|
1
1
|
import { type DragEventHandler, type ReactNode } from "react";
|
|
2
|
-
export type DataTableColumn = {
|
|
2
|
+
export type DataTableColumn<Row extends DataTableRow = DataTableRow> = {
|
|
3
3
|
readonly id: string;
|
|
4
4
|
readonly label: string;
|
|
5
5
|
/** The column that names each row for assistive technology. Defaults to the first column. */
|
|
6
6
|
readonly isRowHeader?: boolean;
|
|
7
7
|
readonly allowsSorting?: boolean;
|
|
8
8
|
readonly align?: "start" | "end";
|
|
9
|
+
/**
|
|
10
|
+
* Narrow-width mode. A `low` column leaves the header below the table's `collapseBelow` width and its value joins the
|
|
11
|
+
* row as stacked secondary text (its label, then its cell) under the first `high` column's content. Default `high`.
|
|
12
|
+
*/
|
|
13
|
+
readonly priority?: "high" | "low";
|
|
14
|
+
/**
|
|
15
|
+
* Makes every cell of the column an editor: the render returns a Select, NumberField, TagGroup or other field for the row.
|
|
16
|
+
* The editor owns its keys and focus. Arrow keys, Enter, Space and typing stay inside it, Tab moves through the cell's fields
|
|
17
|
+
* and Escape returns focus to the cell. A table with an editor column leaves the grid's arrow-key cell navigation for
|
|
18
|
+
* cell-to-cell Tab and arrow movement from the cell itself (React Aria's `tab` keyboard behaviour), so editors work.
|
|
19
|
+
*/
|
|
20
|
+
readonly editor?: (row: Row) => ReactNode;
|
|
9
21
|
};
|
|
10
22
|
export type DataTableSort = {
|
|
11
23
|
readonly columnId: string;
|
|
@@ -13,6 +25,8 @@ export type DataTableSort = {
|
|
|
13
25
|
};
|
|
14
26
|
export type DataTableRow = {
|
|
15
27
|
readonly id: string;
|
|
28
|
+
/** A destination: the whole row becomes a link target, so a click or Enter on the row navigates through the app's router. */
|
|
29
|
+
readonly href?: string;
|
|
16
30
|
};
|
|
17
31
|
/** Cell effects belong to the caller; the table owns cell semantics, focus and activation. */
|
|
18
32
|
export type DataTableCellInteraction = {
|
|
@@ -25,7 +39,7 @@ export type DataTableCellInteraction = {
|
|
|
25
39
|
export type DataTableProps<Row extends DataTableRow> = {
|
|
26
40
|
/** Names the table, e.g. "Invoices". */
|
|
27
41
|
readonly label: string;
|
|
28
|
-
readonly columns: ReadonlyArray<DataTableColumn
|
|
42
|
+
readonly columns: ReadonlyArray<DataTableColumn<Row>>;
|
|
29
43
|
readonly rows: ReadonlyArray<Row>;
|
|
30
44
|
readonly renderCell: (row: Row, columnId: string) => ReactNode;
|
|
31
45
|
/** Optional cell actions and native drop events. An actionable cell receives arrow-key focus itself. */
|
|
@@ -54,7 +68,10 @@ export type DataTableProps<Row extends DataTableRow> = {
|
|
|
54
68
|
readonly stickyHeader?: boolean;
|
|
55
69
|
/** Bounds the body so the table owns vertical scroll, e.g. "24rem". */
|
|
56
70
|
readonly maxBlockSize?: string;
|
|
71
|
+
/** Runs when a row is activated (click, Enter), alongside a row `href` when both are given. */
|
|
57
72
|
readonly onRowAction?: (id: string) => void;
|
|
73
|
+
/** Container inline size in px below which `low` priority columns collapse into the row. Default 640. */
|
|
74
|
+
readonly collapseBelow?: number;
|
|
58
75
|
readonly className?: string;
|
|
59
76
|
};
|
|
60
77
|
/**
|
|
@@ -63,5 +80,5 @@ export type DataTableProps<Row extends DataTableRow> = {
|
|
|
63
80
|
* horizontal scroll so a wide table never widens a 360px page.
|
|
64
81
|
* Contract: scroll LAYOUT-3, grid FOCUS-2 STATE-1, row FOCUS-1, empty STATE-3.
|
|
65
82
|
*/
|
|
66
|
-
export declare const DataTable: <Row extends DataTableRow>({ label, columns, rows, renderCell, getCellInteraction, sort, onSortChange, selectionMode, selectedIds, defaultSelectedIds, onSelectionChange, selectAllLabel, selectRowLabel, isLoading, loadingContent, loadingRows, emptyContent, stickyHeader, maxBlockSize, onRowAction, className, }: DataTableProps<Row>) => import("react").JSX.Element;
|
|
83
|
+
export declare const DataTable: <Row extends DataTableRow>({ label, columns, rows, renderCell, getCellInteraction, sort, onSortChange, selectionMode, selectedIds, defaultSelectedIds, onSelectionChange, selectAllLabel, selectRowLabel, isLoading, loadingContent, loadingRows, emptyContent, stickyHeader, maxBlockSize, onRowAction, collapseBelow, className, }: DataTableProps<Row>) => import("react").JSX.Element;
|
|
67
84
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/DataTable/index.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/DataTable/index.tsx"],"names":[],"mappings":"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"}
|