nntc-ui 0.2.11 → 0.2.12

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.
@@ -14,6 +14,10 @@ interface Props<T> {
14
14
  disableBorder?: boolean;
15
15
  allowDeselect?: boolean;
16
16
  showTooltips?: boolean;
17
+ /** Прокручивать вкладки, не перенося текст.
18
+ * Без флага, если набор не помещается в контейнер, вкладки сужаются и текст переносится.
19
+ */
20
+ scrollable?: boolean;
17
21
  /** Использовать внешнее состояние вместо внутреннего.
18
22
  * При включении компонент не управляет состоянием самостоятельно, а использует переданные value и onChange
19
23
  * */
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,YAAY,EAAmC,MAAM,OAAO,CAAC;AAKpG,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGrC,UAAU,KAAK,CAAC,CAAC;IACf,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACjB,eAAe,CAAC,EAAE,CAAC,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC;IACjC,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mEAAmE;IACnE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;SAEK;IACL,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wFAAwF;IACxF,KAAK,CAAC,EAAE,CAAC,CAAC;CACX;AAED,KAAK,SAAS,CAAC,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AA8KzF,eAAO,MAAM,IAAI,EAA4B,CAAC,CAAC,EAC7C,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,cAAc,CAAC,CAAA;CAAE,KACzD,YAAY,CAAC"}
1
+ {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../../src/components/navigation/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,YAAY,EAAmC,MAAM,OAAO,CAAC;AAKpG,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE1C,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAGrC,UAAU,KAAK,CAAC,CAAC;IACf,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC;IACjB,eAAe,CAAC,EAAE,CAAC,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC;IACjC,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,mEAAmE;IACnE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;SAEK;IACL,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,wFAAwF;IACxF,KAAK,CAAC,EAAE,CAAC,CAAC;CACX;AAED,KAAK,SAAS,CAAC,CAAC,IAAI,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAiLzF,eAAO,MAAM,IAAI,EAA4B,CAAC,CAAC,EAC7C,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,cAAc,CAAC,CAAA;CAAE,KACzD,YAAY,CAAC"}
package/index.css CHANGED
@@ -3299,6 +3299,7 @@
3299
3299
  }
3300
3300
 
3301
3301
  .tabs-module__root__m7YiQ {
3302
+ box-sizing: border-box;
3302
3303
  display: flex;
3303
3304
  flex-direction: row;
3304
3305
  align-items: center;
@@ -3336,6 +3337,72 @@
3336
3337
  gap: 8px;
3337
3338
  }
3338
3339
 
3340
+ .tabs-module__root__m7YiQ.tabs-module__small__hiwdI:not(.tabs-module__vertical__sPO6h) {
3341
+ height: 24px;
3342
+ }
3343
+
3344
+ .tabs-module__root__m7YiQ.tabs-module__medium__dvN0f:not(.tabs-module__vertical__sPO6h) {
3345
+ height: 28px;
3346
+ }
3347
+
3348
+ .tabs-module__root__m7YiQ.tabs-module__large__v3OJM:not(.tabs-module__vertical__sPO6h) {
3349
+ height: 32px;
3350
+ }
3351
+
3352
+ .tabs-module__root__m7YiQ.tabs-module__extraLarge__Vr50m:not(.tabs-module__vertical__sPO6h) {
3353
+ height: 40px;
3354
+ }
3355
+
3356
+ .tabs-module__root__m7YiQ.tabs-module__small__hiwdI:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR),
3357
+ .tabs-module__root__m7YiQ.tabs-module__medium__dvN0f:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR),
3358
+ .tabs-module__root__m7YiQ.tabs-module__large__v3OJM:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR),
3359
+ .tabs-module__root__m7YiQ.tabs-module__extraLarge__Vr50m:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) {
3360
+ align-items: stretch;
3361
+ height: auto;
3362
+ }
3363
+
3364
+ .tabs-module__root__m7YiQ.tabs-module__small__hiwdI:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) {
3365
+ min-height: 24px;
3366
+ }
3367
+
3368
+ .tabs-module__root__m7YiQ.tabs-module__medium__dvN0f:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) {
3369
+ min-height: 28px;
3370
+ }
3371
+
3372
+ .tabs-module__root__m7YiQ.tabs-module__large__v3OJM:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) {
3373
+ min-height: 32px;
3374
+ }
3375
+
3376
+ .tabs-module__root__m7YiQ.tabs-module__extraLarge__Vr50m:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) {
3377
+ min-height: 40px;
3378
+ }
3379
+
3380
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR:not(.tabs-module__vertical__sPO6h) {
3381
+ align-items: flex-start;
3382
+ height: auto;
3383
+ overflow: auto hidden;
3384
+ }
3385
+
3386
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR.tabs-module__small__hiwdI:not(.tabs-module__vertical__sPO6h) .tabs-module__tab__NoNie {
3387
+ height: 24px;
3388
+ }
3389
+
3390
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR.tabs-module__medium__dvN0f:not(.tabs-module__vertical__sPO6h) .tabs-module__tab__NoNie {
3391
+ height: 28px;
3392
+ }
3393
+
3394
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR.tabs-module__large__v3OJM:not(.tabs-module__vertical__sPO6h) .tabs-module__tab__NoNie {
3395
+ height: 32px;
3396
+ }
3397
+
3398
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR.tabs-module__extraLarge__Vr50m:not(.tabs-module__vertical__sPO6h) .tabs-module__tab__NoNie {
3399
+ height: 40px;
3400
+ }
3401
+
3402
+ .tabs-module__root__m7YiQ.tabs-module__scrollable__eR0BR.tabs-module__vertical__sPO6h {
3403
+ overflow: hidden auto;
3404
+ }
3405
+
3339
3406
  .tabs-module__root__m7YiQ.tabs-module__filled__Kzrnb {
3340
3407
  background-color: var(--theme-overlay-8);
3341
3408
  }
