codexly-ui 0.10.70 → 0.10.71

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 (3) hide show
  1. package/fesm2022/codexly-ui.mjs +80 -38
  2. package/fesm2022/codexly-ui.mjs.map +1 -1
  3. package/package.json +1 -1
package/fesm2022/codexly-ui.mjs CHANGED
@@ -15308,34 +15308,55 @@ class ClxCartComponent {
15308
15308
 
15309
15309
  <!-- Title block -->
15310
15310
  <div class="pr-8">
15311
- <p class="text-xs text-clx-text-subtle truncate">{{ item.trademark }}</p>
15311
+ <p class="text-sm text-clx-text-subtle truncate">{{ item.trademark }}</p>
15312
15312
  <h3 class="text-sm font-semibold text-clx-text-label leading-snug line-clamp-2">{{ item.name }}</h3>
15313
- <p class="text-xs font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
15313
+ <p class="text-sm font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
15314
15314
  </div>
15315
15315
 
15316
15316
  <!-- Price + Quantity row -->
15317
- <div class="flex items-center justify-between gap-2 mt-auto flex-wrap">
15317
+ <div class="flex items-end justify-between gap-3 mt-auto flex-wrap">
15318
15318
 
15319
- <!-- Price -->
15320
- <div class="flex items-baseline gap-1.5">
15321
- <span class="text-base font-bold text-clx-text-label">
15322
- {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15323
- </span>
15319
+ <!-- Prices -->
15320
+ <div class="flex items-end gap-4">
15324
15321
  @if (item.has_discount && item.original_price) {
15325
- <span class="text-xs text-clx-text-subtle line-through">
15326
- {{ item.original_price | currency:'COP':'$':'1.0-0' }}
15327
- </span>
15322
+ <div>
15323
+ <p class="text-sm text-clx-text-label">Precio</p>
15324
+ <span class="text-sm text-clx-text-subtle line-through">
15325
+ {{ item.original_price | currency:'COP':'$':'1.0-0' }}
15326
+ </span>
15327
+ </div>
15328
+ <div>
15329
+ <p class="text-sm text-clx-text-label">Precio con descuento</p>
15330
+ <span class="text-sm font-bold text-clx-text-subtle">
15331
+ {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15332
+ </span>
15333
+ </div>
15334
+ } @else {
15335
+ <div>
15336
+ <p class="text-sm text-clx-text-label">Precio</p>
15337
+ <span class="text-sm font-bold text-clx-text-subtle">
15338
+ {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15339
+ </span>
15340
+ </div>
15328
15341
  }
15329
15342
  </div>
15330
15343
 
15331
- <!-- Quantity control -->
15332
- <clx-number
15333
- variant="stepper" size="sm" [color]="color()"
15334
- [min]="1" [max]="item.max_quantity ?? null"
15335
- [disabled]="!item.in_stock"
15336
- [ngModel]="item.quantity"
15337
- (ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
15338
- </clx-number>
15344
+ <!-- Quantity control + Total -->
15345
+ <div class="flex items-end gap-3">
15346
+ <clx-number
15347
+ variant="stepper" size="sm" [color]="color()"
15348
+ [min]="1" [max]="item.max_quantity ?? null"
15349
+ [disabled]="!item.in_stock"
15350
+ [ngModel]="item.quantity"
15351
+ (ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
15352
+ </clx-number>
15353
+ <div>
15354
+ <p class="text-sm text-clx-text-label">Total</p>
15355
+ <span class="text-sm font-bold text-clx-text-subtle">
15356
+ {{ item.unit_price * item.quantity | currency:'COP':'$':'1.0-0' }}
15357
+ </span>
15358
+ </div>
15359
+ </div>
15339
15360
  </div>
15340
15361
  </div>
15341
15362
 
@@ -15568,34 +15589,55 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
15568
15589
 
15569
15590
  <!-- Title block -->
15570
15591
  <div class="pr-8">
15571
- <p class="text-xs text-clx-text-subtle truncate">{{ item.trademark }}</p>
15592
+ <p class="text-sm text-clx-text-subtle truncate">{{ item.trademark }}</p>
15572
15593
  <h3 class="text-sm font-semibold text-clx-text-label leading-snug line-clamp-2">{{ item.name }}</h3>
15573
- <p class="text-xs font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
15594
+ <p class="text-sm font-mono text-clx-text-subtle mt-0.5">{{ item.sku }}</p>
15574
15595
  </div>
15575
15596
 
15576
15597
  <!-- Price + Quantity row -->
15577
- <div class="flex items-center justify-between gap-2 mt-auto flex-wrap">
15598
+ <div class="flex items-end justify-between gap-3 mt-auto flex-wrap">
15578
15599
 
15579
- <!-- Price -->
15580
- <div class="flex items-baseline gap-1.5">
15581
- <span class="text-base font-bold text-clx-text-label">
15582
- {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15583
- </span>
15600
+ <!-- Prices -->
15601
+ <div class="flex items-end gap-4">
15584
15602
  @if (item.has_discount && item.original_price) {
15585
- <span class="text-xs text-clx-text-subtle line-through">
15586
- {{ item.original_price | currency:'COP':'$':'1.0-0' }}
15587
- </span>
15603
+ <div>
15604
+ <p class="text-sm text-clx-text-label">Precio</p>
15605
+ <span class="text-sm text-clx-text-subtle line-through">
15606
+ {{ item.original_price | currency:'COP':'$':'1.0-0' }}
15607
+ </span>
15608
+ </div>
15609
+ <div>
15610
+ <p class="text-sm text-clx-text-label">Precio con descuento</p>
15611
+ <span class="text-sm font-bold text-clx-text-subtle">
15612
+ {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15613
+ </span>
15614
+ </div>
15615
+ } @else {
15616
+ <div>
15617
+ <p class="text-sm text-clx-text-label">Precio</p>
15618
+ <span class="text-sm font-bold text-clx-text-subtle">
15619
+ {{ item.unit_price | currency:'COP':'$':'1.0-0' }}
15620
+ </span>
15621
+ </div>
15588
15622
  }
15589
15623
  </div>
15590
15624
 
15591
- <!-- Quantity control -->
15592
- <clx-number
15593
- variant="stepper" size="sm" [color]="color()"
15594
- [min]="1" [max]="item.max_quantity ?? null"
15595
- [disabled]="!item.in_stock"
15596
- [ngModel]="item.quantity"
15597
- (ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
15598
- </clx-number>
15625
+ <!-- Quantity control + Total -->
15626
+ <div class="flex items-end gap-3">
15627
+ <clx-number
15628
+ variant="stepper" size="sm" [color]="color()"
15629
+ [min]="1" [max]="item.max_quantity ?? null"
15630
+ [disabled]="!item.in_stock"
15631
+ [ngModel]="item.quantity"
15632
+ (ngModelChange)="onQuantityChange.emit({ item, quantity: $event })">
15633
+ </clx-number>
15634
+ <div>
15635
+ <p class="text-sm text-clx-text-label">Total</p>
15636
+ <span class="text-sm font-bold text-clx-text-subtle">
15637
+ {{ item.unit_price * item.quantity | currency:'COP':'$':'1.0-0' }}
15638
+ </span>
15639
+ </div>
15640
+ </div>
15599
15641
  </div>
15600
15642
  </div>
15601
15643