@loadsmart/loadsmart-ui 6.0.3 → 6.0.5

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@loadsmart/loadsmart-ui",
-	"version": "6.0.3",
+	"version": "6.0.5",
 	"description": "Miranda UI, a React UI library",
 	"main": "dist",
 	"files": [

package/src/components/Button/Button.tsx

@@ -387,6 +387,7 @@ const StyledLoadingDots = styled(LoadingDots).attrs({
   role: 'presentation',
 })`
   position: absolute;
+  left: 0;
 
   display: flex;
   align-items: center;

package/src/components/Select/Select.test.tsx

@@ -192,6 +192,23 @@ describe('Select', () => {
         expect(onBlur).toHaveBeenNthCalledWith(1, new MouseEvent('mousedown'))
         expect(onBlur).toHaveBeenNthCalledWith(2, new KeyboardEvent('keyup'))
       })
+
+      it('shrinks when an option is selected', async () => {
+        setup({})
+
+        const searchInput = screen.getByLabelText('Select your favorite fruit')
+        const searchedFruit = generator.pickone([...FRUITS])
+
+        fire.change(searchInput, {
+          target: { value: searchedFruit.label },
+        })
+
+        expect(selectEvent.isMenuExpanded(searchInput)).toBe(true)
+
+        await selectEvent.select(searchedFruit.label, searchInput)
+
+        expect(selectEvent.isMenuExpanded(searchInput)).toBe(false)
+      })
     })
 
     describe('Single selection', () => {

package/src/components/Select/useSelect.ts

@@ -383,8 +383,10 @@ function useSelect(props: SelectProps): useSelectReturn {
         'aria-selected': checked,
         id: String(value),
         onClick() {
+          setQueryTyped(false)
+
           if (!multiple) {
-            setQuery(checked ? '' : label)
+            setQueryTyped(false)
           }
           toggleOption(option)