@cloud-ru/ds-rating 1.0.4 → 1.0.5-preview-d50a3da1.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 (10) hide show
  1. package/dist/cjs/helperComponents/RatingStar/RatingStar.js +1 -1
  2. package/dist/cjs/helperComponents/RatingStar/styles.module.css +54 -54
  3. package/dist/cjs/style.css +54 -54
  4. package/dist/esm/helperComponents/RatingStar/RatingStar.js +1 -1
  5. package/dist/esm/helperComponents/RatingStar/styles.module.css +54 -54
  6. package/dist/esm/style.css +54 -54
  7. package/dist/tsconfig.cjs.tsbuildinfo +1 -1
  8. package/dist/tsconfig.esm.tsbuildinfo +1 -1
  9. package/package.json +3 -3
  10. package/src/helperComponents/RatingStar/RatingStar.tsx +2 -2
package/dist/cjs/helperComponents/RatingStar/RatingStar.js CHANGED
@@ -14,5 +14,5 @@ const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
14
14
  * Компонент RatingStar
15
15
  */
16
16
  function RatingStar({ value = constants_2.VALUE.Zero, appearance = constants_1.APPEARANCE.Yellow, size = constants_1.SIZE.S, className, readonly = false, handleMouseEnter, handleMouseLeave, handleKeyDown, handleClick, 'data-test-id': dataTestId, }) {
17
- return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.ratingStar, className), onKeyDown: handleKeyDown, tabIndex: readonly ? undefined : 0, "data-value": value, "data-size": size, "data-appearance": appearance, "aria-checked": value !== constants_2.VALUE.Zero, role: readonly ? undefined : 'radio', "data-test-id": dataTestId, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.firstStarContainer, "data-test-id": dataTestId ? constants_1.TEST_IDS.starHalfLeft : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(constants_2.VALUE.Half) : undefined, onMouseLeave: handleMouseLeave || undefined, onClick: handleClick ? () => handleClick(constants_2.VALUE.Half) : undefined, children: (0, jsx_runtime_1.jsx)(system_1.StarFilledSVG, { className: styles_module_scss_1.default.icon }) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.secondStarContainer, "data-test-id": dataTestId ? constants_1.TEST_IDS.starHalfRight : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(constants_2.VALUE.Full) : undefined, onMouseLeave: handleMouseLeave, onClick: handleClick ? () => handleClick(constants_2.VALUE.Full) : undefined, children: (0, jsx_runtime_1.jsx)(system_1.StarFilledSVG, { className: styles_module_scss_1.default.icon }) })] }));
17
+ return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles_module_scss_1.default.ratingStar, className), onKeyDown: handleKeyDown, tabIndex: readonly ? undefined : 0, "data-value": value, "data-size": size, "data-appearance": appearance, "aria-checked": value !== constants_2.VALUE.Zero, role: readonly ? undefined : 'radio', "data-test-id": dataTestId, children: [(0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.firstStarContainer, "data-test-id": dataTestId ? constants_1.TEST_IDS.starHalfLeft : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(constants_2.VALUE.Half) : undefined, onMouseLeave: handleMouseLeave || undefined, onClick: handleClick ? () => handleClick(constants_2.VALUE.Half) : undefined, children: (0, jsx_runtime_1.jsx)(system_1.StarFilledSVG, {}) }), (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.secondStarContainer, "data-test-id": dataTestId ? constants_1.TEST_IDS.starHalfRight : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(constants_2.VALUE.Full) : undefined, onMouseLeave: handleMouseLeave, onClick: handleClick ? () => handleClick(constants_2.VALUE.Full) : undefined, children: (0, jsx_runtime_1.jsx)(system_1.StarFilledSVG, {}) })] }));
18
18
  }
package/dist/cjs/helperComponents/RatingStar/styles.module.css CHANGED
@@ -47,164 +47,164 @@
47
47
  outline-offset:calc(-1 * var(--sn-primitive-strokeWeight-strokeSemiBold, 2px));
