@codecademy/gamut
71.0.071.0.1-alpha.69ab4c.0
dist/Form/SelectDropdown/elements/options.js~
dist/Form/SelectDropdown/elements/options.jsModified+5−2
Index: package/dist/Form/SelectDropdown/elements/options.js
===================================================================
--- package/dist/Form/SelectDropdown/elements/options.js
+++ package/dist/Form/SelectDropdown/elements/options.js
@@ -43,8 +43,9 @@
/**
* Custom option component that displays a check icon for selected items.
* Also manages ARIA attributes for accessibility.
+ * Skips the check icon for react-select/creatable's "Add" row (__isNew__).
*/
export const IconOption = ({
children,
...rest
@@ -53,17 +54,19 @@
size
} = rest.selectProps;
const {
isFocused,
- innerProps
+ innerProps,
+ data
} = rest;
+ const isNew = data?.__isNew__;
return /*#__PURE__*/_jsxs(SelectDropdownElements.Option, {
...rest,
innerProps: {
...innerProps,
'aria-selected': isFocused
},
- children: [children, rest?.isSelected && /*#__PURE__*/_jsx(CheckIcon, {
+ children: [children, !isNew && rest?.isSelected && /*#__PURE__*/_jsx(CheckIcon, {
size: selectedIconSize[size ?? 'medium']
})]
});
};