@taiga-ui/core 3.35.0 → 3.36.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 (43) hide show
  1. package/bundles/taiga-ui-core-components-data-list.umd.js +2 -2
  2. package/bundles/taiga-ui-core-components-data-list.umd.js.map +1 -1
  3. package/bundles/taiga-ui-core-components-hosted-dropdown.umd.js +1 -1
  4. package/bundles/taiga-ui-core-components-hosted-dropdown.umd.js.map +1 -1
  5. package/bundles/taiga-ui-core-components-primitive-calendar.umd.js +1 -1
  6. package/bundles/taiga-ui-core-components-primitive-calendar.umd.js.map +1 -1
  7. package/bundles/taiga-ui-core-components-primitive-textfield.umd.js +5 -2
  8. package/bundles/taiga-ui-core-components-primitive-textfield.umd.js.map +1 -1
  9. package/bundles/taiga-ui-core-components-primitive-year-picker.umd.js +1 -1
  10. package/bundles/taiga-ui-core-components-primitive-year-picker.umd.js.map +1 -1
  11. package/bundles/taiga-ui-core-components-root.umd.js +1 -1
  12. package/bundles/taiga-ui-core-components-root.umd.js.map +1 -1
  13. package/bundles/taiga-ui-core-components-svg.umd.js +1 -1
  14. package/bundles/taiga-ui-core-components-svg.umd.js.map +1 -1
  15. package/components/svg/svg.component.d.ts +1 -1
  16. package/constants/cache-basting-payload.d.ts +1 -1
  17. package/esm2015/components/data-list/data-list.component.js +1 -1
  18. package/esm2015/components/data-list/option/option.component.js +1 -1
  19. package/esm2015/components/hosted-dropdown/hosted-dropdown.component.js +2 -2
  20. package/esm2015/components/primitive-calendar/primitive-calendar.component.js +1 -1
  21. package/esm2015/components/primitive-textfield/primitive-textfield.component.js +2 -2
  22. package/esm2015/components/primitive-textfield/value-decoration/value-decoration.component.js +5 -2
  23. package/esm2015/components/primitive-year-picker/primitive-year-picker.component.js +1 -1
  24. package/esm2015/components/root/root.component.js +2 -2
  25. package/esm2015/components/svg/svg.component.js +2 -2
  26. package/fesm2015/taiga-ui-core-components-data-list.js +2 -2
  27. package/fesm2015/taiga-ui-core-components-data-list.js.map +1 -1
  28. package/fesm2015/taiga-ui-core-components-hosted-dropdown.js +1 -1
  29. package/fesm2015/taiga-ui-core-components-hosted-dropdown.js.map +1 -1
  30. package/fesm2015/taiga-ui-core-components-primitive-calendar.js +1 -1
  31. package/fesm2015/taiga-ui-core-components-primitive-calendar.js.map +1 -1
  32. package/fesm2015/taiga-ui-core-components-primitive-textfield.js +5 -2
  33. package/fesm2015/taiga-ui-core-components-primitive-textfield.js.map +1 -1
  34. package/fesm2015/taiga-ui-core-components-primitive-year-picker.js +1 -1
  35. package/fesm2015/taiga-ui-core-components-primitive-year-picker.js.map +1 -1
  36. package/fesm2015/taiga-ui-core-components-root.js +1 -1
  37. package/fesm2015/taiga-ui-core-components-root.js.map +1 -1
  38. package/fesm2015/taiga-ui-core-components-svg.js +1 -1
  39. package/fesm2015/taiga-ui-core-components-svg.js.map +1 -1
  40. package/package.json +4 -4
  41. package/styles/mixins/picker.less +40 -6
  42. package/styles/mixins/picker.scss +42 -10
  43. package/styles/theme/wrapper/icon.less +2 -2
package/styles/mixins/picker.less CHANGED
@@ -28,6 +28,10 @@
28
28
  z-index: -1;
29
29
  border-radius: var(--tui-radius-m);
30
30
  }
31
+
32
+ &:after {
33
+ border-radius: 0.5rem;
34
+ }
31
35
  }
32
36
 
33
37
  .t-cell {
@@ -41,7 +45,7 @@
41
45
  cursor: pointer;
42
46
  background-clip: content-box;
43
47
  box-sizing: border-box;
44
- border: 2px solid transparent;
48
+ border: 0.125rem solid transparent;
45
49
 
46
50
  &:before {
47
51
  content: '';
@@ -74,7 +78,14 @@
74
78
  }
75
79
 
76
80
  &:not(:last-child):before {
77
- right: -@itemSize;
81
+ right: -0.25rem;
82
+ border-top-right-radius: 0;
83
+ border-bottom-right-radius: 0;
84
+ }
85
+
86
+ &:not([data-range='start']):not(:first-child):before {
87
+ border-top-left-radius: 0;
88
+ border-bottom-left-radius: 0;
78
89
  }
79
90
 
80
91
  &:last-child:first-child:before {
@@ -121,30 +132,53 @@
121
132
  }
122
133
  }
123
134
 
135
+ &[data-range='end'] {
136
+ &:before {
137
+ background: var(--tui-base-02);
138
+
139
+ :host._single & {
140
+ background: var(--tui-secondary-hover);
141
+ }
142
+ }
143
+
144
+ &:not(:first-child):before {
145
+ border-top-left-radius: 0;
146
+ border-bottom-left-radius: 0;
147
+ }
148
+ }
149
+
124
150
  &[data-range='end'] > .t-item {
125
151
  &:before {
126
- left: 0.25rem;
152
+ left: 0.625rem;
153
+ border-top-left-radius: 0;
154
+ border-bottom-left-radius: 0;
127
155
  }
128
156
 
129
157
  &:after {
130
158
  left: -2rem;
131
159
  right: 100%;
132
- transform: translateX(1.4375rem) scaleY(0.6) scaleX(0.4) rotate(45deg);
160
+ transform: translateX(1.6rem) scaleY(0.83) scaleX(0.5) rotate(45deg);
133
161
  }
134
162
  }
