@cloud-ru/ds-tree 1.0.23-preview-c6bef496.0 → 1.0.23

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 (10) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/cjs/helperComponents/TreeLine/styles.module.css +1 -1
  3. package/dist/cjs/helperComponents/TreeNode/styles.module.css +27 -27
  4. package/dist/cjs/style.css +28 -28
  5. package/dist/esm/helperComponents/TreeLine/styles.module.css +1 -1
  6. package/dist/esm/helperComponents/TreeNode/styles.module.css +27 -27
  7. package/dist/esm/style.css +28 -28
  8. package/dist/tsconfig.cjs.tsbuildinfo +1 -1
  9. package/dist/tsconfig.esm.tsbuildinfo +1 -1
  10. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## 1.0.23 (2026-09-30)
7
+
8
+ **Note:** Version bump only for package @ds/tree
9
+
6
10
  ## 1.0.22 (2026-09-30)
7
11
 
8
12
  **Note:** Version bump only for package @ds/tree
package/dist/cjs/helperComponents/TreeLine/styles.module.css CHANGED
@@ -16,7 +16,7 @@
16
16
  transform:translateX(-50%);
17
17
  width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
18
18
  height:100%;
19
- background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
19
+ background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
20
20
  }
21
21
  .treeLine[data-horizontal]{
22
22
  box-sizing:border-box;
package/dist/cjs/helperComponents/TreeNode/styles.module.css CHANGED
@@ -12,7 +12,7 @@
12
12
  align-items:center;
13
13
  justify-content:center;
14
14
  box-sizing:border-box;
15
- color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(65, 66, 78, 0.5490196078)));
15
+ color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(0, 0, 0, 0.5803921569)));
16
16
  }
17
17
 
18
18
  .treeNodeTitle{
@@ -22,7 +22,7 @@
22
22
  align-items:center;
23
23
  box-sizing:border-box;
24
24
  min-width:0;
25
- color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
25
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #000000));
26
26
  }
27
27
 
28
28
  .treeNodeActions{
@@ -54,15 +54,15 @@
54
54
  border-radius:inherit;
55
55
  }
56
56
  .treeNodeContent .stateLayer[data-state=borderOnBackground]{
57
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
57
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
58
58
  border-style:solid;
59
59
  border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
60
60
  }
61
61
  .treeNodeContent .stateLayer[data-state=emptyNeutralOnBackground]{
62
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
62
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(0, 0, 0, 0)));
63
63
  }
64
64
  .treeNodeContent .stateLayer[data-state=activatedOnBackground]{
65
- background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(56, 159, 116, 0.1019607843)));
65
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(128, 128, 128, 0.1607843137)));
66
66
  }
67
67
  .treeNodeContent .stateLayer[data-state=versionOnColor]{
68
68
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
@@ -81,13 +81,13 @@
81
81
  }
82
82
  @media (hover: hover){
83
83
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
84
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
84
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(0, 0, 0, 0.2392156863)));
85
85
  }
86
86
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
87
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
87
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
88
88
  }
89
89
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
90
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
90
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
91
91
  }
92
92
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
93
93
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
@@ -108,13 +108,13 @@
108
108
  .treeNodeContent{
109
109
  }
110
110
  .treeNodeContent[data-loading] .stateLayer[data-state=borderOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
111
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
111
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(0, 0, 0, 0.3411764706)));
112
112
  }
113
113
  .treeNodeContent[data-loading] .stateLayer[data-state=emptyNeutralOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
114
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
114
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(0, 0, 0, 0.1215686275)));
115
115
  }
116
116
  .treeNodeContent[data-loading] .stateLayer[data-state=activatedOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
117
- background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(56, 159, 116, 0.3019607843)));
117
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(128, 128, 128, 0.3411764706)));
118
118
  }
119
119
  .treeNodeContent[data-loading] .stateLayer[data-state=versionOnColor], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
120
120
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
@@ -135,17 +135,17 @@
135
135
  visibility:visible;
136
136
  }
137
137
  .treeNodeContent[data-droplist-active] .stateLayer[data-state=emptyNeutralOnBackground]{
138
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
138
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
139
139
  }
