@vuu-ui/vuu-data-react 0.13.4 → 0.13.5

package/package.json

@@ -1,23 +1,23 @@
 {
-  "version": "0.13.4",
+  "version": "0.13.5",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.13.4",
-    "@vuu-ui/vuu-filter-types": "0.13.4",
-    "@vuu-ui/vuu-popups": "0.13.4",
-    "@vuu-ui/vuu-protocol-types": "0.13.4",
-    "@vuu-ui/vuu-table-types": "0.13.4"
+    "@vuu-ui/vuu-data-types": "0.13.5",
+    "@vuu-ui/vuu-filter-types": "0.13.5",
+    "@vuu-ui/vuu-popups": "0.13.5",
+    "@vuu-ui/vuu-protocol-types": "0.13.5",
+    "@vuu-ui/vuu-table-types": "0.13.5"
   },
   "dependencies": {
-    "@vuu-ui/vuu-context-menu": "0.13.4",
-    "@vuu-ui/vuu-data-remote": "0.13.4",
-    "@vuu-ui/vuu-filter-parser": "0.13.4",
-    "@vuu-ui/vuu-layout": "0.13.4",
-    "@vuu-ui/vuu-popups": "0.13.4",
-    "@vuu-ui/vuu-ui-controls": "0.13.4",
-    "@vuu-ui/vuu-utils": "0.13.4",
-    "@vuu-ui/vuu-table": "0.13.4",
+    "@vuu-ui/vuu-context-menu": "0.13.5",
+    "@vuu-ui/vuu-data-remote": "0.13.5",
+    "@vuu-ui/vuu-filter-parser": "0.13.5",
+    "@vuu-ui/vuu-layout": "0.13.5",
+    "@vuu-ui/vuu-popups": "0.13.5",
+    "@vuu-ui/vuu-ui-controls": "0.13.5",
+    "@vuu-ui/vuu-utils": "0.13.5",
+    "@vuu-ui/vuu-table": "0.13.5",
     "@salt-ds/core": "1.43.0",
     "@salt-ds/styles": "0.2.1",
     "@salt-ds/window": "0.1.1"
@@ -30,16 +30,19 @@
   "files": [
     "README.md",
     "esm",
-    "cjs"
+    "cjs",
+    "/types"
   ],
   "exports": {
     ".": {
       "require": "./cjs/index.js",
-      "import": "./esm/index.js"
+      "import": "./esm/index.js",
+      "types": "./types/index.d.ts"
     }
   },
   "main": "cjs/index.js",
   "module": "esm/index.js",
   "name": "@vuu-ui/vuu-data-react",
-  "type": "module"
+  "type": "module",
+  "types": "types/index.d.ts"
 }

package/types/data-editing/EditForm.d.ts

