fix(select): modern syntax works with forms (#27480)

Issue number: resolves #27478

---------

<!-- 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. -->

The modern syntax render function was missing `renderHiddenInput` which
caused modern `ion-select` instances to not participate in form
submission. Legacy syntax is not affected.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Modern syntax calls `renderHiddenInput`.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## 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.0.7-dev.11684158250.1920157d`

core/src/components/select/select.tsx

@@ -745,14 +745,16 @@ export class Select implements ComponentInterface {
   }
 
   private renderSelect() {
-    const { disabled, el, isExpanded, labelPlacement, justify, placeholder, fill, shape } = this;
+    const { disabled, el, isExpanded, labelPlacement, justify, placeholder, fill, shape, name, value } = this;
     const mode = getIonMode(this);
     const hasFloatingOrStackedLabel = labelPlacement === 'floating' || labelPlacement === 'stacked';
     const justifyEnabled = !hasFloatingOrStackedLabel;
     const rtl = isRTL(el) ? 'rtl' : 'ltr';
     const inItem = hostContext('ion-item', this.el);
     const shouldRenderHighlight = mode === 'md' && fill !== 'outline' && !inItem;
 
+    renderHiddenInput(true, el, name, parseValue(value), disabled);
+
     return (
       <Host
         onClick={this.onClick}

core/src/components/select/test/select.spec.tsx

@@ -0,0 +1,22 @@
+import { h } from '@stencil/core';
+import { newSpecPage } from '@stencil/core/testing';
+
+import { Select } from '../select';
+
+describe('ion-select', () => {
+  it('should render hidden input for form validation', async () => {
+    const page = await newSpecPage({
+      components: [Select],
+      template: () => <ion-select value="my value" name="my name" disabled={true}></ion-select>,
+    });
+
+    const select = page.body.querySelector('ion-select');
+
+    const hiddenInput = select.querySelector('input[type="hidden"]');
+    expect(hiddenInput).not.toBe(null);
+
+    expect(hiddenInput.value).toBe('my value');
+    expect(hiddenInput.disabled).toBe(true);
+    expect(hiddenInput.name).toBe('my name');
+  });
+});