@lodev09/react-native-true-sheet 4.0.0-beta.0 → 4.0.0-beta.1

package/src/TrueSheetPeek.tsx

@@ -0,0 +1,11 @@
+import type { ViewProps } from 'react-native';
+
+import TrueSheetPeekViewNativeComponent from './fabric/TrueSheetPeekViewNativeComponent';
+
+/**
+ * Wrapper component that marks its children as the sheet's peek content.
+ * When rendered within a `TrueSheet`, the `"peek"` detent reveals everything
+ * from the top of the sheet through the bottom of this component — content
+ * below it stays hidden until the sheet is expanded.
+ */
+export const TrueSheetPeek = (props: ViewProps) => <TrueSheetPeekViewNativeComponent {...props} />;

package/src/TrueSheetPeek.web.tsx

@@ -0,0 +1,63 @@
+import { createContext, type RefObject, useContext, useEffect, useRef } from 'react';
+import { type LayoutChangeEvent, View, type ViewProps } from 'react-native';
+
+/**
+ * Reports the measured peek content height to the owning TrueSheet.
+ * @internal
+ */
+export interface TrueSheetPeekContextValue {
+  contentRef: RefObject<View | null>;
+  peekRef: RefObject<View | null>;
+  setPeekContentHeight: (height: number) => void;
+}
+
+export const TrueSheetPeekContext = createContext<TrueSheetPeekContextValue | null>(null);
+
+/**
+ * Distance from the top of the content view to the bottom of the peek view,
+ * so the peek view's offset within the content (padding, views above it)
+ * counts toward the peek detent. Both rects live in the drawer's transformed
+ * subtree, so an in-flight translate cancels out of the delta.
+ * @internal
+ */
+export const measurePeekContentHeight = (
+  peekElement: HTMLElement,
+  contentElement: HTMLElement
+): number =>
+  peekElement.getBoundingClientRect().bottom - contentElement.getBoundingClientRect().top;
+
+/**
+ * Wrapper component that marks its children as the sheet's peek content.
+ * When rendered within a `TrueSheet`, the `"peek"` detent reveals everything
+ * from the top of the sheet through the bottom of this component — content
+ * below it stays hidden until the sheet is expanded.
+ */
+export const TrueSheetPeek = ({ onLayout, ...rest }: ViewProps) => {
+  const context = useContext(TrueSheetPeekContext);
+  const localRef = useRef<View>(null);
+
+  // Register into the sheet's peek ref so it can measure the peek live
+  // during detent geometry computation (state lags the first willPresent).
+  const viewRef = context?.peekRef ?? localRef;
+
+  useEffect(() => () => context?.setPeekContentHeight(0), [context]);
+
+  const handleLayout = (event: LayoutChangeEvent) => {
+    if (context) {
+      // On web, View refs resolve to the underlying DOM elements.
+      const peekElement = viewRef.current as unknown as HTMLElement | null;
+      const contentElement = context.contentRef.current as unknown as HTMLElement | null;
+
+      const bottom =
+        peekElement && contentElement
+          ? measurePeekContentHeight(peekElement, contentElement)
+          : event.nativeEvent.layout.height;
+
+      context.setPeekContentHeight(bottom);
+    }
+
+    onLayout?.(event);
+  };
+
+  return <View {...rest} ref={viewRef} onLayout={handleLayout} />;
+};

package/src/TrueSheetProvider.tsx

@@ -0,0 +1,33 @@
+import type { ReactNode } from 'react';
+
+import { TrueSheet } from './TrueSheet';
+import type { TrueSheetStaticMethods } from './TrueSheet.types';
+
+export type { TrueSheetStaticMethods };
+
+export interface TrueSheetProviderProps {
+  children: ReactNode;
+}
+
+/**
+ * Provider for TrueSheet on native platforms.
+ * This is a pass-through component - no context is needed on native
+ * since TrueSheet uses static instance methods internally.
+ */
+export function TrueSheetProvider({ children }: TrueSheetProviderProps) {
+  return children;
+}
+
+/**
+ * Hook to control TrueSheet instances by name.
+ * On native, this maps directly to TrueSheet static methods.
+ */
+export function useTrueSheet(): TrueSheetStaticMethods {
+  return {
+    present: TrueSheet.present,
+    dismiss: TrueSheet.dismiss,
+    dismissStack: TrueSheet.dismissStack,
+    resize: TrueSheet.resize,
+    dismissAll: TrueSheet.dismissAll,
+  };
+}

