@toptal/picasso-select 4.0.19-alpha-bill-optimize-select-performance-381ce8200.1 → 4.0.19-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1

package/dist-package/src/NonNativeSelectOption/NonNativeSelectOption.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NonNativeSelectOption.d.ts","sourceRoot":"","sources":["../../../src/NonNativeSelectOption/NonNativeSelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAEjE,MAAM,WAAW,KAAK,CAAC,CAAC,SAAS,SAAS,CAAE,SAAQ,SAAS;IAC3D,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAA;CAClB;AA4BD,QAAA,MAAM,qBAAqB,qJAY1B,CAAA;AAID,eAAe,qBAAqB,CAAA"}
+{"version":3,"file":"NonNativeSelectOption.d.ts","sourceRoot":"","sources":["../../../src/NonNativeSelectOption/NonNativeSelectOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAEjE,MAAM,WAAW,KAAK,CAAC,CAAC,SAAS,SAAS,CAAE,SAAQ,SAAS;IAC3D,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAA;CAClB;AAED,QAAA,MAAM,qBAAqB,qJA0B1B,CAAA;AAID,eAAe,qBAAqB,CAAA"}

package/dist-package/src/NonNativeSelectOption/NonNativeSelectOption.js

@@ -11,17 +11,9 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React from 'react';
 import { MenuItem } from '@toptal/picasso-menu';
-const NonNativeSelectOptionComponent = (_a) => {
+const NonNativeSelectOption = React.memo((_a) => {
     var { option, selected, highlighted, description, children } = _a, itemProps = __rest(_a, ["option", "selected", "highlighted", "description", "children"]);
     return (React.createElement(MenuItem, Object.assign({ value: option.value, selected: highlighted, checkmarked: selected, titleCase: false, description: description, role: 'option', "aria-selected": selected, "data-highlighted": highlighted, disabled: option.disabled }, itemProps), children));
-};
-const NonNativeSelectOption = React.memo(NonNativeSelectOptionComponent, (prevProps, nextProps) => {
-    return (prevProps.selected === nextProps.selected &&
-        prevProps.highlighted === nextProps.highlighted &&
-        prevProps.option === nextProps.option &&
-        prevProps.option.disabled === nextProps.option.disabled &&
-        prevProps.description === nextProps.description &&
-        prevProps.children === nextProps.children);
 });
 NonNativeSelectOption.displayName = 'NonNativeSelectOption';
 export default NonNativeSelectOption;

package/dist-package/src/NonNativeSelectOption/NonNativeSelectOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"NonNativeSelectOption.js","sourceRoot":"","sources":["../../../src/NonNativeSelectOption/NonNativeSelectOption.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAY/C,MAAM,8BAA8B,GAAG,CAAsB,EAOlD,EAAE,EAAE;QAP8C,EAC3D,MAAM,EACN,QAAQ,EACR,WAAW,EACX,WAAW,EACX,QAAQ,OAEC,EADN,SAAS,cAN+C,gEAO5D,CADa;IAEZ,OAAO,CACL,oBAAC,QAAQ,kBACP,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,QAAQ,EAAE,WAAW,EACrB,WAAW,EAAE,QAAQ,EACrB,SAAS,EAAE,KAAK,EAChB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,QAAQ,mBACE,QAAQ,sBACL,WAAW,EAC7B,QAAQ,EAAE,MAAM,CAAC,QAAQ,IACrB,SAAS,GAEZ,QAAQ,CACA,CACZ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,qBAAqB,GAAG,KAAK,CAAC,IAAI,CACtC,8BAA8B,EAC9B,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE;IACvB,OAAO,CACL,SAAS,CAAC,QAAQ,KAAK,SAAS,CAAC,QAAQ;QACzC,SAAS,CAAC,WAAW,KAAK,SAAS,CAAC,WAAW;QAC/C,SAAS,CAAC,MAAM,KAAK,SAAS,CAAC,MAAM;QACrC,SAAS,CAAC,MAAM,CAAC,QAAQ,KAAK,SAAS,CAAC,MAAM,CAAC,QAAQ;QACvD,SAAS,CAAC,WAAW,KAAK,SAAS,CAAC,WAAW;QAC/C,SAAS,CAAC,QAAQ,KAAK,SAAS,CAAC,QAAQ,CAC1C,CAAA;AACH,CAAC,CACF,CAAA;AAED,qBAAqB,CAAC,WAAW,GAAG,uBAAuB,CAAA;AAE3D,eAAe,qBAAqB,CAAA"}
+{"version":3,"file":"NonNativeSelectOption.js","sourceRoot":"","sources":["../../../src/NonNativeSelectOption/NonNativeSelectOption.tsx"],"names":[],"mappings":";;;;;;;;;;;AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAY/C,MAAM,qBAAqB,GAAG,KAAK,CAAC,IAAI,CACtC,CAAsB,EAOX,EAAE,EAAE;QAPO,EACpB,MAAM,EACN,QAAQ,EACR,WAAW,EACX,WAAW,EACX,QAAQ,OAEC,EADN,SAAS,cANQ,gEAOrB,CADa;IAEZ,OAAO,CACL,oBAAC,QAAQ,kBACP,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,QAAQ,EAAE,WAAW,EACrB,WAAW,EAAE,QAAQ,EACrB,SAAS,EAAE,KAAK,EAChB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,QAAQ,mBACE,QAAQ,sBACL,WAAW,EAC7B,QAAQ,EAAE,MAAM,CAAC,QAAQ,IACrB,SAAS,GAEZ,QAAQ,CACA,CACZ,CAAA;AACH,CAAC,CACF,CAAA;AAED,qBAAqB,CAAC,WAAW,GAAG,uBAAuB,CAAA;AAE3D,eAAe,qBAAqB,CAAA"}

package/dist-package/src/NonNativeSelectOptions/NonNativeSelectOptions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NonNativeSelectOptions.d.ts","sourceRoot":"","sources":["../../../src/NonNativeSelectOptions/NonNativeSelectOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQtC,OAAO,KAAK,EACV,cAAc,EACd,SAAS,EACT,MAAM,EACN,YAAY,EACZ,WAAW,EACX,SAAS,EACV,MAAM,eAAe,CAAA;AAkCtB,oBAAY,KAAK,GAAG,IAAI,CACtB,WAAW,EACX,UAAU,GAAG,eAAe,GAAG,cAAc,CAC9C,GAAG;IACF,OAAO,EAAE,MAAM,EAAE,GAAG,YAAY,CAAA;IAChC,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,kBAAkB,EAAE,MAAM,CAAA;IAC1B,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;IAC1D,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,SAAS,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE;QACR,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,CAAA;CACF,CAAA;AAwFD,QAAA,MAAM,sBAAsB;0JAYzB,KAAK;;CAsEP,CAAA;AAID,eAAe,sBAAsB,CAAA"}
+{"version":3,"file":"NonNativeSelectOptions.d.ts","sourceRoot":"","sources":["../../../src/NonNativeSelectOptions/NonNativeSelectOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQtC,OAAO,KAAK,EACV,cAAc,EACd,SAAS,EACT,MAAM,EACN,YAAY,EACZ,WAAW,EACX,SAAS,EACV,MAAM,eAAe,CAAA;AAkCtB,oBAAY,KAAK,GAAG,IAAI,CACtB,WAAW,EACX,UAAU,GAAG,eAAe,GAAG,cAAc,CAC9C,GAAG;IACF,OAAO,EAAE,MAAM,EAAE,GAAG,YAAY,CAAA;IAChC,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,kBAAkB,EAAE,MAAM,CAAA;IAC1B,YAAY,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAA;IAC1D,MAAM,CAAC,EAAE,cAAc,CAAA;IACvB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,SAAS,CAAA;IACvB,SAAS,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE;QACR,SAAS,CAAC,EAAE,MAAM,CAAA;KACnB,CAAA;CACF,CAAA;AAkFD,QAAA,MAAM,sBAAsB;0JAYzB,KAAK;;CAiDP,CAAA;AAID,eAAe,sBAAsB,CAAA"}

package/dist-package/src/NonNativeSelectOptions/NonNativeSelectOptions.js

@@ -22,13 +22,9 @@ const MenuGroup = (props) => {
             React.createElement(Typography, { size: 'xsmall', weight: 'semibold', color: 'dark-grey' }, group)),
         children));
 };
-const MemoizedNonNativeSelectOption = React.memo(NonNativeSelectOption);
 const renderOptions = ({ options, getItemProps, selection, highlightedIndex, offset = 0, renderOption, }) => {
     return options.map((option, index) => {
-        const optionIndex = index + offset;
-        const isHighlighted = highlightedIndex === optionIndex;
-        const isSelected = selection.isOptionSelected(option);
-        return (React.createElement(MemoizedNonNativeSelectOption, Object.assign({ key: option.key || option.value, option: option, selected: isSelected, highlighted: isHighlighted, description: option.description }, getItemProps(option, optionIndex)), renderOption === null || renderOption === void 0 ? void 0 : renderOption(option)));
+        return (React.createElement(NonNativeSelectOption, Object.assign({ key: option.key || option.value, option: option, selected: selection.isOptionSelected(option), highlighted: highlightedIndex === index + offset, description: option.description }, getItemProps(option, index + offset)), renderOption === null || renderOption === void 0 ? void 0 : renderOption(option)));
     });
 };
 const renderGroups = ({ groups, getItemProps, selection, highlightedIndex, renderOption, }) => {
@@ -60,42 +56,27 @@ const addOffsetToHighlightedIndex = (groups, highlightedIndex) => {
 };
 const NonNativeSelectOptions = ({ options, renderOption = () => null, highlightedIndex, getItemProps, onBlur, selection, filterOptionsValue, noOptionsText, fixedHeader, fixedFooter, testIds, }) => {
     const flatOptions = useMemo(() => flattenOptions(options), [options]);
-    const renderedContent = useMemo(() => {
-        if (!flatOptions.length && filterOptionsValue) {
-            return (React.createElement(MenuItem, { titleCase: false, disabled: true }, noOptionsText));
-        }
-        if (isOptionsType(options)) {
-            return renderOptions({
-                options,
-                getItemProps,
-                selection,
-                highlightedIndex,
-                renderOption,
-            });
-        }
-        return renderGroups({
+    if (!flatOptions.length && filterOptionsValue) {
+        return (React.createElement(SelectOptions, { "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.noOptions, role: 'listbox', fixedHeader: fixedHeader },
+            React.createElement(MenuItem, { titleCase: false, disabled: true }, noOptionsText)));
+    }
+    return (React.createElement(SelectOptions, { fixedHeader: fixedHeader, onBlur: onBlur, selectedIndex: isOptionsType(options)
+            ? highlightedIndex
+            : addOffsetToHighlightedIndex(options, highlightedIndex), fixedFooter: fixedFooter, role: 'listbox' }, isOptionsType(options)
+        ? renderOptions({
+            options,
+            getItemProps,
+            selection,
+            highlightedIndex,
+            renderOption,
+        })
+        : renderGroups({
             groups: options,
             getItemProps,
             selection,
             highlightedIndex,
             renderOption,
-        });
-    }, [
-        options,
-        flatOptions,
-        filterOptionsValue,
-        getItemProps,
-        selection,
-        highlightedIndex,
-        renderOption,
-        noOptionsText,
-    ]);
-    if (!flatOptions.length && filterOptionsValue) {
-        return (React.createElement(SelectOptions, { "data-testid": testIds === null || testIds === void 0 ? void 0 : testIds.noOptions, role: 'listbox', fixedHeader: fixedHeader }, renderedContent));
-    }
-    return (React.createElement(SelectOptions, { fixedHeader: fixedHeader, onBlur: onBlur, selectedIndex: isOptionsType(options)
-            ? highlightedIndex
-            : addOffsetToHighlightedIndex(options, highlightedIndex), fixedFooter: fixedFooter, role: 'listbox' }, renderedContent));
+        })));
 };
 NonNativeSelectOptions.displayName = 'NonNativeSelectOptions';
 export default NonNativeSelectOptions;

package/dist-package/src/NonNativeSelectOptions/NonNativeSelectOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"NonNativeSelectOptions.js","sourceRoot":"","sources":["../../../src/NonNativeSelectOptions/NonNativeSelectOptions.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"NonNativeSelectOptions.js","sourceRoot":"","sources":["../../../src/NonNativeSelectOptions/NonNativeSelectOptions.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-select",
-  "version": "4.0.19-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
+  "version": "4.0.19-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
   "description": "Toptal UI components library - Select",
   "publishConfig": {
     "access": "public"
@@ -22,18 +22,18 @@
   },
   "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
   "dependencies": {
-    "@toptal/picasso-container": "3.1.2-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
-    "@toptal/picasso-form": "6.1.9-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-icons": "1.12.1-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-input": "4.0.19-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-input-adornment": "3.0.10-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-loader": "3.0.3-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
-    "@toptal/picasso-menu": "3.0.15-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-outlined-input": "4.0.19-alpha-bill-optimize-select-performance-381ce8200.1+381ce8200",
-    "@toptal/picasso-popper": "1.0.6-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
-    "@toptal/picasso-shared": "15.0.1-alpha-bill-optimize-select-performance-381ce8200.336+381ce8200",
-    "@toptal/picasso-typography": "4.0.3-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
-    "@toptal/picasso-utils": "3.0.1-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
+    "@toptal/picasso-container": "3.1.2-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
+    "@toptal/picasso-form": "6.1.9-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-icons": "1.12.1-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-input": "4.0.19-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-input-adornment": "3.0.10-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-loader": "3.0.3-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
+    "@toptal/picasso-menu": "3.0.15-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-outlined-input": "4.0.19-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.1+4c9b94a3e",
+    "@toptal/picasso-popper": "1.0.6-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
+    "@toptal/picasso-shared": "15.0.1-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.336+4c9b94a3e",
+    "@toptal/picasso-typography": "4.0.3-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
+    "@toptal/picasso-utils": "3.0.1-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
     "ap-style-title-case": "^1.1.2"
   },
   "sideEffects": [
@@ -46,9 +46,9 @@
     "react": ">=16.12.0 < 19.0.0"
   },
   "devDependencies": {
-    "@toptal/picasso-tailwind": "3.0.1-alpha-bill-optimize-select-performance-381ce8200.123+381ce8200",
-    "@toptal/picasso-tailwind-merge": "2.0.3-alpha-bill-optimize-select-performance-381ce8200.83+381ce8200",
-    "@toptal/picasso-test-utils": "1.1.2-alpha-bill-optimize-select-performance-381ce8200.336+381ce8200",
+    "@toptal/picasso-tailwind": "3.0.1-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.123+4c9b94a3e",
+    "@toptal/picasso-tailwind-merge": "2.0.3-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.83+4c9b94a3e",
+    "@toptal/picasso-test-utils": "1.1.2-alpha-ff-x-replace-overflow-hidden-by-clip-popper-4c9b94a3e.336+4c9b94a3e",
     "popper.js": "^1.16.1"
   },
   "exports": {
@@ -59,5 +59,5 @@
     "!dist-package/tsconfig.tsbuildinfo",
     "src"
   ],
-  "gitHead": "381ce8200c401760a75f271244b2c2310970d0a3"
+  "gitHead": "4c9b94a3e62c29b2bef0b9e028e358948269df7c"
 }

package/src/NonNativeSelectOption/NonNativeSelectOption.tsx

@@ -12,42 +12,30 @@ export interface Props<T extends ValueType> extends ItemProps {
   option: Option<T>
 }
 
-const NonNativeSelectOptionComponent = <T extends ValueType>({
-  option,
-  selected,
-  highlighted,
-  description,
-  children,
-  ...itemProps
-}: Props<T>) => {
-  return (
-    <MenuItem
-      value={option.value}
-      selected={highlighted}
-      checkmarked={selected}
-      titleCase={false}
-      description={description}
-      role='option'
-      aria-selected={selected}
-      data-highlighted={highlighted}
-      disabled={option.disabled}
-      {...itemProps}
-    >
-      {children}
-    </MenuItem>
-  )
-}
-
 const NonNativeSelectOption = React.memo(
-  NonNativeSelectOptionComponent,
-  (prevProps, nextProps) => {
+  <T extends ValueType>({
+    option,
+    selected,
+    highlighted,
+    description,
+    children,
+    ...itemProps
+  }: Props<T>) => {
     return (
-      prevProps.selected === nextProps.selected &&
-      prevProps.highlighted === nextProps.highlighted &&
-      prevProps.option === nextProps.option &&
-      prevProps.option.disabled === nextProps.option.disabled &&
-      prevProps.description === nextProps.description &&
-      prevProps.children === nextProps.children
+      <MenuItem
+        value={option.value}
+        selected={highlighted}
+        checkmarked={selected}
+        titleCase={false}
+        description={description}
+        role='option'
+        aria-selected={selected}
+        data-highlighted={highlighted}
+        disabled={option.disabled}
+        {...itemProps}
+      >
+        {children}
+      </MenuItem>
     )
   }
 )

package/src/NonNativeSelectOptions/NonNativeSelectOptions.tsx

@@ -16,7 +16,7 @@ import type {
 } from '../SelectBase'
 import { flattenOptions, isOptionsType } from '../SelectBase'
 
-// TODO: Replace with a real component as soon as it's implemented [FX-1479]
+// TODO: Replace with a real component as soon as it's implemented
 // https://toptal-core.atlassian.net/browse/FX-1479
 // Note: In the current implementation children are siblings for the group node.
 // If in the new MenuGroup children are inside the group node, that will
@@ -64,8 +64,6 @@ export type Props = Pick<
   }
 }
 
-const MemoizedNonNativeSelectOption = React.memo(NonNativeSelectOption)
-
 const renderOptions = ({
   options,
   getItemProps,
@@ -78,21 +76,17 @@ const renderOptions = ({
   'getItemProps' | 'selection' | 'highlightedIndex' | 'renderOption'
 > & { options: Option[]; offset?: number }) => {
   return options.map((option, index) => {
-    const optionIndex = index + offset
-    const isHighlighted = highlightedIndex === optionIndex
-    const isSelected = selection.isOptionSelected(option)
-
     return (
-      <MemoizedNonNativeSelectOption
+      <NonNativeSelectOption
         key={option.key || option.value}
         option={option}
-        selected={isSelected}
-        highlighted={isHighlighted}
+        selected={selection.isOptionSelected(option)}
+        highlighted={highlightedIndex === index + offset}
         description={option.description}
-        {...getItemProps(option, optionIndex)}
+        {...getItemProps(option, index + offset)}
       >
         {renderOption?.(option)}
-      </MemoizedNonNativeSelectOption>
+      </NonNativeSelectOption>
     )
   })
 }
@@ -168,43 +162,6 @@ const NonNativeSelectOptions = ({
     [options]
   )
 
-  const renderedContent = useMemo(() => {
-    if (!flatOptions.length && filterOptionsValue) {
-      return (
-        <MenuItem titleCase={false} disabled>
-          {noOptionsText}
-        </MenuItem>
-      )
-    }
-
-    if (isOptionsType(options)) {
-      return renderOptions({
-        options,
-        getItemProps,
-        selection,
-        highlightedIndex,
-        renderOption,
-      })
-    }
-
-    return renderGroups({
-      groups: options,
-      getItemProps,
-      selection,
-      highlightedIndex,
-      renderOption,
-    })
-  }, [
-    options,
-    flatOptions,
-    filterOptionsValue,
-    getItemProps,
-    selection,
-    highlightedIndex,
-    renderOption,
-    noOptionsText,
-  ])
-
   if (!flatOptions.length && filterOptionsValue) {
     return (
       <SelectOptions
@@ -212,7 +169,9 @@ const NonNativeSelectOptions = ({
         role='listbox'
         fixedHeader={fixedHeader}
       >
-        {renderedContent}
+        <MenuItem titleCase={false} disabled>
+          {noOptionsText}
+        </MenuItem>
       </SelectOptions>
     )
   }
@@ -229,7 +188,21 @@ const NonNativeSelectOptions = ({
       fixedFooter={fixedFooter}
       role='listbox'
     >
-      {renderedContent}
+      {isOptionsType(options)
+        ? renderOptions({
+            options,
+            getItemProps,
+            selection,
+            highlightedIndex,
+            renderOption,
+          })
+        : renderGroups({
+            groups: options,
+            getItemProps,
+            selection,
+            highlightedIndex,
+            renderOption,
+          })}
     </SelectOptions>
   )
 }