Fix circular imports in forms package

packages/design/src/FormManager/FormEdit/components/common/MovePatternDropdown.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useRef, useEffect } from 'react';
 import { useFormManagerStore } from '../../../store.js';
 import styles from '../../formEditStyles.module.css';
+import type { Pattern } from '@atj/forms';
 
 interface MovePatternDropdownProps {
   isFieldset: boolean;
@@ -27,7 +28,9 @@ const MovePatternDropdown: React.FC<MovePatternDropdownProps> = ({
   const dropdownRef = useRef<HTMLDivElement>(null);
   const buttonRef = useRef<HTMLButtonElement>(null);
   const pages = useFormManagerStore(state =>
-    Object.values(state.session.form.patterns).filter(p => p.type === 'page')
+    Object.values<Pattern>(state.session.form.patterns).filter(
+      p => p.type === 'page'
+    )
   );
   const movePatternToPage = useFormManagerStore(state => state.movePattern);
   const focusPatternId = useFormManagerStore(state => state.focus?.pattern.id);

packages/design/src/FormManager/FormEdit/components/common/PatternEditActions.tsx

@@ -4,6 +4,7 @@ import classNames from 'classnames';
 import { useFormManagerStore } from '../../../store.js';
 import MovePatternDropdown from './MovePatternDropdown.js';
 import styles from '../../formEditStyles.module.css';
+import type { Pattern } from '@atj/forms';
 
 type PatternEditActionsProps = PropsWithChildren<{
   children?: ReactElement;
@@ -19,7 +20,7 @@ export const PatternEditActions = ({ children }: PatternEditActionsProps) => {
     state => state.focus?.pattern.type
   );
   const patterns = useFormManagerStore(state =>
-    Object.values(state.session.form.patterns)
+    Object.values<Pattern>(state.session.form.patterns)
   );
   const focusPatternId = useFormManagerStore(state => state.focus?.pattern.id);
   const isPatternInFieldset = useMemo(() => {
@@ -34,10 +35,12 @@ export const PatternEditActions = ({ children }: PatternEditActionsProps) => {
     copyPattern: state.copyPattern,
   }));
   const pages = useFormManagerStore(state =>
-    Object.values(state.session.form.patterns).filter(p => p.type === 'page')
+    Object.values<Pattern>(state.session.form.patterns).filter(
+      p => p.type === 'page'
+    )
   );
   const fieldsets = useFormManagerStore(state =>
-    Object.values(state.session.form.patterns).filter(
+    Object.values<Pattern>(state.session.form.patterns).filter(
       p => p.type === 'fieldset'
     )
   );

packages/forms/rollup.config.js

@@ -1,3 +1,4 @@
+import { watch } from 'rollup';
 import { builtinModules } from 'module';
 
 import { nodeResolve } from '@rollup/plugin-node-resolve';
@@ -51,4 +52,8 @@ export default {
       ]),
     ];
   })(),
+  watch: {
+    include: 'src/**/*.ts',
+    clearScreen: false,
+  },
 };