@cloud-ru/ds-fields 2.2.7-preview-d50a3da1.0 → 2.2.7-preview-e30f4f90.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 (62) hide show
  1. package/README.md +0 -1
  2. package/dist/cjs/components/FieldColor/FieldColor.js +1 -1
  3. package/dist/cjs/components/FieldColor/styles.module.css +9 -9
  4. package/dist/cjs/components/FieldCombo/FieldCombo.js +1 -1
  5. package/dist/cjs/components/FieldDate/styles.module.css +3 -3
  6. package/dist/cjs/components/FieldSecure/FieldSecure.js +1 -1
  7. package/dist/cjs/components/FieldSelect/FieldSelect.js +2 -2
  8. package/dist/cjs/components/FieldSelect/styles.module.css +18 -15
  9. package/dist/cjs/components/FieldSelect/types.d.ts +1 -1
  10. package/dist/cjs/components/FieldSlider/FieldSlider.js +1 -1
  11. package/dist/cjs/components/FieldSlider/styles.module.css +7 -0
  12. package/dist/cjs/components/FieldStepper/FieldStepper.js +2 -2
  13. package/dist/cjs/components/FieldStepper/styles.module.css +52 -6
  14. package/dist/cjs/components/FieldTextArea/FieldTextArea.js +1 -1
  15. package/dist/cjs/components/FieldTextArea/styles.module.css +36 -39
  16. package/dist/cjs/components/FieldTime/FieldTime.js +1 -1
  17. package/dist/cjs/components/shared/helperComponents/FieldElementButton/styles.module.css +22 -22
  18. package/dist/cjs/components/shared/helperComponents/FieldShell/FieldShell.d.ts +1 -3
  19. package/dist/cjs/components/shared/helperComponents/FieldShell/FieldShell.js +2 -2
  20. package/dist/cjs/components/shared/styles.module.css +124 -151
  21. package/dist/cjs/style.css +271 -245
  22. package/dist/esm/components/FieldColor/FieldColor.js +1 -1
  23. package/dist/esm/components/FieldColor/styles.module.css +9 -9
  24. package/dist/esm/components/FieldCombo/FieldCombo.js +1 -1
  25. package/dist/esm/components/FieldDate/styles.module.css +3 -3
  26. package/dist/esm/components/FieldSecure/FieldSecure.js +1 -1
  27. package/dist/esm/components/FieldSelect/FieldSelect.js +2 -2
  28. package/dist/esm/components/FieldSelect/styles.module.css +18 -15
  29. package/dist/esm/components/FieldSelect/types.d.ts +1 -1
  30. package/dist/esm/components/FieldSlider/FieldSlider.js +2 -2
  31. package/dist/esm/components/FieldSlider/styles.module.css +7 -0
  32. package/dist/esm/components/FieldStepper/FieldStepper.js +2 -2
  33. package/dist/esm/components/FieldStepper/styles.module.css +52 -6
  34. package/dist/esm/components/FieldTextArea/FieldTextArea.js +1 -1
  35. package/dist/esm/components/FieldTextArea/styles.module.css +36 -39
  36. package/dist/esm/components/FieldTime/FieldTime.js +1 -1
  37. package/dist/esm/components/shared/helperComponents/FieldElementButton/styles.module.css +22 -22
  38. package/dist/esm/components/shared/helperComponents/FieldShell/FieldShell.d.ts +1 -3
  39. package/dist/esm/components/shared/helperComponents/FieldShell/FieldShell.js +2 -2
  40. package/dist/esm/components/shared/styles.module.css +124 -151
  41. package/dist/esm/style.css +271 -245
  42. package/dist/tsconfig.cjs.tsbuildinfo +1 -1
  43. package/dist/tsconfig.esm.tsbuildinfo +1 -1
  44. package/package.json +17 -17
  45. package/src/components/FieldColor/FieldColor.tsx +1 -1
  46. package/src/components/FieldColor/styles.module.scss +7 -5
  47. package/src/components/FieldCombo/FieldCombo.tsx +1 -1
  48. package/src/components/FieldDate/styles.module.scss +1 -1
  49. package/src/components/FieldSecure/FieldSecure.tsx +1 -2
  50. package/src/components/FieldSelect/FieldSelect.tsx +0 -2
  51. package/src/components/FieldSelect/styles.module.scss +5 -7
  52. package/src/components/FieldSelect/types.ts +0 -1
  53. package/src/components/FieldSlider/FieldSlider.tsx +3 -3
  54. package/src/components/FieldSlider/styles.module.scss +8 -0
  55. package/src/components/FieldStepper/FieldStepper.tsx +41 -46
  56. package/src/components/FieldStepper/styles.module.scss +60 -10
  57. package/src/components/FieldTextArea/FieldTextArea.tsx +1 -2
  58. package/src/components/FieldTextArea/styles.module.scss +22 -33
  59. package/src/components/FieldTime/FieldTime.tsx +1 -1
  60. package/src/components/shared/helperComponents/FieldElementButton/styles.module.scss +2 -2
  61. package/src/components/shared/helperComponents/FieldShell/FieldShell.tsx +0 -4
  62. package/src/components/shared/styles.module.scss +17 -58