140
140
  .treeNodeContent[data-droplist-active] .stateLayer[data-state=activatedOnBackground]{
141
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
141
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
142
142
  }
143
143
  .treeNodeContent:focus-visible{
144
144
  outline:var(--sn-primitive-strokeWeight-strokeSemiBold, 2px) solid var(--sn-theme-color-available-complementary, #000000);
145
145
  outline-offset:calc(-1 * var(--sn-primitive-strokeWeight-strokeSemiBold, 2px));
146
146
  }
147
147
  .treeNodeContent[aria-selected=true]:focus-visible{
148
- outline-color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
148
+ outline-color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #222222));
149
149
  }
150
150
  .treeNodeContent[data-multiselect]{
151
151
  cursor:default;
@@ -181,7 +181,7 @@
181
181
  padding:0;
182
182
  border:0;
183
183
  border-radius:var(--sn-brand-anatomy-radius-button-s, var(--sn-primitive-dimension-2, 2px));
184
- color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-40, var(--sn-brand-palette-gray-40, #81869c)));
184
+ color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-40, var(--sn-brand-palette-gray-40, #4a4a4a)));
185
185
  background:transparent;
186
186
  }
187
187
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer{
@@ -190,15 +190,15 @@
190
190
  border-radius:inherit;
191
191
  }
192
192
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
193
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
193
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
194
194
  border-style:solid;
195
195
  border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
196
196
  }
197
197
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
198
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
198
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(0, 0, 0, 0)));
199
199
  }
200
200
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
201
- background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(56, 159, 116, 0.1019607843)));
201
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(128, 128, 128, 0.1607843137)));
202
202
  }
203
203
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
204
204
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
@@ -217,13 +217,13 @@
217
217
  }
218
218
  @media (hover: hover){
219
219
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
220
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
220
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(0, 0, 0, 0.2392156863)));
221
221
  }
222
222
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
223
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
223
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
224
224
  }
225
225
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
226
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
226
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
227
227
  }
228
228
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
229
229
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
@@ -244,13 +244,13 @@
244
244
  .treeNodeExpandButton{
245
245
  }
246
246
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=borderOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
247
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
247
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(0, 0, 0, 0.3411764706)));
248
248
  }
249
249
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
250
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
250
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(0, 0, 0, 0.1215686275)));
251
251
  }
252
252
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
253
- background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(56, 159, 116, 0.3019607843)));
253
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(128, 128, 128, 0.3411764706)));
254
254
  }
255
255
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=versionOnColor], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
256
256
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
@@ -327,7 +327,7 @@
327
327
  gap:var(--sn-tree-anatomy-size-s-treeItem-gap, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
328
328
  padding-left:var(--sn-tree-anatomy-size-s-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
329
329
  padding-right:var(--sn-tree-anatomy-size-s-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
330
- font-family:var(--sn-regular-body-s-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
330
+ font-family:var(--sn-regular-body-s-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
331
331
  font-weight:var(--sn-regular-body-s-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-s, var(--sn-brand-font-fontWeight-light-regular-body-s, var(--sn-primitive-font-fontWeightValue-400, 400))));
332
332
  line-height:var(--sn-regular-body-s-lineHeight, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
333
333
  font-size:var(--sn-regular-body-s-fontSize, var(--sn-density-typography-roleBody-fontSizeS, var(--sn-platform-comfort-typography-roleBody-fontSizeS, var(--sn-primitive-font-fontSize-14, 14px))));
@@ -379,7 +379,7 @@
379
379
  padding-right:var(--sn-tree-anatomy-size-m-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-m, var(--sn-platform-comfort-spacing-control-container-horizontal-m, var(--sn-platform-comfort-scale-050-xs, var(--sn-primitive-dimension-8, 8px)))));
380
380
  gap:var(--sn-tree-anatomy-size-m-treeItem-gap, var(--sn-density-spacing-control-container-horizontal-m, var(--sn-platform-comfort-spacing-control-container-horizontal-m, var(--sn-platform-comfort-scale-050-xs, var(--sn-primitive-dimension-8, 8px)))));
381
381
  border-radius:var(--sn-tree-anatomy-size-m-treeItem-borderRadius, var(--sn-brand-anatomy-radius-button-m, var(--sn-primitive-dimension-2, 2px)));
382
- font-family:var(--sn-regular-body-m-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
382
+ font-family:var(--sn-regular-body-m-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
383
383
  font-weight:var(--sn-regular-body-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-m, var(--sn-brand-font-fontWeight-light-regular-body-m, var(--sn-primitive-font-fontWeightValue-400, 400))));
384
384
  line-height:var(--sn-regular-body-m-lineHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-platform-comfort-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-24, 24px))));
385
385
  font-size:var(--sn-regular-body-m-fontSize, var(--sn-density-typography-roleBody-fontSizeM, var(--sn-platform-comfort-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px))));
@@ -431,7 +431,7 @@
431
431
  padding-right:var(--sn-tree-anatomy-size-l-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-l, var(--sn-platform-comfort-spacing-control-container-horizontal-l, var(--sn-platform-comfort-scale-050-s, var(--sn-primitive-dimension-12, 12px)))));
