docs: update Select TS examples to use SelectItemData

articles/hilla/tutorial/index.adoc

@@ -243,7 +243,7 @@ For a complete CRM, users need to be able to edit contacts. Create a new compone
 .ContactForm.tsx
 [source,tsx]
 ----
-import { TextField, EmailField, Select, SelectItem, Button} from "@vaadin/react-components";
+import { TextField, EmailField, Select, SelectItemData, Button} from "@vaadin/react-components";
 import { useForm } from "@vaadin/hilla-react-form";
 import ContactRecordModel from "Frontend/generated/com/example/application/services/CRMService/ContactRecordModel";
 import { CRMService } from "Frontend/generated/endpoints";
@@ -264,7 +264,7 @@ interface ContactFormProps {
 
 export default function ContactForm({contact, onSubmit}: ContactFormProps) {
 
-    const companies = useSignal<SelectItem[]>([]);
+    const companies = useSignal<SelectItemData[]>([]);
 
     const {field, model, submit, reset, read} = useForm(ContactRecordModel, { onSubmit } );
 

frontend/demo/component/auto-grid/react/auto-grid-filtering.tsx

@@ -3,7 +3,7 @@ import React from 'react'; // hidden-source-line
 import { useSignals } from '@preact/signals-react/runtime'; // hidden-source-line
 import { AutoGrid } from '@vaadin/hilla-react-crud';
 import { useComputed, useSignal } from '@vaadin/hilla-react-signals';
-import { Select, type SelectItem } from '@vaadin/react-components/Select.js';
+import { Select, type SelectItemData } from '@vaadin/react-components/Select.js';
 import { TextField } from '@vaadin/react-components/TextField.js';
 import ProductModel from 'Frontend/generated/com/vaadin/demo/fusion/crud/ProductModel';
 import type AndFilter from 'Frontend/generated/com/vaadin/hilla/crud/filter/AndFilter';
@@ -12,7 +12,7 @@ import Matcher from 'Frontend/generated/com/vaadin/hilla/crud/filter/PropertyStr
 import { ProductService } from 'Frontend/generated/endpoints';
 import { autoGridHostStyles } from './auto-grid-host-styles'; // hidden-source-line
 
-const categories: SelectItem[] = [
+const categories: SelectItemData[] = [
   { label: 'All', value: 'All' },
   { label: 'Fruit', value: 'Fruit' },
   { label: 'Vegetable', value: 'Vegetable' },

frontend/demo/component/select/react/select-complex-value-label.tsx

@@ -2,12 +2,12 @@ import { reactExample } from 'Frontend/demo/react-example'; // hidden-source-lin
 import React, { useEffect } from 'react';
 import { useSignals } from '@preact/signals-react/runtime'; // hidden-source-line
 import { useSignal } from '@vaadin/hilla-react-signals';
-import { Select, type SelectItem } from '@vaadin/react-components/Select.js';
+import { Select, type SelectItemData } from '@vaadin/react-components/Select.js';
 import { getPeople } from 'Frontend/demo/domain/DataService';
 
 function Example() {
   useSignals(); // hidden-source-line
-  const items = useSignal<SelectItem[]>([]);
+  const items = useSignal<SelectItemData[]>([]);
 
   useEffect(() => {
     getPeople({ count: 5 }).then(({ people }) => {

frontend/demo/component/select/react/select-overlay-width.tsx

@@ -2,15 +2,15 @@ import { reactExample } from 'Frontend/demo/react-example'; // hidden-source-lin
 import React, { useEffect } from 'react';
 import { useSignals } from '@preact/signals-react/runtime'; // hidden-source-line
 import { useSignal } from '@vaadin/hilla-react-signals';
-import { Select, type SelectItem } from '@vaadin/react-components/Select.js';
+import { Select, type SelectItemData } from '@vaadin/react-components/Select.js';
 import { getPeople } from 'Frontend/demo/domain/DataService';
 import type Person from 'Frontend/generated/com/vaadin/demo/domain/Person';
 
 const formatPersonFullName = (person: Person) => `${person.firstName} ${person.lastName}`;
 
 function Example() {
   useSignals(); // hidden-source-line
-  const items = useSignal<SelectItem[]>([]);
+  const items = useSignal<SelectItemData[]>([]);
 
   useEffect(() => {
     getPeople({ count: 5 }).then(({ people }) => {

frontend/demo/component/select/select-complex-value-label.ts

@@ -2,7 +2,7 @@ import 'Frontend/demo/init'; // hidden-source-line
 import '@vaadin/select';
 import { html, LitElement } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
-import type { SelectItem } from '@vaadin/select';
+import type { SelectItemData } from '@vaadin/select';
 import { getPeople } from 'Frontend/demo/domain/DataService';
 import { applyTheme } from 'Frontend/demo/theme';
 
@@ -15,7 +15,7 @@ export class Example extends LitElement {
   }
 
   @state()
-  private items: SelectItem[] = [];
+  private items: SelectItemData[] = [];
 
   protected override async firstUpdated() {
     const { people } = await getPeople({ count: 5 });

frontend/demo/component/select/select-overlay-width.ts

@@ -4,7 +4,7 @@ import '@vaadin/list-box';
 import '@vaadin/select';
 import { html, LitElement } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
-import type { SelectItem } from '@vaadin/select';
+import type { SelectItemData } from '@vaadin/select';
 import { getPeople } from 'Frontend/demo/domain/DataService';
 import { applyTheme } from 'Frontend/demo/theme';
 import type Person from 'Frontend/generated/com/vaadin/demo/domain/Person';
@@ -20,7 +20,7 @@ export class Example extends LitElement {
   }
 
   @state()
-  private items: SelectItem[] = [];
+  private items: SelectItemData[] = [];
 
   protected override async firstUpdated() {
     const { people } = await getPeople({ count: 5 });