@object-ui/react 3.3.0 → 3.3.1

package/src/hooks/useDensityMode.ts

@@ -1,102 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { useState, useCallback, useMemo } from 'react';
-
-/** Density mode aligned with DensityMode from @objectstack/spec v2.0.7 */
-export type DensityModeValue = 'compact' | 'comfortable' | 'spacious';
-
-export interface DensityConfig {
-  /** Row height in pixels for each density mode */
-  rowHeights?: Record<DensityModeValue, number>;
-  /** Padding classes for each density mode */
-  paddingClasses?: Record<DensityModeValue, string>;
-  /** Font size classes for each density mode */
-  fontSizeClasses?: Record<DensityModeValue, string>;
-}
-
-export interface DensityResult {
-  /** Current density mode */
-  mode: DensityModeValue;
-  /** Set the density mode */
-  setMode: (mode: DensityModeValue) => void;
-  /** Cycle through density modes */
-  cycle: () => void;
-  /** Row height for the current mode (in pixels) */
-  rowHeight: number;
-  /** Tailwind padding class for the current mode */
-  paddingClass: string;
-  /** Tailwind font-size class for the current mode */
-  fontSizeClass: string;
-}
-
-const DEFAULT_ROW_HEIGHTS: Record<DensityModeValue, number> = {
-  compact: 32,
-  comfortable: 40,
-  spacious: 52,
-};
-
-const DEFAULT_PADDING_CLASSES: Record<DensityModeValue, string> = {
-  compact: 'py-1 px-2',
-  comfortable: 'py-2 px-3',
-  spacious: 'py-3 px-4',
-};
-
-const DEFAULT_FONT_SIZE_CLASSES: Record<DensityModeValue, string> = {
-  compact: 'text-xs',
-  comfortable: 'text-sm',
-  spacious: 'text-base',
-};
-
-const DENSITY_ORDER: DensityModeValue[] = ['compact', 'comfortable', 'spacious'];
-
-/**
- * Hook for managing view density modes (compact/comfortable/spacious).
- * Implements DensityMode from @objectstack/spec v2.0.7.
- *
- * @example
- * ```tsx
- * const density = useDensityMode('comfortable');
- *
- * return (
- *   <div className={density.paddingClass}>
- *     <table style={{ rowHeight: density.rowHeight }}>...</table>
- *     <button onClick={density.cycle}>Toggle Density</button>
- *   </div>
- * );
- * ```
- */
-export function useDensityMode(
-  initialMode: DensityModeValue = 'comfortable',
-  config?: DensityConfig
-): DensityResult {
-  const [mode, setMode] = useState<DensityModeValue>(initialMode);
-
-  const rowHeights = config?.rowHeights ?? DEFAULT_ROW_HEIGHTS;
-  const paddingClasses = config?.paddingClasses ?? DEFAULT_PADDING_CLASSES;
-  const fontSizeClasses = config?.fontSizeClasses ?? DEFAULT_FONT_SIZE_CLASSES;
-
-  const cycle = useCallback(() => {
-    setMode((current) => {
-      const idx = DENSITY_ORDER.indexOf(current);
-      return DENSITY_ORDER[(idx + 1) % DENSITY_ORDER.length];
-    });
-  }, []);
-
-  return useMemo(
-    () => ({
-      mode,
-      setMode,
-      cycle,
-      rowHeight: rowHeights[mode],
-      paddingClass: paddingClasses[mode],
-      fontSizeClass: fontSizeClasses[mode],
-    }),
-    [mode, cycle, rowHeights, paddingClasses, fontSizeClasses]
-  );
-}

package/src/hooks/useDiscovery.ts