432
432
  padding-top:var(--sn-tree-anatomy-size-l-treeItem-paddingVertical, var(--sn-density-spacing-control-container-vertical-l, var(--sn-platform-comfort-spacing-control-container-vertical-l, var(--sn-platform-comfort-scale-025-s, var(--sn-primitive-dimension-6, 6px)))));
433
433
  padding-bottom:var(--sn-tree-anatomy-size-l-treeItem-paddingVertical, var(--sn-density-spacing-control-container-vertical-l, var(--sn-platform-comfort-spacing-control-container-vertical-l, var(--sn-platform-comfort-scale-025-s, var(--sn-primitive-dimension-6, 6px)))));
434
- font-family:var(--sn-regular-body-l-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
434
+ font-family:var(--sn-regular-body-l-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
435
435
  font-weight:var(--sn-regular-body-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-l, var(--sn-brand-font-fontWeight-light-regular-body-l, var(--sn-primitive-font-fontWeightValue-400, 400))));
436
436
  line-height:var(--sn-regular-body-l-lineHeight, var(--sn-density-typography-roleBody-lineHeightL, var(--sn-platform-comfort-typography-roleBody-lineHeightL, var(--sn-primitive-font-lineHeight-28, 28px))));
437
437
  font-size:var(--sn-regular-body-l-fontSize, var(--sn-density-typography-roleBody-fontSizeL, var(--sn-platform-comfort-typography-roleBody-fontSizeL, var(--sn-primitive-font-fontSize-18, 18px))));
package/dist/cjs/style.css CHANGED
@@ -70,7 +70,7 @@
70
70
  transform:translateX(-50%);
71
71
  width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
72
72
  height:100%;
73
- background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
73
+ background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
74
74
  }
75
75
  .treeLine[data-horizontal]{
76
76
  box-sizing:border-box;
@@ -103,7 +103,7 @@
103
103
  align-items:center;
104
104
  justify-content:center;
105
105
  box-sizing:border-box;
106
- color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(65, 66, 78, 0.5490196078)));
106
+ color:var(--sn-theme-color-available-version-textTertiary, var(--sn-brand-color-text-version-tertiary, rgba(0, 0, 0, 0.5803921569)));
107
107
  }
108
108
 
109
109
  .treeNodeTitle{
@@ -113,7 +113,7 @@
113
113
  align-items:center;
114
114
  box-sizing:border-box;
115
115
  min-width:0;
116
- color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #41424e));
116
+ color:var(--sn-theme-color-available-version-textMain, var(--sn-brand-color-text-version-main, #000000));
117
117
  }
118
118
 
119
119
  .treeNodeActions{
@@ -145,15 +145,15 @@
145
145
  border-radius:inherit;
146
146
  }
147
147
  .treeNodeContent .stateLayer[data-state=borderOnBackground]{
148
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
148
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
149
149
  border-style:solid;
150
150
  border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
151
151
  }
152
152
  .treeNodeContent .stateLayer[data-state=emptyNeutralOnBackground]{
153
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
153
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(0, 0, 0, 0)));
154
154
  }
