diff --git a/lib/platform-bible-react/src/preview/pages/components/advanced/scripture-results-viewer.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/advanced/scripture-results-viewer.examples.component.tsx
index 3dee29d8d4..1d8a117a38 100644
--- a/lib/platform-bible-react/src/preview/pages/components/advanced/scripture-results-viewer.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/advanced/scripture-results-viewer.examples.component.tsx
@@ -1,6 +1,6 @@
 import ScriptureResultsViewer from '@/components/advanced/scripture-results-viewer/scripture-results-viewer.component';
 import { Button } from '@/components/shadcn-ui/button';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import { useState } from 'react';
 import generateRandomCheckingData from '../data-sources/generate-random-checking-data';
 
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics.component.tsx
index efce6bbede..8a40adb979 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics.component.tsx
@@ -5,7 +5,7 @@ import {
   VerticalTabsList,
   VerticalTabsTrigger,
 } from '@/components/basics/tabs-vertical';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import ExampleAlerts from './basics/alert.examples.component';
 import ButtonExamples from './basics/button.examples.component';
 import CardExamples from './basics/card.examples.component';
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics/card.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics/card.examples.component.tsx
index ef46b69350..b49915a319 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics/card.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics/card.examples.component.tsx
@@ -10,7 +10,7 @@ import {
 import { Input } from '@/components/shadcn-ui/input';
 import { Label } from '@/components/shadcn-ui/label';
 import { Switch } from '@/components/shadcn-ui/switch';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import { BellRing, Check } from 'lucide-react';
 import SelectExamples from './select.examples.component';
 
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics/combo-box.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics/combo-box.examples.component.tsx
index 95354bac0c..35e2b06e33 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics/combo-box.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics/combo-box.examples.component.tsx
@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import ComboBox from '@/components/basics/combo-box.component';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 
 export default function ComboBoxExamples({ direction }: HasDirection) {
   const [comboBoxValue, setComboBox] = useState<string | undefined>(undefined);
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics/dropdown.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics/dropdown.examples.component.tsx
index bf8cf507c7..7a1de9cd83 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics/dropdown.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics/dropdown.examples.component.tsx
@@ -9,7 +9,7 @@ import {
   DropdownMenuShortcut,
   DropdownMenuTrigger,
 } from '@/components/shadcn-ui/dropdown-menu';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import { ChevronDown } from 'lucide-react';
 
 export default function DropdownExamples({ direction }: HasDirection) {
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics/select.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics/select.examples.component.tsx
index 37a6d6a318..d5de3e6d22 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics/select.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics/select.examples.component.tsx
@@ -5,7 +5,7 @@ import {
   SelectContent,
   SelectItem,
 } from '@/components/shadcn-ui/select';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 
 export default function SelectExamples({ direction }: HasDirection) {
   return (
diff --git a/lib/platform-bible-react/src/preview/pages/components/basics/tab.examples.component.tsx b/lib/platform-bible-react/src/preview/pages/components/basics/tab.examples.component.tsx
index 1b59959959..71ef614401 100644
--- a/lib/platform-bible-react/src/preview/pages/components/basics/tab.examples.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/components/basics/tab.examples.component.tsx
@@ -6,7 +6,7 @@ import {
 } from '@/components/basics/tabs-vertical';
 import { Button } from '@/components/shadcn-ui/button';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/shadcn-ui/tabs';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 
 export default function TabExamples({ direction }: HasDirection) {
   return (
diff --git a/lib/platform-bible-react/src/preview/pages/guide.component.tsx b/lib/platform-bible-react/src/preview/pages/guide.component.tsx
index 39f805a482..c1e7450c45 100644
--- a/lib/platform-bible-react/src/preview/pages/guide.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/guide.component.tsx
@@ -5,7 +5,7 @@ import {
   VerticalTabsTrigger,
 } from '@/components/basics/tabs-vertical';
 
-import { DirectionProps } from '@/preview/preview-components/direction-toggle';
+import { DirectionProps } from '@/preview/preview-components/direction-toggle.component';
 import DirectionGuide from './guide/direction.guide.component';
 import ThemeColorDisplay from './guide/theme-color-display.component';
 import ThemingGuide from './guide/theming.guide.component';
diff --git a/lib/platform-bible-react/src/preview/pages/layouts.component.tsx b/lib/platform-bible-react/src/preview/pages/layouts.component.tsx
index ba92a3f480..fb919ac069 100644
--- a/lib/platform-bible-react/src/preview/pages/layouts.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/layouts.component.tsx
@@ -4,7 +4,7 @@ import {
   VerticalTabsList,
   VerticalTabsTrigger,
 } from '@/components/basics/tabs-vertical';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import WindowOrTabExample from './layouts/window.layout.component';
 import Dashboard5Examples from './layouts/dashboard5.layout.component';
 
diff --git a/lib/platform-bible-react/src/preview/pages/layouts/dashboard5.layout.component.tsx b/lib/platform-bible-react/src/preview/pages/layouts/dashboard5.layout.component.tsx
index e8f473f371..db9c8a0c2c 100644
--- a/lib/platform-bible-react/src/preview/pages/layouts/dashboard5.layout.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/layouts/dashboard5.layout.component.tsx
@@ -50,7 +50,7 @@ import {
 } from '@/components/shadcn-ui/table';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/shadcn-ui/tabs';
 import { useState } from 'react';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 
 export default function Dashboard5Examples({ direction }: HasDirection) {
   const [progress, setProgress] = useState<number[]>([25]);
diff --git a/lib/platform-bible-react/src/preview/pages/layouts/window.layout.component.tsx b/lib/platform-bible-react/src/preview/pages/layouts/window.layout.component.tsx
index c5bba6ea87..04190d9cf7 100644
--- a/lib/platform-bible-react/src/preview/pages/layouts/window.layout.component.tsx
+++ b/lib/platform-bible-react/src/preview/pages/layouts/window.layout.component.tsx
@@ -11,7 +11,7 @@ import {
   DropdownMenuTrigger,
 } from '@/components/shadcn-ui/dropdown-menu';
 import { Tabs, TabsList, TabsTrigger } from '@/components/shadcn-ui/tabs';
-import { HasDirection } from '@/preview/preview-components/direction-toggle';
+import { HasDirection } from '@/preview/preview-components/direction-toggle.component';
 import { ScriptureReference } from 'platform-bible-utils';
 import { useState } from 'react';