fix(label): do not grow when in end slot (#29036)

Issue number: resolves #29033 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> In #28773 I resolved several incorrect behaviors with Items related to text wrapping. However, it looks like I missed the removal of https://github.com/ionic-team/ionic-framework/pull/28146/files#diff-4a1156704dbf45b0dad273b6909b190ca45e4380aa7378ba88d0dd7d48d7d473R37 which caused the issue to persist when adding a label to the end slot. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Removed logic that caused `ion-label` to grow larger than it needed to be | `main` | branch | | - | - | | ![Screenshot 2024-02-13 at 11 20 43 AM](https://github.com/ionic-team/ionic-framework/assets/2721089/3fbddd04-d4b5-474c-ab9c-4d9c6e88f758) | ![Screenshot 2024-02-13 at 11 21 17 AM](https://github.com/ionic-team/ionic-framework/assets/2721089/188eda24-ec6f-4ba7-b3ed-2993d93b1cc7) | ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.7.2-dev.11707840956.16e27b4c` --------- Co-authored-by: ionitron <hi@ionicframework.com>

Author: liamdebeasi

core/src/components/label/label.scss

@@ -29,14 +29,6 @@
  overflow: hidden;
 }
 
-// TODO(FW-5289): move to :host-context(.item)
-// Shouldn't need :not(.item-input) as this was
-// only needed because of the specificity with
-// :not(.item-legacy)
-:host-context(.item:not(.item-input):not(.item-legacy)) {
- flex-grow: 1;
-}
-
 :host(.ion-color) {
  color: current-color(base);
 }

core/src/components/label/test/item/item.e2e.ts

@@ -0,0 +1,27 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+ test.describe(title('label: in item'), () => {
+ test('should render correctly in an item', async ({ page }) => {
+ test.info().annotations.push({
+ type: 'issue',
+ description: 'https://github.com/ionic-team/ionic-framework/issues/29033',
+ });
+ await page.setContent(
+ `
+ <ion-item>
+ <ion-label slot="start">Start</ion-label>
+ <ion-label>Default</ion-label>
+ <ion-label slot="end">End</ion-label>
+ </ion-item>
+ `,
+ config
+ );
+
+ const item = page.locator('ion-item');
+
+ await expect(item).toHaveScreenshot(screenshot(`label-item`));
+ });
+ });
+});