package/src/TrueSheetProvider.web.tsx

@@ -0,0 +1,220 @@
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useSyncExternalStore,
+  type ReactNode,
+  type RefObject,
+} from 'react';
+
+import type { TrueSheetMethods, TrueSheetStaticMethods } from './TrueSheet.types';
+
+type SheetRef = RefObject<TrueSheetMethods | null>;
+type NodeRef = RefObject<HTMLDivElement | null>;
+
+interface StackEntry {
+  ref: SheetRef;
+  nodeRef: NodeRef;
+  isFormSheetRef: RefObject<boolean>;
+}
+
+interface SheetContextValue {
+  registerByName: (name: string, ref: SheetRef) => () => void;
+  resolveByName: (name: string) => TrueSheetMethods;
+  pushOpen: (entry: StackEntry) => void;
+  popOpen: (entry: StackEntry) => void;
+  subscribeStack: (listener: () => void) => () => void;
+  getStackSnapshot: () => readonly StackEntry[];
+  portalContainer: HTMLElement | null;
+}
+
+const SheetContext = createContext<SheetContextValue | null>(null);
+
+const NO_PROVIDER_ERROR =
+  'TrueSheet: useTrueSheet() requires a <TrueSheetProvider> ancestor on web.';
+
+const EMPTY_STACK: readonly StackEntry[] = Object.freeze([]);
+
+export interface TrueSheetProviderProps {
+  children: ReactNode;
+}
+
+export function TrueSheetProvider({ children }: TrueSheetProviderProps) {
+  const namedSheetsRef = useRef<Map<string, SheetRef>>(new Map());
+  const stackRef = useRef<readonly StackEntry[]>(EMPTY_STACK);
+  const listenersRef = useRef<Set<() => void>>(new Set());
+
+  // Stable portal container created once. Attached to an anchor div rendered
+  // in this provider's tree so the sheets unmount cleanly with the provider
+  // (e.g., when a screen-scoped provider unmounts on navigation).
+  const portalContainer = useMemo<HTMLDivElement | null>(
+    () => (typeof document !== 'undefined' ? document.createElement('div') : null),
+    []
+  );
+  const anchorRef = useRef<HTMLDivElement | null>(null);
+
+  useLayoutEffect(() => {
+    const anchor = anchorRef.current;
+    if (!anchor || !portalContainer) return;
+    anchor.appendChild(portalContainer);
+    return () => {
+      if (portalContainer.parentNode) {
+        portalContainer.parentNode.removeChild(portalContainer);
+      }
+    };
+  }, [portalContainer]);
+
+  const value = useMemo<SheetContextValue>(() => {
+    const notify = () => listenersRef.current.forEach((listener) => listener());
+
+    return {
+      registerByName: (name, ref) => {
+        namedSheetsRef.current.set(name, ref);
+        return () => {
+          if (namedSheetsRef.current.get(name) === ref) {
+            namedSheetsRef.current.delete(name);
+          }
+        };
+      },
+      resolveByName: (name) => {
+        const ref = namedSheetsRef.current.get(name);
+        const methods = ref?.current;
+        if (!methods) {
+          throw new Error(`TrueSheet: no sheet registered with name "${name}"`);
+        }
+        return methods;
+      },
+      pushOpen: (entry) => {
+        if (stackRef.current.some((e) => e.ref === entry.ref)) return;
+        stackRef.current = [...stackRef.current, entry];
+        notify();
+      },
+      popOpen: (entry) => {
+        const idx = stackRef.current.findIndex((e) => e.ref === entry.ref);
+        if (idx < 0) return;
+        stackRef.current = [...stackRef.current.slice(0, idx), ...stackRef.current.slice(idx + 1)];
+        notify();
+      },
+      subscribeStack: (listener) => {
+        listenersRef.current.add(listener);
+        return () => {
+          listenersRef.current.delete(listener);
+        };
+      },
+      getStackSnapshot: () => stackRef.current,
+      portalContainer,
+    };
+  }, [portalContainer]);
+
+  return (
+    <SheetContext.Provider value={value}>
+      {children}
+      <div ref={anchorRef} />
+    </SheetContext.Provider>
+  );
+}
+
+export function usePortalContainer(): HTMLElement | null {
+  const ctx = useContext(SheetContext);
+  return ctx?.portalContainer ?? null;
+}
+
+export function useTrueSheet(): TrueSheetStaticMethods {
+  const ctx = useContext(SheetContext);
+
+  return useMemo<TrueSheetStaticMethods>(() => {
+    if (!ctx) {
+      const reject = async (): Promise<never> => {
+        throw new Error(NO_PROVIDER_ERROR);
+      };
+      return {
+        present: reject,
+        resize: reject,
+        dismiss: reject,
+        dismissStack: reject,
+        dismissAll: reject,
+      };
+    }
+
+    return {
+      present: (name, index, animated) => ctx.resolveByName(name).present(index, animated),
+      resize: (name, index) => ctx.resolveByName(name).resize(index),
+      dismiss: (name, animated) => ctx.resolveByName(name).dismiss(animated),
+      dismissStack: (name, animated) => ctx.resolveByName(name).dismissStack(animated),
+      dismissAll: async (animated) => {
+        const stack = ctx.getStackSnapshot();
+        await Promise.all(
+          [...stack].reverse().map((entry) => entry.ref.current?.dismiss(animated))
+        );
+      },
+    };
+  }, [ctx]);
+}
+
+export function useRegisterSheet(name: string | undefined, ref: SheetRef): void {
+  const ctx = useContext(SheetContext);
+  useEffect(() => {
+    if (!ctx || !name) return;
+    return ctx.registerByName(name, ref);
+  }, [ctx, name, ref]);
+}
+
+/**
+ * Registers the sheet in the open stack while `isOpen` is true and returns
+ * live data used by each sheet to render stacked visuals and dismiss children.
+ */
+export function useSheetStack(
+  ref: SheetRef,
+  nodeRef: NodeRef,
+  isOpen: boolean,
+  isFormSheet: boolean
+) {
+  const ctx = useContext(SheetContext);
+
+  const isFormSheetRef = useRef(isFormSheet);
+  isFormSheetRef.current = isFormSheet;
+
+  const entry = useMemo<StackEntry>(() => ({ ref, nodeRef, isFormSheetRef }), [ref, nodeRef]);
+
+  useEffect(() => {
+    if (!ctx || !isOpen) return;
+    ctx.pushOpen(entry);
+    return () => ctx.popOpen(entry);
+  }, [ctx, entry, isOpen]);
+
+  const subscribe = useCallback(
+    (listener: () => void) => {
+      if (!ctx) return () => {};
+      return ctx.subscribeStack(listener);
+    },
+    [ctx]
+  );
+
+  const getSnapshot = useCallback(() => (ctx ? ctx.getStackSnapshot() : EMPTY_STACK), [ctx]);
+
+  const stack = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const stackIndex = stack.findIndex((e) => e.ref === ref);
+  const isNested = stackIndex > 0;
+  const descendants = useMemo<readonly StackEntry[]>(
+    () => (stackIndex < 0 ? EMPTY_STACK : stack.slice(stackIndex + 1)),
+    [stack, stackIndex]
+  );
+
+  const dismissAbove = useCallback(
+    async (animated?: boolean) => {
+      if (!ctx) return;
+      const snapshot = ctx.getStackSnapshot();
+      const idx = snapshot.findIndex((e) => e.ref === ref);
+      if (idx < 0) return;
+      const above = snapshot.slice(idx + 1);
+      await Promise.all([...above].reverse().map((e) => e.ref.current?.dismiss(animated)));
+    },
+    [ctx, ref]
+  );
+
+  return { descendants, isNested, dismissAbove };
+}

