From a3070f752e909b88cb7e8bbcb0d4676779e6fa51 Mon Sep 17 00:00:00 2001
From: Maicol Battistini <maicolbattistini@live.it>
Date: Fri, 14 Jul 2023 11:19:10 +0200
Subject: [PATCH] =?UTF-8?q?feat:=20=E2=9C=A8=20Aggiunto=20componente=20`Fi?=
 =?UTF-8?q?lledDateTextField`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ts/Components/FilledDateTextField.tsx     | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)
 create mode 100644 resources/ts/Components/FilledDateTextField.tsx

diff --git a/resources/ts/Components/FilledDateTextField.tsx b/resources/ts/Components/FilledDateTextField.tsx
new file mode 100644
index 000000000..9f16eb490
--- /dev/null
+++ b/resources/ts/Components/FilledDateTextField.tsx
@@ -0,0 +1,36 @@
+import '@material/web/textfield/filled-text-field.js';
+import '@material/web/iconbutton/standard-icon-button.js';
+
+import {FilledTextField} from '@material/web/textfield/lib/filled-text-field';
+import {mdiCalendarMonthOutline} from '@mdi/js';
+import MdIcon from '@osm/Components/MdIcon';
+import {Property} from 'csstype';
+import {Vnode} from 'mithril';
+import {
+  Attributes,
+  Component
+} from 'mithril-utilities';
+import {KebabCasedProperties} from 'type-fest';
+
+export interface FilledDateTextFieldAttributes extends Attributes, Omit<KebabCasedProperties<FilledTextField>, 'style'> {}
+
+export default class FilledDateTextField<A extends FilledDateTextFieldAttributes> extends Component<A> {
+  element!: FilledTextField;
+  view(vnode: Vnode<A>) {
+    vnode.attrs.type ??= 'date';
+    return (
+      <md-filled-text-field {...vnode.attrs}>
+        {vnode.children}
+        <md-standard-icon-button slot="trailingicon" onclick={this.openDatePicker.bind(this)}>
+          <MdIcon icon={mdiCalendarMonthOutline}/>
+        </md-standard-icon-button>
+      </md-filled-text-field>
+    );
+  }
+
+  openDatePicker(event: MouseEvent & {redraw?: boolean}) {
+    event.redraw = false;
+    // @ts-expect-error - Input is private
+    (this.element.input as HTMLInputElement).showPicker();
+  }
+}