155
155
  .treeNodeContent .stateLayer[data-state=activatedOnBackground]{
156
- background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(56, 159, 116, 0.1019607843)));
156
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(128, 128, 128, 0.1607843137)));
157
157
  }
158
158
  .treeNodeContent .stateLayer[data-state=versionOnColor]{
159
159
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
@@ -172,13 +172,13 @@
172
172
  }
173
173
  @media (hover: hover){
174
174
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
175
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
175
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(0, 0, 0, 0.2392156863)));
176
176
  }
177
177
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
178
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
178
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
179
179
  }
180
180
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
181
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
181
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
182
182
  }
183
183
  .treeNodeContent:hover:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
184
184
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
@@ -199,13 +199,13 @@
199
199
  .treeNodeContent{
200
200
  }
201
201
  .treeNodeContent[data-loading] .stateLayer[data-state=borderOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=borderOnBackground]{
202
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
202
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(0, 0, 0, 0.3411764706)));
203
203
  }
204
204
  .treeNodeContent[data-loading] .stateLayer[data-state=emptyNeutralOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=emptyNeutralOnBackground]{
205
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
205
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(0, 0, 0, 0.1215686275)));
206
206
  }
207
207
  .treeNodeContent[data-loading] .stateLayer[data-state=activatedOnBackground], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=activatedOnBackground]{
208
- background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(56, 159, 116, 0.3019607843)));
208
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(128, 128, 128, 0.3411764706)));
209
209
  }
210
210
  .treeNodeContent[data-loading] .stateLayer[data-state=versionOnColor], .treeNodeContent:active:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor], .treeNodeContent[data-pressed=true]:not([data-disabled], [data-loading]) .stateLayer[data-state=versionOnColor]{
211
211
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
@@ -226,17 +226,17 @@
226
226
  visibility:visible;
227
227
  }
228
228
  .treeNodeContent[data-droplist-active] .stateLayer[data-state=emptyNeutralOnBackground]{
229
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
229
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
230
230
  }
231
231
  .treeNodeContent[data-droplist-active] .stateLayer[data-state=activatedOnBackground]{
232
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
232
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
233
233
  }
234
234
  .treeNodeContent:focus-visible{
235
235
  outline:var(--sn-primitive-strokeWeight-strokeSemiBold, 2px) solid var(--sn-theme-color-available-complementary, #000000);
236
236
  outline-offset:calc(-1 * var(--sn-primitive-strokeWeight-strokeSemiBold, 2px));
237
237
  }
238
238
  .treeNodeContent[aria-selected=true]:focus-visible{
239
- outline-color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
239
+ outline-color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #222222));
240
240
  }
241
241
  .treeNodeContent[data-multiselect]{
242
242
  cursor:default;
@@ -272,7 +272,7 @@
272
272
  padding:0;
273
273
  border:0;
274
274
  border-radius:var(--sn-brand-anatomy-radius-button-s, var(--sn-primitive-dimension-2, 2px));
275
- color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-40, var(--sn-brand-palette-gray-40, #81869c)));
275
+ color:var(--sn-theme-color-neutral-text, var(--sn-brand-color-neutral-40, var(--sn-brand-palette-gray-40, #4a4a4a)));
276
276
  background:transparent;
277
277
  }
278
278
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer{
@@ -281,15 +281,15 @@
281
281
  border-radius:inherit;
282
282
  }
283
283
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
284
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
284
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-default-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
285
285
  border-style:solid;
286
286
  border-width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
287
287
  }
288
288
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
289
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(120, 123, 138, 0)));
289
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-defaultEmpty-filled, var(--sn-brand-color-state-neutral-forLightMode-default-background, rgba(0, 0, 0, 0)));
290
290
  }
291
291
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
292
- background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(56, 159, 116, 0.1019607843)));
292
+ background:var(--sn-theme-color-material-stateLayer-activated-default-filled, var(--sn-brand-color-state-activated-default-background, rgba(128, 128, 128, 0.1607843137)));
293
293
  }
294
294
  .treeNodeExpandButton .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
