sera-components 1.6.0 → 1.6.2

package/dist/data/display/index.d.ts

@@ -1,6 +1,6 @@
 import { DataProperty, DataType, DB, ObjectProperty, NestedProperty } from 'sera-db';
-import { DateDisplay, DateTimeDisplay, DateTimeHideTimeDisplay } from './DateTimeDisplay';
-export { SingleForeignKeyDisplay, MultiForeignKeyDisplay } from './ForeignKeyDisplay';
+import { DateDisplay, DateTimeDisplay, DateTimeHideTimeDisplay } from './datetime-display';
+export { SingleForeignKeyDisplay, MultiForeignKeyDisplay } from './foreign-key-display';
 export type DisplayInterface<T> = {
     db: DB;
     property: DataProperty | ObjectProperty | NestedProperty;

package/dist/data/inputs/index.d.ts

@@ -1,12 +1,12 @@
 import { DataProperty, DataType, DB, ObjectProperty, NestedProperty } from 'sera-db';
-import { BooleanInput } from './BooleanInput';
-import { NumberInput } from './NumberInput';
-import { TextInput } from './TextInput';
-import { DateInput } from './DateInput';
-import { EnumInput } from './EnumInput';
-import { ConfirmationInput, ConfirmationLabel } from './ConfirmationInput';
-export { SingleForeignKeyInput, MultiForeignKeyInput } from './ForeignKeyInput';
-export { DateRangeInput, DateTimeRangeInput } from './DateRangeInput';
+import { BooleanInput } from './boolean-input';
+import { NumberInput } from './number-input';
+import { TextInput } from './text-input';
+import { DateInput } from './date-input';
+import { EnumInput } from './enum-input';
+import { ConfirmationInput, ConfirmationLabel } from './confirmation-input';
+export { SingleForeignKeyInput, MultiForeignKeyInput } from './foreign-key-input';
+export { DateRangeInput, DateTimeRangeInput } from './date-range-input';
 /**
  * Interface for input components in forms
  * @interface InputInterface

package/dist/form/{Form.d.ts → form.d.ts}

@@ -1,6 +1,6 @@
 import { PropertyNames, DraftRecord, GenericRecord, Schema, SchemaType, Table, NestedProperty } from 'sera-db';
 import { InputInterface } from '../data/inputs';
-import { FormItemLayout } from './FormItem';
+import { FormItemLayout } from './form-item';
 interface FieldArgs<R, DR> {
     label?: React.ReactNode;
     input?: React.ComponentType<InputInterface<any>>;
@@ -68,4 +68,45 @@ export interface SeraFormProps<ID extends string | number, R extends GenericReco
  * ```
  */
 export declare const SeraForm: <ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends PropertyNames<R>, F extends PropertyNames<DR>, ST extends SchemaType<ID, R, DR, PF, F>>(props: SeraFormProps<ID, R, DR, PF, F, ST>) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Groups multiple form fields together in a row layout using Mantine's Group component.
+ *
+ * This function creates a renderer that displays multiple form fields side-by-side
+ * in a flexible row layout with equal column widths.
+ *
+ * @template ID - The type of the record identifier (string or number)
+ * @template R - The generic record type extending GenericRecord
+ * @template DR - The draft record type extending DraftRecord
+ * @template PF - The type of public fields in R
+ * @template F - The type of fields in DR
+ * @template ST - The schema type that extends SchemaType
+ *
+ * @param schema - The schema definition containing property information
+ * @param fields - Array of field definitions to display in the group
+ * @param args - Optional arguments for visibility, layout, and flex properties
+ *
+ * @returns A function that takes a store and record, returning a React node with grouped form fields
+ *
+ * @example
+ * ```tsx
+ * const groupedFields = groupFormFields(
+ *   userSchema,
+ *   [{ prop: "firstName" }, { prop: "lastName" }]
+ * );
+ * // Use in fieldGroups:
+ * fieldGroups: [{ fields: [[groupedFields]] }]
+ * ```
+ */
+export declare function groupFormFields<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends PropertyNames<R>, F extends PropertyNames<DR>, ST extends SchemaType<ID, R, DR, PF, F>>(schema: Schema<ID, R, DR, PF, F, ST>, fields: (ST["allProperties"] | {
+    prop: ST["allProperties"];
+    args?: FieldArgs<R, DR>;
+} | NestedProperty | {
+    prop: NestedProperty;
+    args?: FieldArgs<R, DR>;
+} | ((store: Table<ID, R, DR>, record: R | DR) => React.ReactNode))[], args?: {
+    visible?: (record: R | DR) => boolean;
+    layout?: FormItemLayout;
+    flexGrow?: boolean;
+    flexGap?: import('@mantine/core').MantineSpacing;
+}): (store: Table<ID, R, DR>, record: R | DR) => React.ReactNode;
 export {};

package/dist/form/index.d.ts

@@ -1,3 +1,3 @@
-export * from './Form';
-export * from './FormItem';
-export * from './FormItemLabel';
+export * from './form';
+export * from './form-item';
+export * from './form-item-label';