@@ -3390,20 +3457,34 @@
3390
3457
  height: 40px;
3391
3458
  }
3392
3459
 
3393
- .tabs-module__vertical__sPO6h.tabs-module__small__hiwdI .tabs-module__tab__NoNie {
3394
- padding-left: 8px;
3460
+ .tabs-module__root__m7YiQ:not(.tabs-module__vertical__sPO6h) .tabs-module__tab__NoNie {
3461
+ height: 100%;
3395
3462
  }
3396
3463
 
3397
- .tabs-module__vertical__sPO6h.tabs-module__medium__dvN0f .tabs-module__tab__NoNie {
3398
- padding-left: 8px;
3464
+ .tabs-module__root__m7YiQ:not(.tabs-module__vertical__sPO6h):not(.tabs-module__scrollable__eR0BR) .tabs-module__tab__NoNie {
3465
+ flex-shrink: 1;
3466
+ min-width: 0;
3467
+ height: auto;
3399
3468
  }
3400
3469
 
3401
- .tabs-module__vertical__sPO6h.tabs-module__large__v3OJM .tabs-module__tab__NoNie {
3402
- padding-left: 12px;
3470
+ .tabs-module__root__m7YiQ.tabs-module__vertical__sPO6h:not(.tabs-module__scrollable__eR0BR).tabs-module__small__hiwdI .tabs-module__tab__NoNie {
3471
+ height: auto;
3472
+ min-height: 24px;
3403
3473
  }
3404
3474
 
3405
- .tabs-module__vertical__sPO6h.tabs-module__extraLarge__Vr50m .tabs-module__tab__NoNie {
3406
- padding-left: 12px;
3475
+ .tabs-module__root__m7YiQ.tabs-module__vertical__sPO6h:not(.tabs-module__scrollable__eR0BR).tabs-module__medium__dvN0f .tabs-module__tab__NoNie {
3476
+ height: auto;
3477
+ min-height: 28px;
3478
+ }
3479
+
3480
+ .tabs-module__root__m7YiQ.tabs-module__vertical__sPO6h:not(.tabs-module__scrollable__eR0BR).tabs-module__large__v3OJM .tabs-module__tab__NoNie {
3481
+ height: auto;
3482
+ min-height: 32px;
3483
+ }
3484
+
3485
+ .tabs-module__root__m7YiQ.tabs-module__vertical__sPO6h:not(.tabs-module__scrollable__eR0BR).tabs-module__extraLarge__Vr50m .tabs-module__tab__NoNie {
3486
+ height: auto;
3487
+ min-height: 40px;
3407
3488
  }
3408
3489
 
3409
3490
  .tabs-module__tab__NoNie.tabs-module__tab-filled__Gmwpo {
@@ -3501,32 +3582,32 @@
3501
3582
  }
3502
3583
 
3503
3584
  .tabs-module__vertical__sPO6h.tabs-module__small__hiwdI .tabs-module__tab-title__XsuJP {
3504
- padding: 0;
3585
+ padding: 0 8px;
3505
3586
  }
3506
3587
 
3507
3588
  .tabs-module__vertical__sPO6h.tabs-module__medium__dvN0f .tabs-module__tab-title__XsuJP {
3508
- padding: 0 8px;
3589
+ padding: 0 16px;
3509
3590
  }
3510
3591
 
3511
3592
  .tabs-module__vertical__sPO6h.tabs-module__large__v3OJM .tabs-module__tab-title__XsuJP {
3512
- padding: 0 8px;
3593
+ padding: 0 20px;
3513
3594
  }
3514
3595
 
3515
3596
  .tabs-module__vertical__sPO6h.tabs-module__extraLarge__Vr50m .tabs-module__tab-title__XsuJP {
3516
- padding: 0 12px;
3597
+ padding: 0 24px;
3517
3598
  }
3518
3599
 
3519
3600
  .tabs-module__vertical__sPO6h.tabs-module__small__hiwdI .tabs-module__tab-title__XsuJP.tabs-module__icon-only__qDPjH {
3520
- padding: 0;
3601
+ padding: 0 8px;
3521
3602
  }
3522
3603
 
3523
3604
  .tabs-module__vertical__sPO6h.tabs-module__medium__dvN0f .tabs-module__tab-title__XsuJP.tabs-module__icon-only__qDPjH {
3524
- padding: 0 4px;
3605
+ padding: 0 12px;
3525
3606
  }
3526
3607
 
3527
3608
  .tabs-module__vertical__sPO6h.tabs-module__large__v3OJM .tabs-module__tab-title__XsuJP.tabs-module__icon-only__qDPjH,
3528
3609
  .tabs-module__vertical__sPO6h.tabs-module__extraLarge__Vr50m .tabs-module__tab-title__XsuJP.tabs-module__icon-only__qDPjH {
3529
- padding: 0 4px;
3610
+ padding: 0 16px;
3530
3611
  }
3531
3612
 
3532
3613
  .tabs-module__tab-title__XsuJP > span {
@@ -3540,6 +3621,17 @@
3540
3621
  white-space: nowrap;
3541
3622
  }
3542
3623
 
3624
+ .tabs-module__root__m7YiQ:not(.tabs-module__scrollable__eR0BR) .tabs-module__tab-title__XsuJP {
3625
+ min-width: 0;
3626
+ }
3627
+
3628
+ .tabs-module__root__m7YiQ:not(.tabs-module__scrollable__eR0BR) .tabs-module__tab-title__XsuJP > span {
3629
+ min-width: 0;
3630
+ overflow-wrap: break-word;
3631
+ text-overflow: unset;
3632
+ white-space: normal;
3633
+ }
3634
+
3543
3635
  .tabs-module__tab-border__tvFwj {
3544
3636
  flex: 0 0 auto;
3545
3637
  width: 100%;