package/src/fabric/TrueSheetContainerViewNativeComponent.ts

@@ -5,4 +5,4 @@ export interface NativeProps extends ViewProps {
   // No props needed - container accesses props from parent TrueSheetView
 }
 
-export default codegenNativeComponent<NativeProps>('TrueSheetContainerView', {});
+export default codegenNativeComponent<NativeProps>('TrueSheetContainerView');

package/src/fabric/TrueSheetContentViewNativeComponent.ts

@@ -5,4 +5,8 @@ export interface NativeProps extends ViewProps {
   // No props needed - size will be controlled by parent
 }
 
-export default codegenNativeComponent<NativeProps>('TrueSheetContentView', {});
+// interfaceOnly: shadow node/state/descriptor are custom (common/cpp) so the
+// content can be bounded to the container when a ScrollView is pinned
+export default codegenNativeComponent<NativeProps>('TrueSheetContentView', {
+  interfaceOnly: true,
+});

package/src/fabric/TrueSheetFooterViewNativeComponent.ts

@@ -1,8 +1,16 @@
 import type { ViewProps } from 'react-native';
+import type { WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
 import { codegenNativeComponent } from 'react-native';
 
 export interface NativeProps extends ViewProps {
-  // Footer-specific props can be added here if needed
+  // Seeds the footer's first layout with the sheet's bottom safe-area inset
+  // (insetAdjustment: 'automatic') so a late-set footer doesn't need a second
+  // layout pass — and a visible sheet resize — once native pushes the inset
+  autoBottomInset?: WithDefault<boolean, false>;
 }
 
-export default codegenNativeComponent<NativeProps>('TrueSheetFooterView', {});
+// interfaceOnly: shadow node/state/descriptor are custom (common/cpp) so the
+// footer can absorb the sheet's bottom safe-area inset as padding
+export default codegenNativeComponent<NativeProps>('TrueSheetFooterView', {
+  interfaceOnly: true,
+});

package/src/fabric/TrueSheetHeaderViewNativeComponent.ts

@@ -0,0 +1,8 @@
+import type { ViewProps } from 'react-native';
+import { codegenNativeComponent } from 'react-native';
+
+export interface NativeProps extends ViewProps {
+  // Header-specific props can be added here if needed
+}
+
+export default codegenNativeComponent<NativeProps>('TrueSheetHeaderView', {});

package/src/fabric/TrueSheetPeekViewNativeComponent.ts

@@ -0,0 +1,8 @@
+import type { ViewProps } from 'react-native';
+import { codegenNativeComponent } from 'react-native';
+
+export interface NativeProps extends ViewProps {
+  // Peek-specific props can be added here if needed
+}
+
+export default codegenNativeComponent<NativeProps>('TrueSheetPeekView', {});

package/src/fabric/TrueSheetViewNativeComponent.ts

@@ -1,50 +1,131 @@
-import type { ViewProps } from 'react-native';
+import type { ColorValue, ProcessedColorValue, ViewProps } from 'react-native';
 import type {
   DirectEventHandler,
   Double,
   Int32,
   WithDefault,
-  Float,
 } from 'react-native/Libraries/Types/CodegenTypes';
 import { codegenNativeComponent } from 'react-native';
 
+type GrabberOptionsType = Readonly<{
+  width?: Double;
+  height?: Double;
+  topMargin?: Double;
+  cornerRadius?: WithDefault<Double, -1>;
+  color?: ProcessedColorValue | null;
+  adaptive?: WithDefault<boolean, true>;
+}>;
+
+type AccessibilityOptionsType = Readonly<{
+  grabberLabel?: WithDefault<string, 'Sheet Grabber'>;
+  grabberHint?: WithDefault<string, 'Double-tap to expand. Swipe up or down to resize the sheet'>;
+  expandedValue?: WithDefault<string, 'Expanded'>;
+  collapsedValue?: WithDefault<string, 'Collapsed'>;
+  detentValue?: WithDefault<string, 'Detent {index} of {count}'>;
+  expandActionLabel?: WithDefault<string, 'Expand'>;
+  collapseActionLabel?: WithDefault<string, 'Collapse'>;
+  paneTitle?: WithDefault<string, 'Bottom sheet'>;
+}>;
+
+type BlurOptionsType = Readonly<{
+  intensity?: WithDefault<Double, -1>;
+  interaction?: WithDefault<boolean, true>;
+}>;
+
+type ScrollEdgeEffect = 'automatic' | 'hard' | 'soft' | 'hidden';
+
+type ScrollableOptionsType = Readonly<{
+  keyboardScrollOffset?: WithDefault<Double, 0>;
+  scrollingExpandsSheet?: WithDefault<boolean, true>;
+  topScrollEdgeEffect?: WithDefault<ScrollEdgeEffect, 'hidden'>;
+  bottomScrollEdgeEffect?: WithDefault<ScrollEdgeEffect, 'hidden'>;
+}>;
+
+type FooterOptionsType = Readonly<{
+  // Named uniquely across option structs — codegen derives the enum name from
+  // the field name, so a second `position` would redefine TrueSheetViewPosition
+  footerPosition?: WithDefault<'relative' | 'absolute', 'relative'>;
+  keyboardOffset?: WithDefault<Double, 0>;
+}>;
+
+type HeaderOptionsType = Readonly<{
+  position?: WithDefault<'relative' | 'absolute', 'relative'>;
+}>;
+
 export interface DetentInfoEventPayload {
   index: Int32;
   position: Double;
+  detent: Double;
 }
 
 export interface PositionChangeEventPayload {
-  index: Int32;
+  index: Double;
   position: Double;
-  transitioning: boolean;
-}
-
-export interface SizeChangeEventPayload {
-  width: Double;
-  height: Double;
+  detent: Double;
+  realtime: boolean;
 }
 
 export interface NativeProps extends ViewProps {
   // Array properties
-  detents?: ReadonlyArray<Float>;
+  detents?: ReadonlyArray<Double>;
 
   // Number properties - use 0 as default to avoid nil insertion
-  maxHeight?: WithDefault<Double, 0>;
-  background?: WithDefault<Int32, 0>;
+  maxContentHeight?: WithDefault<Double, 0>;
+  maxContentWidth?: WithDefault<Double, 0>;
   cornerRadius?: WithDefault<Double, -1>;
+  elevation?: WithDefault<Double, -1>;
+
+  // Color properties
+  backgroundColor?: ColorValue;
   initialDetentIndex?: WithDefault<Int32, -1>;
-  dimmedIndex?: WithDefault<Int32, 0>;
+  dimmedDetentIndex?: WithDefault<Int32, 0>;
 
   // String properties - use empty string as default to avoid nil insertion
-  blurTint?: WithDefault<string, ''>;
-  keyboardMode?: WithDefault<'resize' | 'pan', 'resize'>;
+  backgroundBlur?: WithDefault<
+    | 'none'
+    | 'light'
+    | 'dark'
+    | 'default'
+    | 'extra-light'
+    | 'regular'
+    | 'prominent'
+    | 'system-ultra-thin-material'
+    | 'system-thin-material'
+    | 'system-material'
+    | 'system-thick-material'
+    | 'system-chrome-material'
+    | 'system-ultra-thin-material-light'
+    | 'system-thin-material-light'
+    | 'system-material-light'
+    | 'system-thick-material-light'
+    | 'system-chrome-material-light'
+    | 'system-ultra-thin-material-dark'
+    | 'system-thin-material-dark'
+    | 'system-material-dark'
+    | 'system-thick-material-dark'
+    | 'system-chrome-material-dark',
+    'none'
+  >;
+
+  anchor?: WithDefault<'left' | 'center' | 'right', 'center'>;
+  anchorOffset?: WithDefault<Double, 16>;
+  insetAdjustment?: WithDefault<'automatic' | 'never', 'automatic'>;
+
+  // Blur options
+  blurOptions?: BlurOptionsType;
 
   // Boolean properties - match defaults from TrueSheet.types.ts
   grabber?: WithDefault<boolean, true>;
+  grabberOptions?: GrabberOptionsType;
+  accessibilityOptions?: AccessibilityOptionsType;
   dismissible?: WithDefault<boolean, true>;
+  draggable?: WithDefault<boolean, true>;
   dimmed?: WithDefault<boolean, true>;
   initialDetentAnimated?: WithDefault<boolean, true>;
-  edgeToEdgeFullScreen?: WithDefault<boolean, false>;
+  scrollableOptions?: ScrollableOptionsType;
+  headerOptions?: HeaderOptionsType;
+  footerOptions?: FooterOptionsType;
+  presentation?: WithDefault<'page' | 'form', 'page'>;
 
   // Event handlers
   onMount?: DirectEventHandler<null>;
@@ -57,7 +138,13 @@ export interface NativeProps extends ViewProps {
   onDragChange?: DirectEventHandler<DetentInfoEventPayload>;
   onDragEnd?: DirectEventHandler<DetentInfoEventPayload>;
   onPositionChange?: DirectEventHandler<PositionChangeEventPayload>;
-  onSizeChange?: DirectEventHandler<SizeChangeEventPayload>;
+  onWillFocus?: DirectEventHandler<null>;
+  onDidFocus?: DirectEventHandler<null>;
+  onWillBlur?: DirectEventHandler<null>;
+  onDidBlur?: DirectEventHandler<null>;
+  onVisibilityChange?: DirectEventHandler<Readonly<{ visible: boolean }>>;
 }
 
-export default codegenNativeComponent<NativeProps>('TrueSheetView');
+export default codegenNativeComponent<NativeProps>('TrueSheetView', {
+  interfaceOnly: true,
+});

package/src/index.ts

@@ -1,4 +1,4 @@
 export * from './TrueSheet';
 export * from './TrueSheet.types';
-export * from './TrueSheetGrabber';
-export * from './reanimated';
+export { TrueSheetPeek } from './TrueSheetPeek';
+export { TrueSheetProvider, useTrueSheet } from './TrueSheetProvider';

package/src/mocks/index.ts

@@ -0,0 +1,89 @@
+import React, { createElement, isValidElement, type ReactNode } from 'react';
+import { View, type ViewProps } from 'react-native';
+
+import type { TrueSheetProps, TrueSheetStaticMethods } from '../TrueSheet.types';
+
+interface TrueSheetState {
+  shouldRenderNativeView: boolean;
+}
+
+/**
+ * Mock TrueSheet component for testing.
+ * Import from '@lodev09/react-native-true-sheet/mock' in your test setup.
+ */
+export class TrueSheet extends React.Component<TrueSheetProps, TrueSheetState> {
+  static instances: Record<string, TrueSheet> = {};
+
+  static dismiss = jest.fn((_name: string, _animated?: boolean) => Promise.resolve());
+  static dismissStack = jest.fn((_name: string, _animated?: boolean) => Promise.resolve());
+  static present = jest.fn((_name: string, _index?: number, _animated?: boolean) =>
+    Promise.resolve()
+  );
+  static resize = jest.fn((_name: string, _index: number) => Promise.resolve());
+  static dismissAll = jest.fn((_animated?: boolean) => Promise.resolve());
+
+  dismiss = jest.fn((_animated?: boolean) => Promise.resolve());
+  dismissStack = jest.fn((_animated?: boolean) => Promise.resolve());
+  present = jest.fn((_index?: number, _animated?: boolean) => Promise.resolve());
+  resize = jest.fn((_index: number) => Promise.resolve());
+
+  componentDidMount() {
+    const { name } = this.props;
+    if (name) {
+      TrueSheet.instances[name] = this;
+    }
+  }
+
+  componentWillUnmount() {
+    const { name } = this.props;
+    if (name) {
+      delete TrueSheet.instances[name];
+    }
+  }
+
+  private renderHeader(): ReactNode {
+    const { header } = this.props;
+    if (!header) return null;
+    return isValidElement(header) ? header : createElement(header);
+  }
+
+  private renderFooter(): ReactNode {
+    const { footer } = this.props;
+    if (!footer) return null;
+    return isValidElement(footer) ? footer : createElement(footer);
+  }
+
+  render() {
+    const { children, style } = this.props;
+    return React.createElement(View, { style }, this.renderHeader(), children, this.renderFooter());
+  }
+}
+
+/**
+ * Mock TrueSheetPeek component for testing.
+ */
+export function TrueSheetPeek({ children, ...rest }: ViewProps) {
+  return React.createElement(View, rest, children);
+}
+
+/**
+ * Mock TrueSheetProvider for testing.
+ */
+export function TrueSheetProvider({ children }: { children: React.ReactNode }) {
+  return children;
+}
+
+/**
+ * Mock useTrueSheet hook for testing.
+ */
+export function useTrueSheet(): TrueSheetStaticMethods {
+  return {
+    present: TrueSheet.present,
+    dismiss: TrueSheet.dismiss,
+    dismissStack: TrueSheet.dismissStack,
+    resize: TrueSheet.resize,
+    dismissAll: TrueSheet.dismissAll,
+  };
+}
+
+export * from '../TrueSheet.types';