@scattered-light/loomiere-mojave 0.13.0 → 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.
@@ -797,6 +797,7 @@
797
797
  --sl-picker-button-max-width: 18rem; /** Widest the button grows. A longer choice is cut with an ellipsis; the label never is. */
798
798
  --sl-preview-card-popup-min-width: 300px; /** Narrowest a preview card gets, so a short title still has room for its image. */
799
799
  --sl-preview-card-popup-max-width: 450px; /** Widest a preview card gets, so its description keeps a comfortable line length. */
800
+ --sl-sheet-tab-text-offset: 0px; /** Nudges the tab label down, for a typeface whose caps sit high in the line box. Zero centers the line box. */
800
801
  --sl-slider-vertical-height: 200px; /** Default length of a vertical slider. */
801
802
  --sl-splitter-key-step: 5%; /** One arrow press moves the handle by 5% of the splitter. Dryden used 5%: a nudge you can see, not a jump. */
802
803
  --sl-splitter-key-step-large: 10%; /** The Shift step. Twice the arrow step, so a few presses cross the panel without holding the key. */
@@ -2421,6 +2422,7 @@
2421
2422
  --sl-table-total-rule-color: var(--sl-rule-color); /** The line above a subtotal or total row and the double line under a grand total. The working-paper rule color, so totals and sheet tops are ruled in the same ink. */
2422
2423
  --sl-table-total-background: var(--sl-table-background); /** Fill of a subtotal or grand total row: the cell color, so the rules mark the total instead of a band. The footer's default totals row keeps the header tray. */
2423
2424
  --sl-app-bar-border-color: var(--sl-rule-color); /** The line under the bar, in the rule color, so an ink rule brand gets an ink line here too. */
2425
+ --sl-collection-tree-parent-row-background: var(--sl-table-background); /** Fill of a parent row in a tree with treeLines, so a parent reads a step off its children. */
2424
2426
  --sl-sheet-rule-color: var(--sl-rule-color); /** The top rule's color: the working-paper rule color, so sheets and ruled tables match. */
2425
2427
  --sl-sheet-tab-color: var(--sl-text-on-inverse-surface); /** Text on the tab label. */
2426
2428
  --sl-side-nav-indicator-color: var(--sl-rule-color); /** The current row's line: the working-paper rule color, so the nav and the sheets share one ink. */
@@ -2429,6 +2431,7 @@
2429
2431
  --sl-toggle-group-segmented-pressed-color: var(--sl-text-on-inverse); /** Text on the pressed toggle. */
2430
2432
  --sl-check-background: var(--sl-field-background); /** Empty box, the same fill as a field so it reads as something to fill in. */
2431
2433
  --sl-popup-arrow-fill: var(--sl-popup-background); /** The arrow is part of the popup, so it takes the popup's fill. */
2434
+ --sl-collection-tree-parent-row-hover: var(--sl-table-row-hover); /** A parent row under the pointer, with treeLines. A brand sets it a step darker than table.row-hover so a parent still stands out when hovered. */
2432
2435
  }
2433
2436
 
2434
2437
  /* Look: Classic (data-look='classic'). */
@@ -5915,6 +5918,8 @@
5915
5918
  --sl-app-bar-border-color: var(--sl-rule-color);
5916
5919
  --sl-app-bar-divider-color: var(--sl-border-strong);
5917
5920
  --sl-collection-tree-line-color: var(--sl-border-strong);
5921
+ --sl-collection-tree-parent-row-background: var(--sl-table-background);
5922
+ --sl-collection-tree-parent-row-hover: var(--sl-table-row-hover);
5918
5923
  --sl-collection-disclosure-color: var(--sl-text-primary);
5919
5924
  --sl-description-list-row-border-color: var(--sl-border-subtle);
5920
5925
  --sl-description-list-label-color: var(--sl-text-secondary);
@@ -6102,6 +6107,8 @@
6102
6107
  --sl-app-bar-border-color: var(--sl-rule-color);
6103
6108
  --sl-app-bar-divider-color: var(--sl-border-strong);
6104
6109
  --sl-collection-tree-line-color: var(--sl-border-strong);
6110
+ --sl-collection-tree-parent-row-background: var(--sl-table-background);
6111
+ --sl-collection-tree-parent-row-hover: var(--sl-table-row-hover);
6105
6112
  --sl-collection-disclosure-color: var(--sl-text-primary);
