Merge branch 'develop-6.3.x' into epic/CXSPA-700

SAP · Jul 8, 2023 · 28c8fdd · 28c8fdd
2 parents 219d02c + 801982b
commit 28c8fdd
Show file tree

Hide file tree

Showing 59 changed files with 2,216 additions and 534 deletions.
diff --git a/feature-libs/cart/base/styles/components/_order-summary.scss b/feature-libs/cart/base/styles/components/_order-summary.scss
@@ -12,6 +12,18 @@
     font-weight: var(--cx-font-weight-semi);
   }
 
+  @include forVersion(6.3) {
+    .cx-summary-heading {
+      border-bottom: 1px solid var(--cx-color-medium);
+      padding-bottom: 2.188rem;
+
+      @include media-breakpoint-down(md) {
+        margin-bottom: 0.438rem;
+        padding-bottom: 0.938rem;
+      }
+    }
+  }
+
   .cx-summary-label {
     text-align: start;
     padding: 0;

diff --git a/...eckout/base/components/checkout-delivery-address/checkout-delivery-address.component.html b/...eckout/base/components/checkout-delivery-address/checkout-delivery-address.component.html
@@ -18,16 +18,29 @@ <h2 class="cx-checkout-title d-none d-lg-block d-xl-block">
       <p class="cx-checkout-text">
         {{ 'checkoutAddress.selectYourDeliveryAddress' | cxTranslate }}
       </p>
-      <div class="cx-checkout-btns row">
-        <div class="col-sm-12 col-md-12 col-lg-6">
+      <ng-container *cxFeatureLevel="'!6.3'">
+        <div class="cx-checkout-btns row">
+          <div class="col-sm-12 col-md-12 col-lg-6">
+            <button
+              class="btn btn-block btn-secondary"
+              (click)="showNewAddressForm()"
+            >
+              {{ 'checkoutAddress.addNewAddress' | cxTranslate }}
+            </button>
+          </div>
+        </div>
+      </ng-container>
+
+      <ng-container *cxFeatureLevel="'6.3'">
+        <div class="cx-checkout-btns cx-checkout-btns-top">
           <button
             class="btn btn-block btn-secondary"
             (click)="showNewAddressForm()"
           >
             {{ 'checkoutAddress.addNewAddress' | cxTranslate }}
           </button>
         </div>
-      </div>
+      </ng-container>
 
       <div class="cx-checkout-body row">
         <div
@@ -49,6 +62,17 @@ <h2 class="cx-checkout-title d-none d-lg-block d-xl-block">
         </div>
       </div>
 
+      <ng-container *cxFeatureLevel="'6.3'">
+        <div class="cx-checkout-btns cx-checkout-btns-bottom">
+          <button
+            class="btn btn-block btn-secondary"
+            (click)="showNewAddressForm()"
+          >
+            {{ 'checkoutAddress.addNewAddress' | cxTranslate }}
+          </button>
+        </div>
+      </ng-container>
+
       <div class="cx-checkout-btns row">
         <div class="col-md-12 col-lg-6">
           <button class="cx-btn btn btn-block btn-secondary" (click)="back()">

diff --git a/...out/base/components/checkout-delivery-address/checkout-delivery-address.component.spec.ts b/...out/base/components/checkout-delivery-address/checkout-delivery-address.component.spec.ts
@@ -12,6 +12,8 @@ import {
   GlobalMessageService,
   I18nTestingModule,
   UserAddressService,
+  FeaturesConfig,
+  FeaturesConfigModule,
 } from '@spartacus/core';
 import { Card } from '@spartacus/storefront';
 import { EMPTY, of } from 'rxjs';
@@ -130,7 +132,7 @@ describe('CheckoutDeliveryAddressComponent', () => {
   beforeEach(
     waitForAsync(() => {
       TestBed.configureTestingModule({
-        imports: [I18nTestingModule],
+        imports: [I18nTestingModule, FeaturesConfigModule],
         declarations: [
           CheckoutDeliveryAddressComponent,
           MockAddressFormComponent,
@@ -151,6 +153,12 @@ describe('CheckoutDeliveryAddressComponent', () => {
             provide: CheckoutDeliveryModesFacade,
             useClass: MockCheckoutDeliveryModesFacade,
           },
+          {
+            provide: FeaturesConfig,
+            useValue: {
+              features: { level: '6.3' },
+            },
+          },
         ],
       })
         .overrideComponent(CheckoutDeliveryAddressComponent, {

diff --git a/...bs/checkout/base/components/checkout-delivery-address/checkout-delivery-address.module.ts b/...bs/checkout/base/components/checkout-delivery-address/checkout-delivery-address.module.ts
@@ -8,7 +8,12 @@ import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { CartValidationGuard } from '@spartacus/cart/base/core';
-import { CmsConfig, I18nModule, provideDefaultConfig } from '@spartacus/core';
+import {
+  CmsConfig,
+  I18nModule,
+  provideDefaultConfig,
+  FeaturesConfigModule,
+} from '@spartacus/core';
 import {
   AddressFormModule,
   CardModule,
@@ -26,6 +31,7 @@ import { CheckoutDeliveryAddressComponent } from './checkout-delivery-address.co
     CardModule,
     SpinnerModule,
     I18nModule,
+    FeaturesConfigModule,
   ],
   providers: [
     provideDefaultConfig(<CmsConfig>{

diff --git a/...ibs/checkout/base/components/checkout-delivery-mode/checkout-delivery-mode.component.html b/...ibs/checkout/base/components/checkout-delivery-mode/checkout-delivery-mode.component.html
@@ -27,9 +27,20 @@ <h2 class="cx-checkout-title d-none d-lg-block d-xl-block">
           class="cx-delivery-label form-check-label form-radio-label"
           for="deliveryMode-{{ mode.code }}"
         >
-          <div class="cx-delivery-mode">
-            {{ mode.name }} ({{ mode.description }})
-          </div>
+          <ng-container *cxFeatureLevel="'!6.3'">
+            <div class="cx-delivery-mode">
+              {{ mode.name }} ({{ mode.description }})
+            </div>
+          </ng-container>
+
+          <ng-container *cxFeatureLevel="'6.3'">
+            <div class="cx-delivery-mode">
+              {{ mode.name }}
+              <span class="cx-delivery-mode-description"
+                >({{ mode.description }})</span
+              >
+            </div>
+          </ng-container>
           <div class="cx-delivery-price">
             {{ mode.deliveryCost?.formattedValue }}
           </div>

diff --git a/...ure-libs/checkout/base/components/checkout-delivery-mode/checkout-delivery-mode.module.ts b/...ure-libs/checkout/base/components/checkout-delivery-mode/checkout-delivery-mode.module.ts
@@ -7,7 +7,12 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { ReactiveFormsModule } from '@angular/forms';
-import { CmsConfig, I18nModule, provideDefaultConfig } from '@spartacus/core';
+import {
+  CmsConfig,
+  I18nModule,
+  provideDefaultConfig,
+  FeaturesConfigModule,
+} from '@spartacus/core';
 import {
   OutletModule,
   PageComponentModule,
@@ -25,6 +30,7 @@ import { CheckoutDeliveryModeComponent } from './checkout-delivery-mode.componen
     SpinnerModule,
     OutletModule,
     PageComponentModule,
+    FeaturesConfigModule,
   ],
   providers: [
     provideDefaultConfig(<CmsConfig>{

diff --git a/...s/checkout/base/components/checkout-payment-method/checkout-payment-method.component.html b/...s/checkout/base/components/checkout-payment-method/checkout-payment-method.component.html
@@ -18,16 +18,30 @@ <h2 class="cx-checkout-title d-none d-lg-block d-xl-block">
     <p class="cx-checkout-text">
       {{ 'paymentForm.choosePaymentMethod' | cxTranslate }}
     </p>
-    <div class="cx-checkout-btns row">
-      <div class="col-md-12 col-lg-6">
+
+    <ng-container *cxFeatureLevel="'!6.3'">
+      <div class="cx-checkout-btns row">
+        <div class="col-md-12 col-lg-6">
+          <button
+            class="btn btn-block btn-secondary"
+            (click)="showNewPaymentForm()"
+          >
+            {{ 'paymentForm.addNewPayment' | cxTranslate }}
+          </button>
+        </div>
+      </div>
+    </ng-container>
+
+    <ng-container *cxFeatureLevel="'6.3'">
+      <div class="cx-checkout-btns cx-checkout-btns-top">
         <button
           class="btn btn-block btn-secondary"
           (click)="showNewPaymentForm()"
         >
           {{ 'paymentForm.addNewPayment' | cxTranslate }}
         </button>
       </div>
-    </div>
+    </ng-container>
 
     <div class="cx-checkout-body row">
       <div
@@ -49,6 +63,17 @@ <h2 class="cx-checkout-title d-none d-lg-block d-xl-block">
       </div>
     </div>
 
+    <ng-container *cxFeatureLevel="'6.3'">
+      <div class="cx-checkout-btns cx-checkout-btns-bottom">
+        <button
+          class="btn btn-block btn-secondary"
+          (click)="showNewPaymentForm()"
+        >
+          {{ 'paymentForm.addNewPayment' | cxTranslate }}
+        </button>
+      </div>
+    </ng-container>
+
     <div class="row cx-checkout-btns">
       <div class="col-md-12 col-lg-6">
         <button class="btn btn-block btn-secondary" (click)="back()">

diff --git a/...heckout/base/components/checkout-payment-method/checkout-payment-method.component.spec.ts b/...heckout/base/components/checkout-payment-method/checkout-payment-method.component.spec.ts
@@ -9,6 +9,8 @@ import {
 } from '@spartacus/checkout/base/root';
 import {
   Address,
+  FeaturesConfig,
+  FeaturesConfigModule,
   GlobalMessageService,
   I18nTestingModule,
   QueryState,
@@ -168,7 +170,7 @@ describe('CheckoutPaymentMethodComponent', () => {
   beforeEach(
     waitForAsync(() => {
       TestBed.configureTestingModule({
-        imports: [I18nTestingModule],
+        imports: [I18nTestingModule, FeaturesConfigModule],
         declarations: [
           CheckoutPaymentMethodComponent,
           MockPaymentFormComponent,
@@ -193,6 +195,12 @@ describe('CheckoutPaymentMethodComponent', () => {
           { provide: CheckoutStepService, useClass: MockCheckoutStepService },
           { provide: ActivatedRoute, useValue: mockActivatedRoute },
           { provide: GlobalMessageService, useClass: MockGlobalMessageService },
+          {
+            provide: FeaturesConfig,
+            useValue: {
+              features: { level: '6.3' },
+            },
+          },
         ],
       }).compileComponents();
 

diff --git a/...e-libs/checkout/base/components/checkout-payment-method/checkout-payment-method.module.ts b/...e-libs/checkout/base/components/checkout-payment-method/checkout-payment-method.module.ts
@@ -7,7 +7,12 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { CmsConfig, I18nModule, provideDefaultConfig } from '@spartacus/core';
+import {
+  CmsConfig,
+  I18nModule,
+  provideDefaultConfig,
+  FeaturesConfigModule,
+} from '@spartacus/core';
 import { CardModule, SpinnerModule } from '@spartacus/storefront';
 import { CartNotEmptyGuard } from '../guards/cart-not-empty.guard';
 import { CheckoutAuthGuard } from '../guards/checkout-auth.guard';
@@ -22,6 +27,7 @@ import { CheckoutPaymentMethodComponent } from './checkout-payment-method.compon
     CardModule,
     SpinnerModule,
     I18nModule,
+    FeaturesConfigModule,
   ],
   providers: [
     provideDefaultConfig(<CmsConfig>{

diff --git a/feature-libs/checkout/base/styles/components/steps/_progress.scss b/feature-libs/checkout/base/styles/components/steps/_progress.scss
@@ -105,6 +105,10 @@
         border-width: 0 0 1px 0;
         border-style: solid;
         border-color: var(--cx-color-light);
+
+        @include forVersion(6.3) {
+          padding: 0 1.875rem;
+        }
       }
 
       @include media-breakpoint-down(sm) {

diff --git a/feature-libs/checkout/base/styles/components/steps/delivery-address/_delivery-address.scss b/feature-libs/checkout/base/styles/components/steps/delivery-address/_delivery-address.scss
@@ -1,13 +1,82 @@
 %cx-delivery-address {
   @include checkout-media-style();
 
+  @include forVersion(6.3) {
+    border: 1px solid var(--cx-color-medium);
+    border-radius: 10px;
+    margin-top: 32px;
+    margin-bottom: 30px;
+    padding-inline-start: 1.875rem;
+    padding-inline-end: 1.875rem;
+    padding-top: 1.875rem;
+
+    @include media-breakpoint-down(md) {
+      background-color: var(--cx-color-transparent);
+    }
+
+    cx-address-form {
+      @include media-breakpoint-down(md) {
+        background-color: var(--cx-color-transparent);
+      }
+      form {
+        background-color: var(--cx-color-transparent);
+        padding: 13px 0px 13px 0px;
+        margin-bottom: 0;
+      }
+    }
+  }
+
   .cx-delivery-address-card {
     padding-bottom: 30px;
 
+    @include forVersion(6.3) {
+      padding-inline-start: 0;
+      padding-inline-end: 0;
+
+      @include media-breakpoint-up(lg) {
+        &:nth-child(odd) {
+          padding-inline-end: 15px;
+        }
+        &:nth-child(even) {
+          padding-inline-start: 15px;
+        }
+      }
+    }
+
     .cx-delivery-address-card-inner {
       height: 100%;
       background-color: var(--cx-color-inverse);
       cursor: pointer;
     }
   }
+
+  @include forVersion(6.3) {
+    .cx-checkout-btns-top {
+      display: flex;
+      justify-content: flex-end;
+      padding-inline-start: 1.875rem;
+
+      @include media-breakpoint-down(md) {
+        display: none;
+      }
+
+      .btn {
+        width: 50%;
+      }
+    }
+  }
+
+  @include forVersion(6.3) {
+    .cx-checkout-btns-bottom {
+      padding-bottom: 0;
+
+      @include media-breakpoint-up(lg) {
+        display: none;
+      }
+
+      .btn-secondary {
+        margin-bottom: 0;
+      }
+    }
+  }
 }