@runtypelabs/persona 4.19.0 → 4.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/dist/approval-ui.d.cts +77 -5
  2. package/dist/approval-ui.d.ts +77 -5
  3. package/dist/artifacts-ui.d.cts +77 -5
  4. package/dist/artifacts-ui.d.ts +77 -5
  5. package/dist/codegen.cjs +1 -1
  6. package/dist/codegen.js +1 -1
  7. package/dist/context-mentions.d.cts +77 -5
  8. package/dist/context-mentions.d.ts +77 -5
  9. package/dist/event-stream-view.d.cts +77 -5
  10. package/dist/event-stream-view.d.ts +77 -5
  11. package/dist/forms-ui.d.cts +77 -5
  12. package/dist/forms-ui.d.ts +77 -5
  13. package/dist/index.cjs +50 -50
  14. package/dist/index.cjs.map +1 -1
  15. package/dist/index.d.cts +78 -6
  16. package/dist/index.d.ts +78 -6
  17. package/dist/index.global.js +31 -31
  18. package/dist/index.global.js.map +1 -1
  19. package/dist/index.js +50 -50
  20. package/dist/index.js.map +1 -1
  21. package/dist/launcher.global.js.map +1 -1
  22. package/dist/session-reconnect.d.cts +77 -5
  23. package/dist/session-reconnect.d.ts +77 -5
  24. package/dist/smart-dom-reader.d.cts +77 -5
  25. package/dist/smart-dom-reader.d.ts +77 -5
  26. package/dist/theme-editor-preview.cjs +49 -49
  27. package/dist/theme-editor-preview.d.cts +77 -5
  28. package/dist/theme-editor-preview.d.ts +77 -5
  29. package/dist/theme-editor-preview.js +28 -28
  30. package/dist/theme-editor.d.cts +77 -5
  31. package/dist/theme-editor.d.ts +77 -5
  32. package/dist/theme-reference.cjs +1 -1
  33. package/dist/theme-reference.d.cts +46 -5
  34. package/dist/theme-reference.d.ts +46 -5
  35. package/dist/theme-reference.js +1 -1
  36. package/dist/widget.css +1 -1
  37. package/package.json +1 -1
  38. package/src/components/composer-actions.ts +27 -1
  39. package/src/components/composer-model-picker.ts +4 -14
  40. package/src/components/composer-overflow-menu.ts +14 -0
  41. package/src/components/composer-parts.ts +20 -0
  42. package/src/index-core.ts +2 -0
  43. package/src/styles/widget-styles.test.ts +83 -1
  44. package/src/styles/widget.css +50 -14
  45. package/src/theme-reference.ts +1 -1
  46. package/src/types/theme.ts +47 -5
  47. package/src/types.ts +33 -0
  48. package/src/ui.composer-action-visibility.test.ts +202 -0
  49. package/src/ui.composer-models.test.ts +37 -0
  50. package/src/ui.composer-modes.test.ts +82 -0
  51. package/src/ui.composer-overflow.test.ts +78 -0
  52. package/src/utils/__snapshots__/tokens-parity.test.ts.snap +1633 -686
  53. package/src/utils/composer-modes.test.ts +33 -0
  54. package/src/utils/composer-modes.ts +19 -2
  55. package/src/utils/tokens-parity.test.ts +20 -0
  56. package/src/utils/tokens.test.ts +76 -0
  57. package/src/utils/tokens.ts +4 -4
@@ -1224,27 +1224,66 @@ interface ComposerSegmentedTokens {
1224
1224
  itemPadding?: string;
1225
1225
  }
