forstok-ui-lib 8.3.11 → 8.3.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "forstok-ui-lib",
3
- "version": "8.3.11",
3
+ "version": "8.3.12",
4
4
  "description": "Forstok UI Components Library",
5
5
  "path": "dist",
6
6
  "main": "dist/index.js",
@@ -17,10 +17,10 @@ const getTabsContentModFunc = ({ $mode }: { $mode?: string }) => {
17
17
  let style = ``;
18
18
  if ($mode === "list") {
19
19
  style += `
20
- min-height: 750px;
21
- @media only screen and (min-width: 1280px) {
22
- min-height: 600px;
23
- }
20
+ // min-height: 750px;
21
+ // @media only screen and (min-width: 1280px) {
22
+ // min-height: 600px;
23
+ // }
24
24
  `;
25
25
  } else if ($mode === "chat") {
26
26
  style += `
@@ -3091,17 +3091,16 @@ export const ItemTable = styled.section``;
3091
3091
  const listTableStyles = {
3092
3092
  item: css`
3093
3093
  ${ItemTable} {
3094
- grid-template-columns: var(--checkbox) var(--item) minmax(
3095
- auto,
3096
- max-content
3097
- ) var(--time) minmax(88px, auto);
3094
+ grid-template-columns:
3095
+ var(--checkbox) var(--item) minmax(auto, max-content)
3096
+ var(--time) minmax(88px, auto);
3098
3097
  &[role="rowheader"] > div[role="group"],
3099
3098
  &[role="row"] > div[role="cellgroup"] > div[role="rowgroup"],
3100
3099
  ._refCollapse > div:not(._refCollapseContainer),
3101
3100
  ._refCollapseContainer > div {
3102
- grid-template-columns: var(--variant) var(--sku) var(--qty-big) var(
3103
- --price
3104
- ) var(--status-big);
3101
+ grid-template-columns:
3102
+ var(--variant) var(--sku) var(--qty-big) var(--price)
3103
+ var(--status-big);
3105
3104
  }
3106
3105
  input[name="checkbox-list"] {
3107
3106
  & + span {
@@ -3112,33 +3111,31 @@ const listTableStyles = {
3112
3111
  `,
3113
3112
  "item-nocheck": css`
3114
3113
  ${ItemTable} {
3115
- grid-template-columns: var(--item) minmax(auto, max-content) var(
3116
- --time
3117
- ) minmax(88px, auto);
3114
+ grid-template-columns:
3115
+ var(--item) minmax(auto, max-content) var(--time)
3116
+ minmax(88px, auto);
3118
3117
  &[role="rowheader"] > div[role="group"],
3119
3118
  &[role="row"] > div[role="cellgroup"] > div[role="rowgroup"],
3120
3119
  ._refCollapse > div:not(._refCollapseContainer),
3121
3120
  ._refCollapseContainer > div {
3122
- grid-template-columns: var(--variant) var(--sku) var(--qty-big) var(
3123
- --price
3124
- ) var(--status-big);
3121
+ grid-template-columns:
3122
+ var(--variant) var(--sku) var(--qty-big) var(--price)
3123
+ var(--status-big);
3125
3124
  }
3126
3125
  }
3127
3126
  `,
3128
3127
  listing: css`
3129
3128
  ${ItemTable} {
3130
- grid-template-columns: var(--checkbox) var(--item) minmax(
3131
- auto,
3132
- max-content
3133
- ) minmax(88px, auto);
3129
+ grid-template-columns:
3130
+ var(--checkbox) var(--item) minmax(auto, max-content)
3131
+ minmax(88px, auto);
3134
3132
  &[role="rowheader"] > div[role="group"],
3135
3133
  &[role="row"] > div[role="cellgroup"] > div[role="rowgroup"],
3136
3134
  ._refCollapse > div:not(._refCollapseContainer),
3137
3135
  ._refCollapseContainer > div {
3138
- grid-template-columns: var(--variant) var(--sku) var(--sku) minmax(
3139
- 95px,
3140
- 115px
3141
- ) var(--price) var(--status-small);
3136
+ grid-template-columns:
3137
+ var(--variant) var(--sku) var(--sku) minmax(95px, 115px)
3138
+ var(--price) var(--status-small);
3142
3139
  }
3143
3140
  input[name="checkbox-list"] {
3144
3141
  & + span {
@@ -3157,10 +3154,9 @@ const listTableStyles = {
3157
3154
  &[role="row"] > div[role="cellgroup"] > div[role="rowgroup"],
3158
3155
  ._refCollapse > div:not(._refCollapseContainer),
3159
3156
  ._refCollapseContainer > div {
3160
- grid-template-columns: var(--variant) var(--sku) var(--sku) minmax(
3161
- 95px,
3162
- 115px
3163
- ) var(--price) var(--status-small);
3157
+ grid-template-columns:
3158
+ var(--variant) var(--sku) var(--sku) minmax(95px, 115px)
3159
+ var(--price) var(--status-small);
3164
3160
  }
3165
3161
  }
3166
3162
  `,
@@ -3369,9 +3365,9 @@ const listTableStyles = {
3369
3365
  `,
3370
3366
  picklist: css`
3371
3367
  ${ItemTable} {
3372
- grid-template-columns: var(--checkbox) var(--time) var(--id) var(
3373
- --status
3374
- ) var(--person) var(--warehouse) var(--ref) var(--time) minmax(
3368
+ grid-template-columns:
3369
+ var(--checkbox) var(--time) var(--id) var(--status)
3370
+ var(--person) var(--warehouse) var(--ref) var(--time) minmax(
3375
3371
  185px,
3376
3372
  auto
3377
3373
  );
@@ -3379,29 +3375,28 @@ const listTableStyles = {
3379
3375
  `,
3380
3376
  package: css`
3381
3377
  ${ItemTable} {
3382
- grid-template-columns: var(--checkbox) var(--time) var(--id) var(
3383
- --status
3384
- ) var(--person) var(--warehouse) var(--person) var(--ref) var(
3385
- --time
3386
- ) minmax(110px, auto);
3378
+ grid-template-columns:
3379
+ var(--checkbox) var(--time) var(--id) var(--status)
3380
+ var(--person) var(--warehouse) var(--person) var(--ref) var(--time)
3381
+ minmax(110px, auto);
3387
3382
  }
3388
3383
  `,
3389
3384
  shipment: css`
3390
3385
  ${ItemTable} {
3391
- grid-template-columns: var(--checkbox) var(--time) var(--id-big) var(
3392
- --status
3393
- ) minmax(80px, 160px) minmax(80px, 160px) minmax(95px, 160px) var(
3394
- --ref
3395
- ) minmax(140px, auto);
3386
+ grid-template-columns:
3387
+ var(--checkbox) var(--time) var(--id-big) var(--status)
3388
+ minmax(80px, 160px) minmax(80px, 160px) minmax(95px, 160px) var(--ref)
3389
+ minmax(140px, auto);
3396
3390
  }
3397
3391
  `,
3398
3392
  invoice: css`
3399
3393
  ${ItemTable} {
3400
- grid-template-columns: var(--checkbox) var(--id-big) var(
3401
- --status-small
3402
- ) var(--store) var(--price) var(--price) var(--ref) var(--person) var(
3394
+ grid-template-columns:
3395
+ var(--checkbox) var(--id-big) var(--status-small)
3396
+ var(--store) var(--price) var(--price) var(--ref) var(--person) var(
3403
3397
  --time
3404
- ) minmax(180px, auto);
3398
+ )
3399
+ minmax(180px, auto);
3405
3400
  @media only screen and (max-width: 1279px) {
3406
3401
  width: unset;
3407
3402
  }
@@ -3409,37 +3404,37 @@ const listTableStyles = {
3409
3404
  `,
3410
3405
  "payment-receive": css`
3411
3406
  ${ItemTable} {
3412
- grid-template-columns: var(--time) 155px var(--person) var(--qty) var(
3413
- --price
3414
- ) minmax(110px, auto);
3407
+ grid-template-columns:
3408
+ var(--time) 155px var(--person) var(--qty) var(--price)
3409
+ minmax(110px, auto);
3415
3410
  }
3416
3411
  `,
3417
3412
  "sales-return": css`
3418
3413
  ${ItemTable} {
3419
- grid-template-columns: var(--id-big) var(--status) var(--warehouse) var(
3420
- --person
3421
- ) var(--person) var(--ref-big) var(--time) minmax(120px, auto);
3414
+ grid-template-columns:
3415
+ var(--id-big) var(--status) var(--warehouse) var(--person)
3416
+ var(--person) var(--ref-big) var(--time) minmax(120px, auto);
3422
3417
  }
3423
3418
  `,
3424
3419
  activity: css`
3425
3420
  ${ItemTable} {
3426
- grid-template-columns: var(--time) var(--id-big) var(--item) var(
3427
- --status
3428
- ) var(--email) var(--status) var(--status) minmax(110px, auto);
3421
+ grid-template-columns:
3422
+ var(--time) var(--id-big) var(--item) var(--status)
3423
+ var(--email) var(--status) var(--status) minmax(110px, auto);
3429
3424
  }
3430
3425
  `,
3431
3426
  putaway: css`
3432
3427
  ${ItemTable} {
3433
- grid-template-columns: var(--id-pd20) var(--status-big) var(
3434
- --warehouse
3435
- ) var(--ref) var(--person) var(--time) minmax(60px, auto);
3428
+ grid-template-columns:
3429
+ var(--id-pd20) var(--status-big) var(--warehouse)
3430
+ var(--ref) var(--person) var(--time) minmax(60px, auto);
3436
3431
  }
3437
3432
  `,
3438
3433
  inbound: css`
3439
3434
  ${ItemTable} {
3440
- grid-template-columns: var(--id-pd20) var(--status-big) var(
3441
- --warehouse
3442
- ) var(--ref) minmax(140px, 160px) var(--person) var(--time) minmax(
3435
+ grid-template-columns:
3436
+ var(--id-pd20) var(--status-big) var(--warehouse)
3437
+ var(--ref) minmax(140px, 160px) var(--person) var(--time) minmax(
3443
3438
  170px,
3444
3439
  auto
3445
3440
  );
@@ -3447,9 +3442,9 @@ const listTableStyles = {
3447
3442
  `,
3448
3443
  lowstock: css`
3449
3444
  ${ItemTable} {
3450
- grid-template-columns: var(--checkbox) var(--item) var(--variant) var(
3451
- --sku
3452
- ) var(--warehouse) var(--qty-big) var(--statusnow) var(--time) minmax(
3445
+ grid-template-columns:
3446
+ var(--checkbox) var(--item) var(--variant) var(--sku)
3447
+ var(--warehouse) var(--qty-big) var(--statusnow) var(--time) minmax(
3453
3448
  60px,
3454
3449
  auto
3455
3450
  );
@@ -3457,16 +3452,16 @@ const listTableStyles = {
3457
3452
  `,
3458
3453
  price: css`
3459
3454
  ${ItemTable} {
3460
- grid-template-columns: var(--time) var(--id-big) var(--status) var(
3461
- --qty
3462
- ) var(--email) var(--status) minmax(60px, auto);
3455
+ grid-template-columns:
3456
+ var(--time) var(--id-big) var(--status) var(--qty)
3457
+ var(--email) var(--status) minmax(60px, auto);
3463
3458
  }
3464
3459
  `,
3465
3460
  "stock-adjustment": css`
3466
3461
  ${ItemTable} {
3467
- grid-template-columns: var(--id-pd20) var(--status-big) var(
3468
- --warehouse
3469
- ) var(--ref) minmax(140px, 150px) var(--person) var(--time) minmax(
3462
+ grid-template-columns:
3463
+ var(--id-pd20) var(--status-big) var(--warehouse)
3464
+ var(--ref) minmax(140px, 150px) var(--person) var(--time) minmax(
3470
3465
  160px,
3471
3466
  auto
3472
3467
  );
@@ -3474,9 +3469,9 @@ const listTableStyles = {
3474
3469
  `,
3475
3470
  "stock-outbound": css`
3476
3471
  ${ItemTable} {
3477
- grid-template-columns: var(--id-pd20) var(--status-big) var(
3478
- --warehouse
3479
- ) var(--ref) minmax(150px, 160px) var(--person) var(--time) minmax(
3472
+ grid-template-columns:
3473
+ var(--id-pd20) var(--status-big) var(--warehouse)
3474
+ var(--ref) minmax(150px, 160px) var(--person) var(--time) minmax(
3480
3475
  160px,
3481
3476
  auto
3482
3477
  );
@@ -3484,28 +3479,29 @@ const listTableStyles = {
3484
3479
  `,
3485
3480
  "stock-transfer": css`
3486
3481
  ${ItemTable} {
3487
- grid-template-columns: var(--id) var(--status-big) var(--warehouse) var(
3488
- --warehouse
3489
- ) minmax(90px, 100px) var(--person) var(--time) minmax(160px, auto);
3482
+ grid-template-columns:
3483
+ var(--id) var(--status-big) var(--warehouse) var(--warehouse)
3484
+ minmax(90px, 100px) var(--person) var(--time) minmax(160px, auto);
3490
3485
  }
3491
3486
  `,
3492
3487
  promotion: css`
3493
3488
  ${ItemTable} {
3494
- grid-template-columns: var(--store) var(--id-big) var(--ref-big) minmax(
3495
- 100px,
3496
- 160px
3497
- ) var(--status-small) var(--time) var(--time) minmax(42px, 88px) var(
3489
+ grid-template-columns:
3490
+ var(--store) var(--id-big) var(--ref-big) minmax(100px, 160px)
3491
+ var(--status-small) var(--time) var(--time) minmax(42px, 88px) var(
3498
3492
  --time
3499
- ) minmax(62px, auto);
3493
+ )
3494
+ minmax(62px, auto);
3500
3495
  }
3501
3496
  `,
3502
3497
  "stock-history": css`
3503
3498
  ${ItemTable} {
3504
- grid-template-columns: minmax(120px, 360px) var(--sku) var(
3505
- --warehouse
3506
- ) minmax(85px, 120px) minmax(105px, 190px) var(--qty-small) var(
3499
+ grid-template-columns:
3500
+ minmax(120px, 360px) var(--sku) var(--warehouse)
3501
+ minmax(85px, 120px) minmax(105px, 190px) var(--qty-small) var(
3507
3502
  --qty-small
3508
- ) minmax(68px, 100px) var(--time) minmax(75px, 88px);
3503
+ )
3504
+ minmax(68px, 100px) var(--time) minmax(75px, 88px);
3509
3505
  > *:last-child {
3510
3506
  display: unset;
3511
3507
  justify-content: unset;
@@ -3524,12 +3520,10 @@ const listTableStyles = {
3524
3520
  display: unset;
3525
3521
  justify-content: unset;
3526
3522
  }
3527
- grid-template-columns: minmax(110px, 146px) minmax(120px, 360px) var(
3528
- --sku
3529
- ) var(--store) minmax(75px, 120px) minmax(85px, 120px) minmax(
3530
- 75px,
3531
- 120px
3532
- ) minmax(80px, 120px) var(--time) var(--status) minmax(75px, 88px);
3523
+ grid-template-columns:
3524
+ minmax(110px, 146px) minmax(120px, 360px) var(--sku)
3525
+ var(--store) minmax(75px, 120px) minmax(85px, 120px) minmax(75px, 120px)
3526
+ minmax(80px, 120px) var(--time) var(--status) minmax(75px, 88px);
3533
3527
  }
3534
3528
  `,
3535
3529
  turnover: css`
@@ -3541,9 +3535,9 @@ const listTableStyles = {
3541
3535
  display: unset;
3542
3536
  justify-content: unset;
3543
3537
  }
3544
- grid-template-columns: minmax(120px, 360px) var(--sku) var(
3545
- --warehouse
3546
- ) repeat(4, var(--qty)) minmax(75px, 88px);
3538
+ grid-template-columns:
3539
+ minmax(120px, 360px) var(--sku) var(--warehouse)
3540
+ repeat(4, var(--qty)) minmax(75px, 88px);
3547
3541
  }
3548
3542
  `,
3549
3543
  "days-outofstock": css`
@@ -3555,19 +3549,16 @@ const listTableStyles = {
3555
3549
  display: unset;
3556
3550
  justify-content: unset;
3557
3551
  }
3558
- grid-template-columns: minmax(120px, 360px) var(--sku) var(
3559
- --warehouse
3560
- ) var(--qty-big) var(--qty) var(--qty-big) var(--time) minmax(
3561
- 75px,
3562
- 88px
3563
- );
3552
+ grid-template-columns:
3553
+ minmax(120px, 360px) var(--sku) var(--warehouse)
3554
+ var(--qty-big) var(--qty) var(--qty-big) var(--time) minmax(75px, 88px);
3564
3555
  }
3565
3556
  `,
3566
3557
  warehouses: css`
3567
3558
  ${ItemTable} {
3568
- grid-template-columns: var(--warehouse) var(--status) var(--id-big) var(
3569
- --qty-big
3570
- ) var(--time) minmax(110px, auto);
3559
+ grid-template-columns:
3560
+ var(--warehouse) var(--status) var(--id-big) var(--qty-big)
3561
+ var(--time) minmax(110px, auto);
3571
3562
  }
3572
3563
  `,
3573
3564
  archived: css`
@@ -3589,9 +3580,9 @@ const listTableStyles = {
3589
3580
  @media only screen and (max-width: 1279px) {
3590
3581
  width: unset;
3591
3582
  }
3592
- grid-template-columns: var(--id-pd20) minmax(80px, 120px) var(--time) var(
3593
- --person
3594
- ) var(--qty) var(--price) var(--status) minmax(180px, auto);
3583
+ grid-template-columns:
3584
+ var(--id-pd20) minmax(80px, 120px) var(--time) var(--person)
3585
+ var(--qty) var(--price) var(--status) minmax(180px, auto);
3595
3586
  }
3596
3587
  `,
3597
3588
  order: css`
@@ -3661,10 +3652,9 @@ const listTableStyles = {
3661
3652
  }
3662
3653
  @media only screen and (min-width: 1800px) {
3663
3654
  ${ItemTable} {
3664
- grid-template-columns: var(--checkbox) minmax(125px, 170px) minmax(
3665
- 85px,
3666
- 145px
3667
- ) minmax(auto, max-content);
3655
+ grid-template-columns:
3656
+ var(--checkbox) minmax(125px, 170px) minmax(85px, 145px)
3657
+ minmax(auto, max-content);
3668
3658
  &[role="rowheader"] > div[role="group"] {
3669
3659
  grid-template-columns: var(--order) 50px 110px 130px 130px minmax(
3670
3660
  50px,