135
163
 
136
164
  &[data-range='start'] > .t-item {
137
165
  &:before {
138
- right: 0.25rem;
166
+ right: 0.625rem;
167
+ border-top-right-radius: 0;
168
+ border-bottom-right-radius: 0;
139
169
  }
140
170
 
141
171
  &:after {
142
172
  left: 100%;
143
173
  right: -2rem;
144
- transform: translateX(-1.4375rem) scaleY(0.6) scaleX(0.4) rotate(45deg);
174
+ transform: translateX(-1.6rem) scaleY(0.83) scaleX(0.5) rotate(45deg);
145
175
  }
146
176
  }
147
177
 
178
+ &[data-range='single'] > .t-item:after {
179
+ display: none;
180
+ }
181
+
148
182
  &[data-state='disabled'] {
149
183
  pointer-events: none;
150
184
 
package/styles/mixins/picker.scss CHANGED
@@ -28,6 +28,10 @@
28
28
  z-index: -1;
29
29
  border-radius: var(--tui-radius-m);
30
30
  }
31
+
32
+ &:after {
33
+ border-radius: 0.5rem;
34
+ }
31
35
  }
32
36
 
33
37
  .t-cell {
@@ -41,7 +45,7 @@
41
45
  cursor: pointer;
42
46
  background-clip: content-box;
43
47
  box-sizing: border-box;
44
- border: 2px solid transparent;
48
+ border: 0.125rem solid transparent;
45
49
 
46
50
  &:before {
47
51
  content: '';
@@ -74,7 +78,14 @@
74
78
  }
75
79
 
76
80
  &:not(:last-child):before {
77
- right: -$itemSize;
81
+ right: -0.25rem;
82
+ border-top-right-radius: 0;
83
+ border-bottom-right-radius: 0;
84
+ }
85
+
86
+ &:not([data-range='start']):not(:first-child):before {
87
+ border-top-left-radius: 0;
88
+ border-bottom-left-radius: 0;
78
89
  }
79
90
 
80
91
  &:last-child:first-child:before {
@@ -121,30 +132,53 @@
121
132
  }
122
133
  }
123
134
 
135
+ &[data-range='end'] {
136
+ &:before {
137
+ background: var(--tui-base-02);
138
+
139
+ :host._single & {
140
+ background: var(--tui-secondary-hover);
141
+ }
142
+ }
143
+
144
+ &:not(:first-child):before {
145
+ border-top-left-radius: 0;
146
+ border-bottom-left-radius: 0;
147
+ }
148
+ }
149
+
124
150
  &[data-range='end'] > .t-item {
125
151
  &:before {
126
- left: 0.25rem;
152
+ left: 0.625rem;
153
+ border-top-left-radius: 0;
154
+ border-bottom-left-radius: 0;
127
155
  }
128
156
 
129
157
  &:after {
130
158
  left: -2rem;
131
159
  right: 100%;
132
- transform: translateX(1.4375rem) scaleY(0.6) scaleX(0.4) rotate(45deg);
160
+ transform: translateX(1.6rem) scaleY(0.83) scaleX(0.5) rotate(45deg);
133
161
  }
134
162
  }
135
163
 
136
164
  &[data-range='start'] > .t-item {
137
165
  &:before {
138
- right: 0.25rem;
166
+ right: 0.625rem;
167
+ border-top-right-radius: 0;
168
+ border-bottom-right-radius: 0;
139
169
  }
140
170
 
141
171
  &:after {
142
172
  left: 100%;
143
173
  right: -2rem;
144
- transform: translateX(-1.4375rem) scaleY(0.6) scaleX(0.4) rotate(45deg);
174
+ transform: translateX(-1.6rem) scaleY(0.83) scaleX(0.5) rotate(45deg);
145
175
  }
146
176
  }
147
177
 
178
+ &[data-range='single'] > .t-item:after {
179
+ display: none;
180
+ }
181
+
148
182
  &[data-state='disabled'] {
149
183
  pointer-events: none;
150
184
 
@@ -153,13 +187,11 @@
153
187
  }
154
188
  }
155
189
 
156
- &[data-state='hover']:hover:not([data-range])
157
- > .t-item {
190
+ &[data-state='hover']:hover:not([data-range]) > .t-item {
158
191
  background-color: var(--tui-secondary-hover);
159
192
  }
160
193
 
161
- &[data-state='active']:hover:not([data-range])
162
- > .t-item {
194
+ &[data-state='active']:hover:not([data-range]) > .t-item {
163
195
  background-color: var(--tui-secondary-active);
164
196
  }
165
197
  }
package/styles/theme/wrapper/icon.less CHANGED
@@ -8,14 +8,14 @@
8
8
  color: var(--tui-text-01);
9
9
  opacity: 0.5;
10
10
 
11
- [tuiWrapper]:not([data-state='readonly']):hover .t-textfield-icon & {
11
+ [tuiWrapper]:not([data-state='readonly']):hover .t-textfield-icon &:not([data-state='disabled']) {
12
12
  opacity: 0.65;
13
13
  }
14
14
 
15
15
  &[data-mode='onDark'] {
16
16
  color: var(--tui-text-01-night);
17
17
 
18
- [tuiWrapper]:not([data-state='readonly']):hover .t-textfield-icon & {
18
+ [tuiWrapper]:not([data-state='readonly']):hover .t-textfield-icon &:not([data-state='disabled']) {
19
19
  opacity: 1;
20
20
  }
21
21