6106
6113
  --sl-description-list-row-border-color: var(--sl-border-subtle);
6107
6114
  --sl-description-list-label-color: var(--sl-text-secondary);
@@ -6289,6 +6296,8 @@
6289
6296
  --sl-app-bar-border-color: var(--sl-rule-color);
6290
6297
  --sl-app-bar-divider-color: var(--sl-border-strong);
6291
6298
  --sl-collection-tree-line-color: var(--sl-border-strong);
6299
+ --sl-collection-tree-parent-row-background: var(--sl-table-background);
6300
+ --sl-collection-tree-parent-row-hover: var(--sl-table-row-hover);
6292
6301
  --sl-collection-disclosure-color: var(--sl-text-primary);
6293
6302
  --sl-description-list-row-border-color: var(--sl-border-subtle);
6294
6303
  --sl-description-list-label-color: var(--sl-text-secondary);
@@ -6679,7 +6688,7 @@
6679
6688
  }
6680
6689
 
6681
6690
 
6682
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
6691
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
6683
6692
  /* Loomiere for Base UI: component styles. Brand-free: every value is a --sl- variable from a
6684
6693
  Loomiere theme. Load the theme first:
6685
6694
  @import '<your theme>/tokens.css';
@@ -6689,7 +6698,7 @@
6689
6698
  /* Document defaults, in the reset layer so any unlayered rule wins over them, and so layered
6690
6699
  frameworks (Chakra's recipes, Tailwind's utilities) are not undone by them. */