48
48
  }
49
49
  .ratingStar[data-appearance=primary][data-value="0%"] .firstStarContainer{
50
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
50
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
51
51
  }
52
52
  .ratingStar[data-appearance=primary][data-value="0%"] .secondStarContainer{
53
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
53
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
54
54
  }
55
55
  .ratingStar[data-appearance=primary][data-value="50%"] .firstStarContainer{
56
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
56
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
57
57
  }
58
58
  .ratingStar[data-appearance=primary][data-value="50%"] .secondStarContainer{
59
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
59
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
60
60
  }
61
61
  .ratingStar[data-appearance=primary][data-value="100%"] .firstStarContainer{
62
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
62
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
63
63
  }
64
64
  .ratingStar[data-appearance=primary][data-value="100%"] .secondStarContainer{
65
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
65
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
66
66
  }
67
67
  .ratingStar[data-appearance=neutral][data-value="0%"] .firstStarContainer{
68
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
68
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
69
69
  }
70
70
  .ratingStar[data-appearance=neutral][data-value="0%"] .secondStarContainer{
71
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
71
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
72
72
  }
73
73
  .ratingStar[data-appearance=neutral][data-value="50%"] .firstStarContainer{
74
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
74
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
75
75
  }
76
76
  .ratingStar[data-appearance=neutral][data-value="50%"] .secondStarContainer{
77
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
77
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
78
78
  }
79
79
  .ratingStar[data-appearance=neutral][data-value="100%"] .firstStarContainer{
80
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
80
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
81
81
  }
82
82
  .ratingStar[data-appearance=neutral][data-value="100%"] .secondStarContainer{
83
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
83
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
84
84
  }
85
85
  .ratingStar[data-appearance=red][data-value="0%"] .firstStarContainer{
86
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
86
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
87
87
  }
88
88
  .ratingStar[data-appearance=red][data-value="0%"] .secondStarContainer{
89
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
89
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
90
90
  }
91
91
  .ratingStar[data-appearance=red][data-value="50%"] .firstStarContainer{
92
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
92
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
93
93
  }
94
94
  .ratingStar[data-appearance=red][data-value="50%"] .secondStarContainer{
95
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
95
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
96
96
  }
97
97
  .ratingStar[data-appearance=red][data-value="100%"] .firstStarContainer{
98
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
98
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
99
99
  }
100
100
  .ratingStar[data-appearance=red][data-value="100%"] .secondStarContainer{
101
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
101
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
102
102
  }
103
103
  .ratingStar[data-appearance=orange][data-value="0%"] .firstStarContainer{
104
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
104
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
105
105
  }
106
106
  .ratingStar[data-appearance=orange][data-value="0%"] .secondStarContainer{
107
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
107
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
108
108
  }
109
109
  .ratingStar[data-appearance=orange][data-value="50%"] .firstStarContainer{
110
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
110
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
111
111
  }
112
112
  .ratingStar[data-appearance=orange][data-value="50%"] .secondStarContainer{
113
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
113
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
114
114
  }
115
115
  .ratingStar[data-appearance=orange][data-value="100%"] .firstStarContainer{
116
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
116
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
117
117
  }
118
118
  .ratingStar[data-appearance=orange][data-value="100%"] .secondStarContainer{
119
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
119
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
120
120
  }
121
121
  .ratingStar[data-appearance=yellow][data-value="0%"] .firstStarContainer{
122
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
122
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
123
123
  }
124
124
  .ratingStar[data-appearance=yellow][data-value="0%"] .secondStarContainer{
125
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
125
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
126
126
  }
127
127
  .ratingStar[data-appearance=yellow][data-value="50%"] .firstStarContainer{
128
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
128
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
129
129
  }
130
130
  .ratingStar[data-appearance=yellow][data-value="50%"] .secondStarContainer{
131
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
131
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
132
132
  }
133
133
  .ratingStar[data-appearance=yellow][data-value="100%"] .firstStarContainer{
134
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
134
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
135
135
  }