@@ -0,0 +1,5 @@
+import { HTMLAttributes } from "react";
+import { EditFormHookProps } from "./useEditForm";
+export interface EditFormProps extends EditFormHookProps, Omit<HTMLAttributes<HTMLDivElement>, "onSubmit"> {
+}
+export declare const EditForm: ({ className, dataSource, formFieldDescriptors, onSubmit: onSubmitProp, ...htmlAttributes }: EditFormProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/UnsavedChangesReport.d.ts

@@ -0,0 +1,6 @@
+import { Entity } from "@vuu-ui/vuu-utils";
+export interface UnsavedChangesReportProps<T extends Entity = Entity> {
+    entity: T;
+    editedEntity: T;
+}
+export declare const UnsavedChangesReport: ({ entity, editedEntity, }: UnsavedChangesReportProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/edit-rule-validation-checker.d.ts

@@ -0,0 +1,4 @@
+import type { DataValueDescriptor, DataValueValidationChecker, EditPhase, EditRuleValidationSuccessResult, EditValidationRule } from "@vuu-ui/vuu-data-types";
+export declare const OK: EditRuleValidationSuccessResult;
+export declare function getEditValidationRules(descriptor: DataValueDescriptor, editPhase: EditPhase | "*"): EditValidationRule[];
+export declare const buildValidationChecker: (rules: EditValidationRule[]) => DataValueValidationChecker;

package/types/data-editing/edit-validation-rules.d.ts

@@ -0,0 +1 @@
+export declare const registerRules: () => void;

package/types/data-editing/form-edit-state.d.ts

@@ -0,0 +1,7 @@
+import { Entity } from "@vuu-ui/vuu-utils";
+export type FormEditState = {
+    isClean: boolean;
+    editedFields: string[];
+};
+export declare const CLEAN_FORM: FormEditState;
+export declare const buildFormEditState: (entity: Entity | undefined, newEntity: Entity) => FormEditState;

package/types/data-editing/get-data-item-edit-control.d.ts

@@ -0,0 +1,18 @@
+import type { DataValueDescriptor, TableSchemaTable } from "@vuu-ui/vuu-data-types";
+import { VuuTypeaheadInputProps } from "@vuu-ui/vuu-ui-controls";
+import { CommitHandler } from "@vuu-ui/vuu-utils";
+import { InputProps } from "@salt-ds/core";
+export interface DataItemEditControlProps {
+    InputProps?: Partial<InputProps>;
+    TypeaheadProps?: Pick<VuuTypeaheadInputProps, "highlightFirstSuggestion">;
+    commitWhenCleared?: boolean;
+    /**
+     * A table column or form field Descriptor.
+     */
+    dataDescriptor: DataValueDescriptor;
+    errorMessage?: string;
+    onCommit: CommitHandler<HTMLElement>;
+    table?: TableSchemaTable;
+}
+export type ValidationStatus = "initial" | true | string;
+export declare const getDataItemEditControl: ({ InputProps, TypeaheadProps, commitWhenCleared, dataDescriptor, errorMessage, onCommit, table, }: DataItemEditControlProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./get-data-item-edit-control";
+export * from "./EditForm";
+export * from "./edit-rule-validation-checker";
+export * from "./UnsavedChangesReport";
+export * from "./useEditForm";
+export * from "./form-edit-state";

package/types/data-editing/useEditForm.d.ts

@@ -0,0 +1,21 @@
+import type { DataSource, DataValueDescriptor } from "@vuu-ui/vuu-data-types";
+import { CommitHandler, Entity } from "@vuu-ui/vuu-utils";
+import { FocusEventHandler, SyntheticEvent } from "react";
+export interface EditFormHookProps {
+    dataSource?: DataSource;
+    formFieldDescriptors: DataValueDescriptor[];
+    onSubmit?: () => void;
+}
+export declare const useEditForm: ({ dataSource, formFieldDescriptors, onSubmit, }: EditFormHookProps) => {
+    editedFields: string[];
+    editEntity: Entity | undefined;
+    errorMessages: Record<string, string>;
+    formFieldsContainerRef: import("react").RefObject<HTMLDivElement | null>;
+    isClean: boolean;
+    ok: boolean;
+    onCancel: () => Promise<void>;
+    onChange: (evt: SyntheticEvent<HTMLInputElement>) => void;
+    onCommit: CommitHandler<HTMLElement>;
+    onFocus: FocusEventHandler;
+    onSubmit: () => Promise<void>;
+};

package/types/datasource-provider/RestDataSourceProvider.d.ts

@@ -0,0 +1,11 @@
+import { TableSchema } from "@vuu-ui/vuu-data-types";
+import { ReactNode } from "react";
+export type RestDataSourceExtension = {
+    createHttpHeaders?: () => Headers;
+};
+export declare const isRestDataSourceExtension: (o?: unknown) => o is RestDataSourceExtension;
+export declare const RestDataSourceProvider: ({ children, createHttpHeaders, tableSchemas, url, }: {
+    children: ReactNode;
+    tableSchemas?: Record<string, TableSchema>;
+    url: string;
+} & RestDataSourceExtension) => import("react/jsx-runtime").JSX.Element;

package/types/datasource-provider/VuuDataSourceProvider.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from "react";
+export declare const VuuDataSourceProvider: ({ authenticate, autoConnect, autoLogin, children, websocketUrl, }: {
+    authenticate?: boolean;
+    autoConnect?: boolean;
+    autoLogin?: boolean;
+    children: ReactNode;
+    websocketUrl?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/types/datasource-provider/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./RestDataSourceProvider";
+export * from "./VuuDataSourceProvider";

package/types/datasource-provider/useAutoLoginToVuuServer.d.ts

@@ -0,0 +1,7 @@
+export declare const useAutoLoginToVuuServer: ({ authenticate, autoConnect, secure, websocketUrl, }?: {
+    authenticate?: boolean;
+    autoConnect?: boolean;
+    autoLogin?: boolean;
+    secure?: boolean;
+    websocketUrl?: string;
+}) => import("react/jsx-runtime").JSX.Element | undefined;

package/types/hooks/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./useLookupValues";
+export * from "./useSessionDataSource";
+export * from "./useVuuMenuActions";
+export * from "./useVuuTables";
+export * from "./useVisualLinks";
+export * from "./useTypeaheadSuggestions";

package/types/hooks/useLookupValues.d.ts

@@ -0,0 +1,5 @@
+import { ColumnDescriptor, ListOption } from "@vuu-ui/vuu-table-types";
+export declare const useLookupValues: (column: ColumnDescriptor, initialValueProp: number | string) => {
+    initialValue: ListOption | null;
+    values: ListOption[];
+};

package/types/hooks/useSessionDataSource.d.ts

@@ -0,0 +1,5 @@
+import type { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
+export declare const useSessionDataSource: ({ dataSourceSessionKey, tableSchema, }: {
+    dataSourceSessionKey?: string;
+    tableSchema: TableSchema;
+}) => DataSource;

package/types/hooks/useTypeaheadSuggestions.d.ts

@@ -0,0 +1,4 @@
+import { SuggestionFetcher, TableSchemaTable } from "@vuu-ui/vuu-data-types";
+import { TypeaheadParams } from "@vuu-ui/vuu-protocol-types";
+export declare const getTypeaheadParams: (table: TableSchemaTable, column: string, text?: string, selectedValues?: string[]) => TypeaheadParams;
+export declare const useTypeaheadSuggestions: () => SuggestionFetcher;

package/types/hooks/useVisualLinks.d.ts

@@ -0,0 +1,2 @@
+import { DataSource } from "@vuu-ui/vuu-data-types";
+export declare const useVisualLinks: (dataSource: DataSource) => void;

package/types/hooks/useVuuMenuActions.d.ts

@@ -0,0 +1,44 @@
+import { type MenuActionHandler, type MenuBuilder } from "@vuu-ui/vuu-context-menu";
+import { DataSource, DataSourceVisualLinkCreatedMessage, RpcResponseHandler } from "@vuu-ui/vuu-data-types";
+import type { LinkDescriptorWithLabel, VuuDataRowDto, VuuMenu, VuuMenuItem, VuuRowDataItemType } from "@vuu-ui/vuu-protocol-types";
+import { TableContextMenuOptions, TableMenuLocation } from "@vuu-ui/vuu-table";
+import type { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface VuuMenuActionHookResult {
+    menuBuilder: MenuBuilder<TableMenuLocation, TableContextMenuOptions>;
+    menuActionHandler: MenuActionHandler;
+}
+export interface MenuActionConfig {
+    vuuMenu?: VuuMenu;
+    visualLink?: DataSourceVisualLinkCreatedMessage;
+    visualLinks?: LinkDescriptorWithLabel[];
+}
+export interface VuuMenuActionHookProps {
+    /**
+     * By default, vuuMenuActions will be handled automatically. When activated, a
+     * message will be sent to server and response will be handled here too.
+     * This prop allows client to provide a custom handler for a menu Item. This will
+     * take priority and if handler returns true, no further processing for the menu
+     * item will be handled by Vuu. This can also be used to prevent an item from being
+     * actioned, even when no custom handling is intended. If the handler returns false,
+     * Vuu will process the menuItem.
+     */
+    clientSideMenuActionHandler?: MenuActionHandler;
+    dataSource?: DataSource;
+    menuActionConfig?: MenuActionConfig;
+    onRpcResponse?: RpcResponseHandler;
+}
+export interface VuuCellContextMenuItemOptions extends VuuMenuItem {
+    rowKey: string;
+    field: string;
+    value: VuuRowDataItemType;
+}
+export interface VuuRowContextMenuItemOptions extends VuuMenuItem {
+    rowKey: string;
+    row: VuuDataRowDto;
+}
+export interface VuuSelectedRowsContextMenuItemOptions extends VuuMenuItem {
+    columns: ColumnDescriptor[];
+}
+export declare const isRowMenu: (options: VuuMenuItem) => options is VuuRowContextMenuItemOptions;
+export declare const isSelectionMenu: (options: VuuMenuItem) => options is VuuSelectedRowsContextMenuItemOptions;
+export declare const useVuuMenuActions: ({ clientSideMenuActionHandler, dataSource, onRpcResponse, }: VuuMenuActionHookProps) => VuuMenuActionHookResult;

package/types/hooks/useVuuTables.d.ts

@@ -0,0 +1,2 @@
+import type { TableSchema } from "@vuu-ui/vuu-data-types";
+export declare const useVuuTables: () => TableSchema[] | undefined;

package/types/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./data-editing";
+export * from "./datasource-provider";
+export * from "./hooks";
+export * from "./session-editing-form";

package/types/session-editing-form/SessionEditingForm.d.ts

@@ -0,0 +1,24 @@
+import { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
+import { VuuColumnDataType } from "@vuu-ui/vuu-protocol-types";
+import { HTMLAttributes } from "react";
+export type FormFieldDescriptor = {
+    isKeyField?: boolean;
+    label?: string;
+    name: string;
+    type: VuuColumnDataType;
+    description: string;
+    readonly?: boolean;
+    required?: boolean;
+};
+export type FormConfig = {
+    title: string;
+    key: string;
+    fields: FormFieldDescriptor[];
+};
+export interface SessionEditingFormProps extends HTMLAttributes<HTMLDivElement> {
+    config: FormConfig;
+    onClose?: () => void;
+    dataSource?: DataSource;
+    schema?: TableSchema;
+}
+export declare const SessionEditingForm: ({ className, config: { fields, key: keyField }, dataSource: dataSourceProp, id: idProp, onClose, schema, ...htmlAttributes }: SessionEditingFormProps) => import("react/jsx-runtime").JSX.Element;

package/types/session-editing-form/index.d.ts

@@ -0,0 +1 @@
+export * from "./SessionEditingForm";