@@ -207,28 +207,6 @@ $sizes: 's', 'm', 'l';
207
207
 
208
208
  @each $size in $sizes {
209
209
  &[data-size='#{$size}'] {
210
- // Отступы inputWrapper — только вокруг input: кнопки стоят вплотную к postfix / иконке / краю, как в макете.
211
- $inputPaddingLeft: base.simple-var(
212
- field.$field,
213
- 'anatomy',
214
- 'size',
215
- $size,
216
- 'fieldContainer',
217
- 'contentWrapper',
218
- 'inputWrapper',
219
- 'padding-left'
220
- );
221
- $inputPaddingRight: base.simple-var(
222
- field.$field,
223
- 'anatomy',
224
- 'size',
225
- $size,
226
- 'fieldContainer',
227
- 'contentWrapper',
228
- 'inputWrapper',
229
- 'padding-right'
230
- );
231
-
232
210
  .lineWrapper {
233
211
  display: none;
234
212
  width: 0;
@@ -255,33 +233,18 @@ $sizes: 's', 'm', 'l';
255
233
  padding: $paddingTop $paddingRight $paddingBottom $paddingLeft;
256
234
  }
257
235
 
258
- // В мастере `multiLine/minHeight` стоит только у варианта `resizable=true`, остальные
259
- // живут на высоте одной строки.
260
- &[data-resizable] .fieldContainer {
261
- min-height: base.simple-var(
236
+ .inputLine {
237
+ @include base.composite-var(
262
238
  field.$field,
263
239
  'anatomy',
264
240
  'size',
265
241
  $size,
266
242
  'fieldContainer',
267
- 'multiLine',
268
- 'min-height'
243
+ 'contentWrapper',
244
+ 'inputLine'
269
245
  );
270
246
  }
271
247
 
272
- .inputArea {
273
- padding-right: $inputPaddingRight;
274
- padding-left: $inputPaddingLeft;
275
- }
276
-
277
- .prefix {
278
- padding-left: $inputPaddingLeft;
279
- }
280
-
281
- .postfix {
282
- padding-right: $inputPaddingRight;
283
- }
284
-
285
248
  .prefix,
286
249
  .postfix,
287
250
  .fieldInput {
@@ -296,7 +259,7 @@ $sizes: 's', 'm', 'l';
296
259
  $size,
297
260
  'fieldContainer',
298
261
  'centeredWrapper',
299
- 'height'
262
+ 'max-height'
300
263
  );
301
264
 
302
265
  // Иконки полей (iconBefore/iconAfter + декоративные chevron/calendar/watch) масштабируются
@@ -304,10 +267,10 @@ $sizes: 's', 'm', 'l';
304
267
  // приём, что в @cloud-ru/ds-button: @cloud-ru/ds-icons задают инлайн `style="width:24"`, который перебивает
305
268
  // обычный width, но не max-width, поэтому svg клампится к нужному размеру без JS-пропа.
306
269
  svg {
307
- $iconSlotSize: base.$sn-density-icon-s;
270
+ $iconSlotSize: base.$sn-density-size-icon-s;
308
271
 
309
272
  @if $size == 's' {
310
- $iconSlotSize: base.$sn-density-icon-xs;
273
+ $iconSlotSize: base.$sn-density-size-icon-xs;
311
274
  }
312
275
 
313
276
  max-width: $iconSlotSize;
@@ -317,26 +280,28 @@ $sizes: 's', 'm', 'l';
317
280
 
318
281
  .clearButtonSlot,
319
282
  .postfixButtonsSlot {
320
- // Кнопки clear/copy — иконный квадрат слота centeredWrapper (как легаси ButtonClearValue), а не кнопка 32px.
321
- // Размер кнопки — BUTTON_SIZE_MAP из @cloud-ru/ds-input-private: field s → button s, m/l → m.
322
- $slotWidth: base.simple-var(field.$field, 'anatomy', 'size', $size, 'fieldContainer', 'centeredWrapper', 'width');
323
- $iconSquare: base.$sn-density-icon-s;
283
+ // Кнопки clear/copy — иконный квадрат (паритет с легаси ButtonClearValue: 16px при s,
284
+ // 24px при m/l), а не полноразмерная function-кнопка 32px. Те же icon-токены, что у .iconSlot.
285
+ // @cloud-ru/ds-button читает min-height и iconOnly-minWidth через var() (figma-variables
286
+ // button.module.scss) — локальный override сжимает кнопку до иконного квадрата без
287
+ // правки @cloud-ru/ds-button. BUTTON_SIZE_MAP (@cloud-ru/ds-input-private): field s → button s, m/l → m.
288
+ $iconSquare: base.$sn-density-size-icon-s;
324
289
  $btnSize: 'm';
325
290
 
326
291
  @if $size == 's' {
327
- $iconSquare: base.$sn-density-icon-xs;
292
+ $iconSquare: base.$sn-density-size-icon-xs;
328
293
  $btnSize: 's';
329
294
  }
330
295
 
331
296
  --sn-button-anatomy-size-#{$btnSize}-container-minHeight: #{$iconSquare};
332
- --sn-button-anatomy-size-#{$btnSize}-container-iconOnly-minWidth: #{$slotWidth};
297
+ --sn-button-anatomy-size-#{$btnSize}-container-iconOnly-minWidth: #{$iconSquare};
333
298
 
334
- max-width: $slotWidth;
299
+ max-width: $iconSquare;
335
300
  max-height: $iconSquare;
336
301
 
337
302
  // Иконки @cloud-ru/ds-icons инлайнят style width:24 — без max-* кнопка при field s не сожмётся до 16.
338
303
  svg {
339
- max-width: $slotWidth;
304
+ max-width: $iconSquare;
340
305
  max-height: $iconSquare;
341
306
  }
342
307
  }
@@ -383,12 +348,6 @@ $sizes: 's', 'm', 'l';
383
348
  &[data-disabled='true'] {
384
349
  cursor: not-allowed;
385
350
  opacity: base.$sn-theme-effect-opacity-disabled;
386
-
387
- // Кнопка сегмента, которая в макете не переходит в disabled вместе с полем (глаз FieldSecure):
388
- // поле уже затемнено целиком, собственное затемнение кнопки (FieldElementButton) снимаем.
389
- .elementButtonInheritDisabled[data-disabled='true'] > * {
390
- opacity: 1;
391
- }
392
351
  }
393
352
 
394
353
  &[data-readonly='true']:not([data-disabled='true']) {