@threadlabs/looma 0.22.12 → 0.22.14

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 (71) hide show
  1. package/components/shared/icons.js +4 -0
  2. package/components/ui-card/ui-card.html +21 -2
  3. package/components/ui-icon/ui-icon.html +4 -0
  4. package/components/ui-input/ui-input.html +1 -0
  5. package/components/ui-input-group/ui-input-group.html +11 -0
  6. package/components/ui-popover/ui-popover.html +15 -0
  7. package/components/ui-scroll-area/ui-scroll-area.html +12 -0
  8. package/components/ui-search-result-row/ui-search-result-row.html +11 -0
  9. package/components/ui-stack/ui-stack.html +6 -3
  10. package/components/ui-text/ui-text.html +12 -0
  11. package/dist/index.js +1 -1
  12. package/editor/chunks/extensions.js +75 -6
  13. package/editor/extensions/index.d.ts +1 -0
  14. package/editor/extensions/index.js +2 -2
  15. package/editor/extensions/preset.d.ts +2 -0
  16. package/editor/extensions/relative-links.d.ts +8 -0
  17. package/editor/extensions/slash-command.d.ts +5 -3
  18. package/editor/icons.d.ts +4 -0
  19. package/editor/index.js +7 -3
  20. package/package.json +1 -1
  21. package/styles/ui-card.css +17 -0
  22. package/styles/ui-input-group.css +9 -0
  23. package/styles/ui-input.css +1 -0
  24. package/styles/ui-popover.css +13 -0
  25. package/styles/ui-scroll-area.css +10 -0
  26. package/styles/ui-search-result-row.css +9 -0
  27. package/styles/ui-stack.css +3 -0
  28. package/styles/ui-text.css +8 -0
  29. package/vanilla/UiCard.d.ts +2 -1
  30. package/vanilla/UiCard.js +1 -1
  31. package/vanilla/UiIcon.js +1 -1
  32. package/vanilla/UiInputGroup.d.ts +1 -0
  33. package/vanilla/UiInputGroup.js +1 -1
  34. package/vanilla/UiPopover.d.ts +1 -0
  35. package/vanilla/UiPopover.js +1 -1
  36. package/vanilla/UiScrollArea.d.ts +1 -0
  37. package/vanilla/UiScrollArea.js +1 -1
  38. package/vanilla/UiSearchResultRow.d.ts +1 -0
  39. package/vanilla/UiSearchResultRow.js +1 -1
  40. package/vanilla/UiStack.d.ts +1 -1
  41. package/vanilla/UiStack.js +1 -1
  42. package/vanilla/UiText.d.ts +2 -0
  43. package/vanilla/UiText.js +1 -1
  44. package/vue/UiCard.d.ts +12 -3
  45. package/vue/UiCard.vue +49 -5
  46. package/vue/UiIcon.vue +23 -0
  47. package/vue/UiInput.vue +1 -0
  48. package/vue/UiInputGroup.d.ts +9 -0
  49. package/vue/UiInputGroup.vue +33 -2
  50. package/vue/UiPopover.d.ts +9 -0
  51. package/vue/UiPopover.vue +43 -2
  52. package/vue/UiScrollArea.d.ts +9 -0
  53. package/vue/UiScrollArea.vue +35 -2
  54. package/vue/UiSearchResultRow.d.ts +9 -0
  55. package/vue/UiSearchResultRow.vue +38 -1
  56. package/vue/UiStack.d.ts +3 -3
  57. package/vue/UiStack.vue +10 -4
  58. package/vue/UiText.d.ts +18 -0
  59. package/vue/UiText.vue +70 -0
  60. package/vue/chunks/UiCard.js +39 -3
  61. package/vue/chunks/UiIcon.js +69 -1
  62. package/vue/chunks/UiInput.js +1 -1
  63. package/vue/chunks/UiInputGroup.js +59 -22
  64. package/vue/chunks/UiPopover.js +37 -5
  65. package/vue/chunks/UiScrollArea.js +66 -23
  66. package/vue/chunks/UiSearchResultRow.js +28 -2
  67. package/vue/chunks/UiStack.js +3 -2
  68. package/vue/chunks/UiText.js +92 -4
  69. package/vue/components.css +174 -297
  70. package/vue/editor/LoomaEditor.d.ts +11 -0
  71. package/vue/editor/index.js +262 -145
@@ -92,7 +92,7 @@
92
92
  syntax: "*";
93
93
  inherits: false;
94
94
  }
