fix(overlays): change dropdownConfig inheritsReferenceWidth to min

packages/overlays/src/configurations/withDropdownConfig.js

@@ -1,7 +1,7 @@
 export const withDropdownConfig = () => ({
   placementMode: 'local',
 
-  inheritsReferenceWidth: 'full',
+  inheritsReferenceWidth: 'min',
   hidesOnOutsideClick: true,
   popperConfig: {
     placement: 'bottom-start',

packages/select-rich/test/lion-select-rich.test.js

@@ -400,6 +400,23 @@ describe('lion-select-rich', () => {
       expect(elSingleoption.opened).to.be.false;
     });
 
+    it('sets inheritsReferenceWidth to min by default', async () => {
+      const el = await fixture(html`
+        <lion-select-rich name="favoriteColor" label="Favorite color">
+          <lion-options slot="input">
+            <lion-option .choiceValue=${'red'}>Red</lion-option>
+            <lion-option .choiceValue=${'hotpink'}>Hotpink</lion-option>
+            <lion-option .choiceValue=${'teal'}>Teal</lion-option>
+          </lion-options>
+        </lion-select-rich>
+      `);
+
+      expect(el._overlayCtrl.inheritsReferenceWidth).to.equal('min');
+      el.opened = true;
+      await el.updateComplete;
+      expect(el._overlayCtrl.inheritsReferenceWidth).to.equal('min');
+    });
+
     it('should override the inheritsWidth prop when no default selected feature is used', async () => {
       const el = await fixture(html`
         <lion-select-rich name="favoriteColor" label="Favorite color" has-no-default-selected>
@@ -410,10 +427,14 @@ describe('lion-select-rich', () => {
           </lion-options>
         </lion-select-rich>
       `);
+      // The default is min, so we override that behavior here
+      el._overlayCtrl.inheritsReferenceWidth = 'full';
+      el._initialInheritsReferenceWidth = 'full';
 
       expect(el._overlayCtrl.inheritsReferenceWidth).to.equal('full');
       el.opened = true;
       await el.updateComplete;
+      // Opens while hasNoDefaultSelected = true, so we expect an override
       expect(el._overlayCtrl.inheritsReferenceWidth).to.equal('min');
 
       // Emulate selecting hotpink, it closing, and opening it again
@@ -423,6 +444,7 @@ describe('lion-select-rich', () => {
       el.opened = true;
       await el.updateComplete;
 
+      // noDefaultSelected will now flip the override back to what was the initial reference width
       expect(el._overlayCtrl.inheritsReferenceWidth).to.equal('full');
     });
 

yarn.lock

@@ -1998,6 +1998,31 @@
     npmlog "^4.1.2"
     write-file-atomic "^2.3.0"
 
+"@lion/field@0.13.1":
+  version "0.13.1"
+  resolved "https://registry.yarnpkg.com/@lion/field/-/field-0.13.1.tgz#566244c16fbac8e46d59e5a2eca7024cc6c8bfdc"
+  integrity sha512-ecAzZt4qq4VA+BCrxS9wcE5Vzy3yK6ETdHQlnmIZKuJwaACbtx+FKTkDovwxkYy4jpohWB2g+etQevz4F6GOzw==
+  dependencies:
+    "@lion/core" "0.6.0"
+    "@lion/validate" "0.11.0"
+
+"@lion/localize@0.10.0":
+  version "0.10.0"
+  resolved "https://registry.yarnpkg.com/@lion/localize/-/localize-0.10.0.tgz#f3608baeb9ae65ac4e0c3efdd6208208220a6153"
+  integrity sha512-oAy07yvNkFlsMxW3TBwrHvj1QEcjVDJ50vazuekzpc0M6v9c+00/6Y3U3TnH/H5V5qjKmOHnfhqYZoVqkmaqhA==
+  dependencies:
+    "@bundled-es-modules/message-format" "6.0.4"
+    "@lion/core" "0.6.0"
+    singleton-manager "1.0.0"
+
+"@lion/validate@0.11.0":
+  version "0.11.0"
+  resolved "https://registry.yarnpkg.com/@lion/validate/-/validate-0.11.0.tgz#634465b2a90461024e913698f60505cd0b774a19"
+  integrity sha512-pphmYoWZZyybjLo0kdZ8jBSDwS2yh4Kjuanu6Qv8YJCK1gK1d7CvMIqBdFAPlRvZ5DSpz7eoHMrY/iYbo6edog==
+  dependencies:
+    "@lion/core" "0.6.0"
+    "@lion/localize" "0.10.0"
+
 "@marionebl/sander@^0.6.0":
   version "0.6.1"
   resolved "https://registry.yarnpkg.com/@marionebl/sander/-/sander-0.6.1.tgz#1958965874f24bc51be48875feb50d642fc41f7b"