From d6ee813cee646f98cc3e83076b10cebe5b947b13 Mon Sep 17 00:00:00 2001
From: Eric Olkowski <thatblindgeye@gmail.com>
Date: Wed, 9 Feb 2022 12:22:12 -0500
Subject: [PATCH] chore(CalendarMonth): convert examples to TypeScript

---
 .../CalendarMonth/examples/CalendarMonth.md   | 20 ++-----------------
 .../examples/CalendarMonthDefault.tsx         |  4 ++++
 .../examples/CalendarMonthSelectableDate.tsx  | 13 ++++++++++++
 3 files changed, 19 insertions(+), 18 deletions(-)
 create mode 100644 packages/react-core/src/components/CalendarMonth/examples/CalendarMonthDefault.tsx
 create mode 100644 packages/react-core/src/components/CalendarMonth/examples/CalendarMonthSelectableDate.tsx

diff --git a/packages/react-core/src/components/CalendarMonth/examples/CalendarMonth.md b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonth.md
index ef0b44817aa..4ac809257e4 100644
--- a/packages/react-core/src/components/CalendarMonth/examples/CalendarMonth.md
+++ b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonth.md
@@ -9,27 +9,11 @@ beta: true
 ## Examples
 
 ### Default
-```js
-import React from 'react';
-import { CalendarMonth } from '@patternfly/react-core';
 
-<CalendarMonth />
+```ts file="./CalendarMonthDefault.tsx"
 ```
 
 ### Selectable date
-```js
-import React from 'react';
-import { CalendarMonth } from '@patternfly/react-core';
 
-SelectableCalendarMonth = () => {
-  const [date, setDate] = React.useState(new Date(2020, 10, 24));
-  
-  return (
-    <React.Fragment>
-      <pre>Selected date: {date.toString()}</pre>
-      <CalendarMonth date={date} onChange={setDate} />
-    </React.Fragment>
-  );
-}
+```ts file="./CalendarMonthSelectableDate.tsx"
 ```
-
diff --git a/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthDefault.tsx b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthDefault.tsx
new file mode 100644
index 00000000000..57c4bc9452d
--- /dev/null
+++ b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthDefault.tsx
@@ -0,0 +1,4 @@
+import React from 'react';
+import { CalendarMonth } from '@patternfly/react-core';
+
+export const CalendarMonthDefault: React.FunctionComponent = () => <CalendarMonth date={new Date()} />;
diff --git a/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthSelectableDate.tsx b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthSelectableDate.tsx
new file mode 100644
index 00000000000..6f77dccf600
--- /dev/null
+++ b/packages/react-core/src/components/CalendarMonth/examples/CalendarMonthSelectableDate.tsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import { CalendarMonth } from '@patternfly/react-core';
+
+export const CalendarMonthSelectableDate: React.FunctionComponent = () => {
+  const [date, setDate] = React.useState(new Date(2020, 10, 24));
+
+  return (
+    <React.Fragment>
+      <pre>Selected date: {date.toString()}</pre>
+      <CalendarMonth date={date} onChange={setDate} />
+    </React.Fragment>
+  );
+};