Merge branch 'develop' into feat/CXSPA-7604

CONTRIBUTING.md

@@ -170,6 +170,10 @@ Submit the form to us through one of the following methods:
 
   The "guidelines and standards" requirement could fill entire books and still lack a 100% clear definition, but rest assured that you will receive feedback if something is not right. That being said, please consult the [Contributor's Guide](https://sap.github.io/spartacus-docs/contributors-guide/).
 
+### Contribution of generated AI content
+
+To contribute generated AI content, please read the following [guide](https://github.com/SAP/.github/blob/main/CONTRIBUTING_USING_GENAI.md)
+
 ### Contribution Process
 
   1. Make sure the change would be welcome, as described above.

feature-libs/cart/import-export/assets/translations/en/importExport.json

@@ -19,6 +19,7 @@
     "importProductsNewSavedCartSubtitle": "Add products by importing a .CSV file and creating a new saved cart.",
     "importProductFileDetails": "Text file should contain list of products with required columns separated by comma: SKU and quantity.",
     "selectFile": "Select File",
+    "selectedSuccessfully": "CSV file has been successfully selected.",
     "savedCartName": "Saved Cart Name",
     "savedCartDescription": "Saved Cart Description",
     "optional": "optional",

feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-entries-form/import-entries-form.component.html

@@ -3,6 +3,17 @@
   [formGroup]="form"
   (submit)="formSubmitSubject$.next(undefined)"
 >
+  <ng-container *cxFeature="'a11yCartImportConfirmationMessage'">
+    <div aria-live="assertive" aria-atomic="true">
+      <cx-message
+        *ngIf="form.get('file')?.value && form.get('file')?.valid"
+        [text]="'importEntriesDialog.selectedSuccessfully' | cxTranslate"
+        [type]="globalMessageType.MSG_TYPE_CONFIRMATION"
+        [isVisibleCloseButton]="false"
+        [cxFocus]="{ autofocus: '.cx-message' }"
+      ></cx-message>
+    </div>
+  </ng-container>
   <p class="cx-import-entries-subtitle">
     {{ 'importEntriesDialog.importProductsSubtitle' | cxTranslate }}
   </p>

feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-entries-form/import-entries-form.component.ts

@@ -28,6 +28,7 @@ import {
 import { of, Subject } from 'rxjs';
 import { filter, startWith, switchMap, take, tap } from 'rxjs/operators';
 import { ImportProductsFromCsvService } from '../../import-products-from-csv.service';
+import { GlobalMessageType } from '@spartacus/core';
 
 @Component({
   selector: 'cx-import-entries-form',
@@ -38,6 +39,7 @@ export class ImportEntriesFormComponent implements OnInit {
   form: UntypedFormGroup;
   loadedFile: string[][] | null;
   formSubmitSubject$ = new Subject();
+  globalMessageType = GlobalMessageType;
 
   @Output()
   submitEvent = new EventEmitter<{

feature-libs/cart/import-export/components/import-to-cart/import-entries-dialog/import-to-new-saved-cart-form/import-to-new-saved-cart-form.component.html

@@ -3,6 +3,17 @@
   [formGroup]="form"
   (submit)="formSubmitSubject$.next(undefined)"
 >
+  <ng-container *cxFeature="'a11yCartImportConfirmationMessage'">
+    <div aria-live="assertive" aria-atomic="true">
+      <cx-message
+        *ngIf="form.get('file')?.value && form.get('file')?.valid"
+        [text]="'importEntriesDialog.selectedSuccessfully' | cxTranslate"
+        [type]="globalMessageType.MSG_TYPE_CONFIRMATION"
+        [isVisibleCloseButton]="false"
+        [cxFocus]="{ autofocus: '.cx-message' }"
+      ></cx-message>
+    </div>
+  </ng-container>
   <p class="cx-import-entries-subtitle">
     {{ 'importEntriesDialog.importProductsNewSavedCartSubtitle' | cxTranslate }}
   </p>

feature-libs/cart/import-export/components/import-to-cart/import-order-entries.module.ts

@@ -19,6 +19,7 @@ import {
   FormErrorsModule,
   IconModule,
   KeyboardFocusModule,
+  MessageComponentModule,
 } from '@spartacus/storefront';
 import { defaultImportEntriesLayoutConfig } from './default-import-entries-layout.config';
 import { ImportEntriesDialogComponent } from './import-entries-dialog/import-entries-dialog.component';
@@ -37,6 +38,8 @@ import { ImportOrderEntriesComponent } from './import-entries/import-order-entri
     KeyboardFocusModule,
     FileUploadModule,
     I18nModule,
+    MessageComponentModule,
+    FeaturesConfigModule,
     ConfigModule.withConfig(<CmsConfig>{
       cmsComponents: {
         ImportOrderEntriesComponent: {

package.json

@@ -234,7 +234,7 @@
     "ts-morph": "^23.0.0",
     "ts-node": "^10.6.0",
     "typescript": "^5.2.2",
-    "webpack": "~5.93.0",
+    "webpack": "~5.94.0",
     "webpack-cli": "^5.0.0"
   }
 }

projects/core/src/features-config/feature-toggles/config/feature-toggles.ts

@@ -224,6 +224,12 @@ export interface FeatureTogglesInterface {
    */
   a11yOrganizationListHeadingOrder?: boolean;
 
+  /**
+   * In `ImportToNewSavedCartFormComponent`,`ImportEntriesFormComponent` after selecting a file
+   * confirmation message is displayed and read out
+   */
+  a11yCartImportConfirmationMessage?: boolean;
+
   /**
    * Changes 'order days' check list into a fieldset inside of 'CheckoutScheduleReplenishmentOrderComponent'.
    */
@@ -523,7 +529,7 @@ export const defaultFeatureToggles: Required<FeatureTogglesInterface> = {
   pdfInvoicesSortByInvoiceDate: false,
   storeFrontLibCardParagraphTruncated: true,
   useProductCarouselBatchApi: false,
-  productConfiguratorAttributeTypesV2: false,
+  productConfiguratorAttributeTypesV2: true,
   productConfiguratorDeltaRendering: false,
   a11yRequiredAsterisks: false,
   a11yQuantityOrderTabbing: false,
@@ -543,6 +549,7 @@ export const defaultFeatureToggles: Required<FeatureTogglesInterface> = {
   a11yMobileVisibleFocus: false,
   a11yOrganizationsBanner: false,
   a11yOrganizationListHeadingOrder: false,
+  a11yCartImportConfirmationMessage: false,
   a11yReplenishmentOrderFieldset: false,
   a11yListOversizedFocus: false,
   a11yStoreFinderOverflow: false,

projects/storefrontapp/src/app/spartacus/spartacus-features.module.ts

@@ -318,6 +318,7 @@ if (environment.cpq) {
         a11yMobileVisibleFocus: true,
         a11yOrganizationsBanner: true,
         a11yOrganizationListHeadingOrder: true,
+        a11yCartImportConfirmationMessage: true,
         a11yReplenishmentOrderFieldset: true,
         a11yListOversizedFocus: true,
         a11yStoreFinderOverflow: true,

projects/storefrontlib/shared/components/form/file-upload/file-upload.module.ts

@@ -10,9 +10,16 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { I18nModule } from '@spartacus/core';
 import { FormErrorsModule } from '../form-errors/form-errors.module';
 import { FileUploadComponent } from './file-upload.component';
+import { KeyboardFocusModule } from '../../../../layout/a11y';
 
 @NgModule({
-  imports: [CommonModule, ReactiveFormsModule, FormErrorsModule, I18nModule],
+  imports: [
+    CommonModule,
+    ReactiveFormsModule,
+    FormErrorsModule,
+    I18nModule,
+    KeyboardFocusModule,
+  ],
   declarations: [FileUploadComponent],
   exports: [FileUploadComponent],
 })

projects/storefrontstyles/scss/components/product/search/_searchbox.scss

@@ -138,7 +138,7 @@
         color: currentColor;
 
         @include forFeature('a11yImproveContrast') {
-          color: var(--cx-color-dark);
+          color: var(--cx-color-secondary);
         }
       }
     }