@snack-uikit/table 0.27.0 → 0.27.1

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 (5) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/helperComponents/Cells/TreeCell/styles.module.css +5 -3
  3. package/dist/esm/helperComponents/Cells/TreeCell/styles.module.css +5 -3
  4. package/package.json +3 -3
  5. package/src/helperComponents/Cells/TreeCell/styles.module.scss +21 -20
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
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
+ ## 0.27.1 (2025-01-31)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **PDS-1461:** update after token change ([3324d1d](https://github.com/cloud-ru-tech/snack-uikit/commit/3324d1da07b8d0e26186046d859985774fc06ce6))
12
+
13
+
14
+
15
+
16
+
6
17
  # 0.27.0 (2025-01-23)
7
18
 
8
19
 
package/dist/cjs/helperComponents/Cells/TreeCell/styles.module.css CHANGED
@@ -18,11 +18,13 @@
18
18
  }
19
19
 
20
20
  .treeNodeContent{
21
- height:var(--size-tree-item-height, 32px);
22
21
  gap:var(--space-tree-item-content-layout-gap, 4px);
22
+ padding-top:var(--space-tree-item-content-layout-padding, 4px);
23
23
  padding-right:var(--space-tree-item-content-layout-padding, 4px);
24
+ padding-bottom:var(--space-tree-item-content-layout-padding, 4px);
24
25
  padding-left:var(--space-tree-item-content-layout-padding, 4px);
25
26
  border-radius:var(--radius-tree-item-content-layout, 8px);
27
+ min-height:var(--size-tree-item-height, 32px);
26
28
  cursor:pointer;
27
29
  display:flex;
28
30
  align-items:center;
@@ -97,8 +99,8 @@
97
99
  }
98
100
 
99
101
  .treeCheckboxWrap{
100
- width:var(--size-tree-item-checkbox-wrap, 24px);
101
- height:var(--size-tree-item-checkbox-wrap, 24px);
102
+ width:var(--size-tree-item-wrap, 24px);
103
+ height:var(--size-tree-item-wrap, 24px);
102
104
  display:flex;
103
105
  flex-shrink:0;
104
106
  align-items:center;
package/dist/esm/helperComponents/Cells/TreeCell/styles.module.css CHANGED
@@ -18,11 +18,13 @@
18
18
  }
19
19
 
20
20
  .treeNodeContent{
21
- height:var(--size-tree-item-height, 32px);
22
21
  gap:var(--space-tree-item-content-layout-gap, 4px);
22
+ padding-top:var(--space-tree-item-content-layout-padding, 4px);
23
23
  padding-right:var(--space-tree-item-content-layout-padding, 4px);
24
+ padding-bottom:var(--space-tree-item-content-layout-padding, 4px);
24
25
  padding-left:var(--space-tree-item-content-layout-padding, 4px);
25
26
  border-radius:var(--radius-tree-item-content-layout, 8px);
27
+ min-height:var(--size-tree-item-height, 32px);
26
28
  cursor:pointer;
27
29
  display:flex;
28
30
  align-items:center;
@@ -97,8 +99,8 @@
97
99
  }
98
100
 
99
101
  .treeCheckboxWrap{
100
- width:var(--size-tree-item-checkbox-wrap, 24px);
101
- height:var(--size-tree-item-checkbox-wrap, 24px);
102
+ width:var(--size-tree-item-wrap, 24px);
103
+ height:var(--size-tree-item-wrap, 24px);
102
104
  display:flex;
103
105
  flex-shrink:0;
104
106
  align-items:center;
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Table",
7
- "version": "0.27.0",
7
+ "version": "0.27.1",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -46,7 +46,7 @@
46
46
  "@snack-uikit/scroll": "0.9.3",
47
47
  "@snack-uikit/skeleton": "0.6.2",
48
48
  "@snack-uikit/toggles": "0.13.5",
49
- "@snack-uikit/toolbar": "0.10.0",
49
+ "@snack-uikit/toolbar": "0.10.1",
50
50
  "@snack-uikit/truncate-string": "0.6.6",
51
51
  "@snack-uikit/typography": "0.8.4",
52
52
  "@snack-uikit/utils": "3.7.0",
@@ -61,5 +61,5 @@
61
61
  "peerDependencies": {
62
62
  "@snack-uikit/locale": "*"
63
63
  },
64
- "gitHead": "3528e78aec23804dca44d311947c1dcd4ed3792b"
64
+ "gitHead": "bad2d5ed6e54954b528c1ea9dae0b8f86e4c8147"
65
65
  }