6691
6700
  @layer reset {
6692
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
6701
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
6693
6702
  /* CSS Reset - Mojave Theme */
6694
6703
 
6695
6704
  /* ============================================
@@ -7133,7 +7142,7 @@ hr {
7133
7142
  }
7134
7143
  }
7135
7144
  @layer reset {
7136
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7145
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7137
7146
  /* Accessibility — base rules (no theme color dependencies). Theme-specific focus/invalid: accessibility-theme.css */
7138
7147
 
7139
7148
  /* Remove default focus; keyboard focus styled in accessibility-theme.css */
@@ -7246,7 +7255,7 @@ main:focus {
7246
7255
 
7247
7256
  }
7248
7257
  @layer reset {
7249
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7258
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7250
7259
  /* Focus, invalid, contrast — requires theme tokens (after theme-accessibility.css). */
7251
7260
 
7252
7261
  :focus-visible {
@@ -7314,7 +7323,7 @@ button,
7314
7323
 
7315
7324
  }
7316
7325
  /* Component styles */
7317
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7326
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7318
7327
  /* Accordion - Mojave Theme
7319
7328
  *
7320
7329
  * No component tokens. Hover, press, chevron, divider and motion are the disclosure
@@ -7435,7 +7444,7 @@ button,
7435
7444
  overflow: hidden;
7436
7445
  }
7437
7446
 
7438
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7447
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7439
7448
  /* Alert Dialog - Mojave Theme
7440
7449
  *
7441
7450
  * No component tokens and no rules of its own. An alert dialog looks exactly like a
@@ -7444,7 +7453,7 @@ button,
7444
7453
  * cancel quiet, and a destructive one bold with data-color="error".
7445
7454
  */
7446
7455
 
7447
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7456
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7448
7457
  /* Autocomplete - Mojave Theme
7449
7458
  *
7450
7459
  * No component tokens. The input is Input (Input.css), the clear button is an icon
@@ -7646,7 +7655,7 @@ button,
7646
7655
  (reset-accessibility.css).
7647
7656
  ============================================ */
7648
7657
 
7649
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7658
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7650
7659
  /* Avatar - Mojave Theme
7651
7660
  *
7652
7661
  * A round picture with a ring in the page color, so avatars in a group cut out of each other in
@@ -7754,7 +7763,7 @@ button,
7754
7763
  }
7755
7764
  }
7756
7765
 
7757
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7766
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7758
7767
  /* Button - Mojave Theme
7759
7768
  *
7760
7769
  * Colors are the brand's emphasis levels, sizes are control.*, text is the trigger
@@ -7904,7 +7913,7 @@ button,
7904
7913
  font-size: var(--sl-icon-size-maximize);
7905
7914
  }
7906
7915
 
7907
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
7916
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
7908
7917
  /* Checkbox - Mojave Theme
7909
7918
  * Sizes follow the label: the box is the icon size one tier above the label's text
7910
7919
  * tier (like a button's icon) and the check mark one tier below it.
@@ -8061,7 +8070,7 @@ button,
8061
8070
  border-radius: var(--sl-radius-pill);
8062
8071
  }
8063
8072
 
8064
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
8073
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8065
8074
  /* Checkbox Group - Mojave Theme */
8066
8075
 
8067
8076
  /* Each checkbox row is already a full tap target tall, so the rows sit close. */
@@ -8077,7 +8086,7 @@ button,
8077
8086
  pointer-events: none;
8078
8087
  }
8079
8088
 
8080
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
8089
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8081
8090
  /* Collapsible - Mojave Theme
8082
8091
  *
8083
8092
  * No component tokens. Hover, press, chevron and motion are the disclosure concept
@@ -8193,7 +8202,7 @@ button,
8193
8202
  background: var(--sl-surface-raised);
8194
8203
  }
8195
8204
 
8196
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
8205
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8197
8206
  /* Combobox - Mojave Theme
8198
8207
  *
8199
8208
  * No component tokens. The input is Input (Input.css); the chips box is a field; the
@@ -8678,7 +8687,7 @@ button,
8678
8687
  color: var(--sl-text-tertiary);
8679
8688
  }
8680
8689
 
8681
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
8690
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8682
8691
  /* Context Menu - Mojave Theme
8683
8692
  *
8684
8693
  * No component tokens. Opens on right-click; the trigger area only sets the cursor. The popup is the popup concept, rows are item rows at the
@@ -8847,7 +8856,7 @@ button,
8847
8856
  stroke-width: var(--sl-stroke-default);
8848
8857
  }
8849
8858
 
8850
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
8859
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8851
8860
  /* Dialog and Alert dialog - Mojave Theme
8852
8861
  *
8853
8862
  * Both are centered modals built from the modal concept (tokens/semantic/modal.json):
@@ -8993,7 +9002,7 @@ button,
8993
9002
  margin-top: var(--sl-modal-actions-spacing);
8994
9003
  }
8995
9004
 
8996
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9005
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
8997
9006
  /* Drawer - a panel that slides in from an edge and can be swiped away.
8998
9007
  The surface, scrim, heading and motion are the modal concept's (--sl-modal-*), so a
8999
9008
  drawer reads as a dialog's sibling; only its size and grab bar are its own
@@ -9126,7 +9135,7 @@ button,
9126
9135
  color: var(--sl-modal-description-color);
9127
9136
  }
9128
9137
 
9129
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9138
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9130
9139
  /* Field - Mojave Theme
9131
9140
  *
9132
9141
  * Label, control, description and error. No component tokens: spacing is the field
@@ -9187,7 +9196,7 @@ textarea.FieldControl {
9187
9196
  height: auto;
9188
9197
  }
9189
9198
 
9190
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9199
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9191
9200
  /* Fieldset - Mojave Theme
9192
9201
  *
9193
9202
  * No component tokens: a titled group of fields, spaced by the stack gaps, with
@@ -9229,7 +9238,7 @@ textarea.FieldControl {
9229
9238
  color: var(--sl-text-secondary);
9230
9239
  }
9231
9240
 
9232
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9241
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9233
9242
  /* Form - Mojave Theme
9234
9243
  *
9235
9244
  * No component tokens: fields stack with the large block space, and the action
@@ -9249,7 +9258,7 @@ textarea.FieldControl {
9249
9258
  margin-top: var(--sl-space-block-md);
9250
9259
  }
9251
9260
 
9252
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9261
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9253
9262
  /* Input - Mojave Theme
9254
9263
  *
9255
9264
  * No component tokens: the look is the field concept (tokens/semantic/field.json),
@@ -9386,7 +9395,7 @@ textarea.FieldControl {
9386
9395
  padding-inline: var(--sl-control-padding-inline-lg);
9387
9396
  }
9388
9397
 
9389
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9398
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9390
9399
  /* Menu - Mojave Theme
9391
9400
  *
9392
9401
  * No component tokens. The trigger is a Button. The popup is the popup concept, rows are item rows at the
@@ -9535,7 +9544,7 @@ textarea.FieldControl {
9535
9544
  color: var(--sl-text-tertiary);
9536
9545
  }
9537
9546
 
9538
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9547
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9539
9548
  /* Menubar - Mojave Theme
9540
9549
  *
9541
9550
  * No component tokens. A row of quiet triggers, each opening a menu. The popup is the popup concept, rows are item rows at the
@@ -9728,7 +9737,7 @@ textarea.FieldControl {
9728
9737
  color: var(--sl-text-tertiary);
9729
9738
  }
9730
9739
 
9731
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9740
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9732
9741
  /* Meter - Mojave Theme
9733
9742
  *
9734
9743
  * A gauge (tokens/semantic/gauge.json). The fill is the solid color of the scope around it:
@@ -9791,7 +9800,7 @@ textarea.FieldControl {
9791
9800
  height: var(--sl-gauge-height-lg);
9792
9801
  }
9793
9802
 
9794
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
9803
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
9795
9804
  /* Navigation Menu - Mojave Theme
9796
9805
  *
9797
9806
  * The strip is the bar concept, the panel is the popup concept and each link is an item
@@ -10211,7 +10220,7 @@ textarea.FieldControl {
10211
10220
  width: 100%;
10212
10221
  }
10213
10222
 
10214
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10223
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10215
10224
  /* Number Field - Mojave Theme
10216
10225
  *
10217
10226
  * No component tokens. The input is Input (Input.css) and the label, description and
@@ -10302,7 +10311,7 @@ textarea.FieldControl {
10302
10311
  user-select: none;
10303
10312
  }
10304
10313
 
10305
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10314
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10306
10315
  /* OTP Field - Mojave Theme
10307
10316
  *
10308
10317
  * One-time code entry: a row of single-character inputs. Each slot is the same control as Input
@@ -10365,7 +10374,7 @@ textarea.FieldControl {
10365
10374
  letter-spacing: var(--sl-font-body-magnify-letter-spacing);
10366
10375
  }
10367
10376
 
10368
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10377
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10369
10378
  /* Popover - Mojave Theme */
10370
10379
 
10371
10380
  /* ============================================
@@ -10530,7 +10539,7 @@ textarea.FieldControl {
10530
10539
  fill: var(--sl-popup-arrow-stroke);
10531
10540
  }
10532
10541
 
10533
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10542
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10534
10543
  /* Preview Card - Mojave Theme
10535
10544
  *
10536
10545
  * The popup concept (surface, arrow, motion) with a title-magnify title and condense
@@ -10647,7 +10656,7 @@ textarea.FieldControl {
10647
10656
  fill: var(--sl-popup-arrow-stroke);
10648
10657
  }
10649
10658
 
10650
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10659
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10651
10660
  /* Progress - Mojave Theme
10652
10661
  *
10653
10662
  * A gauge (tokens/semantic/gauge.json), the same bar as Meter. The fill is the solid color of
@@ -10724,7 +10733,7 @@ textarea.FieldControl {
10724
10733
  height: var(--sl-gauge-height-lg);
10725
10734
  }
10726
10735
 
10727
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10736
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10728
10737
  /* Radio - Mojave Theme
10729
10738
  * Same box as Checkbox, always round. Sizes follow the label the same way, and the
10730
10739
  * dot is a share of the circle (check.dot-scale).
@@ -10876,7 +10885,7 @@ textarea.FieldControl {
10876
10885
  gap: var(--sl-gap-stack-sm);
10877
10886
  }
10878
10887
 
10879
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10888
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10880
10889
  /* Scroll Area - Mojave Theme
10881
10890
  *
10882
10891
  * The scrollbar is the content scrollbar (content.scrollbar-*): a track that stays clear until
@@ -10958,7 +10967,7 @@ textarea.FieldControl {
10958
10967
  background: transparent;
10959
10968
  }
10960
10969
 
10961
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
10970
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
10962
10971
  /* Select - Mojave Theme
10963
10972
  *
10964
10973
  * The trigger is a field (the field pattern, control sizes, the base text style); the
@@ -11243,7 +11252,7 @@ textarea.FieldControl {
11243
11252
  stroke-width: var(--sl-stroke-default);
11244
11253
  }
11245
11254
 
11246
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11255
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11247
11256
  /* Separator - Mojave Theme
11248
11257
  *
11249
11258
  * A hairline in the everyday divider color (border.default), one stroke thick, with a step of
@@ -11271,7 +11280,7 @@ textarea.FieldControl {
11271
11280
  margin-inline: var(--sl-space-4);
11272
11281
  }
11273
11282
 
11274
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11283
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11275
11284
  /* Slider - Mojave Theme
11276
11285
  *
11277
11286
  * A slider is a gauge you can drag: the track, fill and label row are gauge.* (the same bar as
@@ -11437,7 +11446,7 @@ textarea.FieldControl {
11437
11446
  transform: translate(-50%, 50%);
11438
11447
  }
11439
11448
 
11440
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11449
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11441
11450
  /* Switch - Mojave Theme
11442
11451
  * Switch keeps its track sizes. The thumb, its travel and the ON/OFF text are
11443
11452
  * worked out from them: the thumb fills the track's height inside the padding,
@@ -11603,7 +11612,7 @@ textarea.FieldControl {
11603
11612
  color: var(--sl-text-disabled);
11604
11613
  }
11605
11614
 
11606
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11615
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11607
11616
  /* Tabs - Mojave Theme
11608
11617
  *
11609
11618
  * No component tokens. The divider, the selected line and color, hover and the disabled
@@ -11739,7 +11748,7 @@ textarea.FieldControl {
11739
11748
  padding: var(--sl-space-6);
11740
11749
  }
11741
11750
 
11742
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11751
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11743
11752
  /* Toast - Mojave Theme
11744
11753
  *
11745
11754
  * A toast is a notice (tokens/semantic/notice.json) on the popup surface. A toast whose type
@@ -11975,7 +11984,7 @@ textarea.FieldControl {
11975
11984
  flex-shrink: 0;
11976
11985
  }
11977
11986
 
11978
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
11987
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
11979
11988
  /* Toggle - Mojave Theme
11980
11989
  * A toggle is a button that stays pressed: the same heights, padding, gap and
11981
11990
  * trigger text style as a button of the same size. Pressed, it takes its emphasis level's
@@ -12087,7 +12096,7 @@ textarea.FieldControl {
12087
12096
  height: var(--sl-icon-size-maximize);
12088
12097
  }
12089
12098
 
12090
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12099
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12091
12100
  /* Toggle Group - Mojave Theme
12092
12101
  *
12093
12102
  * No component tokens. The strip is the bar concept (tokens/semantic/bar.json); the
@@ -12149,7 +12158,7 @@ textarea.FieldControl {
12149
12158
  outline-offset: var(--sl-focus-outline-offset-inset);
12150
12159
  }
12151
12160
 
12152
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12161
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12153
12162
  /* Toolbar - Mojave Theme
12154
12163
  *
12155
12164
  * The strip is the bar concept (tokens/semantic/bar.json). Buttons, toggles, selects
@@ -12211,7 +12220,7 @@ textarea.FieldControl {
12211
12220
  max-width: var(--sl-toolbar-input-max-width);
12212
12221
  }
12213
12222
 
12214
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12223
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12215
12224
  /* Tooltip - Mojave Theme
12216
12225
  *
12217
12226
  * The inverse surface (surface.inverse, text.on-inverse-surface) with condense text, so a tooltip
@@ -12272,7 +12281,7 @@ textarea.FieldControl {
12272
12281
  }
12273
12282
 
12274
12283
  /* Custom components: not Base UI parts. Built from existing concepts and tokens. */
12275
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12284
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12276
12285
  /* Badge
12277
12286
  *
12278
12287
  * A status or count label. Not a Base UI part, and not interactive: no hover or focus.
@@ -12377,7 +12386,7 @@ textarea.FieldControl {
12377
12386
  height: var(--sl-badge-dot-base);
12378
12387
  }
12379
12388
 
12380
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12389
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12381
12390
  /*
12382
12391
  * DatePicker: a field that opens a calendar for one date or a period.
12383
12392
  * Not a Base UI part. The popup is Popover on a wide viewport and Drawer
@@ -12950,7 +12959,7 @@ textarea.FieldControl {
12950
12959
  flex-basis: 100%;
12951
12960
  }
12952
12961
 
12953
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
12962
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
12954
12963
  /* Money field
12955
12964
  *
12956
12965
  * An amount of money, built on Number field. The value is an integer in minor units
@@ -13295,7 +13304,7 @@ textarea.FieldControl {
13295
13304
  letter-spacing: var(--sl-font-body-base-letter-spacing);
13296
13305
  }
13297
13306
 
13298
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
13307
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
13299
13308
  /* ListDetail
13300
13309
  *
13301
13310
  * The detail of one item, next to its list. Not a Base UI part. It is a Splitter
@@ -13422,7 +13431,7 @@ textarea.FieldControl {
13422
13431
  background: transparent;
13423
13432
  }
13424
13433
 
13425
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
13434
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
13426
13435
  /* Splitter
13427
13436
  *
13428
13437
  * Two or more panels and a handle between them. Not a Base UI part. It follows the
@@ -13630,7 +13639,7 @@ textarea.FieldControl {
13630
13639
  background: var(--sl-border-default);
13631
13640
  }
13632
13641
 
13633
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
13642
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
13634
13643
  /* EmptyState
13635
13644
  *
13636
13645
  * The block a page, pane, table, list or popup shows when it has nothing to show.
@@ -13886,7 +13895,7 @@ textarea.FieldControl {
13886
13895
  color: inherit;
13887
13896
  }
13888
13897
 
13889
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
13898
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
13890
13899
  /* Table - Mojave Theme
13891
13900
  *
13892
13901
  * Base UI has no table, so this styles the native <table class="Table"> elements with the
@@ -13964,6 +13973,23 @@ textarea.FieldControl {
13964
13973
  border-bottom: var(--sl-stroke-default) solid var(--sl-table-border-color);
13965
13974
  }
13966
13975
 
13976
+ /* Caps header: the column names, and the labels in total rows, in caps-condense. DataTable headerStyle="caps". */
13977
+ .Table[data-header-style='caps'] thead th,
13978
+ .Table[data-header-style='caps'] tr[data-total] > :not([data-align='end']) {
13979
+ font-family: var(--sl-font-caps-condense-font-family);
13980
+ font-size: var(--sl-font-caps-condense-font-size);
13981
+ font-weight: var(--sl-font-caps-condense-font-weight);
13982
+ line-height: var(--sl-font-caps-condense-line-height);
13983
+ letter-spacing: var(--sl-font-caps-condense-letter-spacing);
13984
+ text-transform: var(--sl-font-caps-condense-text-transform);
13985
+ }
13986
+
13987
+ /* Figures: numbers (end-aligned cells) in the figures family, total rows included. DataTable figures. */
13988
+ .Table[data-figures] :is(td, th)[data-align='end'] {
13989
+ font-family: var(--sl-font-figures-base-font-family);
13990
+ font-variant-numeric: var(--sl-font-figures-base-font-variant-numeric);
13991
+ }
13992
+
13967
13993
  /* A header that sorts: aria-sort on the th */
13968
13994
  .Table th[aria-sort] {
13969
13995
  cursor: pointer;
@@ -14120,7 +14146,7 @@ textarea.FieldControl {
14120
14146
  color: inherit;
14121
14147
  }
14122
14148
 
14123
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14149
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14124
14150
  /* Collection
14125
14151
  *
14126
14152
  * DataTable, DataList, the toolbar and the pagination, in one place so the two views
@@ -14131,7 +14157,7 @@ textarea.FieldControl {
14131
14157
  * the tabs and the search where they are, so selecting rows does not grow the toolbar.
14132
14158
  */
14133
14159
 
14134
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14160
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14135
14161
  /* Collection toolbar
14136
14162
  *
14137
14163
  * The wrap follows the toolbar's own width, not the window: a table in a narrow pane wraps
@@ -14297,7 +14323,7 @@ textarea.FieldControl {
14297
14323
  border-block-end: var(--sl-stroke-default) solid var(--sl-table-border-color);
14298
14324
  }
14299
14325
 
14300
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14326
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14301
14327
  /* DataTable additions on top of .Table.
14302
14328
  *
14303
14329
  * Sort buttons fill the header cell and inherit its hover, so old aria-sort markup keeps
@@ -14485,7 +14511,18 @@ textarea.FieldControl {
14485
14511
  cursor: pointer;
14486
14512
  }
14487
14513
 
14488
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14514
+ /* Parent rows in a tree: their own fill and hover, a step off the children. */
14515
+ .DataTable[data-tree-lines] tbody tr:not([data-depth], [aria-selected='true'], [data-selected], [aria-current='true']) > :is(th, td) {
14516
+ background: var(--sl-collection-tree-parent-row-background);
14517
+ }
14518
+
14519
+ @media (hover: hover) {
14520
+ .DataTable[data-tree-lines] tbody tr:not([data-depth], [aria-selected='true'], [data-selected], [aria-current='true']):hover > :is(th, td) {
14521
+ background: var(--sl-collection-tree-parent-row-hover);
14522
+ }
14523
+ }
14524
+
14525
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14489
14526
  /* DataList
14490
14527
  *
14491
14528
  * The same rows as the table, in one container with the table's borders, hover, selected
@@ -14627,7 +14664,7 @@ textarea.FieldControl {
14627
14664
  transition: opacity var(--sl-duration-fast) var(--sl-easing-default);
14628
14665
  }
14629
14666
 
14630
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14667
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14631
14668
  /* Pagination
14632
14669
  *
14633
14670
  * Not tied to a collection. Anything with a page, a page count and a total can use it.
@@ -14652,7 +14689,7 @@ textarea.FieldControl {
14652
14689
  margin: 0;
14653
14690
  }
14654
14691
 
14655
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14692
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14656
14693
  /* EditableList
14657
14694
  *
14658
14695
  * One table at every width, so a field is not submitted twice. Under the stack width each
@@ -14751,7 +14788,7 @@ textarea.FieldControl {
14751
14788
  }
14752
14789
  }
14753
14790
 
14754
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14791
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14755
14792
  /* Sheet
14756
14793
  *
14757
14794
  * A working-paper surface: the raised surface with a heavier rule across its top
@@ -14793,6 +14830,8 @@ textarea.FieldControl {
14793
14830
  background: var(--sl-sheet-tab-background);
14794
14831
  color: var(--sl-sheet-tab-color);
14795
14832
  border-radius: var(--sl-sheet-tab-radius) var(--sl-sheet-tab-radius) 0 0;
14833
+ padding-block-start: var(--sl-sheet-tab-text-offset);
14834
+ line-height: 1;
14796
14835
  white-space: nowrap;
14797
14836
  }
14798
14837
 
@@ -14842,7 +14881,7 @@ textarea.FieldControl {
14842
14881
  border-top: 0;
14843
14882
  }
14844
14883
 
14845
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14884
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14846
14885
  /* StatFigure
14847
14886
  *
14848
14887
  * One large figure with a caps label above and a caption under it. The label is
@@ -14903,7 +14942,7 @@ textarea.FieldControl {
14903
14942
  color: var(--sl-stat-figure-caption-color);
14904
14943
  }
14905
14944
 
14906
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
14945
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14907
14946
  /* DescriptionList
14908
14947
  *
14909
14948
  * Label and value pairs in a native dl, one DescriptionItem (a div holding a dt and a dd)
@@ -14979,7 +15018,7 @@ textarea.FieldControl {
14979
15018
  text-align: end;
14980
15019
  }
14981
15020
 
14982
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
15021
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
14983
15022
  /* AppBar
14984
15023
  *
14985
15024
  * The bar across the top of an app window, one row on a line in the rule color. The line is
@@ -15013,7 +15052,7 @@ textarea.FieldControl {
15013
15052
  background: var(--sl-app-bar-divider-color);
15014
15053
  }
15015
15054
 
15016
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
15055
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
15017
15056
  /* PickerButton
15018
15057
  *
15019
15058
  * A trigger with a caps label before the current choice: CLIENT Alpha Services. The field
@@ -15099,7 +15138,7 @@ textarea.FieldControl {
15099
15138
  transform: rotate(180deg);
15100
15139
  }
15101
15140
 
15102
- /* @scattered-light/loomiere-base-ui 0.13.0 · styles for @base-ui/react 1.9.0 */
15141
+ /* @scattered-light/loomiere-base-ui 0.14.0 · styles for @base-ui/react 1.9.0 */
15103
15142
  /* SideNav
15104
15143
  *
15105
15144
  * The column of links down the side of a workspace. Rows are ruled apart with a hairline; the