warqadui 0.0.11 → 0.0.13

package/dist/index.d.mts

@@ -4,6 +4,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react_hook_form from 'react-hook-form';
 import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
 import { ColumnDef, SortingState, ColumnFiltersState, RowData } from '@tanstack/react-table';
+import * as react_to_print from 'react-to-print';
 
 interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: "primary" | "secondary" | "outline" | "ghost" | "danger" | "warning";
@@ -13,6 +14,55 @@ interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElem
 }
 declare const Button: React__default.FC<ButtonProps>;
 
+interface InfoItem {
+    label: string;
+    value: React__default.ReactNode;
+    /** Use monospace font for the value (useful for account numbers, IDs, etc.) */
+    mono?: boolean;
+}
+interface InfoGridProps {
+    items: InfoItem[];
+    /** Grid columns count, defaults to 3 */
+    cols?: number;
+    /** Optional container class */
+    className?: string;
+    isLoading?: boolean;
+}
+/**
+ * InfoGrid Component
+ *
+ * A clean, rounded grid container for displaying key information items
+ * with labels and values.
+ */
+declare const InfoGrid: React__default.FC<InfoGridProps>;
+
+/**
+ * Props for the PageA4 component
+ */
+interface PageA4Props {
+    /** The content to render inside the A4 page */
+    children: React__default.ReactNode;
+    /** Optional container class for the outer document viewer wrapper */
+    className?: string;
+    /** Optional class for the paper itself */
+    pageClassName?: string;
+    /** Optional page number for the footer */
+    pageNumber?: number;
+    /** Optional total pages for the footer */
+    totalPages?: number;
+    /** Whether this is the final page being printed */
+    isLastPage?: boolean;
+}
+/**
+ * PageA4 Component
+ *
+ * A reusable React component that renders its children inside a container that always
+ * maintains an exact A4 paper width (210mm).
+ *
+ * It scales down proportionally on smaller screens.
+ */
+declare const PageA4: React__default.FC<PageA4Props>;
+
 interface NavItem {
     label: string;
     icon?: React__default.ReactNode;
@@ -149,7 +199,7 @@ interface UseModalReturn {
 declare const useModal: (initialState?: boolean) => UseModalReturn;
 
 interface DateInputProps<T extends FieldValues> {
-    label: string;
+    label?: string;
     error?: string;
     containerClassName?: string;
     name?: Path<T>;
@@ -227,7 +277,7 @@ interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElemen
 declare const PhoneInput: React$1.ForwardRefExoticComponent<PhoneInputProps & React$1.RefAttributes<any>>;
 
 interface InputProps<T extends FieldValues> extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "name" | "form"> {
-    label: string;
+    label?: string;
     icon?: React.ReactNode;
     error?: string;
     containerClassName?: string;
@@ -255,10 +305,12 @@ declare const Fields: {
     }) => React.ReactElement;
 };
 
+type DataTableColumn<TData = any, TValue = any> = ColumnDef<TData, TValue> & {
+    key?: string;
+    hide?: boolean;
+};
 interface DataTableProps<TData, TValue> {
-    columns: (ColumnDef<TData, TValue> & {
-        key?: string;
-    })[];
+    columns: DataTableColumn<TData, TValue>[];
     data: TData[];
     isLoading?: boolean;
     pageRows?: number;
@@ -285,9 +337,11 @@ interface DataTableProps<TData, TValue> {
         selectedRows: TData[];
         filteredData: TData[];
     }) => void;
+    selectable?: boolean;
+    filterables?: boolean;
 }
 declare function DataTable<TData, TValue>({ columns: userColumns, data, isLoading, pageRows, searchPlaceholder, className, verticalLines, rowPadding, index, renderSubComponent, hasSubComponent, // default to true
-defaultExpanded, onChange, }: DataTableProps<TData, TValue>): react_jsx_runtime.JSX.Element;
+defaultExpanded, onChange, selectable, filterables, }: DataTableProps<TData, TValue>): react_jsx_runtime.JSX.Element;
 
 declare module "@tanstack/react-table" {
     interface ColumnMeta<TData extends RowData, TValue> {
@@ -325,17 +379,31 @@ interface PostTableProps<TData> {
 declare function PostTable<TData extends Record<string, any>>({ columns: userColumns, data: controlledData, onChange, isLoading, className, verticalLines, rowPadding, index, renderAddButton, renderSubComponent, hasSubComponent, // default to true if renderSubComponent is provided
 defaultExpanded, }: PostTableProps<TData>): react_jsx_runtime.JSX.Element;
 
+type SimpleTableColumn<TData> = ColumnDef<TData, any> & {
+    key?: string;
+    render?: (row: TData) => React__default.ReactNode;
+    renderFooter?: (data: TData[]) => React__default.ReactNode;
+    className?: string;
+    width?: number | string;
+    minWidth?: number | string;
+    maxWidth?: number | string;
+    flex?: number;
+    hide?: boolean;
+};
 interface SimpleTableProps<TData> {
-    columns: (ColumnDef<TData, any> & {
-        key?: string;
-    })[];
+    columns: SimpleTableColumn<TData>[];
     data: TData[];
     className?: string;
     renderFooter?: () => React__default.ReactNode;
     rowPadding?: string;
     verticalLines?: boolean;
+    index?: boolean;
+    startIndex?: number;
+    isLoading?: boolean;
+    title?: string;
+    enableSearch?: boolean;
 }
-declare function SimpleTable<TData>({ columns: userColumns, data, className, renderFooter, rowPadding, verticalLines, }: SimpleTableProps<TData>): react_jsx_runtime.JSX.Element;
+declare function SimpleTable<TData>({ columns: userColumns, data, className, renderFooter: componentFooter, rowPadding, verticalLines, index, startIndex, isLoading, title, enableSearch, }: SimpleTableProps<TData>): react_jsx_runtime.JSX.Element;
 
 interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
     variant?: "primary" | "danger" | "warning" | "success";
@@ -360,27 +428,10 @@ interface BrandingProps {
 }
 declare const Branding: React__default.FC<BrandingProps>;
 
-interface ThemeConfig {
-    primaryColor?: string;
-}
-interface WarqadConfig {
-    api?: string;
-    theme?: ThemeConfig;
-}
-interface WarqadConfigContextType {
-    config: WarqadConfig;
-}
-declare const useWarqadConfig: () => WarqadConfig;
-interface WarqadProviderProps {
-    children: ReactNode;
-    config?: WarqadConfig;
-}
-declare const WarqadProvider: ({ children, config, }: WarqadProviderProps) => react_jsx_runtime.JSX.Element;
-
 interface FetchProps {
     url: string;
     body?: Record<string, any>;
-    v?: 1 | 2;
+    v?: 0 | 1 | 2;
     params?: Record<string, any>;
     delay?: number;
     form?: {
@@ -423,6 +474,96 @@ declare const useApi: () => {
     }>;
 };
 
+declare const useA4StatementView: ({ url, v, delay, params, }?: {
+    url?: string;
+    v?: 0 | 1 | 2;
+    delay?: number;
+    params?: Record<string, any>;
+}) => {
+    A4DataView: ({ columns, data, error, info, index, title, subtitle, printable, rowPadding, headers, }: {
+        columns?: SimpleTableColumn<any>[];
+        data?: any[];
+        error?: string | null;
+        info?: any[];
+        index?: boolean;
+        title?: string;
+        subtitle?: string;
+        printable?: boolean;
+        rowPadding?: string;
+        headers?: React.ReactNode;
+    }) => react_jsx_runtime.JSX.Element;
+    data: any;
+    isLoading: boolean;
+    get: FetchFunction;
+    reactToPrintFn: react_to_print.UseReactToPrintFn;
+};
+type A4DataViewProps = Parameters<ReturnType<typeof useA4StatementView>["A4DataView"]>[0] & Parameters<typeof useA4StatementView>[0];
+declare const A4DataView: (props: A4DataViewProps) => react_jsx_runtime.JSX.Element;
+
+declare const useTransaction: ({ url, v, delay, params, }: {
+    url: string;
+    v?: 0 | 1 | 2;
+    delay?: number;
+    params?: Record<string, any>;
+}) => {
+    TransactionViewComponent: ({ columns, data, error, pageRows, searchPlaceholder, selectable, filterables, verticalLines, index, rowPadding, className, title, description, onCreate, createTitle, ...rest }: {
+        columns: DataTableColumn[];
+        data: any[];
+        error?: any;
+        pageRows?: number;
+        searchPlaceholder?: string;
+        selectable?: boolean;
+        filterables?: boolean;
+        verticalLines?: boolean;
+        index?: boolean;
+        rowPadding?: string;
+        className?: string;
+        title?: string;
+        description?: string;
+        onCreate?: () => void;
+        createTitle?: string;
+    }) => react_jsx_runtime.JSX.Element;
+    data: any;
+    isLoading: boolean;
+    get: FetchFunction;
+    reload: () => void;
+    error: string | null;
+    date: String | null | undefined;
+};
+
+interface ThemeConfig {
+    primaryColor?: string;
+}
+interface StoreConfig {
+    name?: string;
+    address?: string;
+    phone?: string;
+    email?: string;
+    logo?: string;
+}
+interface WarqadConfig {
+    api?: string;
+    theme?: ThemeConfig;
+    store?: StoreConfig;
+}
+interface WarqadConfigContextType {
+    config: WarqadConfig;
+}
+/**
+ * Hook to access the current Warqad configuration.
+ */
+declare const useWarqadConfig: () => WarqadConfig;
+interface WarqadProviderProps {
+    children: ReactNode;
+    config?: WarqadConfig;
+}
+/**
+ * WarqadProvider
+ *
+ * Provides configuration and theme values to the entire application.
+ */
+declare const WarqadProvider: ({ children, config }: WarqadProviderProps) => react_jsx_runtime.JSX.Element;
+
 interface PdfOptions {
     orientation?: "portrait" | "landscape";
     unit?: "mm" | "cm" | "in" | "px";
@@ -441,4 +582,4 @@ interface PdfOptions {
  */
 declare const generatePdf: (elementId: string, options?: PdfOptions) => Promise<void>;
 
-export { Badge, type BadgeProps, Branding, type BrandingProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ClassicSpin, CodeBlock, DashboardLayout, DataTable, DateInput, type DateInputProps, Fields, Input, type InputProps, LoadingBox, LoadingSpin, Modal, type ModalProps, type NavItem, type NavItems, type Option, OverlaySpin, PageHeader, type PdfOptions, PhoneInput, type PhoneInputProps, PostTable, type PostTableActions, SearchApi, type SearchApiProps, Select, type SelectProps, SimpleTable, Textarea, type TextareaProps, type ThemeConfig, ThemeProvider, ThemeToggle, type UseModalReturn, type WarqadConfig, type WarqadConfigContextType, WarqadProvider, generatePdf, useApi, useModal, useTheme, useWarqadConfig };
+export { A4DataView, Badge, type BadgeProps, Branding, type BrandingProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ClassicSpin, CodeBlock, DashboardLayout, DataTable, type DataTableColumn, DateInput, type DateInputProps, Fields, InfoGrid, Input, type InputProps, LoadingBox, LoadingSpin, Modal, type ModalProps, type NavItem, type NavItems, type Option, OverlaySpin, PageA4, PageHeader, type PdfOptions, PhoneInput, type PhoneInputProps, PostTable, type PostTableActions, SearchApi, type SearchApiProps, Select, type SelectProps, SimpleTable, type SimpleTableColumn, type StoreConfig, Textarea, type TextareaProps, type ThemeConfig, ThemeProvider, ThemeToggle, type UseModalReturn, type WarqadConfig, type WarqadConfigContextType, WarqadProvider, generatePdf, useA4StatementView, useApi, useModal, useTheme, useTransaction, useWarqadConfig };

package/dist/index.d.ts

@@ -4,6 +4,7 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react_hook_form from 'react-hook-form';
 import { FieldValues, Path, UseFormReturn } from 'react-hook-form';
 import { ColumnDef, SortingState, ColumnFiltersState, RowData } from '@tanstack/react-table';
+import * as react_to_print from 'react-to-print';
 
 interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
     variant?: "primary" | "secondary" | "outline" | "ghost" | "danger" | "warning";
@@ -13,6 +14,55 @@ interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElem
 }
 declare const Button: React__default.FC<ButtonProps>;
 
+interface InfoItem {
+    label: string;
+    value: React__default.ReactNode;
+    /** Use monospace font for the value (useful for account numbers, IDs, etc.) */
+    mono?: boolean;
+}
+interface InfoGridProps {
+    items: InfoItem[];
+    /** Grid columns count, defaults to 3 */
+    cols?: number;
+    /** Optional container class */
+    className?: string;
+    isLoading?: boolean;
+}
+/**
+ * InfoGrid Component
+ *
+ * A clean, rounded grid container for displaying key information items
+ * with labels and values.
+ */
+declare const InfoGrid: React__default.FC<InfoGridProps>;
+
+/**
+ * Props for the PageA4 component
+ */
+interface PageA4Props {
+    /** The content to render inside the A4 page */
+    children: React__default.ReactNode;
+    /** Optional container class for the outer document viewer wrapper */
+    className?: string;
+    /** Optional class for the paper itself */
+    pageClassName?: string;
+    /** Optional page number for the footer */
+    pageNumber?: number;
+    /** Optional total pages for the footer */
+    totalPages?: number;
+    /** Whether this is the final page being printed */
+    isLastPage?: boolean;
+}
+/**
+ * PageA4 Component
+ *
+ * A reusable React component that renders its children inside a container that always
+ * maintains an exact A4 paper width (210mm).
+ *
+ * It scales down proportionally on smaller screens.
+ */
+declare const PageA4: React__default.FC<PageA4Props>;
+
 interface NavItem {
     label: string;
     icon?: React__default.ReactNode;
@@ -149,7 +199,7 @@ interface UseModalReturn {
 declare const useModal: (initialState?: boolean) => UseModalReturn;
 
 interface DateInputProps<T extends FieldValues> {
-    label: string;
+    label?: string;
     error?: string;
     containerClassName?: string;
     name?: Path<T>;
@@ -227,7 +277,7 @@ interface PhoneInputProps extends Omit<React.InputHTMLAttributes<HTMLInputElemen
 declare const PhoneInput: React$1.ForwardRefExoticComponent<PhoneInputProps & React$1.RefAttributes<any>>;
 
 interface InputProps<T extends FieldValues> extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "name" | "form"> {
-    label: string;
+    label?: string;
     icon?: React.ReactNode;
     error?: string;
     containerClassName?: string;
@@ -255,10 +305,12 @@ declare const Fields: {
     }) => React.ReactElement;
 };
 
+type DataTableColumn<TData = any, TValue = any> = ColumnDef<TData, TValue> & {
+    key?: string;
+    hide?: boolean;
+};
 interface DataTableProps<TData, TValue> {
-    columns: (ColumnDef<TData, TValue> & {
-        key?: string;
-    })[];
+    columns: DataTableColumn<TData, TValue>[];
     data: TData[];
     isLoading?: boolean;
     pageRows?: number;
@@ -285,9 +337,11 @@ interface DataTableProps<TData, TValue> {
         selectedRows: TData[];
         filteredData: TData[];
     }) => void;
+    selectable?: boolean;
+    filterables?: boolean;
 }
 declare function DataTable<TData, TValue>({ columns: userColumns, data, isLoading, pageRows, searchPlaceholder, className, verticalLines, rowPadding, index, renderSubComponent, hasSubComponent, // default to true
-defaultExpanded, onChange, }: DataTableProps<TData, TValue>): react_jsx_runtime.JSX.Element;
+defaultExpanded, onChange, selectable, filterables, }: DataTableProps<TData, TValue>): react_jsx_runtime.JSX.Element;
 
 declare module "@tanstack/react-table" {
     interface ColumnMeta<TData extends RowData, TValue> {
@@ -325,17 +379,31 @@ interface PostTableProps<TData> {
 declare function PostTable<TData extends Record<string, any>>({ columns: userColumns, data: controlledData, onChange, isLoading, className, verticalLines, rowPadding, index, renderAddButton, renderSubComponent, hasSubComponent, // default to true if renderSubComponent is provided
 defaultExpanded, }: PostTableProps<TData>): react_jsx_runtime.JSX.Element;
 
+type SimpleTableColumn<TData> = ColumnDef<TData, any> & {
+    key?: string;
+    render?: (row: TData) => React__default.ReactNode;
+    renderFooter?: (data: TData[]) => React__default.ReactNode;
+    className?: string;
+    width?: number | string;
+    minWidth?: number | string;
+    maxWidth?: number | string;
+    flex?: number;
+    hide?: boolean;
+};
 interface SimpleTableProps<TData> {
-    columns: (ColumnDef<TData, any> & {
-        key?: string;
-    })[];
+    columns: SimpleTableColumn<TData>[];
     data: TData[];
     className?: string;
     renderFooter?: () => React__default.ReactNode;
     rowPadding?: string;
     verticalLines?: boolean;
+    index?: boolean;
+    startIndex?: number;
+    isLoading?: boolean;
+    title?: string;
+    enableSearch?: boolean;
 }
-declare function SimpleTable<TData>({ columns: userColumns, data, className, renderFooter, rowPadding, verticalLines, }: SimpleTableProps<TData>): react_jsx_runtime.JSX.Element;
+declare function SimpleTable<TData>({ columns: userColumns, data, className, renderFooter: componentFooter, rowPadding, verticalLines, index, startIndex, isLoading, title, enableSearch, }: SimpleTableProps<TData>): react_jsx_runtime.JSX.Element;
 
 interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
     variant?: "primary" | "danger" | "warning" | "success";
@@ -360,27 +428,10 @@ interface BrandingProps {
 }
 declare const Branding: React__default.FC<BrandingProps>;
 
-interface ThemeConfig {
-    primaryColor?: string;
-}
-interface WarqadConfig {
-    api?: string;
-    theme?: ThemeConfig;
-}
-interface WarqadConfigContextType {
-    config: WarqadConfig;
-}
-declare const useWarqadConfig: () => WarqadConfig;
-interface WarqadProviderProps {
-    children: ReactNode;
-    config?: WarqadConfig;
-}
-declare const WarqadProvider: ({ children, config, }: WarqadProviderProps) => react_jsx_runtime.JSX.Element;
-
 interface FetchProps {
     url: string;
     body?: Record<string, any>;
-    v?: 1 | 2;
+    v?: 0 | 1 | 2;
     params?: Record<string, any>;
     delay?: number;
     form?: {
@@ -423,6 +474,96 @@ declare const useApi: () => {
     }>;
 };
 
+declare const useA4StatementView: ({ url, v, delay, params, }?: {
+    url?: string;
+    v?: 0 | 1 | 2;
+    delay?: number;
+    params?: Record<string, any>;
+}) => {
+    A4DataView: ({ columns, data, error, info, index, title, subtitle, printable, rowPadding, headers, }: {
+        columns?: SimpleTableColumn<any>[];
+        data?: any[];
+        error?: string | null;
+        info?: any[];
+        index?: boolean;
+        title?: string;
+        subtitle?: string;
+        printable?: boolean;
+        rowPadding?: string;
+        headers?: React.ReactNode;
+    }) => react_jsx_runtime.JSX.Element;
+    data: any;
+    isLoading: boolean;
+    get: FetchFunction;
+    reactToPrintFn: react_to_print.UseReactToPrintFn;
+};
+type A4DataViewProps = Parameters<ReturnType<typeof useA4StatementView>["A4DataView"]>[0] & Parameters<typeof useA4StatementView>[0];
+declare const A4DataView: (props: A4DataViewProps) => react_jsx_runtime.JSX.Element;
+
+declare const useTransaction: ({ url, v, delay, params, }: {
+    url: string;
+    v?: 0 | 1 | 2;
+    delay?: number;
+    params?: Record<string, any>;
+}) => {
+    TransactionViewComponent: ({ columns, data, error, pageRows, searchPlaceholder, selectable, filterables, verticalLines, index, rowPadding, className, title, description, onCreate, createTitle, ...rest }: {
+        columns: DataTableColumn[];
+        data: any[];
+        error?: any;
+        pageRows?: number;
+        searchPlaceholder?: string;
+        selectable?: boolean;
+        filterables?: boolean;
+        verticalLines?: boolean;
+        index?: boolean;
+        rowPadding?: string;
+        className?: string;
+        title?: string;
+        description?: string;
+        onCreate?: () => void;
+        createTitle?: string;
+    }) => react_jsx_runtime.JSX.Element;
+    data: any;
+    isLoading: boolean;
+    get: FetchFunction;
+    reload: () => void;
+    error: string | null;
+    date: String | null | undefined;
+};
+
+interface ThemeConfig {
+    primaryColor?: string;
+}
+interface StoreConfig {
+    name?: string;
+    address?: string;
+    phone?: string;
+    email?: string;
+    logo?: string;
+}
+interface WarqadConfig {
+    api?: string;
+    theme?: ThemeConfig;
+    store?: StoreConfig;
+}
+interface WarqadConfigContextType {
+    config: WarqadConfig;
+}
+/**
+ * Hook to access the current Warqad configuration.
+ */
+declare const useWarqadConfig: () => WarqadConfig;
+interface WarqadProviderProps {
+    children: ReactNode;
+    config?: WarqadConfig;
+}
+/**
+ * WarqadProvider
+ *
+ * Provides configuration and theme values to the entire application.
+ */
+declare const WarqadProvider: ({ children, config }: WarqadProviderProps) => react_jsx_runtime.JSX.Element;
+
 interface PdfOptions {
     orientation?: "portrait" | "landscape";
     unit?: "mm" | "cm" | "in" | "px";
@@ -441,4 +582,4 @@ interface PdfOptions {
  */
 declare const generatePdf: (elementId: string, options?: PdfOptions) => Promise<void>;
 
-export { Badge, type BadgeProps, Branding, type BrandingProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ClassicSpin, CodeBlock, DashboardLayout, DataTable, DateInput, type DateInputProps, Fields, Input, type InputProps, LoadingBox, LoadingSpin, Modal, type ModalProps, type NavItem, type NavItems, type Option, OverlaySpin, PageHeader, type PdfOptions, PhoneInput, type PhoneInputProps, PostTable, type PostTableActions, SearchApi, type SearchApiProps, Select, type SelectProps, SimpleTable, Textarea, type TextareaProps, type ThemeConfig, ThemeProvider, ThemeToggle, type UseModalReturn, type WarqadConfig, type WarqadConfigContextType, WarqadProvider, generatePdf, useApi, useModal, useTheme, useWarqadConfig };
+export { A4DataView, Badge, type BadgeProps, Branding, type BrandingProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ClassicSpin, CodeBlock, DashboardLayout, DataTable, type DataTableColumn, DateInput, type DateInputProps, Fields, InfoGrid, Input, type InputProps, LoadingBox, LoadingSpin, Modal, type ModalProps, type NavItem, type NavItems, type Option, OverlaySpin, PageA4, PageHeader, type PdfOptions, PhoneInput, type PhoneInputProps, PostTable, type PostTableActions, SearchApi, type SearchApiProps, Select, type SelectProps, SimpleTable, type SimpleTableColumn, type StoreConfig, Textarea, type TextareaProps, type ThemeConfig, ThemeProvider, ThemeToggle, type UseModalReturn, type WarqadConfig, type WarqadConfigContextType, WarqadProvider, generatePdf, useA4StatementView, useApi, useModal, useTheme, useTransaction, useWarqadConfig };