package/src/helperComponents/Cells/TreeCell/styles.module.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-element';
2
- @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-table';
3
- @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-tree';
1
+ @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-element' as element;
2
+ @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-table' as table;
3
+ @use '@snack-uikit/figma-tokens/build/scss/components/styles-tokens-tree' as tree;
4
4
 
5
5
  .treeCell {
6
6
  display: flex;
@@ -8,7 +8,7 @@
8
8
  justify-content: start;
9
9
 
10
10
  width: fit-content;
11
- height: styles-tokens-table.$size-markdown-table-cell-height;
11
+ height: table.$size-markdown-table-cell-height;
12
12
  }
13
13
 
14
14
  .cellUserToggleIcon {
@@ -17,12 +17,12 @@
17
17
  align-items: center;
18
18
  box-sizing: border-box;
19
19
  svg {
20
- color: styles-tokens-tree.$sys-neutral-text-support;
20
+ color: tree.$sys-neutral-text-support;
21
21
  }
22
22
  }
23
23
 
24
24
  .treeNodeContent {
25
- @include styles-tokens-tree.composite-var(styles-tokens-tree.$tree-item-content-layout);
25
+ @include tree.composite-var(tree.$tree-item-content-layout);
26
26
 
27
27
  cursor: pointer;
28
28
 
@@ -31,12 +31,12 @@
31
31
  align-items: center;
32
32
 
33
33
  box-sizing: border-box;
34
- height: styles-tokens-table.$size-markdown-table-cell-height;
34
+ height: table.$size-markdown-table-cell-height;
35
35
 
36
36
  &:focus-visible {
37
- @include styles-tokens-tree.outline-inside-var(styles-tokens-element.$container-focused-s);
37
+ @include element.outline-inside-var(element.$container-focused-s);
38
38
 
39
- outline-color: styles-tokens-tree.$sys-available-complementary;
39
+ outline-color: tree.$sys-available-complementary;
40
40
  }
41
41
 
42
42
  &[data-multiselect] {
@@ -51,46 +51,47 @@
51
51
  }
52
52
 
53
53
  .treeNodeTitle, .treeNodeIcon {
54
- color: styles-tokens-tree.$sys-neutral-text-disabled;
54
+ color: tree.$sys-neutral-text-disabled;
55
55
  }
56
56
  }
57
57
 
58
58
  &[aria-selected='true']:not([data-multiselect]) {
59
- opacity: styles-tokens-tree.$opacity-a008;
60
- background-color: styles-tokens-tree.$sys-primary-accent-default;
59
+ opacity: tree.$opacity-a008;
60
+ background-color: tree.$sys-primary-accent-default;
61
61
 
62
62
  &:hover {
63
- opacity: styles-tokens-tree.$opacity-a016;
63
+ opacity: tree.$opacity-a016;
64
64
  }
65
65
  }
66
66
  }
67
+
67
68
  .userContent {
68
69
  cursor: pointer;
69
70
  display: flex;
70
71
  align-items: center;
71
72
  svg {
72
- color: styles-tokens-tree.$sys-neutral-text-support;
73
+ color: tree.$sys-neutral-text-support;
73
74
  }
74
75
  }
75
76
  .treeCellContainer {
76
77
  position: relative;
77
78
  overflow: hidden;
78
79
 
79
- @include styles-tokens-table.composite-var(styles-tokens-table.$sans-body-m);
80
+ @include table.composite-var(table.$sans-body-m);
80
81
  }
81
82
  .line {
82
- margin-left: calc(#{styles-tokens-table.$dimension-4m} + #{styles-tokens-table.$dimension-025m});
83
+ margin-left: calc(#{table.$dimension-4m} + #{table.$dimension-025m});
83
84
  }
84
85
  .firstLine {
85
- margin-left: styles-tokens-table.$dimension-2m
86
+ margin-left: table.$dimension-2m
86
87
  }
87
88
  .cellExpandButton {
88
89
  box-sizing: border-box;
89
90
 
90
91
 
91
92
  svg {
92
- width: styles-tokens-element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
93
- height: styles-tokens-element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
93
+ width: element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
94
+ height: element.$icon-s !important; /* stylelint-disable-line declaration-no-important */
94
95
  transition: transform 0.2s ease;
95
96
  }
96
97
 
@@ -102,7 +103,7 @@
102
103
  }
103
104
 
104
105
  .treeCheckboxWrap {
105
- @include styles-tokens-tree.composite-var(styles-tokens-tree.$tree-item-checkbox-wrap);
106
+ @include tree.composite-var(tree.$tree-item-toggle-wrap);
106
107
 
107
108
  display: flex;
108
109
  flex-shrink: 0;