1226
1226
  /**
1227
- * Model picker popover (`composer.modelPicker.presentation: "popover"`).
1227
+ * Model picker chrome (`composer.models`).
1228
+ *
1229
+ * The surface keys (`background`, `hoverBackground`, `borderColor`,
1230
+ * `borderRadius`, `labelColor`) style the CLOSED control, so the native
1231
+ * `<select>` and the `presentation: "popover"` trigger share one vocabulary.
1232
+ * The `menu*`, `rowHoverBackground`, and `descriptionColor` keys style the
1233
+ * popover panel and are inert under the native select, as is `suffixColor`,
1234
+ * which a `<select>` cannot carry either.
1228
1235
  *
1229
1236
  * Every key is optional and unset ones emit nothing: the stylesheet's `var()`
1230
1237
  * fallbacks own the default look, which derives from the surface and ghost
1231
- * button tokens. Inert under the native `<select>` presentation, except
1232
- * `suffixColor`, which the native control cannot carry either.
1238
+ * button tokens.
1233
1239
  */
1234
1240
  interface ComposerModelPickerTokens {
1241
+ /** Closed control fill. @default the ghost button fill (transparent) */
1242
+ background?: TokenReference<'color'>;
1243
+ /** Closed control fill under hover. @default the ghost hover wash */
1244
+ hoverBackground?: TokenReference<'color'>;
1245
+ /**
1246
+ * Closed control outline, drawn as a 1px inset ring so setting it never
1247
+ * resizes the control. @default none
1248
+ */
1249
+ borderColor?: TokenReference<'color'>;
1250
+ /** Closed control corner radius. @default the ghost button radius */
1251
+ borderRadius?: TokenReference<'radius'>;
1235
1252
  /** Panel fill behind the rows. @default semantic.colors.surface */
1236
1253
  menuBackground?: TokenReference<'color'>;
1237
1254
  /** Panel corner radius. @default palette.radius.lg */
1238
1255
  menuBorderRadius?: TokenReference<'radius'>;
1239
1256
  /** Row fill under hover and the focused option. @default the ghost hover wash */
1240
1257
  rowHoverBackground?: TokenReference<'color'>;
1241
- /** Row label and closed-control label color. @default inherited text */
1258
+ /**
1259
+ * Row label color, plus the closed control's text and chevron in both
1260
+ * presentations. @default the ghost button foreground
1261
+ */
1242
1262
  labelColor?: TokenReference<'color'>;
1243
1263
  /** Second line under a row label. @default semantic.colors.textMuted */
1244
1264
  descriptionColor?: TokenReference<'color'>;
1245
1265
  /** `composer.modelPicker.suffix` on the closed control. @default semantic.colors.textMuted */
1246
1266
  suffixColor?: TokenReference<'color'>;
1247
1267
  }
1268
+ /**
1269
+ * Composer overflow `+` menu panel (`composer.actionOverflow`).
1270
+ *
1271
+ * Every key is optional and unset ones emit nothing: the stylesheet's `var()`
1272
+ * fallbacks own the default look. The panel is portaled outside the themed
1273
+ * mount, so the menu forwards the configured values onto it when it opens.
1274
+ */
1275
+ interface ComposerOverflowMenuTokens {
1276
+ /** Panel fill behind the rows. @default semantic.colors.surface */
1277
+ background?: TokenReference<'color'>;
1278
+ /** Panel border color. @default semantic.colors.border */
1279
+ borderColor?: TokenReference<'color'>;
1280
+ /** Panel corner radius. @default palette.radius.lg */
1281
+ borderRadius?: TokenReference<'radius'>;
1282
+ /** Row text and glyph color. @default semantic.colors.text */
1283
+ foreground?: TokenReference<'color'>;
1284
+ /** Panel elevation (raw CSS box-shadow, `none` allowed). @default palette.shadows.md */
1285
+ shadow?: string;
1286
+ }
1248
1287
  /** Composer (message input) chrome. */
