diff --git a/change/@microsoft-arbutus-component-preview-2ce2c8d1-5687-4ce5-99ab-89563cb66da7.json b/change/@microsoft-arbutus-component-preview-2ce2c8d1-5687-4ce5-99ab-89563cb66da7.json
new file mode 100644
index 00000000..26f28903
--- /dev/null
+++ b/change/@microsoft-arbutus-component-preview-2ce2c8d1-5687-4ce5-99ab-89563cb66da7.json
@@ -0,0 +1,7 @@
+{
+ "type": "patch",
+ "comment": "Fixes ComponentPreviewProps wrapper type.",
+ "packageName": "@microsoft/arbutus.component-preview",
+ "email": "akimalunar@gmail.com",
+ "dependentChangeType": "patch"
+}
diff --git a/components/component-preview/src/component-preview/component-preview.types.ts b/components/component-preview/src/component-preview/component-preview.types.ts
index 399cf333..28184876 100644
--- a/components/component-preview/src/component-preview/component-preview.types.ts
+++ b/components/component-preview/src/component-preview/component-preview.types.ts
@@ -1,4 +1,4 @@
-import type { ElementType, ReactElement, ReactNode } from 'react';
+import type { ElementType, ReactNode } from 'react';
export type ComponentPreviewProps = {
/**
@@ -17,8 +17,8 @@ export type ComponentPreviewProps = {
* @example ({ children, currentThemeKey }) => {children}
*/
// This is exposed to the consumer, so we have to use any here.
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
- wrapper?: ({ children, themeKey }: WrapperProps) => ReactElement | null;
+ // eslint-disable-next-line no-unused-vars
+ wrapper?: ({ children, themeKey }: WrapperProps) => ReactNode;
/**
* Themes to be passed to the wrapper, if you want to add theme switcher.
@@ -70,6 +70,7 @@ export type ComponentPreviewProps = {
* const onThemeChange = (theme: string) => setCurrentTheme(theme);
* ```
*/
+ // eslint-disable-next-line no-unused-vars
onThemeChange?: (themeKey: string) => void;
};
diff --git a/scripts/update-docs.js b/scripts/update-docs.js
index 354d0015..71ba5ed3 100644
--- a/scripts/update-docs.js
+++ b/scripts/update-docs.js
@@ -10,4 +10,4 @@ fs.emptyDirSync(destDir);
// Copy the contents of the source directory to the destination directory
fs.copySync(sourceDir, destDir);
-console.log('Docs directory updated successfully!');
\ No newline at end of file
+console.log('Docs directory updated successfully!');
diff --git a/utilities/docs/src/layouts/home/home.tsx b/utilities/docs/src/layouts/home/home.tsx
index e3d1bffc..6cc09e07 100644
--- a/utilities/docs/src/layouts/home/home.tsx
+++ b/utilities/docs/src/layouts/home/home.tsx
@@ -90,9 +90,12 @@ export const HomeLayout: FC = ({
{articles.map(({ title, description, image, isExternal, to }, i) => {
const navigate = makeNavigate({ isExternal, to });
- const handleClick = useCallback((e: React.SyntheticEvent | undefined) => {
- navigate(e);
- }, [isExternal, to]);
+ const handleClick = useCallback(
+ (e: React.SyntheticEvent | undefined) => {
+ navigate(e);
+ },
+ [isExternal, to],
+ );
return (