@seeqdev/qomponents 0.0.143 → 0.0.144

package/dist/index.js

@@ -13410,6 +13410,7 @@ const multiValueStyles = [
  *
  */
 const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no matching options', isSearchable = true, creatable = false, isMulti = false, isClearable = false, closeMenuOnSelect = true, id, inputId, menuPortalTarget, getOptionLabel, getSelectedValueLabel, getOptionValue, onChange, menuIsOpen, menuPlacement = 'auto', extraClassNames, inputGroup, filterConfig, filterOption, small = false, isDisabled = false, showError = false, isLoading = false, formatGroupLabel, onRemove, defaultValue, onMenuOpen, onMenuClose, components, onMenuInputFocus, onInputChange, inputValue, }) => {
+    const [isSelectOptionsOpen, setIsSelectOptionsOpen] = React.useState(false);
     const getOptionOrSelectedLabel = (option, { context }) => {
         const getSelectedOptionLabel = getSelectedValueLabel ? getSelectedValueLabel : getOptionLabel;
         if (getOptionLabel || getSelectedValueLabel) {
@@ -13465,6 +13466,7 @@ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no
         classNames: {
             control: ({ menuIsOpen }) => {
                 let border = menuIsOpen ? 'tw-rounded-t-md' : 'tw-rounded-md';
+                setIsSelectOptionsOpen(menuIsOpen);
                 // if it's on the left side of the input group make sure the right side is straight and not curved
                 if (inputGroup === 'left') {
                     border = menuIsOpen ? 'tw-rounded-tl-md' : 'tw-rounded-l-md';
@@ -13476,8 +13478,8 @@ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no
                 return `${appliedClasses} ${baseClasses$3} specSelectControl ${isDisabled ? disabledClasses$3 : ''} ${small ? 'tw-pl-2 tw-pr-1' : 'tw-pl-2.5 tw-pr-1.5'}`;
             },
             placeholder: () => placeholderStyles,
-            container: ({ selectProps }) => {
-                const containerBorderStyles = selectProps?.menuIsOpen ? 'tw-rounded-t-md' : 'tw-rounded-md';
+            container: () => {
+                const containerBorderStyles = isSelectOptionsOpen ? 'tw-rounded-t-md' : 'tw-rounded-md';
                 return `${textStyles} ${containerStyles} ${extraClassNames} ${containerBorderStyles}`;
             },
             input: () => textStyles + ' specSelectInput',