295
295
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-default-filled, rgba(0, 0, 0, 0.0509803922));
@@ -308,13 +308,13 @@
308
308
  }
309
309
  @media (hover: hover){
310
310
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
311
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(159, 166, 198, 0.6509803922)));
311
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-hovered-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-hovered-borderColor, rgba(0, 0, 0, 0.2392156863)));
312
312
  }
313
313
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
314
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(188, 195, 220, 0.1490196078)));
314
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-hovered-filled, var(--sn-brand-color-state-neutral-forLightMode-hovered-background, rgba(0, 0, 0, 0.0784313725)));
315
315
  }
316
316
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
317
- background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(56, 159, 116, 0.2)));
317
+ background:var(--sn-theme-color-material-stateLayer-activated-hovered-filled, var(--sn-brand-color-state-activated-hovered-background, rgba(128, 128, 128, 0.2392156863)));
318
318
  }
319
319
  .treeNodeExpandButton:hover:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
320
320
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-hovered-filled, rgba(0, 0, 0, 0.1019607843));
@@ -335,13 +335,13 @@
335
335
  .treeNodeExpandButton{
336
336
  }
337
337
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=borderOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=borderOnBackground]{
338
- border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(159, 166, 198, 0.8)));
338
+ border-color:var(--sn-theme-color-material-stateLayer-neutral-border-pressed-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-pressed-borderColor, rgba(0, 0, 0, 0.3411764706)));
339
339
  }
340
340
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=emptyNeutralOnBackground]{
341
- background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(188, 195, 220, 0.3019607843)));
341
+ background:var(--sn-theme-color-material-stateLayer-neutral-onBackground-pressed-filled, var(--sn-brand-color-state-neutral-forLightMode-pressed-background, rgba(0, 0, 0, 0.1215686275)));
342
342
  }
343
343
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=activatedOnBackground]{
344
- background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(56, 159, 116, 0.3019607843)));
344
+ background:var(--sn-theme-color-material-stateLayer-activated-pressed-filled, var(--sn-brand-color-state-activated-pressed-background, rgba(128, 128, 128, 0.3411764706)));
345
345
  }