@@ -1,168 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { useState, useEffect, useContext } from 'react';
-import { SchemaRendererContext } from '../context/SchemaRendererContext';
-
-/**
- * Discovery service information structure.
- * Represents server capabilities and service status.
- */
-export interface DiscoveryInfo {
-  /** Server name and version */
-  name?: string;
-  version?: string;
-  
-  /** Runtime mode (e.g., 'development', 'production', 'preview') */
-  mode?: string;
-
-  /** Preview mode configuration from the kernel (present when mode is 'preview') */
-  previewMode?: {
-    autoLogin?: boolean;
-    simulatedRole?: 'admin' | 'user' | 'viewer';
-    simulatedUserName?: string;
-    readOnly?: boolean;
-    expiresInSeconds?: number;
-    bannerMessage?: string;
-  };
-  
-  /** Service availability status */
-  services?: {
-    /** Authentication service status */
-    auth?: {
-      enabled: boolean;
-      status?: 'available' | 'unavailable';
-      message?: string;
-    };
-    /** Data access service status */
-    data?: {
-      enabled: boolean;
-      status?: 'available' | 'unavailable';
-    };
-    /** Metadata service status */
-    metadata?: {
-      enabled: boolean;
-      status?: 'available' | 'unavailable';
-    };
-    /** AI service configuration */
-    ai?: {
-      enabled: boolean;
-      status?: 'available' | 'unavailable';
-      /** AI service endpoint route (e.g. '/api/v1/ai') */
-      route?: string;
-    };
-    [key: string]: any;
-  };
-  
-  /** API capabilities */
-  capabilities?: string[];
-  
-  /** Additional discovery metadata */
-  [key: string]: any;
-}
-
-/**
- * Hook to access discovery information from the ObjectStack server.
- * 
- * This hook retrieves server capabilities and service status, which can be used
- * to conditionally enable/disable features based on server configuration.
- * 
- * @example
- * ```tsx
- * function App() {
- *   const { discovery, isLoading } = useDiscovery();
- *   
- *   if (isLoading) {
- *     return <LoadingScreen />;
- *   }
- *   
- *   // Check if auth is enabled on the server
- *   const authEnabled = discovery?.services?.auth?.enabled ?? true;
- *   
- *   return (
- *     <div>
- *       {authEnabled ? <AuthProvider>...</AuthProvider> : <App />}
- *     </div>
- *   );
- * }
- * ```
- * 
- * @returns Discovery information and loading state
- */
-export function useDiscovery() {
-  const context = useContext(SchemaRendererContext);
-  const dataSource = context?.dataSource;
-  const [discovery, setDiscovery] = useState<DiscoveryInfo | null>(null);
-  const [isLoading, setIsLoading] = useState(true);
-  const [error, setError] = useState<Error | null>(null);
-
-  useEffect(() => {
-    let cancelled = false;
-
-    async function fetchDiscovery() {
-      if (!dataSource) {
-        setIsLoading(false);
-        return;
-      }
-
-      try {
-        setIsLoading(true);
-        
-        // Check if dataSource has getDiscovery method
-        if (typeof (dataSource as any).getDiscovery === 'function') {
-          const discoveryData = await (dataSource as any).getDiscovery();
-          
-          if (!cancelled) {
-            setDiscovery(discoveryData);
-            setError(null);
-          }
-        } else {
-          // DataSource doesn't support discovery
-          if (!cancelled) {
-            setDiscovery(null);
-            setError(null);
-          }
-        }
-      } catch (err) {
-        if (!cancelled) {
-          setError(err instanceof Error ? err : new Error('Failed to fetch discovery'));
-          setDiscovery(null);
-        }
-      } finally {
-        if (!cancelled) {
-          setIsLoading(false);
-        }
-      }
-    }
-
-    fetchDiscovery();
-
-    return () => {
-      cancelled = true;
-    };
-  }, [dataSource]);
-
-  return {
-    discovery,
-    isLoading,
-    error,
-    /**
-     * Check if authentication is enabled on the server.
-     * Defaults to true if discovery data is not available.
-     */
-    isAuthEnabled: discovery?.services?.auth?.enabled ?? true,
-    /**
-     * Check if AI service is enabled and available on the server.
-     * Defaults to false if discovery data is not available.
-     */
-    isAiEnabled:
-      discovery?.services?.ai?.enabled === true &&
-      discovery?.services?.ai?.status === 'available',
-  };
-}
-

package/src/hooks/useDynamicApp.ts

