@yca-software/yca-react-core 0.0.1

package/dist/components/spa/index.d.ts

@@ -0,0 +1,275 @@
+import * as React$1 from 'react';
+import React__default, { ReactNode } from 'react';
+import { A as AdminDetailErrorKind } from '../../admin-BVYdWtEy.js';
+import { a as AdminListSearchMode } from '../../useAdminListPage-C4ZTTllP.js';
+import { DateRange } from 'react-day-picker';
+import { LucideIcon } from 'lucide-react';
+export { d as dateRangePickerTranslations } from '../../dateRangePickerTranslations-B99F2WQA.js';
+import '@tanstack/react-query';
+import '../../pagination-CFqoqiAG.js';
+import '../../types-BuNHOJ1h.js';
+import 'date-fns';
+
+interface AdminDetailPageProps {
+    backHref: string;
+    backLabel: string;
+    isLoading: boolean;
+    errorKind?: AdminDetailErrorKind;
+    error?: unknown;
+    notFoundMessage: string;
+    forbiddenMessage: string;
+    loadErrorMessage: string;
+    /** App-bound API error formatter (e.g. formatApiError from SPA helpers). */
+    formatError?: (error: unknown) => string;
+    children: React.ReactNode;
+    headerActions?: React.ReactNode;
+}
+/** Reusable admin detail page: back button, loading/error states, content. */
+declare function AdminDetailPage({ backHref, backLabel, isLoading, errorKind, error, notFoundMessage, forbiddenMessage, loadErrorMessage, formatError, children, headerActions, }: AdminDetailPageProps): React$1.JSX.Element;
+
+interface AdminListPageColumn<T> {
+    key: string;
+    header: string;
+    render: (item: T) => React.ReactNode;
+    /** Column class for alignment/width */
+    className?: string;
+}
+interface AdminListPageProps<T> {
+    title: string;
+    description: string;
+    /** Optional actions (e.g. "Create" button) rendered next to the page title. */
+    headerActions?: React.ReactNode;
+    /** Card header title (e.g. "All Users") */
+    cardTitle: string;
+    searchPlaceholder: string;
+    emptyMessage: string;
+    columns: AdminListPageColumn<T>[];
+    items: T[];
+    isLoading: boolean;
+    hasNextPage: boolean;
+    isFetchingNextPage: boolean;
+    loadMoreRef: React.RefObject<HTMLTableRowElement | null>;
+    search: string;
+    onSearchChange: (value: string) => void;
+    onRowClick: (item: T) => void;
+    getRowKey: (item: T) => string;
+    /** Accessible label for the loading spinner (app i18n). */
+    loadingAriaLabel?: string;
+    /** `instant` updates query on debounced typing; `submit` requires Search/Clear actions. */
+    searchMode?: AdminListSearchMode;
+    /** Label for the Search button when `searchMode` is `submit`. */
+    searchButtonLabel?: string;
+    /** Label for the Clear button when `searchMode` is `submit`. */
+    clearButtonLabel?: string;
+    /** Called when the user clicks Search or presses Enter in submit mode. */
+    onSearchSubmit?: () => void;
+    /** Called when the user clicks Clear in submit mode. */
+    onSearchClear?: () => void;
+    /** Enter-key handler for submit mode (typically from `useAdminListPage().onSearchKeyDown`). */
+    onSearchKeyDown?: React.KeyboardEventHandler<HTMLInputElement>;
+}
+/**
+ * Reusable admin list page: search + card + table + infinite scroll.
+ */
+declare function AdminListPage<T>({ title, description, headerActions, cardTitle, searchPlaceholder, emptyMessage, columns, items, isLoading, hasNextPage, isFetchingNextPage, loadMoreRef, search, onSearchChange, onRowClick, getRowKey, loadingAriaLabel, searchMode, searchButtonLabel, clearButtonLabel, onSearchSubmit, onSearchClear, onSearchKeyDown, }: AdminListPageProps<T>): React$1.JSX.Element;
+
+type AuditLogFilterOption = {
+    value: string;
+    label: string;
+};
+type AuditLogListFiltersProps = {
+    search: string;
+    onSearchChange: (value: string) => void;
+    action: string;
+    onActionChange: (value: string) => void;
+    resourceType: string;
+    onResourceTypeChange: (value: string) => void;
+    actionOptions: AuditLogFilterOption[];
+    resourceOptions: AuditLogFilterOption[];
+    searchPlaceholder: string;
+    actionFilterLabel: string;
+    resourceFilterLabel: string;
+};
+declare function AuditLogListFilters({ search, onSearchChange, action, onActionChange, resourceType, onResourceTypeChange, actionOptions, resourceOptions, searchPlaceholder, actionFilterLabel, resourceFilterLabel, }: AuditLogListFiltersProps): React$1.JSX.Element;
+
+interface QueryStateProps {
+    isLoading: boolean;
+    isError?: boolean;
+    error?: unknown;
+    onRetry?: () => void;
+    loadingClassName?: string;
+    children: React.ReactNode;
+    /** App-bound API error formatter (e.g. formatApiError from SPA helpers). */
+    formatError?: (error: unknown) => string;
+    /** Fallback copy when formatError returns empty. */
+    errorDescription?: string;
+    retryLabel?: string;
+    loadingLabel?: string;
+}
+/** Renders loading/error states for TanStack Query results, then children on success. */
+declare function QueryState({ isLoading, isError, error, onRetry, loadingClassName, children, formatError, errorDescription, retryLabel, loadingLabel, }: QueryStateProps): React$1.JSX.Element;
+
+type QueryStateBindings = Pick<QueryStateProps, 'formatError' | 'errorDescription' | 'retryLabel' | 'loadingLabel'>;
+type BoundQueryStateProps = Omit<QueryStateProps, keyof QueryStateBindings>;
+/** Factory for SPA-local i18n/error bindings around shared QueryState. */
+declare function createBoundQueryState(useBindings: () => QueryStateBindings): {
+    (props: BoundQueryStateProps): React$1.JSX.Element;
+    displayName: string;
+};
+
+interface DateRangeFilterProps {
+    label: string;
+    value: DateRange | undefined;
+    onChange: (value: DateRange | undefined) => void;
+    onApply: (value: DateRange | undefined) => void;
+    minDate?: Date;
+    maxDate?: Date;
+    className?: string;
+    hint?: string;
+    /** Layout variant for toolbar vs panel contexts. */
+    variant?: 'panel' | 'inline' | 'toolbar';
+    /** i18n translate function (e.g. from useTranslationNamespace). */
+    t: (key: string) => string;
+    /** Namespace prefix for dateRange keys (default: `common`). */
+    translationNs?: string;
+}
+declare function DateRangeFilter({ label, value, onChange, onApply, minDate, maxDate, className, hint, variant, t, translationNs, }: DateRangeFilterProps): React$1.JSX.Element;
+
+interface DetailField {
+    label: string;
+    value: React.ReactNode;
+    /** Span 2 columns on sm+ */
+    span?: 1 | 2;
+}
+type DetailFieldVariant = 'plain' | 'bordered';
+interface DetailFieldListProps {
+    fields: DetailField[];
+    className?: string;
+    /** When `bordered`, each label/value group is shown in a subtle framed cell. */
+    fieldVariant?: DetailFieldVariant;
+}
+/** Definition list for detail views. Responsive two-column grid on sm+. */
+declare function DetailFieldList({ fields, className, fieldVariant, }: DetailFieldListProps): React$1.JSX.Element;
+
+interface EntityRowAction {
+    label: string;
+    icon: LucideIcon;
+    onClick: () => void;
+    variant?: 'default' | 'destructive';
+}
+interface EntityRowProps {
+    icon: LucideIcon;
+    title: React.ReactNode;
+    /** Tooltip for title (when title is truncated). Omit when title is a ReactNode. */
+    titleTooltip?: string;
+    description?: string;
+    /** Secondary line below title (e.g. created date, email) */
+    subtitle?: string;
+    onClick?: () => void;
+    actions?: EntityRowAction[];
+    /** Muted styling for archived items */
+    archived?: boolean;
+    /** Extra content below main block (e.g. key prefix, metadata) */
+    children?: React.ReactNode;
+    className?: string;
+}
+/**
+ * Reusable row for settings entity lists (roles, teams, members, API keys).
+ * Consistent layout: icon + title + optional description/subtitle + actions dropdown.
+ */
+declare function EntityRow({ icon: Icon, title, titleTooltip, description, subtitle, onClick, actions, archived, children, className, }: EntityRowProps): React$1.JSX.Element;
+
+interface PageLoaderProps {
+    className?: string;
+    spinnerClassName?: string;
+    /**
+     * - `page`: full-screen route guard
+     * - `route`: lazy route / admin detail suspense (`min-h-[40vh]`)
+     * - `section`: in-page block (`py-12`)
+     * - `inline`: compact centered spinner (auth cards, nested panels)
+     */
+    variant?: 'page' | 'route' | 'section' | 'inline';
+    /** Accessible loading text; defaults to i18n `common.loading`. */
+    loadingLabel?: string;
+}
+declare function PageLoader({ className, spinnerClassName, variant, loadingLabel, }: PageLoaderProps): React$1.JSX.Element;
+
+interface RouteSuspenseProps {
+    children: ReactNode;
+    loadingLabel?: string;
+}
+/** Suspense boundary for lazy route modules with shared loading UX. */
+declare function RouteSuspense({ children, loadingLabel }: RouteSuspenseProps): React$1.JSX.Element;
+
+/**
+ * Theme store interface for theme state management.
+ */
+interface ThemeStore {
+    /** Current theme mode */
+    theme: 'light' | 'dark';
+    /** Function to update theme */
+    setTheme: (theme: 'light' | 'dark') => void;
+}
+/** Default in-memory theme store when no external store is provided. */
+declare function useDefaultThemeStore(): ThemeStore;
+/** Hook to read theme store from ThemeProvider context. */
+declare function useThemeStoreContext(): ThemeStore | null;
+/**
+ * Props for the ThemeProvider component.
+ */
+interface ThemeProviderProps {
+    /** Child components */
+    children: React__default.ReactNode;
+    /** Hook function that returns the theme store (e.g., from Zustand) */
+    useThemeStore?: () => ThemeStore;
+}
+/**
+ * Theme provider component that applies theme classes to the document root.
+ * Works with any state management solution via the `useThemeStore` prop.
+ * When `useThemeStore` is not provided, uses an internal default store so hooks are always called unconditionally.
+ *
+ * @example
+ * ```tsx
+ * // With Zustand
+ * const useThemeStore = () => {
+ *   const theme = useStore((state) => state.theme);
+ *   const setTheme = useStore((state) => state.setTheme);
+ *   return { theme, setTheme };
+ * };
+ *
+ * <ThemeProvider useThemeStore={useThemeStore}>
+ *   <App />
+ * </ThemeProvider>
+ * ```
+ */
+declare function ThemeProvider({ children, useThemeStore: useThemeStoreProp }: ThemeProviderProps): React__default.JSX.Element;
+
+/**
+ * Props for the ThemeToggle component.
+ */
+interface ThemeToggleProps {
+    /** Hook function that returns the theme store (e.g., from Zustand) */
+    useThemeStore?: () => ThemeStore;
+    /** Accessible label for the toggle button */
+    ariaLabel?: string;
+}
+/**
+ * Theme toggle button component.
+ * Displays a sun icon in dark mode and moon icon in light mode.
+ * Toggles between light and dark themes when clicked.
+ * When useThemeStore is passed, uses that store; otherwise uses ThemeProvider context or internal default (no conditional hook calls).
+ *
+ * @example
+ * ```tsx
+ * const useThemeStore = () => {
+ *   const theme = useStore((state) => state.theme);
+ *   const setTheme = useStore((state) => state.setTheme);
+ *   return { theme, setTheme };
+ * };
+ *
+ * <ThemeToggle useThemeStore={useThemeStore} ariaLabel="Toggle theme" />
+ * ```
+ */
+declare function ThemeToggle({ useThemeStore: useThemeStoreProp, ariaLabel, }: ThemeToggleProps): React$1.JSX.Element;
+
+export { AdminDetailErrorKind, AdminDetailPage, type AdminDetailPageProps, AdminListPage, type AdminListPageColumn, type AdminListPageProps, AdminListSearchMode, type AuditLogFilterOption, AuditLogListFilters, type AuditLogListFiltersProps, type BoundQueryStateProps, DateRangeFilter, type DateRangeFilterProps, type DetailField, DetailFieldList, type DetailFieldListProps, type DetailFieldVariant, EntityRow, type EntityRowAction, type EntityRowProps, PageLoader, type PageLoaderProps, QueryState, type QueryStateBindings, type QueryStateProps, RouteSuspense, type RouteSuspenseProps, ThemeProvider, type ThemeProviderProps, type ThemeStore, ThemeToggle, type ThemeToggleProps, createBoundQueryState, useDefaultThemeStore, useThemeStoreContext };

package/dist/components/spa/index.js

@@ -0,0 +1,8 @@
+export { AdminDetailPage, AdminListPage, AuditLogListFilters, DateRangeFilter, DetailFieldList, EntityRow, PageLoader, QueryState, RouteSuspense, ThemeProvider, ThemeToggle, createBoundQueryState, useDefaultThemeStore, useThemeStoreContext } from '../../chunk-EVZBADFR.js';
+import '../../chunk-PLSNCPEC.js';
+import '../../chunk-3AYG73DK.js';
+export { dateRangePickerTranslations } from '../../chunk-UCJ76BEC.js';
+import '../../chunk-TSXUUD64.js';
+import '../../chunk-GXWVFQCK.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/spa/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}