136
136
  .ratingStar[data-appearance=yellow][data-value="100%"] .secondStarContainer{
137
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
137
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
138
138
  }
139
139
  .ratingStar[data-appearance=green][data-value="0%"] .firstStarContainer{
140
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
140
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
141
141
  }
142
142
  .ratingStar[data-appearance=green][data-value="0%"] .secondStarContainer{
143
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
143
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
144
144
  }
145
145
  .ratingStar[data-appearance=green][data-value="50%"] .firstStarContainer{
146
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
146
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
147
147
  }
148
148
  .ratingStar[data-appearance=green][data-value="50%"] .secondStarContainer{
149
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
149
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
150
150
  }
151
151
  .ratingStar[data-appearance=green][data-value="100%"] .firstStarContainer{
152
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
152
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
153
153
  }
154
154
  .ratingStar[data-appearance=green][data-value="100%"] .secondStarContainer{
155
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
155
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
156
156
  }
157
157
  .ratingStar[data-appearance=blue][data-value="0%"] .firstStarContainer{
158
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
158
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
159
159
  }
160
160
  .ratingStar[data-appearance=blue][data-value="0%"] .secondStarContainer{
161
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
161
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
162
162
  }
163
163
  .ratingStar[data-appearance=blue][data-value="50%"] .firstStarContainer{
164
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
164
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
165
165
  }
166
166
  .ratingStar[data-appearance=blue][data-value="50%"] .secondStarContainer{
167
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
167
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
168
168
  }
169
169
  .ratingStar[data-appearance=blue][data-value="100%"] .firstStarContainer{
170
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
170
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
171
171
  }
172
172
  .ratingStar[data-appearance=blue][data-value="100%"] .secondStarContainer{
173
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
173
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
174
174
  }
175
175
  .ratingStar[data-appearance=violet][data-value="0%"] .firstStarContainer{
176
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
176
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
177
177
  }
178
178
  .ratingStar[data-appearance=violet][data-value="0%"] .secondStarContainer{
179
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
179
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
180
180
  }
181
181
  .ratingStar[data-appearance=violet][data-value="50%"] .firstStarContainer{
182
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
182
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
183
183
  }
184
184
  .ratingStar[data-appearance=violet][data-value="50%"] .secondStarContainer{
185
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
185
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
186
186
  }
187
187
  .ratingStar[data-appearance=violet][data-value="100%"] .firstStarContainer{
188
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
188
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
189
189
  }
190
190
  .ratingStar[data-appearance=violet][data-value="100%"] .secondStarContainer{
191
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
191
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
192
192
  }
193
193
  .ratingStar[data-appearance=pink][data-value="0%"] .firstStarContainer{
194
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
194
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
195
195
  }
196
196
  .ratingStar[data-appearance=pink][data-value="0%"] .secondStarContainer{
197
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
197
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
198
198
  }
199
199
  .ratingStar[data-appearance=pink][data-value="50%"] .firstStarContainer{
200
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
200
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
201
201
  }
202
202
  .ratingStar[data-appearance=pink][data-value="50%"] .secondStarContainer{
203
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
203
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
204
204
  }
205
205
  .ratingStar[data-appearance=pink][data-value="100%"] .firstStarContainer{
206
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
206
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
207
207
  }
208
208
  .ratingStar[data-appearance=pink][data-value="100%"] .secondStarContainer{
209
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
209
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
210
210
  }
package/dist/cjs/style.css CHANGED
@@ -51,164 +51,164 @@
51
51
  outline-offset:calc(-1 * var(--sn-primitive-strokeWeight-strokeSemiBold, 2px));
52
52
  }
53
53
  .ratingStar[data-appearance=primary][data-value="0%"] .firstStarContainer{
54
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
54
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
55
55
  }
56
56
  .ratingStar[data-appearance=primary][data-value="0%"] .secondStarContainer{
57
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
57
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
58
58
  }
