@salt-ds/ag-grid-theme 2.10.1 → 2.11.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 (3) hide show
  1. package/CHANGELOG.md +86 -0
  2. package/package.json +3 -3
  3. package/salt-ag-theme.css +1257 -237
package/CHANGELOG.md CHANGED
@@ -1,5 +1,91 @@
1
1
  # @salt-ds/ag-grid-theme
2
2
 
3
+ ## 2.11.0
4
+
5
+ ### Minor Changes
6
+
7
+ - 415c480: Added cell validation support for non-editable cells. The `.error-cell`, `.warning-cell` and `.success-cell` classes no longer need `.editable-cell`, and show the status background, status adornment and focus ring color on any cell. When used together with `.editable-cell`, the editable border also reflects the validation state.
8
+
9
+ ### Patch Changes
10
+
11
+ - 415c480: Fixed AG Grid theme styling to align with the Salt Data Grid Figma designs.
12
+
13
+ - Default row height now includes the 1px row border (`--salt-size-base` + `--salt-spacing-100` + 1px), so cell content matches the header row height.
14
+ - Cell text is now vertically centered when `--ag-line-height` isn't defined (AG Grid v33+), and wrapped text cells use `--salt-text-lineHeight`.
15
+ - Header column separators are now as tall as `--salt-size-base`, less `--salt-spacing-50` at each end.
16
+ - Dividers between header rows (e.g. below column groups) and below the row group panel now use `--salt-separable-tertiary-borderColor`.
17
+ - The editable cell corner flag now uses `--salt-focused-outlineColor`, and the inline editing background uses `--salt-editable-primary-background`.
18
+ - Header icon buttons now use `--salt-actionable-background-hover` on hover. The hover is drawn as a `--salt-size-base` less `--salt-spacing-100` button with `--salt-palette-corner-weaker`, matching Salt's `Button` in an `Input` adornment. The same applies to floating filter, dialog, tool panel and chart icon buttons.
19
+ - Status bar now matches the row height, uses `--salt-container-subtle-borderColor` for its top border and `--salt-content-primary-foreground` for its labels.
20
+ - Row group indentation now uses `--salt-spacing-100` on each side of the icon.
21
+ - Menu separators now use `--salt-separable-tertiary-borderColor`.
22
+ - Cells now use `--salt-palette-corner-weak` for their corner radius, so focus rings, editable borders, validation backgrounds and the edit flag are rounded when `corner="rounded"`. Multi-cell range selections only round their outer corners. Custom cell backgrounds, such as those set with `cellStyle` or `cellClass`, follow the same corner radius, matching the Figma cell.
23
+ - Editor popups (select, rich select and large text) now use `--salt-palette-corner` for their corner radius, matching `OptionList`, and their shadow follows the rounded corners. Select and large text scroll areas are inset from the top and bottom by the corner radius, so scrollbars don't overlap the rounded corners. Rich select keeps its option rows aligned with pointer hit testing.
24
+ - Checkboxes are now drawn like Salt's `Checkbox`, with `--salt-palette-corner-weaker` for their corner radius and the indeterminate bar from `CheckboxIcon`.
25
+ - Floating filters are drawn as a rounded box with a 1px gap between columns, and the filter button is centered where the Figma button sits inside the box. The focus ring and `--salt-editable-primary-background` now cover the whole box, including the filter button. Read-only floating filters, such as the set filter, and columns without a floating filter show no box, and filter values use `--salt-content-secondary-foreground`.
26
+ - Validation status adornments no longer replace the range selection border on cells at the edge of a multi-cell range selection.
27
+ - Floating filter values now use `--salt-text-fontSize` and `--salt-text-fontWeight`, instead of the header label text.
28
+ - Row group expand icons now sit in a transparent button, with `--salt-spacing-100` on each side of the icon and `--salt-palette-corner-weak`, plus a `--salt-spacing-100` gap before the group value. Leaf rows line up with their parent's group value. The button uses `--salt-actionable-subtle-background-hover` and `--salt-actionable-subtle-background-active`, matching a transparent `Button`.
29
+ - Validation cells now leave a `--salt-spacing-100` gap between the cell text and the status adornment.
30
+ - Right-aligned header text now has a `--salt-spacing-100` gap from the menu and filter icons when truncated.
31
+ - Column group headers now show a right chevron when closed and a left chevron when open.
32
+ - Validation cells inside a range selection keep their status background, with the range selection color painted on top. Cells colored with an inline style, such as `cellStyle`, now also show the range selection color on top of their own color, instead of hiding it.
33
+ - Menus now have a 1px gap between items, with separators drawn in the gap, use the Salt chevron for submenus, and show the Salt focus ring on keyboard focus. Pressed menu items match `MenuItem`'s active state, with `--salt-selectable-background-selected` and a `--salt-selectable-borderColor-selected` line above and below.
34
+ - Filter inputs and dropdowns are now bordered, `--salt-size-base` tall and use `--salt-palette-corner-weak`, with the Salt chevron for dropdowns. Filter buttons also use `--salt-palette-corner-weak`.
35
+ - The columns tool panel now uses `--salt-spacing-300` padding and gaps, drop zones are drawn as a dashed box with a bolder message, side bar tabs have a `--salt-spacing-100` gap with a single divider beside them, and the pivot mode toggle matches Salt's `Switch`.
36
+ - The columns tool panel keeps space for the column picker and scrolls when its contents exceed the available height, including when pivot mode adds another drop zone.
37
+ - The pagination panel no longer has a top border, uses `--salt-content-secondary-foreground` with bolder numbers, `--salt-spacing-300` between groups, and transparent buttons around the paging icons.
38
+ - Column drop chips now use `--salt-container-secondary-background` with a border, shadow and transparent remove button, instead of the bold actionable style.
39
+ - Side bar tabs, paging buttons, column drop chips and the column select header now show the Salt focus ring instead of the AG Grid focus box.
40
+ - Dialogs, such as Choose Columns, now match Salt's `Dialog`, with `--salt-palette-corner` and `--salt-container-borderColor`.
41
+ - Filter menu content now lines up with the menu padding, with `--salt-spacing-100` between rows and above the buttons.
42
+ - Buttons now use the same tokens as Salt's `Button` (`--salt-text-action-*`, and the actionable subtle and accented bold colors including borders and active states), instead of hard-coded font weight and text transform.
43
+ - Keyboard focus on list items (set filter, column select, rich select), tabs, tool panel and multi filter group headers, and column group headers now shows the Salt focus ring instead of the AG Grid focus box.
44
+ - The filters tool panel now matches the Figma "Filters panel": a bordered search input, `--salt-size-base` group headers with a bolder title and a chevron indicator, and filters indented to the group title. Filter actions wrap when the panel is too narrow to fit them on one row.
45
+ - Dialog titles now use `--salt-content-primary-foreground` and `--salt-text-fontWeight-bolder`.
46
+ - The editable cell corner flag is now `--salt-size-adornment`, and focus ring offsets use Salt tokens instead of fixed pixel values.
47
+ - Every cell now leaves a 1px gap on its right, matching the Figma column separator slot and the row border between stacked cells. Cell backgrounds, including validation backgrounds and custom backgrounds set with `cellStyle` or `cellClass`, editable borders and focus rings stay inside the gap, so neighboring colored cells no longer merge. The pinned column separator takes the place of the gap on the last left-pinned column, and range selection backgrounds cover the gaps between selected cells, so a range still reads as one area. The gap after the last column of a range stays clear. Custom backgrounds set with the `background` shorthand in `cellStyle` also paint the gap; use `backgroundColor` instead.
48
+ - Range selection borders now cover the gaps between selected cells, preserving the pinned column separators and the clear gap after the last selected column.
49
+
50
+ ## 2.10.2
51
+
52
+ ### Patch Changes
53
+
54
+ - 825f63d: Renamed the `small` and `strong` font weight tokens to `lighter` and `bolder`, to match the new `fontWeight` prop on `Text`. The old tokens still work as aliases but are deprecated and will be removed in a future major version. Salt components now use the new tokens, so if you override an old token, override the new one instead.
55
+
56
+ ```diff
57
+ - font-weight: var(--salt-text-fontWeight-strong);
58
+ + font-weight: var(--salt-text-fontWeight-bolder);
59
+ ```
60
+
61
+ | Deprecated token | Use instead |
62
+ | ---------------------------------------- | ----------------------------------------- |
63
+ | `--salt-text-fontWeight-small` | `--salt-text-fontWeight-lighter` |
64
+ | `--salt-text-fontWeight-strong` | `--salt-text-fontWeight-bolder` |
65
+ | `--salt-text-action-fontWeight-small` | `--salt-text-action-fontWeight-lighter` |
66
+ | `--salt-text-action-fontWeight-strong` | `--salt-text-action-fontWeight-bolder` |
67
+ | `--salt-text-display-fontWeight-small` | `--salt-text-display-fontWeight-lighter` |
68
+ | `--salt-text-display-fontWeight-strong` | `--salt-text-display-fontWeight-bolder` |
69
+ | `--salt-text-heading-fontWeight-small` | `--salt-text-heading-fontWeight-lighter` |
70
+ | `--salt-text-heading-fontWeight-strong` | `--salt-text-heading-fontWeight-bolder` |
71
+ | `--salt-text-label-fontWeight-small` | `--salt-text-label-fontWeight-lighter` |
72
+ | `--salt-text-label-fontWeight-strong` | `--salt-text-label-fontWeight-bolder` |
73
+ | `--salt-text-notation-fontWeight-small` | `--salt-text-notation-fontWeight-lighter` |
74
+ | `--salt-text-notation-fontWeight-strong` | `--salt-text-notation-fontWeight-bolder` |
75
+
76
+ The deprecated `--salt-text-h{1-4}-fontWeight-small`, `--salt-text-h{1-4}-fontWeight-strong`, `--salt-text-display{1-4}-fontWeight-small` and `--salt-text-display{1-4}-fontWeight-strong` tokens now alias the new tokens.
77
+
78
+ The `small` and `strong` font weight tokens have been removed from the experimental Salt (Interim) theme without aliases. If you use the interim theme and reference them, switch to the matching `lighter` and `bolder` tokens in the table above.
79
+
80
+ See [font weight](https://www.saltdesignsystem.com/salt/foundations/typography#font-weight) for how each text style uses these weights.
81
+
82
+ - Updated dependencies [c319c14]
83
+ - Updated dependencies [825f63d]
84
+ - Updated dependencies [825f63d]
85
+ - Updated dependencies [825f63d]
86
+ - Updated dependencies [825f63d]
87
+ - @salt-ds/theme@1.48.0
88
+
3
89
  ## 2.10.1
4
90
 
5
91
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salt-ds/ag-grid-theme",
3
- "version": "2.10.1",
3
+ "version": "2.11.0",
4
4
  "license": "Apache-2.0",
5
5
  "repository": {
6
6
  "type": "git",
@@ -24,10 +24,10 @@
24
24
  "provenance": true
25
25
  },
26
26
  "devDependencies": {
27
- "del": "^8.0.0"
27
+ "del": "^9.0.0"
28
28
  },
29
29
  "peerDependencies": {
30
- "@salt-ds/theme": "^1.47.0",
30
+ "@salt-ds/theme": "^1.48.0",
31
31
  "ag-grid-community": ">=28.0.0"
32
32
  }
33
33
  }