95
- [data-component~="ui-icon"][data-v-d26ad280] {
95
+ [data-component~="ui-icon"][data-v-5aa6beca] {
96
96
  /* Hooks do not inherit, so the svg reads the stroke from the root. A Looma component that
97
97
  sizes the icons it renders sets --_ui-default-icon-*, which the icon's own hooks override. */
98
98
  --_ui-icon-stroke-width: var(--ui-icon-stroke-width, var(--_ui-default-icon-stroke-width));
@@ -102,14 +102,14 @@
102
102
  inline-size: var(--ui-icon-size, var(--_ui-default-icon-size, 1em));
103
103
  block-size: var(--ui-icon-size, var(--_ui-default-icon-size, 1em));
104
104
  }
105
- svg[data-v-d26ad280] {
105
+ svg[data-v-5aa6beca] {
106
106
  inline-size: 100%;
107
107
  block-size: 100%;
108
108
  stroke-width: var(--_ui-icon-stroke-width, 2);
109
109
  }
110
110
 
111
111
  /* A component that sets its display still honours the hidden attribute on its root. */
112
- [data-component~="ui-icon"][hidden][data-v-d26ad280] {
112
+ [data-component~="ui-icon"][hidden][data-v-5aa6beca] {
113
113
  display: none;
114
114
  }
115
115
 
@@ -1178,7 +1178,7 @@ html[data-ui-input-modality="touch"]
1178
1178
 
1179
1179
  /* A surface that groups content. Its children stack with even space between them, so a card
1180
1180
  needs no layout of its own. */
1181
- [data-component~="ui-card"][data-v-6699d01e] {
1181
+ [data-component~="ui-card"][data-v-5ac43da6] {
1182
1182
  display: flex;
1183
1183
  flex-direction: column;
1184
1184
  gap: var(--ui-space-4);
@@ -1190,29 +1190,45 @@ html[data-ui-input-modality="touch"]
1190
1190
  background: var(--ui-surface-raised);
1191
1191
  color: var(--ui-text-primary);
1192
1192
  }
1193
- [data-component~="ui-card"][data-ui-card-state~="padding=sm"][data-v-6699d01e] {
1193
+ [data-component~="ui-card"][data-ui-card-state~="padding=xs"][data-v-5ac43da6] {
1194
+ gap: var(--ui-space-1);
1195
+ padding: var(--ui-space-2);
1196
+ }
1197
+ [data-component~="ui-card"][data-ui-card-state~="padding=sm"][data-v-5ac43da6] {
1194
1198
  gap: var(--ui-space-2);
1195
1199
  padding: var(--ui-space-3);
1196
1200
  }
1197
- [data-component~="ui-card"][data-ui-card-state~="padding=lg"][data-v-6699d01e] {
1201
+ [data-component~="ui-card"][data-ui-card-state~="padding=lg"][data-v-5ac43da6] {
1198
1202
  padding: var(--ui-space-6);
1199
1203
  }
1200
- [data-component~="ui-card"][data-ui-card-state~="variant=subtle"][data-v-6699d01e] {
1204
+ [data-component~="ui-card"][data-ui-card-state~="variant=subtle"][data-v-5ac43da6] {
1201
1205
  border-color: transparent;
1202
1206
  background: var(--ui-surface-muted);
1203
1207
  }
1204
- [data-component~="ui-card"][data-ui-card-state~="variant=elevated"][data-v-6699d01e] {
1208
+ [data-component~="ui-card"][data-ui-card-state~="variant=elevated"][data-v-5ac43da6] {
1205
1209
  border-color: var(--ui-border-subtle);
1206
1210
  box-shadow: var(--ui-shadow-lg);
1207
1211
  }
1208
- [data-component~="ui-card"][data-ui-card-state~="tone=danger"][data-v-6699d01e] {
1212
+ [data-component~="ui-card"][data-ui-card-state~="tone=danger"][data-v-5ac43da6] {
1209
1213
  border-color: color-mix(in srgb, var(--ui-danger) 45%, var(--ui-border-default));
1210
1214
  border-inline-start: 4px solid var(--ui-danger);
1211
1215
  background: var(--ui-danger-soft);
1212
1216
  }
1217
+ [data-component~="ui-card"][data-ui-card-state~="size=sm"][data-v-5ac43da6] {
1218
+ inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
1219
+ max-inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
1220
+ }
1221
+ [data-component~="ui-card"][data-ui-card-state~="size=md"][data-v-5ac43da6] {
1222
+ inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
1223
+ max-inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
1224
+ }
1225
+ [data-component~="ui-card"][data-ui-card-state~="size=lg"][data-v-5ac43da6] {
1226
+ inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
1227
+ max-inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
1228
+ }
1213
1229
 
1214
1230
  /* A component that sets its display still honours the hidden attribute on its root. */
1215
- [data-component~="ui-card"][hidden][data-v-6699d01e] {
1231
+ [data-component~="ui-card"][hidden][data-v-5ac43da6] {
1216
1232
  display: none;
1217
1233
  }
1218
1234
 
@@ -2316,7 +2332,7 @@ dd[data-v-7a7db3d1] {
2316
2332
  /* The controller sets each fade length from overflow and scroll position. The mask blends
2317
2333
  into whatever is behind the area without needing to know its colour. Before upgrade, its
2318
2334
  zero-length defaults leave the authored scroll area fully visible. */
2319
- [data-component~="ui-scroll-area"][data-v-1357c460] {
2335
+ [data-component~="ui-scroll-area"][data-v-97150230] {
2320
2336
  display: block;
2321
2337
  box-sizing: border-box;
2322
2338
  min-block-size: 0;
@@ -2335,20 +2351,29 @@ dd[data-v-7a7db3d1] {
2335
2351
  transparent
2336
2352
  );
2337
2353
  }
2338
- .content[data-v-1357c460] {
2354
+ .content[data-v-97150230] {
2339
2355
  display: flow-root;
2340
2356
  }
2341
- [data-component~="ui-scroll-area"][data-ui-scroll-area-state~="orientation=horizontal"][data-v-1357c460] {
2357
+ [data-component~="ui-scroll-area"][data-ui-scroll-area-state~="orientation=horizontal"][data-v-97150230] {
2342
2358
  overflow-x: auto;
2343
2359
  overflow-y: hidden;
2344
2360
  --_ui-scroll-fade-direction: var(--_ui-scroll-fade-inline);
2345
2361
  }
2346
- [data-component~="ui-scroll-area"][data-v-1357c460]:dir(rtl) {
2362
+ [data-component~="ui-scroll-area"][data-v-97150230]:dir(rtl) {
2347
2363
  --_ui-scroll-fade-inline: to left;
2348
2364
  }
2365
+ [data-component~="ui-scroll-area"][data-ui-scroll-area-state~="size=sm"][data-v-97150230] {
2366
+ max-block-size: 9.375rem;
2367
+ }
2368
+ [data-component~="ui-scroll-area"][data-ui-scroll-area-state~="size=md"][data-v-97150230] {
2369
+ max-block-size: 20rem;
2370
+ }
2371
+ [data-component~="ui-scroll-area"][data-ui-scroll-area-state~="size=lg"][data-v-97150230] {
2372
+ max-block-size: 30rem;
2373
+ }
2349
2374
 
2350
2375
  /* A component that sets its display still honours the hidden attribute on its root. */
2351
- [data-component~="ui-scroll-area"][hidden][data-v-1357c460] {
2376
+ [data-component~="ui-scroll-area"][hidden][data-v-97150230] {
2352
2377
  display: none;
2353
2378
  }
2354
2379
 
@@ -4631,7 +4656,7 @@ svg[data-v-0d1b1c7d-s] {
4631
4656
  syntax: "*";
4632
4657
  inherits: false;
4633
4658
  }
4634
- [data-component~="ui-input"][data-v-0226cb52] {
4659
+ [data-component~="ui-input"][data-v-f900b391] {
4635
4660
  box-sizing: border-box;
4636
4661
  display: inline-block;
4637
4662
  inline-size: var(--ui-input-inline-size, 100%);
@@ -4643,6 +4668,7 @@ svg[data-v-0d1b1c7d-s] {
4643
4668
  margin: 0;
4644
4669
  padding: var(--ui-space-2) var(--ui-space-3);
4645
4670
  appearance: none;
4671
+ padding-inline-start: var(--_ui-default-input-padding-inline-start, var(--ui-space-3));
4646
4672
  border: var(--ui-input-border-width, var(--_ui-default-input-border-width, 1px)) solid
4647
4673
  var(
4648
4674
  --ui-input-border,
@@ -4667,7 +4693,7 @@ svg[data-v-0d1b1c7d-s] {
4667
4693
  }
4668
4694
 
4669
4695
  /* Each size reads the hook and then an Input Group's default first, so a group, which draws the frame, can zero it. */
4670
- [data-component~="ui-input"][data-ui-input-state~="size=sm"][data-v-0226cb52] {
4696
+ [data-component~="ui-input"][data-ui-input-state~="size=sm"][data-v-f900b391] {
4671
4697
  min-block-size: var(
4672
4698
  --ui-input-min-block-size,
4673
4699
  var(--_ui-default-input-min-block-size, var(--ui-control-size-sm))
@@ -4675,7 +4701,7 @@ svg[data-v-0d1b1c7d-s] {
4675
4701
  padding: var(--ui-space-1) var(--ui-space-2);
4676
4702
  font-size: var(--ui-font-size-sm);
4677
4703
  }
4678
- [data-component~="ui-input"][data-ui-input-state~="size=lg"][data-v-0226cb52] {
4704
+ [data-component~="ui-input"][data-ui-input-state~="size=lg"][data-v-f900b391] {
4679
4705
  min-block-size: var(
4680
4706
  --ui-input-min-block-size,
4681
4707
  var(--_ui-default-input-min-block-size, var(--ui-control-size-lg))
@@ -4687,7 +4713,7 @@ svg[data-v-0d1b1c7d-s] {
4687
4713
  /* Under touch a small field is still a touch-sized target, as a small button is, and keeps
4688
4714
  body-size text: below 16px, iOS zooms the page into the focused field. */
4689
4715
  @media (pointer: coarse) {
4690
- [data-component~="ui-input"][data-ui-input-state~="size=sm"][data-v-0226cb52] {
4716
+ [data-component~="ui-input"][data-ui-input-state~="size=sm"][data-v-f900b391] {
4691
4717
  min-block-size: var(
4692
4718
  --ui-input-min-block-size,
4693
4719
  var(--_ui-default-input-min-block-size, var(--ui-control-min-block-size))
@@ -4697,21 +4723,21 @@ svg[data-v-0d1b1c7d-s] {
4697
4723
  }
4698
4724
 
4699
4725
  /* Tabbing into a field selects its text; tint that selection softly instead of the page highlight. */
4700
- [data-component~="ui-input"][data-v-0226cb52]::selection {
4726
+ [data-component~="ui-input"][data-v-f900b391]::selection {
4701
4727
  background: color-mix(in srgb, var(--ui-accent-solid) 20%, transparent);
4702
4728
  color: inherit;
4703
4729
  }
4704
- [data-component~="ui-input"][data-v-0226cb52]::placeholder {
4730
+ [data-component~="ui-input"][data-v-f900b391]::placeholder {
4705
4731
  color: var(--ui-control-placeholder, var(--ui-text-secondary));
4706
4732
  opacity: 1;
4707
4733
  }
4708
- [data-component~="ui-input"][data-v-0226cb52]:hover:not(:focus):not(:disabled):not(:read-only):not([aria-invalid="true"]):not(:is(:user-invalid, [data-user-invalid])) {
4734
+ [data-component~="ui-input"][data-v-f900b391]:hover:not(:focus):not(:disabled):not(:read-only):not([aria-invalid="true"]):not(:is(:user-invalid, [data-user-invalid])) {
4709
4735
  border-color: var(
4710
4736
  --ui-input-border-hover,
4711
4737
  var(--_ui-default-input-border-hover, var(--ui-control-border-hover, var(--ui-text-secondary)))
4712
4738
  );
4713
4739
  }
4714
- [data-component~="ui-input"][data-v-0226cb52]:focus-visible {
4740
+ [data-component~="ui-input"][data-v-f900b391]:focus-visible {
4715
4741
  border-color: var(
4716
4742
  --ui-input-focus-border,
4717
4743
  var(--_ui-default-input-focus-border, var(--ui-control-focus, var(--ui-accent-solid)))
@@ -4728,14 +4754,14 @@ svg[data-v-0d1b1c7d-s] {
4728
4754
  }
4729
4755
 
4730
4756
  /* The app's invalid flag, or the browser's own verdict once the user has left an invalid field. */
4731
- [data-component~="ui-input"][aria-invalid="true"][data-v-0226cb52],
4732
- [data-component~="ui-input"][data-v-0226cb52]:is(:user-invalid, [data-user-invalid]) {
4757
+ [data-component~="ui-input"][aria-invalid="true"][data-v-f900b391],
4758
+ [data-component~="ui-input"][data-v-f900b391]:is(:user-invalid, [data-user-invalid]) {
4733
4759
  border-color: var(
4734
4760
  --ui-input-invalid-border,
4735
4761
  var(--_ui-default-input-invalid-border, var(--ui-field-danger, var(--ui-danger-solid)))
4736
4762
  );
4737
4763
  }
4738
- [data-component~="ui-input"][data-v-0226cb52]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
4764
+ [data-component~="ui-input"][data-v-f900b391]:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible {
4739
4765
  box-shadow: var(
4740
4766
  --ui-input-invalid-focus-shadow,
4741
4767
  var(
@@ -4749,7 +4775,7 @@ svg[data-v-0d1b1c7d-s] {
4749
4775
  )
4750
4776
  );
4751
4777
  }
4752
- [data-component~="ui-input"][data-v-0226cb52]:disabled {
4778
+ [data-component~="ui-input"][data-v-f900b391]:disabled {
4753
4779
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
4754
4780
  color: var(--ui-disabled-text);
4755
4781
  box-shadow: none;
@@ -4758,7 +4784,7 @@ svg[data-v-0d1b1c7d-s] {
4758
4784
 
4759
4785
  /* Forced colors drop box shadows, so the focus ring becomes an outline. */
4760
4786
  @media (forced-colors: active) {
4761
- [data-component~="ui-input"][data-v-0226cb52]:focus-visible {
4787
+ [data-component~="ui-input"][data-v-f900b391]:focus-visible {
4762
4788
  outline: var(
4763
4789
  --ui-input-focus-outline,
4764
4790
  var(--_ui-default-input-focus-outline, 2px solid Highlight)
@@ -4771,7 +4797,7 @@ svg[data-v-0d1b1c7d-s] {
4771
4797
  * scroll vertically inside the field. Native inputs already center their single line. */
4772
4798
 
4773
4799
  /* A component that sets its display still honours the hidden attribute on its root. */
4774
- [data-component~="ui-input"][hidden][data-v-0226cb52] {
4800
+ [data-component~="ui-input"][hidden][data-v-f900b391] {
4775
4801
  display: none;
4776
4802
  }
4777
4803
 
@@ -4795,7 +4821,7 @@ svg[data-v-0d1b1c7d-s] {
4795
4821
  whole value is. The action slot takes one button at the end, inside the border, for the one
4796
4822
  thing the field is for ("Continue" after a site's address), so it reads as the field's action
4797
4823
  and not the form's. */
4798
- [data-component~="ui-input-group"][data-v-5cf4aea5] {
4824
+ [data-component~="ui-input-group"][data-v-7050a5eb] {
4799
4825
  /* The group's own border and height stand for the input's, so the group is a lone Input's height.
4800
4826
  Hooks do not inherit, so these are defaults for the input; its own hooks still win. */
4801
4827
  --_ui-default-input-border-width: 0;
@@ -4831,36 +4857,36 @@ svg[data-v-0d1b1c7d-s] {
4831
4857
  }
4832
4858
 
4833
4859
  /* The frame takes its input's size, so a small group lines up with small buttons and fields. */
4834
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(.field [data-ui-input-state~="size=sm"]) {
4860
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(.field [data-ui-input-state~="size=sm"]) {
4835
4861
  min-block-size: var(--ui-control-size-sm);
4836
4862
  }
4837
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(.field [data-ui-input-state~="size=lg"]) {
4863
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(.field [data-ui-input-state~="size=lg"]) {
4838
4864
  min-block-size: var(--ui-control-size-lg);
4839
4865
  }
4840
4866
  @media (pointer: coarse) {
4841
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(.field [data-ui-input-state~="size=sm"]) {
4867
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(.field [data-ui-input-state~="size=sm"]) {
4842
4868
  min-block-size: var(--ui-control-min-block-size);
4843
4869
  }
4844
4870
  }
4845
- [data-component~="ui-input-group"][data-v-5cf4aea5]:hover:not(:has(input:focus, input:disabled, input:read-only, [aria-invalid="true"], :is(:user-invalid, [data-user-invalid]))) {
4871
+ [data-component~="ui-input-group"][data-v-7050a5eb]:hover:not(:has(input:focus, input:disabled, input:read-only, [aria-invalid="true"], :is(:user-invalid, [data-user-invalid]))) {
4846
4872
  border-color: var(--ui-control-border-hover, var(--ui-text-secondary));
4847
4873
  }
4848
4874
 
4849
4875
  /* The ring shows when the field's input would show its own: when it is focus-visible, which a
4850
4876
  text input is for a pointer as well as a keyboard. A focused action button draws its own. */
4851
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(.field input:focus-visible) {
4877
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(.field input:focus-visible) {
4852
4878
  border-color: var(--ui-control-focus, var(--ui-accent-solid));
4853
4879
  box-shadow:
4854
4880
  var(--ui-control-inset),
4855
4881
  var(--ui-control-focus-halo-shadow);
4856
4882
  }
4857
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])) {
4883
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])) {
4858
4884
  border-color: var(
4859
4885
  --ui-input-group-invalid-border,
4860
4886
  var(--ui-field-danger, var(--ui-danger-solid))
4861
4887
  );
4862
4888
  }
4863
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(input:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible) {
4889
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(input:is([aria-invalid="true"], :is(:user-invalid, [data-user-invalid])):focus-visible) {
4864
4890
  box-shadow: var(
4865
4891
  --ui-input-group-invalid-focus-shadow,
4866
4892
  var(--ui-control-inset),
@@ -4874,23 +4900,23 @@ svg[data-v-0d1b1c7d-s] {
4874
4900
 
4875
4901
  /* Forced colors drop box shadows, so the focus ring becomes an outline. */
4876
4902
  @media (forced-colors: active) {
4877
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(input:focus-visible) {
4903
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(input:focus-visible) {
4878
4904
  outline: 2px solid Highlight;
4879
4905
  outline-offset: 1px;
4880
4906
  }
4881
4907
  }
4882
- [data-component~="ui-input-group"][data-ui-input-group-state~="disabled"][data-v-5cf4aea5],
4883
- [data-component~="ui-input-group"][data-v-5cf4aea5]:has(input:disabled) {
4908
+ [data-component~="ui-input-group"][data-ui-input-group-state~="disabled"][data-v-7050a5eb],
4909
+ [data-component~="ui-input-group"][data-v-7050a5eb]:has(input:disabled) {
4884
4910
  background: var(--ui-control-surface-disabled, var(--ui-surface-muted));
4885
4911
  box-shadow: none;
4886
4912
  cursor: not-allowed;
4887
4913
  }
4888
- .field[data-v-5cf4aea5] {
4914
+ .field[data-v-7050a5eb] {
4889
4915
  display: flex;
4890
4916
  flex: 1;
4891
4917
  min-inline-size: 0;
4892
4918
  }
4893
- .affix[data-v-5cf4aea5] {
4919
+ .affix[data-v-7050a5eb] {
4894
4920
  display: inline-flex;
4895
4921
  flex: none;
4896
4922
  align-items: center;
@@ -4902,32 +4928,41 @@ svg[data-v-0d1b1c7d-s] {
4902
4928
  }
4903
4929
 
4904
4930
  /* Fixed text is part of the value, but should not look editable. */
4905
- .affix[data-v-5cf4aea5]:has([slot="prefix"]),
4906
- .affix[data-v-5cf4aea5]:has([slot="suffix"]) {
4931
+ .affix[data-v-7050a5eb]:has([slot="prefix"]),
4932
+ .affix[data-v-7050a5eb]:has([slot="suffix"]) {
4907
4933
  background: var(--ui-surface-muted);
4908
4934
  }
4909
- .affix[data-v-5cf4aea5]:has([slot="prefix"]) {
4935
+ .affix[data-v-7050a5eb]:has([slot="prefix"]) {
4910
4936
  border-inline-end: 1px solid var(--ui-border-divider);
4911
4937
  }
4912
- .affix[data-v-5cf4aea5]:has([slot="suffix"]) {
4938
+ .affix[data-v-7050a5eb]:has([slot="suffix"]) {
4913
4939
  border-inline-start: 1px solid var(--ui-border-divider);
4914
4940
  }
4941
+ [data-component~="ui-input-group"][data-ui-input-group-state~="prefixKind=icon"][data-v-7050a5eb] {
4942
+ --_ui-default-input-padding-inline-start: var(--ui-space-2);
4943
+ }
4944
+ [data-component~="ui-input-group"][data-ui-input-group-state~="prefixKind=icon"]
4945
+ .affix[data-v-7050a5eb]:first-child {
4946
+ padding-inline-end: 0;
4947
+ border-inline-end: 0;
4948
+ background: transparent;
4949
+ }
4915
4950
 
4916
4951
  /* Centred rather than padded above and below: the group is exactly a lone Input's height, so a
4917
4952
  small button sits inside it with the difference split evenly, and the field keeps its height. */
4918
- .action[data-v-5cf4aea5] {
4953
+ .action[data-v-7050a5eb] {
4919
4954
  display: flex;
4920
4955
  flex: none;
4921
4956
  align-items: center;
4922
4957
  padding-inline: var(--ui-space-1);
4923
4958
  }
4924
- .affix[data-v-5cf4aea5]:empty,
4925
- .action[data-v-5cf4aea5]:empty {
4959
+ .affix[data-v-7050a5eb]:empty,
4960
+ .action[data-v-7050a5eb]:empty {
4926
4961
  display: none;
4927
4962
  }
4928
4963
 
4929
4964
  /* A component that sets its display still honours the hidden attribute on its root. */
4930
- [data-component~="ui-input-group"][hidden][data-v-5cf4aea5] {
4965
+ [data-component~="ui-input-group"][hidden][data-v-7050a5eb] {
4931
4966
  display: none;
4932
4967
  }
4933
4968
 
@@ -5888,7 +5923,7 @@ svg[data-v-0d1b1c7d-s] {
5888
5923
  syntax: "*";
5889
5924
  inherits: false;
5890
5925
  }
5891
- [data-component~="ui-popover"][data-v-876af604] {
5926
+ [data-component~="ui-popover"][data-v-639bc886] {
5892
5927
  --_ui-popover-surface: var(--ui-popover-surface);
5893
5928
  --_ui-popover-border: var(--ui-popover-border);
5894
5929
  --_ui-popover-radius: var(--ui-popover-radius);
@@ -5908,7 +5943,7 @@ svg[data-v-0d1b1c7d-s] {
5908
5943
  background: transparent;
5909
5944
  box-shadow: none;
5910
5945
  }
5911
- .surface[data-v-876af604] {
5946
+ .surface[data-v-639bc886] {
5912
5947
  box-sizing: border-box;
5913
5948
  max-inline-size: inherit;
5914
5949
  max-block-size: inherit;
@@ -5922,10 +5957,10 @@ svg[data-v-0d1b1c7d-s] {
5922
5957
  var(--ui-overlay-shadow, var(--ui-elevation-overlay, var(--ui-shadow-lg)))
5923
5958
  );
5924
5959
  }
5925
- [data-component~="ui-popover"][data-v-876af604]:not([data-component~="ui-popover"][data-ui-popover-state~="internalOpen"]) {
5960
+ [data-component~="ui-popover"][data-v-639bc886]:not([data-component~="ui-popover"][data-ui-popover-state~="internalOpen"]) {
5926
5961
  display: none;
5927
5962
  }
5928
- [data-component~="ui-popover"][popover][data-v-876af604] {
5963
+ [data-component~="ui-popover"][popover][data-v-639bc886] {
5929
5964
  position: fixed;
5930
5965
  inset: auto;
5931
5966
  margin: 0;
@@ -5937,21 +5972,33 @@ svg[data-v-0d1b1c7d-s] {
5937
5972
  display var(--ui-motion-fast) allow-discrete,
5938
5973
  overlay var(--ui-motion-fast) allow-discrete;
5939
5974
  }
5940
- [data-component~="ui-popover"][popover][data-v-876af604]:popover-open {
5975
+ [data-component~="ui-popover"][popover][data-v-639bc886]:popover-open {
5941
5976
  opacity: 1;
5942
5977
  transform: translateY(0) scale(1);
5943
5978
  }
5944
5979
  @starting-style {
5945
- [data-component~="ui-popover"][popover][data-v-876af604]:popover-open {
5980
+ [data-component~="ui-popover"][popover][data-v-639bc886]:popover-open {
5946
5981
  opacity: 0;
5947
5982
  transform: translateY(-4px) scale(0.99);
5948
5983
  }
5949
5984
  }
5950
- [data-component~="ui-popover"][hidden][data-v-876af604] {
5985
+ [data-component~="ui-popover"][data-ui-popover-state~="size=sm"][data-v-639bc886] {
5986
+ inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
5987
+ max-inline-size: min(22rem, calc(100vw - var(--ui-space-2) * 2));
5988
+ }
5989
+ [data-component~="ui-popover"][data-ui-popover-state~="size=md"][data-v-639bc886] {
5990
+ inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
5991
+ max-inline-size: min(28rem, calc(100vw - var(--ui-space-2) * 2));
5992
+ }
5993
+ [data-component~="ui-popover"][data-ui-popover-state~="size=lg"][data-v-639bc886] {
5994
+ inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
5995
+ max-inline-size: min(36rem, calc(100vw - var(--ui-space-2) * 2));
5996
+ }
5997
+ [data-component~="ui-popover"][hidden][data-v-639bc886] {
5951
5998
  display: none;
5952
5999
  }
5953
6000
  @media (prefers-reduced-motion: reduce) {
5954
- [data-component~="ui-popover"][popover][data-v-876af604] {
6001
+ [data-component~="ui-popover"][popover][data-v-639bc886] {
5955
6002
  transition: none;
5956
6003
  }
5957
6004
  }
@@ -6220,7 +6267,7 @@ legend[data-v-f7b72b3f] + * {
6220
6267
  syntax: "*";
6221
6268
  inherits: false;
6222
6269
  }
6223
- [data-component~="ui-search-result-row"][data-v-a9010076] {
6270
+ [data-component~="ui-search-result-row"][data-v-b1b33060] {
6224
6271
  appearance: none;
6225
6272
  inline-size: 100%;
6226
6273
  min-block-size: var(--ui-search-result-row-min-height, 56px);
@@ -6238,60 +6285,68 @@ legend[data-v-f7b72b3f] + * {
6238
6285
  text-align: left;
6239
6286
  transition: background-color var(--ui-motion-fast) var(--ui-motion-ease);
6240
6287
  }
6241
- [data-component~="ui-search-result-row"][data-v-a9010076]:hover:enabled {
6288
+ [data-component~="ui-search-result-row"][data-ui-search-result-row-state~="density=compact"][data-v-b1b33060] {
6289
+ min-block-size: var(--ui-search-result-row-min-height, 3.125rem);
6290
+ padding-block: var(--ui-search-result-row-padding-block, var(--ui-space-1));
6291
+ padding-inline: var(--ui-search-result-row-padding-inline, var(--ui-space-2));
6292
+ gap: var(--ui-search-result-row-gap, var(--ui-space-2));
6293
+ align-items: center;
6294
+ font-family: var(--ui-font-family-sans, sans-serif);
6295
+ }
6296
+ [data-component~="ui-search-result-row"][data-v-b1b33060]:hover:enabled {
6242
6297
  background: var(
6243
6298
  --ui-search-result-row-hover-surface,
6244
6299
  color-mix(in srgb, var(--ui-surface) 85%, black 3%)
6245
6300
  );
6246
6301
  }
6247
- [data-component~="ui-search-result-row"][data-ui-search-result-row-state~="selected"][data-v-a9010076] {
6302
+ [data-component~="ui-search-result-row"][data-ui-search-result-row-state~="selected"][data-v-b1b33060] {
6248
6303
  background: var(
6249
6304
  --ui-search-result-row-selected-bg,
6250
6305
  var(--ui-search-result-row-hover-surface, color-mix(in srgb, var(--ui-surface) 85%, black 3%))
6251
6306
  );
6252
6307
  }
6253
- [data-component~="ui-search-result-row"][data-v-a9010076]:focus-visible {
6308
+ [data-component~="ui-search-result-row"][data-v-b1b33060]:focus-visible {
6254
6309
  outline: 2px solid var(--ui-focus-ring);
6255
6310
  outline-offset: -2px;
6256
6311
  }
6257
- [data-component~="ui-search-result-row"][data-v-a9010076]:disabled {
6312
+ [data-component~="ui-search-result-row"][data-v-b1b33060]:disabled {
6258
6313
  background: var(--ui-disabled-surface);
6259
6314
  color: var(--ui-disabled-text);
6260
6315
  cursor: not-allowed;
6261
6316
  }
6262
- .leading[data-v-a9010076],
6263
- .trailing[data-v-a9010076] {
6317
+ .leading[data-v-b1b33060],
6318
+ .trailing[data-v-b1b33060] {
6264
6319
  display: inline-flex;
6265
6320
  align-items: flex-start;
6266
6321
  flex-shrink: 0;
6267
6322
  }
6268
- .content[data-v-a9010076] {
6323
+ .content[data-v-b1b33060] {
6269
6324
  min-inline-size: 0;
6270
6325
  flex: 1;
6271
6326
  display: flex;
6272
6327
  flex-direction: column;
6273
6328
  }
6274
- .title[data-v-a9010076],
6275
- .meta[data-v-a9010076],
6276
- .excerpt[data-v-a9010076] {
6329
+ .title[data-v-b1b33060],
6330
+ .meta[data-v-b1b33060],
6331
+ .excerpt[data-v-b1b33060] {
6277
6332
  display: block;
6278
6333
  min-inline-size: 0;
6279
6334
  }
6280
6335
 
6281
6336
  /* An unused region takes no space. */
6282
- .leading[data-v-a9010076]:empty,
6283
- .meta[data-v-a9010076]:empty,
6284
- .excerpt[data-v-a9010076]:empty,
6285
- .trailing[data-v-a9010076]:empty {
6337
+ .leading[data-v-b1b33060]:empty,
6338
+ .meta[data-v-b1b33060]:empty,
6339
+ .excerpt[data-v-b1b33060]:empty,
6340
+ .trailing[data-v-b1b33060]:empty {
6286
6341
  display: none;
6287
6342
  }
6288
- [slot="title"][data-v-a9010076-s],[slot="meta"][data-v-a9010076-s],[slot="excerpt"][data-v-a9010076-s] {
6343
+ [slot="title"][data-v-b1b33060-s],[slot="meta"][data-v-b1b33060-s],[slot="excerpt"][data-v-b1b33060-s] {
6289
6344
  display: block;
6290
6345
  margin: 0;
6291
6346
  }
6292
6347
 
6293
6348
  /* A component that sets its display still honours the hidden attribute on its root. */
6294
- [data-component~="ui-search-result-row"][hidden][data-v-a9010076] {
6349
+ [data-component~="ui-search-result-row"][hidden][data-v-b1b33060] {
6295
6350
  display: none;
6296
6351
  }
6297
6352
 
@@ -6914,7 +6969,7 @@ dialog[data-v-34344651] {
6914
6969
  syntax: "*";
6915
6970
  inherits: false;
6916
6971
  }
6917
- [data-component~="ui-stack"][data-v-c216d2df] {
6972
+ [data-component~="ui-stack"][data-v-e67d7412] {
6918
6973
  --_layout-gap: var(--ui-space-4);
6919
6974
  display: flex;
6920
6975
  flex-direction: column;
@@ -6924,42 +6979,45 @@ dialog[data-v-34344651] {
6924
6979
  max-inline-size: 100%;
6925
6980
  margin: 0;
6926
6981
  }
6927
- [data-component~="ui-stack"][data-ui-stack-state~="gap=xs"][data-v-c216d2df] {
6982
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=none"][data-v-e67d7412] {
6983
+ --_layout-gap: 0px;
6984
+ }
6985
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=xs"][data-v-e67d7412] {
6928
6986
  --_layout-gap: var(--ui-space-2);
6929
6987
  }
6930
- [data-component~="ui-stack"][data-ui-stack-state~="gap=s"][data-v-c216d2df] {
6988
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=s"][data-v-e67d7412] {
6931
6989
  --_layout-gap: var(--ui-space-3);
6932
6990
  }
6933
- [data-component~="ui-stack"][data-ui-stack-state~="gap=m"][data-v-c216d2df] {
6991
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=m"][data-v-e67d7412] {
6934
6992
  --_layout-gap: var(--ui-space-4);
6935
6993
  }
6936
- [data-component~="ui-stack"][data-ui-stack-state~="gap=l"][data-v-c216d2df] {
6994
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=l"][data-v-e67d7412] {
6937
6995
  --_layout-gap: var(--ui-space-5);
6938
6996
  }
6939
- [data-component~="ui-stack"][data-ui-stack-state~="gap=xl"][data-v-c216d2df] {
6997
+ [data-component~="ui-stack"][data-ui-stack-state~="gap=xl"][data-v-e67d7412] {
6940
6998
  --_layout-gap: var(--ui-space-6);
6941
6999
  }
6942
- [data-component~="ui-stack"][data-ui-stack-state~="align=start"][data-v-c216d2df] {
7000
+ [data-component~="ui-stack"][data-ui-stack-state~="align=start"][data-v-e67d7412] {
6943
7001
  align-items: flex-start;
6944
7002
  }
6945
- [data-component~="ui-stack"][data-ui-stack-state~="align=center"][data-v-c216d2df] {
7003
+ [data-component~="ui-stack"][data-ui-stack-state~="align=center"][data-v-e67d7412] {
6946
7004
  align-items: center;
6947
7005
  }
6948
- [data-component~="ui-stack"][data-ui-stack-state~="align=end"][data-v-c216d2df] {
7006
+ [data-component~="ui-stack"][data-ui-stack-state~="align=end"][data-v-e67d7412] {
6949
7007
  align-items: flex-end;
6950
7008
  }
6951
- [data-component~="ui-stack"][data-ui-stack-state~="justify=center"][data-v-c216d2df] {
7009
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=center"][data-v-e67d7412] {
6952
7010
  justify-content: center;
6953
7011
  }
6954
- [data-component~="ui-stack"][data-ui-stack-state~="justify=end"][data-v-c216d2df] {
7012
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=end"][data-v-e67d7412] {
6955
7013
  justify-content: flex-end;
6956
7014
  }
6957
- [data-component~="ui-stack"][data-ui-stack-state~="justify=between"][data-v-c216d2df] {
7015
+ [data-component~="ui-stack"][data-ui-stack-state~="justify=between"][data-v-e67d7412] {
6958
7016
  justify-content: space-between;
6959
7017
  }
6960
7018
 
6961
7019
  /* A component that sets its display still honours the hidden attribute on its root. */
6962
- [data-component~="ui-stack"][hidden][data-v-c216d2df] {
7020
+ [data-component~="ui-stack"][hidden][data-v-e67d7412] {
6963
7021
  display: none;
6964
7022
  }
6965
7023
 
@@ -7501,7 +7559,7 @@ tbody tr[data-v-dfbf191c-s]:last-child > * {
7501
7559
  /* Running text, set on the type scale and in a tone that says what it is, so a view never styles
7502
7560
  text of its own. The root is a paragraph unless as= names a span, div, small, strong, label, or
7503
7561
  heading. */
7504
- [data-component~="ui-text"][data-v-6dc4d971] {
7562
+ [data-component~="ui-text"][data-v-09b7a2ed] {
7505
7563
  margin: 0;
7506
7564
  min-inline-size: 0;
7507
7565
  color: var(--ui-text-primary);
@@ -7510,87 +7568,93 @@ tbody tr[data-v-dfbf191c-s]:last-child > * {
7510
7568
 
7511
7569
  /* A heading drops the browser's heading size and weight, so size and weight set it as they set
7512
7570
  any text, and inherit keeps the text around it. */
7513
- [data-component~="ui-text"][data-v-6dc4d971]:is(h2, h3, h4, h5, h6) {
7571
+ [data-component~="ui-text"][data-v-09b7a2ed]:is(h2, h3, h4, h5, h6) {
7514
7572
  font-size: inherit;
7515
7573
  font-weight: inherit;
7516
7574
  }
7517
- [data-component~="ui-text"][data-ui-text-state~="size=xs"][data-v-6dc4d971] {
7575
+ [data-component~="ui-text"][data-ui-text-state~="size=xs"][data-v-09b7a2ed] {
7518
7576
  font-size: var(--ui-font-size-xs);
7519
7577
  line-height: var(--ui-line-height);
7520
7578
  }
7521
- [data-component~="ui-text"][data-ui-text-state~="size=sm"][data-v-6dc4d971] {
7579
+ [data-component~="ui-text"][data-ui-text-state~="size=sm"][data-v-09b7a2ed] {
7522
7580
  font-size: var(--ui-font-size-sm);
7523
7581
  line-height: var(--ui-line-height);
7524
7582
  }
7525
- [data-component~="ui-text"][data-ui-text-state~="size=md"][data-v-6dc4d971] {
7583
+ [data-component~="ui-text"][data-ui-text-state~="size=md"][data-v-09b7a2ed] {
7526
7584
  font-size: var(--ui-font-size-md);
7527
7585
  line-height: var(--ui-line-height);
7528
7586
  }
7529
- [data-component~="ui-text"][data-ui-text-state~="size=lg"][data-v-6dc4d971] {
7587
+ [data-component~="ui-text"][data-ui-text-state~="size=lg"][data-v-09b7a2ed] {
7530
7588
  font-size: var(--ui-font-size-lg);
7531
7589
  line-height: var(--ui-line-height-relaxed);
7532
7590
  }
7533
- [data-component~="ui-text"][data-ui-text-state~="tone=secondary"][data-v-6dc4d971] {
7591
+ [data-component~="ui-text"][data-ui-text-state~="tone=secondary"][data-v-09b7a2ed] {
7534
7592
  color: var(--ui-text-secondary);
7535
7593
  }
7536
- [data-component~="ui-text"][data-ui-text-state~="tone=muted"][data-v-6dc4d971] {
7594
+ [data-component~="ui-text"][data-ui-text-state~="tone=muted"][data-v-09b7a2ed] {
7537
7595
  color: var(--ui-text-muted);
7538
7596
  }
7539
- [data-component~="ui-text"][data-ui-text-state~="tone=accent"][data-v-6dc4d971] {
7597
+ [data-component~="ui-text"][data-ui-text-state~="tone=accent"][data-v-09b7a2ed] {
7540
7598
  color: var(--ui-accent-active);
7541
7599
  }
7542
7600
  /* Every status tone uses the text-safe token a subtle badge sets its words in, so text and badges
7543
7601
  in one tone match, and each holds 4.5:1 on sunken surfaces where some base colours fall short. */
7544
- [data-component~="ui-text"][data-ui-text-state~="tone=danger"][data-v-6dc4d971] {
7602
+ [data-component~="ui-text"][data-ui-text-state~="tone=danger"][data-v-09b7a2ed] {
7545
7603
  color: var(--ui-danger-subtle-text);
7546
7604
  }
7547
- [data-component~="ui-text"][data-ui-text-state~="tone=success"][data-v-6dc4d971] {
7605
+ [data-component~="ui-text"][data-ui-text-state~="tone=success"][data-v-09b7a2ed] {
7548
7606
  color: var(--ui-success-subtle-text);
7549
7607
  }
7550
- [data-component~="ui-text"][data-ui-text-state~="tone=info"][data-v-6dc4d971] {
7608
+ [data-component~="ui-text"][data-ui-text-state~="tone=info"][data-v-09b7a2ed] {
7551
7609
  color: var(--ui-info-subtle-text);
7552
7610
  }
7553
- [data-component~="ui-text"][data-ui-text-state~="tone=warning"][data-v-6dc4d971] {
7611
+ [data-component~="ui-text"][data-ui-text-state~="tone=warning"][data-v-09b7a2ed] {
7554
7612
  color: var(--ui-warning-subtle-text);
7555
7613
  }
7556
- [data-component~="ui-text"][data-ui-text-state~="weight=normal"][data-v-6dc4d971] {
7614
+ [data-component~="ui-text"][data-ui-text-state~="weight=normal"][data-v-09b7a2ed] {
7557
7615
  font-weight: var(--ui-font-normal);
7558
7616
  }
7559
- [data-component~="ui-text"][data-ui-text-state~="weight=medium"][data-v-6dc4d971] {
7617
+ [data-component~="ui-text"][data-ui-text-state~="weight=medium"][data-v-09b7a2ed] {
7560
7618
  font-weight: var(--ui-font-medium);
7561
7619
  }
7562
- [data-component~="ui-text"][data-ui-text-state~="weight=semibold"][data-v-6dc4d971] {
7620
+ [data-component~="ui-text"][data-ui-text-state~="weight=semibold"][data-v-09b7a2ed] {
7563
7621
  font-weight: var(--ui-font-semibold);
7564
7622
  }
7565
- [data-component~="ui-text"][data-ui-text-state~="variant=eyebrow"][data-v-6dc4d971] {
7623
+ [data-component~="ui-text"][data-ui-text-state~="variant=eyebrow"][data-v-09b7a2ed] {
7566
7624
  font-size: var(--ui-font-size-xs);
7567
7625
  font-weight: var(--ui-font-semibold);
7568
7626
  letter-spacing: 0.06em;
7569
7627
  text-transform: uppercase;
7570
7628
  }
7571
- [data-component~="ui-text"][data-ui-text-state~="variant=code"][data-v-6dc4d971] {
7629
+ [data-component~="ui-text"][data-ui-text-state~="variant=code"][data-v-09b7a2ed] {
7572
7630
  font-family: var(--ui-font-family-mono);
7573
7631
  }
7574
7632
 
7575
7633
  /* A link in running text is underlined, so it stands apart from the words around it by more than
7576
7634
  colour. */
7577
- [data-component~="ui-text"] a[data-v-6dc4d971-s] {
7635
+ [data-component~="ui-text"] a[data-v-09b7a2ed-s] {
7578
7636
  color: var(--ui-accent-active);
7579
7637
  text-decoration: underline;
7580
7638
  text-decoration-thickness: 0.06em;
7581
7639
  text-underline-offset: 0.18em;
7582
7640
  }
7583
- [data-component~="ui-text"][data-ui-text-state~="truncate"][data-v-6dc4d971] {
7641
+ [data-component~="ui-text"][data-ui-text-state~="truncate"][data-v-09b7a2ed] {
7584
7642
  overflow: hidden;
7585
7643
  text-overflow: ellipsis;
7586
7644
  white-space: nowrap;
7587
7645
  }
7588
- [data-component~="ui-text"][data-ui-text-state~="align=center"][data-v-6dc4d971] {
7646
+ [data-component~="ui-text"][data-ui-text-state~="align=center"][data-v-09b7a2ed] {
7589
7647
  text-align: center;
7590
7648
  }
7649
+ [data-component~="ui-text"][data-ui-text-state~="font=sans"][data-v-09b7a2ed] {
7650
+ font-family: var(--ui-font-family-sans, sans-serif);
7651
+ }
7652
+ [data-component~="ui-text"][data-ui-text-state~="wrap=anywhere"][data-v-09b7a2ed] {
7653
+ overflow-wrap: anywhere;
7654
+ }
7591
7655
 
7592
7656
  /* A component that sets its display still honours the hidden attribute on its root. */
7593
- [data-component~="ui-text"][hidden][data-v-6dc4d971] {
7657
+ [data-component~="ui-text"][hidden][data-v-09b7a2ed] {
7594
7658
  display: none;
7595
7659
  }
7596
7660
 
@@ -9029,7 +9093,6 @@ html[data-ui-input-modality="touch"]
9029
9093
  }
9030
9094
 
9031
9095
  .looma-editor__table-picker-popover,
9032
- .looma-editor__link-popover,
9033
9096
  .looma-editor__chip-popover,
9034
9097
  .looma-editor__table-toolbar-shell,
9035
9098
  .looma-editor__table-menu-shell {
@@ -9043,10 +9106,6 @@ html[data-ui-input-modality="touch"]
9043
9106
  background: transparent;
9044
9107
  }
9045
9108
 
9046
- .looma-editor__link-popover {
9047
- inline-size: min(22rem, calc(100vw - 2rem));
9048
- }
9049
-
9050
9109
  /* The floating toolbar supplies the surface; the containing popover only
9051
9110
  positions it beside the app-owned trigger. */
9052
9111
  .looma-editor__formatting-popover {
@@ -9056,72 +9115,6 @@ html[data-ui-input-modality="touch"]
9056
9115
  --ui-popover-shadow: none;
9057
9116
  }
9058
9117
 
9059
- .looma-editor__link-context {
9060
- box-sizing: border-box;
9061
- max-width: min(24rem, calc(100vw - 1.5rem));
9062
- padding: var(--ui-editor-toolbar-floating-padding, 4px);
9063
- border: 1px solid var(--ui-editor-toolbar-border, var(--ui-border-strong));
9064
- border-radius: var(--ui-editor-toolbar-floating-radius, var(--ui-radius-lg));
9065
- background: var(--ui-editor-toolbar-surface, var(--ui-surface));
9066
- box-shadow: var(--ui-editor-toolbar-floating-shadow, var(--ui-shadow-lg, 0 10px 24px rgb(0 0 0 / 0.12)));
9067
- color: var(--ui-text-primary);
9068
- font-family: var(--ui-font-family-sans, sans-serif);
9069
- }
9070
-
9071
- .looma-editor__link-context-actions {
9072
- display: flex;
9073
- flex-wrap: wrap;
9074
- align-items: center;
9075
- gap: var(--ui-space-1);
9076
- }
9077
-
9078
- .looma-editor__link-context-url {
9079
- min-width: 0;
9080
- flex: 1 1 100%;
9081
- padding-inline: var(--ui-space-2);
9082
- color: var(--ui-text-secondary);
9083
- overflow-wrap: anywhere;
9084
- font-size: var(--ui-font-size-sm);
9085
- }
9086
-
9087
- .looma-editor__link-context-url :is(strong, small) {
9088
- display: block;
9089
- }
9090
-
9091
- .looma-editor__link-context-url strong {
9092
- color: var(--ui-text-primary);
9093
- }
9094
-
9095
- .looma-editor__link-context-actions :is(button, a) {
9096
- display: inline-flex;
9097
- flex: 0 0 auto;
9098
- align-items: center;
9099
- min-height: var(--ui-control-min-block-size);
9100
- padding: 0 var(--ui-space-2);
9101
- border: 0;
9102
- border-radius: var(--ui-radius-sm);
9103
- background: transparent;
9104
- color: var(--ui-text-primary);
9105
- font: inherit;
9106
- font-size: var(--ui-font-size-sm);
9107
- text-decoration: none;
9108
- cursor: pointer;
9109
- }
9110
-
9111
- .looma-editor__link-context-actions :is(button, a):is(:hover, :focus-visible) {
9112
- background: var(--ui-surface-subtle);
9113
- }
9114
-
9115
- .looma-editor__link-context-actions :is(button, a):focus-visible {
9116
- outline: 2px solid var(--ui-focus-ring);
9117
- outline-offset: 2px;
9118
- }
9119
-
9120
- .looma-editor__link-context--editing {
9121
- width: min(22rem, calc(100vw - 1.5rem));
9122
- padding: var(--ui-space-3);
9123
- }
9124
-
9125
9118
  .looma-editor__chip-popover {
9126
9119
  inline-size: min(15rem, calc(100vw - 2rem));
9127
9120
  }
@@ -9171,122 +9164,6 @@ html[data-ui-input-modality="touch"]
9171
9164
  outline-offset: 2px;
9172
9165
  }
9173
9166
 
9174
- .looma-editor__link-form,
9175
- .looma-editor__link-form label {
9176
- display: flex;
9177
- flex-direction: column;
9178
- gap: var(--ui-space-2);
9179
- }
9180
-
9181
- .looma-editor__link-form label {
9182
- font-size: var(--ui-font-size-sm);
9183
- }
9184
-
9185
- .looma-editor__link-form input:not([type="checkbox"]) {
9186
- box-sizing: border-box;
9187
- width: 100%;
9188
- min-height: var(--ui-control-min-block-size);
9189
- padding: var(--ui-space-2);
9190
- border: 1px solid var(--ui-control-border);
9191
- border-radius: var(--ui-field-radius, var(--ui-radius-md));
9192
- background: var(--ui-control-surface);
9193
- color: var(--ui-text-primary);
9194
- font: inherit;
9195
- }
9196
-
9197
- .looma-editor__link-form input:focus-visible,
9198
- .looma-editor__link-form button:focus-visible,
9199
- .looma-editor__link-preview:focus-visible {
9200
- outline: 2px solid var(--ui-focus-ring);
9201
- outline-offset: 2px;
9202
- }
9203
-
9204
- .looma-editor__link-form .looma-editor__link-new-tab {
9205
- flex-direction: row;
9206
- align-items: center;
9207
- }
9208
-
9209
- .looma-editor__link-modes {
9210
- display: flex;
9211
- gap: var(--ui-space-1);
9212
- }
9213
-
9214
- .looma-editor__link-modes button,
9215
- .looma-editor__link-results button {
9216
- min-height: var(--ui-control-min-block-size);
9217
- padding: var(--ui-space-2);
9218
- border: 1px solid var(--ui-control-border);
9219
- border-radius: var(--ui-field-radius, var(--ui-radius-md));
9220
- background: var(--ui-control-surface);
9221
- color: var(--ui-text-primary);
9222
- font: inherit;
9223
- text-align: left;
9224
- cursor: pointer;
9225
- }
9226
-
9227
- .looma-editor__link-modes button[aria-pressed="true"] {
9228
- border-color: var(--ui-accent);
9229
- color: var(--ui-accent);
9230
- }
9231
-
9232
- .looma-editor__link-results {
9233
- display: flex;
9234
- flex-direction: column;
9235
- gap: var(--ui-space-1);
9236
- max-height: 15rem;
9237
- overflow-y: auto;
9238
- }
9239
-
9240
- .looma-editor__link-results p {
9241
- margin: 0;
9242
- color: var(--ui-text-secondary);
9243
- font-size: var(--ui-font-size-sm);
9244
- }
9245
-
9246
- .looma-editor__link-results button {
9247
- display: flex;
9248
- flex-direction: column;
9249
- width: 100%;
9250
- }
9251
-
9252
- .looma-editor__link-results button:is(:hover, :focus-visible) {
9253
- background: var(--ui-surface-subtle);
9254
- }
9255
-
9256
- .looma-editor__link-results button small {
9257
- color: var(--ui-text-secondary);
9258
- }
9259
-
9260
- .looma-editor__link-error {
9261
- margin: 0;
9262
- color: var(--ui-field-danger, var(--ui-danger));
9263
- font-size: var(--ui-font-size-sm);
9264
- }
9265
-
9266
- .looma-editor__link-preview {
9267
- width: fit-content;
9268
- color: var(--ui-accent);
9269
- font-size: var(--ui-font-size-sm);
9270
- }
9271
-
9272
- .looma-editor__link-actions {
9273
- display: flex;
9274
- flex-wrap: wrap;
9275
- justify-content: flex-end;
9276
- gap: var(--ui-space-2);
9277
- }
9278
-
9279
- .looma-editor__link-actions button {
9280
- min-height: var(--ui-control-min-block-size);
9281
- padding: var(--ui-space-2) var(--ui-space-3);
9282
- border: 1px solid var(--ui-control-border);
9283
- border-radius: var(--ui-action-radius, var(--ui-radius-md));
9284
- background: var(--ui-surface);
9285
- color: var(--ui-text-primary);
9286
- font: inherit;
9287
- cursor: pointer;
9288
- }
9289
-
9290
9167
  .looma-editor__table-toolbar-shell,
9291
9168
  .looma-editor__table-menu-shell,
9292
9169
  .looma-editor__table-overlay-shell {