@bsol-oss/react-datatable5 13.0.1-beta.2 → 13.0.1-beta.21

package/dist/types/components/TimePicker/TimePicker.d.ts

@@ -1,22 +1,23 @@
-import { Dispatch, SetStateAction } from 'react';
+import React from 'react';
 import { TimePickerLabels } from '../Form/components/types/CustomJSONSchema7';
-interface TimePickerProps {
+export interface TimePickerProps {
     hour: number | null;
-    setHour: Dispatch<SetStateAction<number | null>>;
+    setHour: (hour: number | null) => void;
     minute: number | null;
-    setMinute: Dispatch<SetStateAction<number | null>>;
+    setMinute: (minute: number | null) => void;
     meridiem: 'am' | 'pm' | null;
-    setMeridiem: Dispatch<SetStateAction<'am' | 'pm' | null>>;
-    onChange?: (newValue: {
+    setMeridiem: (meridiem: 'am' | 'pm' | null) => void;
+    onChange?: (params: {
         hour: number | null;
         minute: number | null;
         meridiem: 'am' | 'pm' | null;
     }) => void;
+    format?: '12h' | '24h';
+    showSeconds?: boolean;
     startTime?: string;
     selectedDate?: string;
     timezone?: string;
     portalled?: boolean;
     labels?: TimePickerLabels;
 }
-export declare const TimePicker: ({ hour, setHour, minute, setMinute, meridiem, setMeridiem, onChange, startTime, selectedDate, timezone, portalled, labels, }: TimePickerProps) => import("react/jsx-runtime").JSX.Element;
-export {};
+export declare const TimePicker: React.FC<TimePickerProps>;

package/dist/types/index.d.ts

@@ -76,6 +76,16 @@ declare module '@tanstack/react-table' {
          * Only applies when canResize={false}.
          */
         responsivePriority?: number;
+        /**
+         * Grid column span for data display layout.
+         * Used in DataDisplay component.
+         */
+        gridColumn?: string | string[];
+        /**
+         * Grid row span for data display layout.
+         * Used in DataDisplay component.
+         */
+        gridRow?: string | object;
     }
 }
 export type { TableHeaderTexts } from './components/DataTable/display/TableHeader';
@@ -121,12 +131,10 @@ export * from './components/Form/components/core/FormBody';
 export * from './components/Form/components/types/CustomJSONSchema7';
 export * from './components/Form/components/MediaLibraryBrowser';
 export * from './components/Form/useForm';
-export * from './components/Form/utils/buildErrorMessages';
 export * from './components/DatePicker/DatePicker';
 export * from './components/DatePicker/getMultiDates';
 export * from './components/DatePicker/getRangeDates';
 export * from './components/DatePicker/RangeDatePicker';
-export * from './components/DatePicker/DatePickerInput';
 export * from './components/DataTable/display/RecordDisplay';
 export * from './components/DataTable/display/TableDataDisplay';
 export * from './components/DataTable/DefaultTable';

package/package.json

@@ -1,11 +1,14 @@
 {
   "name": "@bsol-oss/react-datatable5",
-  "version": "13.0.1-beta.2",
+  "version": "13.0.1-beta.21",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
-  "repository": "https://github.com/bsol-oss/react-datatable5.git",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/bsol-oss/react-datatable5.git"
+  },
   "homepage": "https://github.com/bsol-oss/react-datatable5#react-datatable5",
   "author": "screw123",
   "license": "MIT",
@@ -46,7 +49,7 @@
     "ajv": "^8.12.0",
     "ajv-errors": "^3.0.0",
     "ajv-formats": "^3.0.1",
-    "axios": "^1.7.9",
+    "axios": "^1.13.2",
     "dayjs": "^1.11.13",
     "next-themes": "^0.4.4",
     "react": "^19.0.0",
@@ -80,7 +83,7 @@
     "lint-staged": "^16.2.5",
     "prettier": "3.2.5",
     "rollup-plugin-dts": "^6.1.0",
-    "storybook": "^10.0.7",
+    "storybook": "^10.1.11",
     "typescript": "^5.2.2",
     "vite": "^5.2.0"
   },

package/dist/types/components/DatePicker/DatePickerInput.d.ts

@@ -1,18 +0,0 @@
-import { DatePickerLabels } from './DatePicker';
-export interface DatePickerInputProps {
-    value?: string | Date;
-    onChange?: (date?: string) => void;
-    placeholder?: string;
-    dateFormat?: string;
-    displayFormat?: string;
-    labels?: DatePickerLabels;
-    timezone?: string;
-    minDate?: Date;
-    maxDate?: Date;
-    firstDayOfWeek?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
-    showOutsideDays?: boolean;
-    monthsToDisplay?: number;
-    insideDialog?: boolean;
-    readOnly?: boolean;
-}
-export declare function DatePickerInput({ value, onChange, placeholder, dateFormat, displayFormat, labels, timezone, minDate, maxDate, firstDayOfWeek, showOutsideDays, monthsToDisplay, insideDialog, readOnly, }: DatePickerInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/DatePicker/IsoTimePicker.d.ts

@@ -1,24 +0,0 @@
-import { Dispatch, SetStateAction } from 'react';
-interface IsoTimePickerProps {
-    hour: number | null;
-    setHour: Dispatch<SetStateAction<number | null>>;
-    minute: number | null;
-    setMinute: Dispatch<SetStateAction<number | null>>;
-    second: number | null;
-    setSecond: Dispatch<SetStateAction<number | null>>;
-    onChange?: (newValue: {
-        hour: number | null;
-        minute: number | null;
-        second: number | null;
-    }) => void;
-    startTime?: string;
-    selectedDate?: string;
-    timezone?: string;
-    portalled?: boolean;
-    labels?: {
-        placeholder?: string;
-        emptyMessage?: string;
-    };
-}
-export declare function IsoTimePicker({ hour, setHour, minute, setMinute, second, setSecond, onChange, startTime, selectedDate, timezone, portalled, labels, }: IsoTimePickerProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/types/components/DatePicker/PickerDemo.d.ts

@@ -1 +0,0 @@
-export declare function PickerDemo(): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/Form/utils/buildErrorMessages.d.ts

@@ -1,223 +0,0 @@
-/**
- * Type definitions for error message configuration
- */
-/**
- * Common validation error types that can be customized
- */
-export type ValidationErrorType = 'minLength' | 'maxLength' | 'pattern' | 'minimum' | 'maximum' | 'multipleOf' | 'format' | 'type' | 'enum' | 'required' | 'minItems' | 'maxItems' | 'uniqueItems' | 'minProperties' | 'maxProperties' | 'anyOf' | 'oneOf' | 'allOf' | 'const' | 'additionalProperties' | 'dependencies';
-/**
- * Configuration for field-specific validation errors
- */
-export type FieldErrorConfig = Partial<Record<ValidationErrorType, string>>;
-/**
- * Configuration for building error messages
- */
-export interface ErrorMessageConfig {
-    /**
-     * Required field error messages
-     * Maps field names to their required error messages
-     * Supports both plain strings and i18n translation keys
-     *
-     * @example
-     * ```typescript
-     * required: {
-     *   username: "Username is required", // plain string
-     *   email: "user.email.field_required" // i18n key
-     * }
-     * ```
-     */
-    required?: Record<string, string>;
-    /**
-     * Field-specific validation error messages
-     * Maps field names to their validation error configurations
-     *
-     * @example
-     * ```typescript
-     * properties: {
-     *   username: {
-     *     minLength: "Username must be at least 3 characters",
-     *     pattern: "Username can only contain letters and numbers"
-     *   },
-     *   age: {
-     *     minimum: "Age must be at least 18",
-     *     maximum: "Age cannot exceed 120"
-     *   }
-     * }
-     * ```
-     */
-    properties?: Record<string, FieldErrorConfig>;
-    /**
-     * Global fallback error messages for validation types
-     * These are used when no field-specific message is provided
-     *
-     * @example
-     * ```typescript
-     * {
-     *   minLength: "This field is too short",
-     *   minimum: "Value is too small"
-     * }
-     * ```
-     */
-    [key: string]: any;
-}
-/**
- * Result of buildErrorMessages that follows ajv-errors format
- */
-export interface ErrorMessageResult {
-    required?: Record<string, string>;
-    properties?: Record<string, FieldErrorConfig>;
-    [key: string]: any;
-}
-/**
- * Schema-level error message builder
- *
- * Builds a complete errorMessage object compatible with ajv-errors plugin.
- * Supports both i18n translation keys and plain string messages.
- *
- * @param config - Error message configuration
- * @returns Complete errorMessage object for JSON Schema
- *
- * @example
- * ```typescript
- * // Simple required field errors
- * const errorMessage = buildErrorMessages({
- *   required: {
- *     username: "Username is required",
- *     email: "user.email.field_required" // i18n key
- *   }
- * });
- *
- * // With validation rules
- * const errorMessage = buildErrorMessages({
- *   required: {
- *     password: "Password is required"
- *   },
- *   properties: {
- *     password: {
- *       minLength: "Password must be at least 8 characters",
- *       pattern: "Password must contain letters and numbers"
- *     },
- *     age: {
- *       minimum: "Must be 18 or older",
- *       maximum: "Must be under 120"
- *     }
- *   }
- * });
- *
- * // With global fallbacks
- * const errorMessage = buildErrorMessages({
- *   required: {
- *     email: "Email is required"
- *   },
- *   minLength: "This field is too short", // applies to all fields
- *   minimum: "Value is too small"
- * });
- * ```
- */
-export declare const buildErrorMessages: (config: ErrorMessageConfig) => ErrorMessageResult;
-/**
- * Converts buildErrorMessages result to ajv-errors compatible format
- */
-export declare const convertToAjvErrorsFormat: (errorMessages: ErrorMessageResult) => Record<string, any>;
-/**
- * Helper function to build required field errors
- *
- * Simplifies creating required field error messages, especially useful
- * for generating i18n translation keys following a pattern.
- *
- * @param fields - Array of required field names
- * @param messageOrGenerator - Either a string template or function to generate messages
- * @returns Required field error configuration
- *
- * @example
- * ```typescript
- * // Plain string messages
- * const required = buildRequiredErrors(
- *   ["username", "email", "password"],
- *   (field) => `${field} is required`
- * );
- * // Result: { username: "username is required", email: "email is required", ... }
- *
- * // i18n translation keys
- * const required = buildRequiredErrors(
- *   ["username", "email"],
- *   (field) => `user.${field}.field_required`
- * );
- * // Result: { username: "user.username.field_required", email: "user.email.field_required" }
- *
- * // Same message for all fields
- * const required = buildRequiredErrors(
- *   ["username", "email"],
- *   "This field is required"
- * );
- * // Result: { username: "This field is required", email: "This field is required" }
- *
- * // With keyPrefix for i18n
- * const required = buildRequiredErrors(
- *   ["username", "email"],
- *   (field) => `${field}.field_required`,
- *   "user"
- * );
- * // Result: { username: "user.username.field_required", email: "user.email.field_required" }
- * ```
- */
-export declare const buildRequiredErrors: (fields: string[], messageOrGenerator: string | ((field: string) => string), keyPrefix?: string) => Record<string, string>;
-/**
- * Helper function to build field-specific validation errors
- *
- * Creates property-specific error messages for multiple fields at once.
- *
- * @param config - Maps field names to their validation error configurations
- * @returns Properties error configuration
- *
- * @example
- * ```typescript
- * const properties = buildFieldErrors({
- *   username: {
- *     minLength: "Username must be at least 3 characters",
- *     pattern: "Username can only contain letters and numbers"
- *   },
- *   age: {
- *     minimum: "Must be 18 or older",
- *     maximum: "Must be under 120"
- *   },
- *   email: {
- *     format: "Please enter a valid email address"
- *   }
- * });
- * ```
- */
-export declare const buildFieldErrors: (config: Record<string, FieldErrorConfig>) => Record<string, FieldErrorConfig>;
-/**
- * Helper function to create a complete error message configuration in one call
- *
- * Convenient wrapper that combines required and validation errors.
- *
- * @param required - Required field error messages
- * @param properties - Field-specific validation error messages
- * @param globalFallbacks - Global fallback error messages
- * @returns Complete error message configuration
- *
- * @example
- * ```typescript
- * const errorMessage = createErrorMessage(
- *   {
- *     username: "Username is required",
- *     email: "Email is required"
- *   },
- *   {
- *     username: {
- *       minLength: "Username must be at least 3 characters"
- *     },
- *     email: {
- *       format: "Please enter a valid email"
- *     }
- *   },
- *   {
- *     minLength: "This field is too short",
- *     format: "Invalid format"
- *   }
- * );
- * ```
- */
-export declare const createErrorMessage: (required?: Record<string, string>, properties?: Record<string, FieldErrorConfig>, globalFallbacks?: Partial<Record<ValidationErrorType, string>>) => ErrorMessageResult;

package/dist/types/components/Form/utils/getFieldError.d.ts

@@ -1,6 +0,0 @@
-import { FieldErrors } from 'react-hook-form';
-/**
- * Gets the error message for a specific field from react-hook-form errors
- * Prioritizes required errors (#.required) over field-specific validation errors
- */
-export declare const getFieldError: (errors: FieldErrors, fieldName: string) => string | undefined;

package/dist/types/components/Form/utils/useFormI18n.d.ts

@@ -1,57 +0,0 @@
-/**
- * Custom hook for form field labels and fallback text.
- * Automatically handles colLabel construction and removeIndex logic.
- * Uses schema.title when available, otherwise falls back to translate function.
- *
- * @param column - The column name
- * @param prefix - The prefix for the field (usually empty string or parent path)
- * @param schema - Optional schema object with title property
- * @returns Object with label helper functions
- *
- * @example
- * ```tsx
- * const formI18n = useFormI18n(column, prefix, schema);
- *
- * // Get field label (prefers schema.title)
- * <Field label={formI18n.label()} />
- *
- * // Get required error message
- * <Text>{formI18n.required()}</Text>
- *
- * // Get custom text
- * <Text>{formI18n.t('add_more')}</Text>
- *
- * // Access the raw colLabel
- * const colLabel = formI18n.colLabel;
- * ```
- */
-export declare const useFormI18n: (column: string, prefix?: string, schema?: {
-    title?: string;
-}) => {
-    /**
-     * The constructed column label (prefix + column)
-     */
-    colLabel: string;
-    /**
-     * Get the field label from schema title prop, or fall back to translate function
-     * Uses schema.title if available, otherwise: translate.t(removeIndex(`${colLabel}.field_label`))
-     */
-    label: (options?: any) => string;
-    /**
-     * Get the required error message
-     * Equivalent to: translate.t(removeIndex(`${colLabel}.field_required`))
-     */
-    required: (options?: any) => string;
-    /**
-     * Get text for any custom key relative to the field
-     * Equivalent to: translate.t(removeIndex(`${colLabel}.${key}`))
-     *
-     * @param key - The key suffix (e.g., 'add_more', 'total', etc.)
-     * @param options - Optional options (e.g., defaultValue, interpolation variables)
-     */
-    t: (key: string, options?: any) => string;
-    /**
-     * Access to the original translate object for edge cases
-     */
-    translate: import("../useForm").Translate;
-};

package/dist/types/components/ui/number-input.d.ts

@@ -1,8 +0,0 @@
-import { NumberInput as ChakraNumberInput } from "@chakra-ui/react";
-import * as React from "react";
-export interface NumberInputProps extends ChakraNumberInput.RootProps {
-}
-export declare const NumberInputRoot: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLDivElement>>;
-export declare const NumberInputField: React.ForwardRefExoticComponent<ChakraNumberInput.InputProps & React.RefAttributes<HTMLInputElement>>;
-export declare const NumberInputScrubber: React.ForwardRefExoticComponent<ChakraNumberInput.ScrubberProps & React.RefAttributes<HTMLDivElement>>;
-export declare const NumberInputLabel: React.ForwardRefExoticComponent<ChakraNumberInput.LabelProps & React.RefAttributes<HTMLLabelElement>>;