Merge pull request #165 from EmanuelRamos115/fix/sku-selector-classname

Fix/SKU selector classname
vtex-apps · Jun 10, 2024 · d2443e4 · d2443e4
2 parents 10819df + eeafb1a
commit d2443e4
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -579,4 +579,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ### Added
 
-- Add css handles in components parents div to manipulate styles easily.
+- Add css handles in components parents div to manipulate styles easily.
+
+### Added
+
+- Add css handles to selected sku on AutoComplete block.
diff --git a/react/AutocompleteBlock.tsx b/react/AutocompleteBlock.tsx
@@ -278,6 +278,7 @@ const AutocompleteBlock: FunctionComponent<any & WrappedComponentProps> = ({
     'productThumb',
     'productTitle',
     'productSku',
+    'skuSelected',
     'productLabel',
     'inputQuantity',
     'buttonAdd',
@@ -341,7 +342,10 @@ const AutocompleteBlock: FunctionComponent<any & WrappedComponentProps> = ({
                             return (
                               <span
                                 key={item.itemId}
-                                className={`mr4 ${handles.skuSelection}`}
+                                className={`mr4 ${handles.skuSelection} ${
+                                  item.itemId === selectedItem.value &&
+                                  handles.skuSelected
+                                }`}
                               >
                                 <Tag
                                   size="small"