1249
1288
  interface ComposerChromeTokens {
1250
1289
  /** Box-shadow on the composer form (raw CSS, e.g. `none`). */
@@ -1279,8 +1318,10 @@ interface ComposerChromeTokens {
1279
1318
  overlayBand?: string;
1280
1319
  /** Segmented mode-group track. */
1281
1320
  segmented?: ComposerSegmentedTokens;
1282
- /** Model picker popover chrome. */
1321
+ /** Model picker chrome (closed control plus popover panel). */
1283
1322
  modelPicker?: ComposerModelPickerTokens;
1323
+ /** Overflow `+` menu panel chrome. */
1324
+ overflowMenu?: ComposerOverflowMenuTokens;
1284
1325
  }
1285
1326
  /**
1286
1327
  * Motion timing shared by every composer animation.
@@ -5829,6 +5870,15 @@ type ComposerActionPlacement = "start" | "end";
5829
5870
  * it, `"overflow"` and `"auto"` both render in the bar.
5830
5871
  */
5831
5872
  type ComposerActionPresentation = "bar" | "overflow" | "auto";
5873
+ /**
5874
+ * When a composer action is mounted, as a function of the draft.
5875
+ *
5876
+ * - `"always"` (default): the control is always mounted.
5877
+ * - `"when-empty"`: hidden as soon as the draft holds text or an attachment,
5878
+ * and while a response streams.
5879
+ * - `"when-text"`: the inverse, on the same draft state the send control reads.
5880
+ */
5881
+ type ComposerActionVisibility = "always" | "when-empty" | "when-text";
5832
5882
  /**
5833
5883
  * Fields shared by every composer action.
5834
5884
  *
@@ -5844,6 +5894,13 @@ type ComposerActionBase = {
5844
5894
  presentation?: ComposerActionPresentation;
5845
5895
  order?: number;
5846
5896
  visible?: boolean | ((state: Readonly<ComposerState>) => boolean);
5897
+ /**
5898
+ * Draft-driven visibility, on the same state `sendButton.visibility` reads.
5899
+ * Hidden removes the control from layout and tab order. Combined with
5900
+ * `visible`: both must pass.
5901
+ * @default "always"
5902
+ */
5903
+ visibility?: ComposerActionVisibility;
5847
5904
  disabled?: boolean | ((state: Readonly<ComposerState>) => boolean);
5848
5905
  /** Disable while a response streams, through the composer's own mechanism. */
5849
5906
  disableWhenStreaming?: boolean;
@@ -5990,6 +6047,15 @@ type ComposerMode = {
5990
6047
  * row, never in the overflow menu.
5991
6048
  */
5992
6049
  type ComposerModeGroupPresentation = "buttons" | "segmented";
6050
+ /**
6051
+ * Whether a group's active modes also render as removable chips.
6052
+ *
6053
+ * - `"auto"` (default): one chip per active mode, except under `"segmented"`
6054
+ * presentation, where the track already shows the state.
6055
+ * - `"hidden"`: no chips for this group under any presentation. The pressed bar
6056
+ * button carries the state, and deselection stays on the button.
6057
+ */
6058
+ type ComposerModeChipVisibility = "auto" | "hidden";
5993
6059
  /**
5994
6060
  * Selection policy for a set of modes. `"single"` deselects siblings when one
5995
6061
  * is chosen; `"multiple"` toggles independently.
@@ -5999,6 +6065,12 @@ type ComposerModeGroup = {
5999
6065
  selection: "single" | "multiple";
6000
6066
  /** @default "buttons" */
6001
6067
  presentation?: ComposerModeGroupPresentation;
6068
+ /**
6069
+ * Chip row policy for this group's active modes. The chip row itself is
6070
+ * derived from its children, so a group with no other chips leaves no gap.
6071
+ * @default "auto"
6072
+ */
6073
+ chipVisibility?: ComposerModeChipVisibility;
6002
6074
  /**
6003
6075
  * Accessible name for a segmented track. With it the track is a labelled
6004
6076
  * `role="group"`; without it the segments stand on their own names.
@@ -1224,27 +1224,66 @@ interface ComposerSegmentedTokens {
1224
1224
  itemPadding?: string;
1225
1225
  }
1226
1226
  /**
1227
- * Model picker popover (`composer.modelPicker.presentation: "popover"`).
1227
+ * Model picker chrome (`composer.models`).
1228
+ *
1229
+ * The surface keys (`background`, `hoverBackground`, `borderColor`,
1230
+ * `borderRadius`, `labelColor`) style the CLOSED control, so the native
1231
+ * `<select>` and the `presentation: "popover"` trigger share one vocabulary.
1232
+ * The `menu*`, `rowHoverBackground`, and `descriptionColor` keys style the
1233
+ * popover panel and are inert under the native select, as is `suffixColor`,
1234
+ * which a `<select>` cannot carry either.
1228
1235
  *
1229
1236
  * Every key is optional and unset ones emit nothing: the stylesheet's `var()`
1230
1237
  * fallbacks own the default look, which derives from the surface and ghost
1231
- * button tokens. Inert under the native `<select>` presentation, except
1232
- * `suffixColor`, which the native control cannot carry either.
1238
+ * button tokens.
1233
1239
  */
1234
1240
  interface ComposerModelPickerTokens {
1241
+ /** Closed control fill. @default the ghost button fill (transparent) */
1242
+ background?: TokenReference<'color'>;
1243
+ /** Closed control fill under hover. @default the ghost hover wash */
1244
+ hoverBackground?: TokenReference<'color'>;
1245
+ /**
1246
+ * Closed control outline, drawn as a 1px inset ring so setting it never
1247
+ * resizes the control. @default none
1248
+ */
1249
+ borderColor?: TokenReference<'color'>;
1250
+ /** Closed control corner radius. @default the ghost button radius */
1251
+ borderRadius?: TokenReference<'radius'>;
1235
1252
  /** Panel fill behind the rows. @default semantic.colors.surface */
1236
1253
  menuBackground?: TokenReference<'color'>;
1237
1254
  /** Panel corner radius. @default palette.radius.lg */
1238
1255
  menuBorderRadius?: TokenReference<'radius'>;
1239
1256
  /** Row fill under hover and the focused option. @default the ghost hover wash */
1240
1257
  rowHoverBackground?: TokenReference<'color'>;
1241
- /** Row label and closed-control label color. @default inherited text */
1258
+ /**
1259
+ * Row label color, plus the closed control's text and chevron in both
1260
+ * presentations. @default the ghost button foreground
1261
+ */
1242
1262
  labelColor?: TokenReference<'color'>;
1243
1263
  /** Second line under a row label. @default semantic.colors.textMuted */
1244
1264
  descriptionColor?: TokenReference<'color'>;
1245
1265
  /** `composer.modelPicker.suffix` on the closed control. @default semantic.colors.textMuted */
1246
1266
  suffixColor?: TokenReference<'color'>;
1247
1267
  }
1268
+ /**
1269
+ * Composer overflow `+` menu panel (`composer.actionOverflow`).
1270
+ *
1271
+ * Every key is optional and unset ones emit nothing: the stylesheet's `var()`
1272
+ * fallbacks own the default look. The panel is portaled outside the themed
1273
+ * mount, so the menu forwards the configured values onto it when it opens.
1274
+ */
1275
+ interface ComposerOverflowMenuTokens {
1276
+ /** Panel fill behind the rows. @default semantic.colors.surface */
1277
+ background?: TokenReference<'color'>;
1278
+ /** Panel border color. @default semantic.colors.border */
1279
+ borderColor?: TokenReference<'color'>;
1280
+ /** Panel corner radius. @default palette.radius.lg */
1281
+ borderRadius?: TokenReference<'radius'>;
1282
+ /** Row text and glyph color. @default semantic.colors.text */
1283
+ foreground?: TokenReference<'color'>;
1284
+ /** Panel elevation (raw CSS box-shadow, `none` allowed). @default palette.shadows.md */
1285
+ shadow?: string;
1286
+ }
1248
1287
  /** Composer (message input) chrome. */
1249
1288
  interface ComposerChromeTokens {
1250
1289
  /** Box-shadow on the composer form (raw CSS, e.g. `none`). */
@@ -1279,8 +1318,10 @@ interface ComposerChromeTokens {
1279
1318
  overlayBand?: string;
1280
1319
  /** Segmented mode-group track. */
1281
1320
  segmented?: ComposerSegmentedTokens;
1282
- /** Model picker popover chrome. */
1321
+ /** Model picker chrome (closed control plus popover panel). */
1283
1322
  modelPicker?: ComposerModelPickerTokens;
1323
+ /** Overflow `+` menu panel chrome. */
1324
+ overflowMenu?: ComposerOverflowMenuTokens;
1284
1325
  }
1285
1326
  /**
1286
1327
  * Motion timing shared by every composer animation.
@@ -5829,6 +5870,15 @@ type ComposerActionPlacement = "start" | "end";
5829
5870
  * it, `"overflow"` and `"auto"` both render in the bar.
5830
5871
  */
5831
5872
  type ComposerActionPresentation = "bar" | "overflow" | "auto";
5873
+ /**
5874
+ * When a composer action is mounted, as a function of the draft.
5875
+ *
5876
+ * - `"always"` (default): the control is always mounted.
5877
+ * - `"when-empty"`: hidden as soon as the draft holds text or an attachment,
5878
+ * and while a response streams.
5879
+ * - `"when-text"`: the inverse, on the same draft state the send control reads.
5880
+ */
5881
+ type ComposerActionVisibility = "always" | "when-empty" | "when-text";
5832
5882
  /**
5833
5883
  * Fields shared by every composer action.
5834
5884
  *
@@ -5844,6 +5894,13 @@ type ComposerActionBase = {
5844
5894
  presentation?: ComposerActionPresentation;
5845
5895
  order?: number;
5846
5896
  visible?: boolean | ((state: Readonly<ComposerState>) => boolean);
5897
+ /**
5898
+ * Draft-driven visibility, on the same state `sendButton.visibility` reads.
5899
+ * Hidden removes the control from layout and tab order. Combined with
5900
+ * `visible`: both must pass.
5901
+ * @default "always"
5902
+ */
5903
+ visibility?: ComposerActionVisibility;
5847
5904
  disabled?: boolean | ((state: Readonly<ComposerState>) => boolean);
5848
5905
  /** Disable while a response streams, through the composer's own mechanism. */
5849
5906
  disableWhenStreaming?: boolean;
@@ -5990,6 +6047,15 @@ type ComposerMode = {
5990
6047
  * row, never in the overflow menu.
5991
6048
  */
5992
6049
  type ComposerModeGroupPresentation = "buttons" | "segmented";
6050
+ /**
6051
+ * Whether a group's active modes also render as removable chips.
6052
+ *
6053
+ * - `"auto"` (default): one chip per active mode, except under `"segmented"`
6054
+ * presentation, where the track already shows the state.
6055
+ * - `"hidden"`: no chips for this group under any presentation. The pressed bar
6056
+ * button carries the state, and deselection stays on the button.
6057
+ */
6058
+ type ComposerModeChipVisibility = "auto" | "hidden";
5993
6059
  /**
5994
6060
  * Selection policy for a set of modes. `"single"` deselects siblings when one
5995
6061
  * is chosen; `"multiple"` toggles independently.
@@ -5999,6 +6065,12 @@ type ComposerModeGroup = {
5999
6065
  selection: "single" | "multiple";
6000
6066
  /** @default "buttons" */
6001
6067
  presentation?: ComposerModeGroupPresentation;
6068
+ /**
6069
+ * Chip row policy for this group's active modes. The chip row itself is
6070
+ * derived from its children, so a group with no other chips leaves no gap.
6071
+ * @default "auto"
6072
+ */
6073
+ chipVisibility?: ComposerModeChipVisibility;
6002
6074
  /**
6003
6075
  * Accessible name for a segmented track. With it the track is a labelled
6004
6076
  * `role="group"`; without it the segments stand on their own names.