@@ -1,142 +0,0 @@
-/**
- * ObjectUI
- * Copyright (c) 2024-present ObjectStack Inc.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { useState, useEffect, useCallback, useRef } from 'react';
-
-/**
- * Options for dynamic app configuration loading.
- */
-export interface DynamicAppOptions<TAppConfig = unknown> {
-  /** Application identifier to load */
-  appId: string;
-  /**
-   * Static (fallback) configuration used when the server does not
-   * provide an app definition or is unreachable.
-   */
-  staticConfig?: TAppConfig;
-  /**
-   * Data source adapter with `getApp` and `invalidateCache` methods.
-   * Typically an ObjectStackAdapter instance.
-   */
-  adapter?: {
-    getApp: (appId: string) => Promise<unknown | null>;
-    invalidateCache?: (key?: string) => void;
-    getObjectSchema?: (objectName: string) => Promise<unknown>;
-  };
-  /** Whether to attempt loading from the server (default: true) */
-  enabled?: boolean;
-}
-
-/**
- * Result returned by useDynamicApp.
- */
-export interface DynamicAppResult<TAppConfig = unknown> {
-  /** The resolved app configuration (server or static fallback) */
-  config: TAppConfig | null;
-  /** Whether the configuration is currently loading */
-  isLoading: boolean;
-  /** Error from the most recent load attempt */
-  error: Error | null;
-  /** Whether the config was loaded from the server (vs static fallback) */
-  isServerConfig: boolean;
-  /** Re-fetch the app configuration from the server, invalidating cache */
-  refresh: () => Promise<void>;
-}
-
-/**
- * React hook for dynamic app configuration loading.
- *
- * Fetches app configuration from the server via `adapter.getApp(appId)`,
- * falling back to `staticConfig` when the server is unavailable.
- * Supports cache-based hot-reload via the `refresh()` callback.
- *
- * @example
- * ```tsx
- * import { useDynamicApp } from '@object-ui/react';
- * import staticAppConfig from '../config/app.json';
- *
- * function App() {
- *   const { config, isLoading, refresh } = useDynamicApp({
- *     appId: 'crm',
- *     staticConfig: staticAppConfig,
- *     adapter: dataSource,
- *   });
- *
- *   if (isLoading) return <LoadingScreen />;
- *   return <Console config={config} onRefresh={refresh} />;
- * }
- * ```
- */
-export function useDynamicApp<TAppConfig = unknown>(
-  options: DynamicAppOptions<TAppConfig>,
-): DynamicAppResult<TAppConfig> {
-  const { appId, staticConfig, adapter, enabled = true } = options;
-
-  const [config, setConfig] = useState<TAppConfig | null>(staticConfig ?? null);
-  const [isLoading, setIsLoading] = useState(enabled && !!adapter);
-  const [error, setError] = useState<Error | null>(null);
-  const [isServerConfig, setIsServerConfig] = useState(false);
-
-  // Ref to track unmount / stale requests
-  const mountedRef = useRef(true);
-  useEffect(() => {
-    mountedRef.current = true;
-    return () => { mountedRef.current = false; };
-  }, []);
-
-  const loadConfig = useCallback(async () => {
-    if (!adapter || !enabled) {
-      setConfig(staticConfig ?? null);
-      setIsServerConfig(false);
-      setIsLoading(false);
-      return;
-    }
-
-    setIsLoading(true);
-    setError(null);
-
-    try {
-      const serverConfig = await adapter.getApp(appId);
-
-      if (!mountedRef.current) return;
-
-      if (serverConfig) {
-        setConfig(serverConfig as TAppConfig);
-        setIsServerConfig(true);
-      } else {
-        // Server returned null — fall back to static config
-        setConfig(staticConfig ?? null);
-        setIsServerConfig(false);
-      }
-    } catch (err) {
-      if (!mountedRef.current) return;
-
-      setError(err instanceof Error ? err : new Error(String(err)));
-      // Fall back to static config on error
-      setConfig(staticConfig ?? null);
-      setIsServerConfig(false);
-    } finally {
-      if (mountedRef.current) {
-        setIsLoading(false);
-      }
-    }
-  }, [adapter, appId, staticConfig, enabled]);
-
-  // Load on mount and when appId changes
-  useEffect(() => {
-    loadConfig();
-  }, [loadConfig]);
-
-  const refresh = useCallback(async () => {
-    // Invalidate cache before re-fetching
-    adapter?.invalidateCache?.(`app:${appId}`);
-    await loadConfig();
-  }, [adapter, appId, loadConfig]);
-
-  return { config, isLoading, error, isServerConfig, refresh };
-}