@seeqdev/qomponents 0.0.8 → 0.0.9

package/dist/index.js

@@ -7313,7 +7313,7 @@ var CreatableSelect = /*#__PURE__*/React.forwardRef(function (props, ref) {
 });
 var CreatableSelect$1 = CreatableSelect;
 
-const baseClasses = ['tw-px-2.5', 'focus:tw-ring-0', 'disabled:tw-cursor-not-allowed'].join(' ');
+const baseClasses = ['focus:tw-ring-0', 'disabled:tw-cursor-not-allowed'].join(' ');
 const containerStyles = ['tw-bg-white', 'dark:tw-bg-sq-dark-background'].join(' ');
 const errorClasses = 'tw-border-sq-danger-color';
 const borderColorClasses = ['tw-border-sq-disabled-gray', 'dark:tw-border-sq-dark-disabled-gray'].join(' ');
@@ -7389,7 +7389,7 @@ const multiValueStyles = [
  *  For ease of testing most of the elements of this select can be identified by classNames prefixed with "spec".
  *
  */
-const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no matching options', isSearchable = false, 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, }) => {
+const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no matching options', isSearchable = false, creatable = false, isMulti = false, isClearable = false, closeMenuOnSelect = true, id, inputId, menuPortalTarget = document.body, getOptionLabel, getSelectedValueLabel, getOptionValue, onChange, menuIsOpen, menuPlacement = 'auto', extraClassNames, inputGroup, filterConfig, filterOption, small = false, isDisabled = false, showError = false, isLoading = false, formatGroupLabel, onRemove, defaultValue, }) => {
     const getOptionOrSelectedLabel = (option, { context }) => {
         const getSelectedOptionLabel = getSelectedValueLabel ? getSelectedValueLabel : getOptionLabel;
         if (getOptionLabel || getSelectedValueLabel) {
@@ -7447,7 +7447,7 @@ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no
                     border = menuIsOpen ? 'tw-rounded-tr-sm' : 'tw-rounded-r-sm';
                 }
                 const appliedClasses = `${borderStyles} ${border}  ${showError ? errorClasses : borderColorClasses} ${small ? 'reactSelectMinHeightSmall' : 'reactSelectMinHeight'} `;
-                return `${appliedClasses} ${baseClasses} specSelectControl ${isDisabled ? disabledClasses : ''}`;
+                return `${appliedClasses} ${baseClasses} specSelectControl ${isDisabled ? disabledClasses : ''} ${small ? 'tw-pl-2 tw-pr-1' : 'tw-pl-2.5 tw-pr-1.5'}`;
             },
             placeholder: () => placeholderStyles,
             container: () => `${textStyles} ${containerStyles} ${extraClassNames}`,
@@ -7466,7 +7466,7 @@ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no
             singleValue: () => 'specOpenSelect',
             multiValue: () => multiValueStyles,
             multiValueRemove: () => 'hover:tw-text-sq-danger-color specSelectMultiValueRemove',
-            clearIndicator: () => 'hover:tw-text-sq-danger-color specClearSelect',
+            clearIndicator: () => 'tw-text-sq-disabled-gray hover:tw-text-sq-danger-color specClearSelect',
             group: () => 'specSelectGroup',
             groupHeading: () => groupHeadingStyles,
         },