346
346
  .treeNodeExpandButton[data-loading] .treeNodeExpandButtonStateLayer[data-state=versionOnColor], .treeNodeExpandButton:active:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor], .treeNodeExpandButton[data-pressed=true]:not([data-disabled], [data-loading]) .treeNodeExpandButtonStateLayer[data-state=versionOnColor]{
347
347
  background:var(--sn-theme-color-material-stateLayer-versionOnColor-pressed-filled, rgba(0, 0, 0, 0.1490196078));
@@ -418,7 +418,7 @@
418
418
  gap:var(--sn-tree-anatomy-size-s-treeItem-gap, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
419
419
  padding-left:var(--sn-tree-anatomy-size-s-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
420
420
  padding-right:var(--sn-tree-anatomy-size-s-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-s, var(--sn-platform-comfort-spacing-control-container-horizontal-s, var(--sn-platform-comfort-scale-050-2xs, var(--sn-primitive-dimension-4, 4px)))));
421
- font-family:var(--sn-regular-body-s-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
421
+ font-family:var(--sn-regular-body-s-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
422
422
  font-weight:var(--sn-regular-body-s-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-s, var(--sn-brand-font-fontWeight-light-regular-body-s, var(--sn-primitive-font-fontWeightValue-400, 400))));
423
423
  line-height:var(--sn-regular-body-s-lineHeight, var(--sn-density-typography-roleBody-lineHeightS, var(--sn-platform-comfort-typography-roleBody-lineHeightS, var(--sn-primitive-font-lineHeight-20, 20px))));
424
424
  font-size:var(--sn-regular-body-s-fontSize, var(--sn-density-typography-roleBody-fontSizeS, var(--sn-platform-comfort-typography-roleBody-fontSizeS, var(--sn-primitive-font-fontSize-14, 14px))));
@@ -470,7 +470,7 @@
470
470
  padding-right:var(--sn-tree-anatomy-size-m-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-m, var(--sn-platform-comfort-spacing-control-container-horizontal-m, var(--sn-platform-comfort-scale-050-xs, var(--sn-primitive-dimension-8, 8px)))));
471
471
  gap:var(--sn-tree-anatomy-size-m-treeItem-gap, var(--sn-density-spacing-control-container-horizontal-m, var(--sn-platform-comfort-spacing-control-container-horizontal-m, var(--sn-platform-comfort-scale-050-xs, var(--sn-primitive-dimension-8, 8px)))));
472
472
  border-radius:var(--sn-tree-anatomy-size-m-treeItem-borderRadius, var(--sn-brand-anatomy-radius-button-m, var(--sn-primitive-dimension-2, 2px)));
473
- font-family:var(--sn-regular-body-m-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
473
+ font-family:var(--sn-regular-body-m-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
474
474
  font-weight:var(--sn-regular-body-m-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-m, var(--sn-brand-font-fontWeight-light-regular-body-m, var(--sn-primitive-font-fontWeightValue-400, 400))));
475
475
  line-height:var(--sn-regular-body-m-lineHeight, var(--sn-density-typography-roleBody-lineHeightM, var(--sn-platform-comfort-typography-roleBody-lineHeightM, var(--sn-primitive-font-lineHeight-24, 24px))));
476
476
  font-size:var(--sn-regular-body-m-fontSize, var(--sn-density-typography-roleBody-fontSizeM, var(--sn-platform-comfort-typography-roleBody-fontSizeM, var(--sn-primitive-font-fontSize-16, 16px))));
@@ -522,7 +522,7 @@
522
522
  padding-right:var(--sn-tree-anatomy-size-l-treeItem-paddingHorizontal, var(--sn-density-spacing-control-container-horizontal-l, var(--sn-platform-comfort-spacing-control-container-horizontal-l, var(--sn-platform-comfort-scale-050-s, var(--sn-primitive-dimension-12, 12px)))));
523
523
  padding-top:var(--sn-tree-anatomy-size-l-treeItem-paddingVertical, var(--sn-density-spacing-control-container-vertical-l, var(--sn-platform-comfort-spacing-control-container-vertical-l, var(--sn-platform-comfort-scale-025-s, var(--sn-primitive-dimension-6, 6px)))));
524
524
  padding-bottom:var(--sn-tree-anatomy-size-l-treeItem-paddingVertical, var(--sn-density-spacing-control-container-vertical-l, var(--sn-platform-comfort-spacing-control-container-vertical-l, var(--sn-platform-comfort-scale-025-s, var(--sn-primitive-dimension-6, 6px)))));
525
- font-family:var(--sn-regular-body-l-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Interface));
525
+ font-family:var(--sn-regular-body-l-fontFamily, var(--sn-brand-font-fontFamily-regular-body, SB Sans Text));
526
526
  font-weight:var(--sn-regular-body-l-fontWeight, var(--sn-theme-typography-fontWeight-regular-body-l, var(--sn-brand-font-fontWeight-light-regular-body-l, var(--sn-primitive-font-fontWeightValue-400, 400))));
527
527
  line-height:var(--sn-regular-body-l-lineHeight, var(--sn-density-typography-roleBody-lineHeightL, var(--sn-platform-comfort-typography-roleBody-lineHeightL, var(--sn-primitive-font-lineHeight-28, 28px))));
528
528
  font-size:var(--sn-regular-body-l-fontSize, var(--sn-density-typography-roleBody-fontSizeL, var(--sn-platform-comfort-typography-roleBody-fontSizeL, var(--sn-primitive-font-fontSize-18, 18px))));
package/dist/esm/helperComponents/TreeLine/styles.module.css CHANGED
@@ -16,7 +16,7 @@
16
16
  transform:translateX(-50%);
17
17
  width:var(--sn-primitive-strokeWeight-strokeRegular, 1px);
18
18
  height:100%;
19
- background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(159, 166, 198, 0.3019607843)));
19
+ background:var(--sn-theme-color-available-borderColor, var(--sn-brand-color-state-neutralBorder-forLightMode-default-borderColor, rgba(0, 0, 0, 0.1411764706)));
20
20
  }
21
21
  .treeLine[data-horizontal]{
22
22
  box-sizing:border-box;