diff --git a/packages/block-editor/src/components/publish-date-time-picker/stories/index.story.js b/packages/block-editor/src/components/publish-date-time-picker/stories/index.story.js
new file mode 100644
index 00000000000000..c206920dcb6469
--- /dev/null
+++ b/packages/block-editor/src/components/publish-date-time-picker/stories/index.story.js
@@ -0,0 +1,41 @@
+/**
+ * WordPress dependencies
+ */
+import { useState } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import PublicPublishDateTimePicker from '../';
+
+export default {
+	title: 'Components/PublicPublishDateTimePicker',
+	component: PublicPublishDateTimePicker,
+	argTypes: {
+		onChange: { action: 'onChange' },
+		onClose: { action: 'onClose' },
+	},
+};
+
+export const Default = {
+	render: function Template( { onChange, ...args } ) {
+		const [ currentDate, setCurrentDate ] = useState(
+			args.currentDate || null
+		);
+
+		return (
+			<PublicPublishDateTimePicker
+				{ ...args }
+				currentDate={ currentDate }
+				onChange={ ( date ) => {
+					setCurrentDate( date );
+					onChange( date );
+				} }
+			/>
+		);
+	},
+	args: {
+		currentDate: new Date().toISOString(),
+		showPopoverHeaderActions: true,
+	},
+};