feat(textfield): add experimental react wrapper

PiperOrigin-RevId: 599982922

Author: Elliott Marquez

textfield/tsx/filled-text-field.ts

@@ -0,0 +1,19 @@
+/**
+ * @license
+ * Copyright 2024 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as React from 'react';
+import {createComponent} from '@lit/react';
+import {MdFilledTextField} from '../filled-text-field.js';
+import {events} from './internal/events.js';
+export type {MdFilledTextField} from '../filled-text-field.js';
+
+// tslint:disable-next-line
+export const FilledTextField = createComponent({
+  tagName: 'md-filled-text-field',
+  elementClass: MdFilledTextField,
+  events,
+  react: React,
+});

textfield/tsx/internal/events.ts

@@ -0,0 +1,13 @@
+/**
+ * @license
+ * Copyright 2024 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import {EventName} from '@lit/react';
+
+// tslint:disable-next-line
+export const events = {
+  onChange: 'change',
+  onInput: 'input' as EventName<InputEvent>,
+} as const;

textfield/tsx/outlined-text-field.ts

@@ -0,0 +1,19 @@
+/**
+ * @license
+ * Copyright 2024 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as React from 'react';
+import {createComponent} from '@lit/react';
+import {MdOutlinedTextField} from '../outlined-text-field.js';
+import {events} from './internal/events.js';
+export type {MdOutlinedTextField} from '../outlined-text-field.js';
+
+// tslint:disable-next-line
+export const OutlinedTextField = createComponent({
+  tagName: 'md-outlined-text-field',
+  elementClass: MdOutlinedTextField,
+  events,
+  react: React,
+});

tsconfig.json

@@ -29,6 +29,7 @@
   "exclude": [
     "catalog",
     "**/demo",
+    "**/tsx",
     "scripts/"
   ]
 }