sera-components 1.5.0 → 1.6.0

package/dist/misc/Menu.d.ts

@@ -1,22 +1,23 @@
 import { Trie } from '../utils';
-import { NavigateFunction, Permission, NoArgsRoute } from '../types';
+import { NavigateFunction, Permission, NoArgsRoute, NoURLArgsRoute } from '../types';
 type MenuKey = string;
-export interface MenuRoute<R> {
-    path: NoArgsRoute;
+export interface MenuRoute<Q, R> {
+    path: NoURLArgsRoute<Q> | NoArgsRoute;
     role: R;
+    defaultPathArgs?: Q;
 }
 export interface SeraMenuItem<R> {
     key: MenuKey;
     label: React.ReactElement | string;
     icon?: React.ReactElement;
-    route?: MenuRoute<R>;
+    route?: MenuRoute<any, R>;
     children?: SeraMenuItem<R>[];
 }
-export declare function buildMenuItemIndex<R>(items: SeraMenuItem<R>[]): {
+export declare function buildMenuItemIndex<Q, R>(items: SeraMenuItem<R>[]): {
     key2item: Record<MenuKey, SeraMenuItem<R>>;
     key2fullpath: Record<MenuKey, MenuKey[]>;
     key2route: {
-        [key: MenuKey]: MenuRoute<R>;
+        [key: MenuKey]: MenuRoute<Q, R>;
     };
 };
 export declare function filterAllowedItems<R>(items: SeraMenuItem<R>[], checkPermission: (role: R) => Permission): SeraMenuItem<R>[];

package/dist/table/makeColumns.d.ts

@@ -1,4 +1,4 @@
-import { DataProperty, DB, DraftEmbeddedRecord, DraftRecord, EmbeddedSchema, GenericEmbeddedRecord, GenericRecord, ObjectProperty, Schema, SchemaType } from 'sera-db';
+import { DataProperty, DB, DraftEmbeddedRecord, DraftRecord, EmbeddedSchema, GenericEmbeddedRecord, GenericRecord, ObjectProperty, PropertyNames, Schema, SchemaType } from 'sera-db';
 import { DisplayInterface } from '../data/display';
 type DOP = DataProperty | ObjectProperty;
 /**
@@ -43,10 +43,10 @@ export declare function makeTableColumnFromNestedProperty<R>(db: DB, property: D
     nestedKey?: string;
     component?: React.ComponentType<DisplayInterface<any>>;
 }): SeraColumn<R>;
-export declare function makeTableColumns<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>, OR>(db: DB, schema: Schema<ID, R, DR, PF, F, ST> | EmbeddedSchema<R, DR, PF, F>, selectedColumns: (PF | SeraColumn<OR>)[], options?: {
+export declare function makeTableColumns<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>, OR>(db: DB, schema: Schema<ID, R, DR, PF, F, ST> | EmbeddedSchema<R, DR, PF, F>, selectedColumns: (PF | SeraColumn<OR>)[], options?: {
     nestedKey?: string;
 }): SeraColumn<OR>[];
-export declare function makeEmbeddedTableColumns<R extends GenericEmbeddedRecord<DR>, DR extends DraftEmbeddedRecord, PF extends keyof R, F extends keyof DR, OR>(db: DB, schema: EmbeddedSchema<R, DR, PF, F>, selectedColumns?: (PF | SeraColumn<OR>)[], options?: {
+export declare function makeEmbeddedTableColumns<R extends GenericEmbeddedRecord<DR>, DR extends DraftEmbeddedRecord, PF extends PropertyNames<R>, F extends PropertyNames<DR>, OR>(db: DB, schema: EmbeddedSchema<R, DR, PF, F>, selectedColumns?: (PF | SeraColumn<OR>)[], options?: {
     nestedKey?: string;
 }): SeraColumn<OR>[];
 export declare function isSeraColumn<R>(column: SeraColumn<R> | any): column is SeraColumn<R>;

package/dist/types.d.ts

@@ -26,6 +26,18 @@ export interface NoArgsRoute {
         open: (navigate: NavigateFunction) => void;
     };
     getURL(): string;
+    pathDef: string;
+}
+export interface NoURLArgsRoute<Q> {
+    path({ queryArgs }: {
+        queryArgs: Q;
+    }): {
+        open: (navigate: NavigateFunction) => void;
+    };
+    getURL({ queryArgs }: {
+        queryArgs: Q;
+    }): string;
+    pathDef: string;
 }
 export interface EntityRoute {
     path({ urlArgs }: {

package/dist/utils/index.d.ts

@@ -1,2 +1,3 @@
 export * from './utils';
 export * from './trie';
+export * from './propertyUtils';

package/dist/utils/propertyUtils.d.ts

@@ -0,0 +1,33 @@
+import { DataProperty, ObjectProperty, NestedProperty } from 'sera-db';
+/**
+ * Gets the value of a property (regular or nested) from a record.
+ *
+ * @param record - The record to extract the value from
+ * @param property - The property (DataProperty, ObjectProperty, or NestedProperty)
+ * @returns The value of the property
+ *
+ * @example
+ * ```typescript
+ * const value = getPropertyValue(supplier, paymentPolicyProp);
+ * const nestedValue = getPropertyValue(supplier, new NestedProperty(supplier.paymentPolicy, paymentPolicy.type));
+ * ```
+ */
+export declare function getPropertyValue(record: any, property: DataProperty | ObjectProperty | NestedProperty): any;
+/**
+ * Sets the value of a property (regular or nested) in a record.
+ *
+ * For regular properties, calls the updateFuncName method.
+ * For nested properties, uses the setValue method which handles
+ * creating intermediate objects as needed.
+ *
+ * @param record - The record to set the value in (must be a draft record)
+ * @param property - The property (DataProperty, ObjectProperty, or NestedProperty)
+ * @param value - The new value to set
+ *
+ * @example
+ * ```typescript
+ * setPropertyValue(draftSupplier, paymentPolicyProp, newPolicy);
+ * setPropertyValue(draftSupplier, new NestedProperty(supplier.paymentPolicy, paymentPolicy.type), PaymentPolicyType.PaymentBeforeService);
+ * ```
+ */
+export declare function setPropertyValue(record: any, property: DataProperty | ObjectProperty | NestedProperty, value: any): void;

package/dist/view/View.d.ts

@@ -1,18 +1,21 @@
-import { DataProperty, DraftRecord, GenericRecord, ObjectProperty, Schema, SchemaType, Table } from 'sera-db';
+import { DraftRecord, GenericRecord, Schema, SchemaType, Table, NestedProperty, PropertyNames } from 'sera-db';
 import { MantineSpacing } from '@mantine/core';
 import { DisplayInterface } from '../data/display';
 interface FieldArgs<R> {
     display?: React.ComponentType<DisplayInterface<any>>;
     visible?: (record: R) => boolean;
 }
-export interface FieldGroup<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>> {
+export interface FieldGroup<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>> {
     name?: string;
     fields: (ST["allProperties"] | {
         prop: ST["allProperties"];
         args?: FieldArgs<R>;
+    } | NestedProperty | {
+        prop: NestedProperty;
+        args?: FieldArgs<R>;
     } | ((store: Table<ID, R, DR>, record: R) => React.ReactNode))[][];
 }
-export interface SeraViewProps<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>> {
+export interface SeraViewProps<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>;
     store: Table<ID, R, DR>;
     fieldGroups: FieldGroup<ID, R, DR, PF, F, ST>[];
@@ -20,32 +23,7 @@ export interface SeraViewProps<ID extends string | number, R extends GenericReco
     styles?: React.CSSProperties;
     className?: string;
 }
-export declare const SeraView: <ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>>(props: SeraViewProps<ID, R, DR, PF, F, ST>) => import("react/jsx-runtime").JSX.Element;
-/**
- * Creates a nested field renderer function for displaying nested record properties.
- *
- * This function determines the appropriate display component based on the property type
- * (data property or object property) and cardinality, then returns a function that renders
- * the property value within a ViewNestedPropertyItem component.
- *
- * @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
- *
- * @param props - Array of properties defining the nested path to the field
- * @param display - Optional custom display component for rendering the field value
- *
- * @returns A function that takes a store and record, returning a React node to display the nested field
- *
- * @throws {Error} When no display component is found for the specified datatype
- *
- * @example
- * ```tsx
- * const renderField = makeNestedField([userProperty, nameProperty]);
- * const node = renderField(store, record);
- * ```
- */
-export declare function makeNestedField<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>>(props: (DataProperty | ObjectProperty)[], args?: FieldArgs<R>): (store: Table<ID, R, DR>, record: R) => React.ReactNode;
+export declare const SeraView: <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: SeraViewProps<ID, R, DR, PF, F, ST>) => import("react/jsx-runtime").JSX.Element;
 /**
  * Groups multiple fields together in a row layout using SimpleGrid.
  *
@@ -66,9 +44,12 @@ export declare function makeNestedField<ID extends string | number, R extends Ge
  * const node = groupedFields(store, record);
  * ```
  */
-export declare function groupFields<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>>(schema: Schema<ID, R, DR, PF, F, ST>, fields: (ST["allProperties"] | {
+export declare function groupFields<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>;
+} | NestedProperty | {
+    prop: NestedProperty;
+    args?: FieldArgs<R>;
 } | ((store: Table<ID, R, DR>, record: R) => React.ReactNode))[], args?: {
     visible?: (record: R) => boolean;
     flexGrow?: boolean;

package/dist/view/ViewItem.d.ts

@@ -1,9 +1,9 @@
-import { DataProperty, DraftRecord, GenericRecord, ObjectProperty, Table } from 'sera-db';
+import { DataProperty, DraftRecord, GenericRecord, ObjectProperty, Table, NestedProperty } from 'sera-db';
 import { DisplayInterface } from '../data';
 export interface ViewItemProps<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>> {
     store: Table<ID, R, DR>;
     record: R;
-    property: DataProperty | ObjectProperty;
+    property: DataProperty | ObjectProperty | NestedProperty;
     visible?: (record: R) => boolean;
     DisplayComponent: React.ComponentType<DisplayInterface<any>>;
 }

package/dist/view/ViewTab.d.ts

@@ -1,6 +1,6 @@
-import { DraftRecord, GenericRecord, Schema, SchemaType, Table } from 'sera-db';
+import { DraftRecord, GenericRecord, PropertyNames, Schema, SchemaType, Table } from 'sera-db';
 import { FieldGroup } from './View';
-export interface SeraViewTabProps<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>> {
+export interface SeraViewTabProps<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>;
     store: Table<ID, R, DR>;
     fieldTabs: {
@@ -11,4 +11,4 @@ export interface SeraViewTabProps<ID extends string | number, R extends GenericR
     tabStyles?: React.CSSProperties;
     tabClassName?: string;
 }
-export declare const SeraViewTab: <ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>, PF extends keyof R, F extends keyof DR, ST extends SchemaType<ID, R, DR, PF, F>>(props: SeraViewTabProps<ID, R, DR, PF, F, ST>) => import("react/jsx-runtime").JSX.Element;
+export declare const SeraViewTab: <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: SeraViewTabProps<ID, R, DR, PF, F, ST>) => import("react/jsx-runtime").JSX.Element;

package/dist/view/index.d.ts

@@ -1,2 +1,2 @@
-export { SeraView, makeNestedField, groupFields } from './View';
+export { SeraView, groupFields } from './View';
 export { SeraViewTab } from './ViewTab';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sera-components",
   "private": false,
-  "version": "1.5.0",
+  "version": "1.6.0",
   "type": "module",
   "files": [
     "dist"
@@ -19,13 +19,14 @@
     "dev": "vite",
     "clean": "rimraf dist",
     "build": "tsc -b tsconfig.build.json && vite build",
+    "typecheck": "tsc --noEmit",
     "preview": "vite preview",
     "test": "vitest",
     "prepublishOnly": "npm run clean && npm run build"
   },
   "devDependencies": {
-    "@types/react": "^19.0.12",
-    "@types/react-dom": "^19.0.4",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
     "@types/throttle-debounce": "^5.0.2",
     "rimraf": "^6.0.1",
     "typescript": "~5.7.2",
@@ -35,17 +36,17 @@
   },
   "peerDependencies": {
     "@mantine/core": "^8.1.0",
-    "@mantine/form": "^8.1.0",
     "@mantine/dates": "^8.3.1",
+    "@mantine/form": "^8.1.0",
     "@tabler/icons-react": "^3.31.0",
     "@tanstack/react-table": "^8.21.3",
+    "dayjs": "^1.11.18",
     "mobx-react-lite": "^4.1.0",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
     "react-imask": "^7.6.1",
     "react-router": "^7.7.1",
-    "sera-db": "^1.12.7",
-    "throttle-debounce": "^5.0.2",
-    "dayjs": "^1.11.18"
+    "sera-db": "^1.13.0",
+    "throttle-debounce": "^5.0.2"
   }
 }

package/dist/form/FormNestedPropertyItem.d.ts

@@ -1,38 +0,0 @@
-import { DataProperty, DraftRecord, GenericRecord, ObjectProperty, validators, Table } from 'sera-db';
-import { InputInterface } from '../data';
-import { FormItemLayout } from './FormItem';
-export interface FormNestedPropertyItemProps<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>> {
-    store: Table<ID, R, DR>;
-    record: DR | R;
-    properties: (DataProperty | ObjectProperty)[];
-    InputComponent: React.ComponentType<InputInterface<any>>;
-    validator: validators.ValueValidator;
-    layout?: FormItemLayout;
-    freeze?: boolean;
-}
-/**
- * A component that renders a nested property input for forms.
- *
- * This component traverses through a chain of properties to create input fields
- * for deeply nested property values in a record. It handles embedded objects
- * by creating nested form structures.
- *
- * @template ID - The type of the record identifier (string or number)
- * @template R - The type of the generic record extending GenericRecord
- * @template DR - The type of the draft record extending DraftRecord
- *
- * @param props - The component properties
- * @param props.store - The table store containing the record data
- * @param props.record - The draft record being edited
- * @param props.properties - Array of properties defining the path to the nested value
- * @param props.InputComponent - React component used to render the field input
- *
- * @returns A JSX element with input fields for the nested property
- */
-export declare const FormNestedPropertyItem: (<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>>({ store, record, properties, layout, InputComponent, validator, freeze, }: FormNestedPropertyItemProps<ID, R, DR>) => import("react/jsx-runtime").JSX.Element) & {
-    displayName: string;
-};
-export declare function makeFieldForm<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>>(props: (DataProperty | ObjectProperty)[], validators: validators.ValueValidator, args?: {
-    input?: React.ComponentType<InputInterface<any>>;
-    freeze?: boolean;
-}): (store: Table<ID, R, DR>, record: DR) => React.ReactNode;

package/dist/view/ViewNestedPropertyItem.d.ts

@@ -1,43 +0,0 @@
-import { DataProperty, DraftRecord, GenericRecord, ObjectProperty, Table } from 'sera-db';
-import { DisplayInterface } from '../data';
-export interface ViewNestedPropertyItemProps<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>> {
-    store: Table<ID, R, DR>;
-    record: R;
-    properties: (DataProperty | ObjectProperty)[];
-    DisplayComponent: React.ComponentType<DisplayInterface<any>>;
-    visible?: (record: R) => boolean;
-}
-/**
- * A component that renders a nested property item.
- *
- * This component traverses through a chain of properties to display a deeply nested
- * property value from a record. It shows the last property label and renders the value
- * using the provided DisplayComponent.
- *
- * @template ID - The type of the record identifier (string or number)
- * @template R - The type of the generic record extending GenericRecord
- * @template DR - The type of the draft record extending DraftRecord
- * @template PF - The property field type constrained to keys of R
- * @template F - The field type constrained to keys of DR
- *
- * @param props - The component properties
- * @param props.store - The table store containing the record data
- * @param props.record - The record being viewed
- * @param props.properties - Array of properties defining the path to the nested value
- * @param props.DisplayComponent - React component used to render the field value
- *
- * @returns A JSX element displaying the nested property with its label and value
- *
- * @example
- * ```tsx
- * <ViewNestedPropertyItem
- *   store={userStore}
- *   record={user}
- *   properties={[addressProperty, streetProperty]}
- *   DisplayComponent={TextDisplay}
- * />
- * ```
- */
-export declare const ViewNestedPropertyItem: (<ID extends string | number, R extends GenericRecord<ID, DR>, DR extends DraftRecord<ID>>({ store, record, properties, DisplayComponent, visible, }: ViewNestedPropertyItemProps<ID, R, DR>) => import("react/jsx-runtime").JSX.Element) & {
-    displayName: string;
-};