59
59
  .ratingStar[data-appearance=primary][data-value="50%"] .firstStarContainer{
60
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
60
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
61
61
  }
62
62
  .ratingStar[data-appearance=primary][data-value="50%"] .secondStarContainer{
63
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
63
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
64
64
  }
65
65
  .ratingStar[data-appearance=primary][data-value="100%"] .firstStarContainer{
66
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
66
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
67
67
  }
68
68
  .ratingStar[data-appearance=primary][data-value="100%"] .secondStarContainer{
69
- color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-55, var(--sn-brandRole-color-brandA-55, var(--sn-primitive-color-brandA-55, #389f74))));
69
+ color:var(--sn-theme-color-primary-accent, var(--sn-brand-color-primary-50, #389f74));
70
70
  }
71
71
  .ratingStar[data-appearance=neutral][data-value="0%"] .firstStarContainer{
72
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
72
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
73
73
  }
74
74
  .ratingStar[data-appearance=neutral][data-value="0%"] .secondStarContainer{
75
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
75
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
76
76
  }
77
77
  .ratingStar[data-appearance=neutral][data-value="50%"] .firstStarContainer{
78
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
78
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
79
79
  }
80
80
  .ratingStar[data-appearance=neutral][data-value="50%"] .secondStarContainer{
81
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
81
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
82
82
  }
83
83
  .ratingStar[data-appearance=neutral][data-value="100%"] .firstStarContainer{
84
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
84
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
85
85
  }
86
86
  .ratingStar[data-appearance=neutral][data-value="100%"] .secondStarContainer{
87
- color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-55, var(--sn-primitive-color-gray-55, #8b8fa7)));
87
+ color:var(--sn-theme-color-neutral-accent, var(--sn-brand-color-neutral-50, var(--sn-brand-palette-gray-50, #8b8fa7)));
88
88
  }
89
89
  .ratingStar[data-appearance=red][data-value="0%"] .firstStarContainer{
90
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
90
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
91
91
  }
92
92
  .ratingStar[data-appearance=red][data-value="0%"] .secondStarContainer{
93
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
93
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
94
94
  }
95
95
  .ratingStar[data-appearance=red][data-value="50%"] .firstStarContainer{
96
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
96
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
97
97
  }
98
98
  .ratingStar[data-appearance=red][data-value="50%"] .secondStarContainer{
99
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
99
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
100
100
  }
101
101
  .ratingStar[data-appearance=red][data-value="100%"] .firstStarContainer{
102
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
102
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
103
103
  }
104
104
  .ratingStar[data-appearance=red][data-value="100%"] .secondStarContainer{
105
- color:var(--sn-theme-color-red-accent, var(--sn-primitive-color-red-55, #d52e33));
105
+ color:var(--sn-theme-color-red-accent, var(--sn-brand-palette-red-50, #d52e33));
106
106
  }
107
107
  .ratingStar[data-appearance=orange][data-value="0%"] .firstStarContainer{
108
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
108
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
109
109
  }
110
110
  .ratingStar[data-appearance=orange][data-value="0%"] .secondStarContainer{
111
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
111
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
112
112
  }
113
113
  .ratingStar[data-appearance=orange][data-value="50%"] .firstStarContainer{
114
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
114
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
115
115
  }
116
116
  .ratingStar[data-appearance=orange][data-value="50%"] .secondStarContainer{
117
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
117
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
118
118
  }
119
119
  .ratingStar[data-appearance=orange][data-value="100%"] .firstStarContainer{
120
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
120
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
121
121
  }
122
122
  .ratingStar[data-appearance=orange][data-value="100%"] .secondStarContainer{
123
- color:var(--sn-theme-color-orange-accent, var(--sn-primitive-color-orange-55, #f57e1f));
123
+ color:var(--sn-theme-color-orange-accent, var(--sn-brand-palette-orange-50, #f57e1f));
124
124
  }
125
125
  .ratingStar[data-appearance=yellow][data-value="0%"] .firstStarContainer{
126
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
126
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
127
127
  }
128
128
  .ratingStar[data-appearance=yellow][data-value="0%"] .secondStarContainer{
129
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
129
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
130
130
  }
131
131
  .ratingStar[data-appearance=yellow][data-value="50%"] .firstStarContainer{
132
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
132
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
133
133
  }
134
134
  .ratingStar[data-appearance=yellow][data-value="50%"] .secondStarContainer{
135
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
135
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
136
136
  }
137
137
  .ratingStar[data-appearance=yellow][data-value="100%"] .firstStarContainer{
138
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
138
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
139
139
  }
140
140
  .ratingStar[data-appearance=yellow][data-value="100%"] .secondStarContainer{
141
- color:var(--sn-theme-color-yellow-accent, var(--sn-primitive-color-yellow-55, #f3b917));
141
+ color:var(--sn-theme-color-yellow-accent, var(--sn-brand-palette-yellow-50, #f3b917));
142
142
  }
143
143
  .ratingStar[data-appearance=green][data-value="0%"] .firstStarContainer{
144
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
144
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
145
145
  }
146
146
  .ratingStar[data-appearance=green][data-value="0%"] .secondStarContainer{
147
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
147
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
148
148
  }
149
149
  .ratingStar[data-appearance=green][data-value="50%"] .firstStarContainer{
150
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
150
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
151
151
  }
152
152
  .ratingStar[data-appearance=green][data-value="50%"] .secondStarContainer{
153
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
153
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
154
154
  }
155
155
  .ratingStar[data-appearance=green][data-value="100%"] .firstStarContainer{
156
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
156
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
157
157
  }
158
158
  .ratingStar[data-appearance=green][data-value="100%"] .secondStarContainer{
159
- color:var(--sn-theme-color-green-accent, var(--sn-primitive-color-green-55, #41b954));
159
+ color:var(--sn-theme-color-green-accent, var(--sn-brand-palette-green-50, #41b954));
160
160
  }
161
161
  .ratingStar[data-appearance=blue][data-value="0%"] .firstStarContainer{
162
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
162
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
163
163
  }
164
164
  .ratingStar[data-appearance=blue][data-value="0%"] .secondStarContainer{
165
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
165
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
166
166
  }
167
167
  .ratingStar[data-appearance=blue][data-value="50%"] .firstStarContainer{
168
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
168
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
169
169
  }
170
170
  .ratingStar[data-appearance=blue][data-value="50%"] .secondStarContainer{
171
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
171
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
172
172
  }
173
173
  .ratingStar[data-appearance=blue][data-value="100%"] .firstStarContainer{
174
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
174
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
175
175
  }
176
176
  .ratingStar[data-appearance=blue][data-value="100%"] .secondStarContainer{
177
- color:var(--sn-theme-color-blue-accent, var(--sn-primitive-color-blue-55, #4387e2));
177
+ color:var(--sn-theme-color-blue-accent, var(--sn-brand-palette-blue-50, #4387e2));
178
178
  }
179
179
  .ratingStar[data-appearance=violet][data-value="0%"] .firstStarContainer{
180
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
180
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
181
181
  }
182
182
  .ratingStar[data-appearance=violet][data-value="0%"] .secondStarContainer{
183
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
183
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
184
184
  }
185
185
  .ratingStar[data-appearance=violet][data-value="50%"] .firstStarContainer{
186
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
186
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
187
187
  }
188
188
  .ratingStar[data-appearance=violet][data-value="50%"] .secondStarContainer{
189
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
189
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
190
190
  }
191
191
  .ratingStar[data-appearance=violet][data-value="100%"] .firstStarContainer{
192
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
192
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
193
193
  }
194
194
  .ratingStar[data-appearance=violet][data-value="100%"] .secondStarContainer{
195
- color:var(--sn-theme-color-violet-accent, var(--sn-primitive-color-violet-55, #b163cc));
195
+ color:var(--sn-theme-color-violet-accent, var(--sn-brand-palette-violet-50, #b163cc));
196
196
  }
197
197
  .ratingStar[data-appearance=pink][data-value="0%"] .firstStarContainer{
198
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
198
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
199
199
  }
200
200
  .ratingStar[data-appearance=pink][data-value="0%"] .secondStarContainer{
201
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
201
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
202
202
  }
203
203
  .ratingStar[data-appearance=pink][data-value="50%"] .firstStarContainer{
204
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
204
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
205
205
  }
206
206
  .ratingStar[data-appearance=pink][data-value="50%"] .secondStarContainer{
207
- color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-primitive-color-gray-80, #e3e5ed)));
207
+ color:var(--sn-theme-color-neutral-decor, var(--sn-brand-color-neutral-80, var(--sn-brand-palette-gray-80, #e3e5ed)));
208
208
  }
209
209
  .ratingStar[data-appearance=pink][data-value="100%"] .firstStarContainer{
210
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
210
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
211
211
  }
212
212
  .ratingStar[data-appearance=pink][data-value="100%"] .secondStarContainer{
213
- color:var(--sn-theme-color-pink-accent, var(--sn-primitive-color-pink-55, #dd5a8e));
213
+ color:var(--sn-theme-color-pink-accent, var(--sn-brand-palette-pink-50, #dd5a8e));
214
214
  }
package/dist/esm/helperComponents/RatingStar/RatingStar.js CHANGED
@@ -8,5 +8,5 @@ import styles from './styles.module.css';
8
8
  * Компонент RatingStar
9
9
  */
10
10
  export function RatingStar({ value = VALUE.Zero, appearance = APPEARANCE.Yellow, size = SIZE.S, className, readonly = false, handleMouseEnter, handleMouseLeave, handleKeyDown, handleClick, 'data-test-id': dataTestId, }) {
11
- return (_jsxs("div", { className: cn(styles.ratingStar, className), onKeyDown: handleKeyDown, tabIndex: readonly ? undefined : 0, "data-value": value, "data-size": size, "data-appearance": appearance, "aria-checked": value !== VALUE.Zero, role: readonly ? undefined : 'radio', "data-test-id": dataTestId, children: [_jsx("div", { className: styles.firstStarContainer, "data-test-id": dataTestId ? TEST_IDS.starHalfLeft : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(VALUE.Half) : undefined, onMouseLeave: handleMouseLeave || undefined, onClick: handleClick ? () => handleClick(VALUE.Half) : undefined, children: _jsx(StarFilledSVG, { className: styles.icon }) }), _jsx("div", { className: styles.secondStarContainer, "data-test-id": dataTestId ? TEST_IDS.starHalfRight : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(VALUE.Full) : undefined, onMouseLeave: handleMouseLeave, onClick: handleClick ? () => handleClick(VALUE.Full) : undefined, children: _jsx(StarFilledSVG, { className: styles.icon }) })] }));
11
+ return (_jsxs("div", { className: cn(styles.ratingStar, className), onKeyDown: handleKeyDown, tabIndex: readonly ? undefined : 0, "data-value": value, "data-size": size, "data-appearance": appearance, "aria-checked": value !== VALUE.Zero, role: readonly ? undefined : 'radio', "data-test-id": dataTestId, children: [_jsx("div", { className: styles.firstStarContainer, "data-test-id": dataTestId ? TEST_IDS.starHalfLeft : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(VALUE.Half) : undefined, onMouseLeave: handleMouseLeave || undefined, onClick: handleClick ? () => handleClick(VALUE.Half) : undefined, children: _jsx(StarFilledSVG, {}) }), _jsx("div", { className: styles.secondStarContainer, "data-test-id": dataTestId ? TEST_IDS.starHalfRight : undefined, onMouseEnter: handleMouseEnter ? () => handleMouseEnter(VALUE.Full) : undefined, onMouseLeave: handleMouseLeave, onClick: handleClick ? () => handleClick(VALUE.Full) : undefined, children: _jsx(StarFilledSVG, {}) })] }));
12
12
  }