zavadil-react-common 2.0.1 → 2.0.4

package/dist/component/forms/EntityIdSelect.d.ts

@@ -0,0 +1,12 @@
+import { EntityBase } from "zavadil-ts-common";
+export type EntityIdSelectProps<T extends EntityBase> = {
+    id?: number | null;
+    onChange: (n: number | null | undefined) => any;
+    options?: Array<T> | null;
+    showEmptyOption?: boolean;
+    disabled?: boolean;
+    emptyOptionLabel?: string;
+    sort?: boolean;
+    labelGetter: (item: T) => string;
+};
+export declare function EntityIdSelect<T extends EntityBase>({ id, sort, disabled, labelGetter, onChange, options, showEmptyOption, emptyOptionLabel }: EntityIdSelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/component/forms/EntitySelect.d.ts

@@ -0,0 +1,12 @@
+import { EntityBase } from "zavadil-ts-common";
+export type EntitySelectProps<T extends EntityBase> = {
+    value?: T | null;
+    onChange: (e: T | null | undefined) => any;
+    options?: Array<T> | null;
+    showEmptyOption?: boolean;
+    disabled?: boolean;
+    emptyOptionLabel?: string;
+    sort?: boolean;
+    labelGetter: (item: T) => string;
+};
+export declare function EntitySelect<T extends EntityBase>({ value, sort, disabled, labelGetter, onChange, options, showEmptyOption, emptyOptionLabel }: EntitySelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/component/forms/EntityWithNameIdSelect.d.ts

@@ -0,0 +1,11 @@
+import { EntityWithName } from "zavadil-ts-common";
+export type EntityWithNameIdSelectProps<T extends EntityWithName> = {
+    id?: number | null;
+    onChange: (n: number | null | undefined) => any;
+    options?: Array<T> | null;
+    showEmptyOption?: boolean;
+    disabled?: boolean;
+    emptyOptionLabel?: string;
+    sort?: boolean;
+};
+export declare function EntityWithNameIdSelect<T extends EntityWithName>({ id, sort, disabled, onChange, options, showEmptyOption, emptyOptionLabel }: EntityWithNameIdSelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/component/forms/EntityWithNameSelect.d.ts

@@ -0,0 +1,11 @@
+import { EntityWithName } from "zavadil-ts-common";
+export type EntityWithNameSelectProps<T extends EntityWithName> = {
+    value?: T | null;
+    onChange: (e: T | null | undefined) => any;
+    options?: Array<T> | null;
+    showEmptyOption?: boolean;
+    disabled?: boolean;
+    emptyOptionLabel?: string;
+    sort?: boolean;
+};
+export declare function EntityWithNameSelect<T extends EntityWithName>({ value, sort, disabled, onChange, options, showEmptyOption, emptyOptionLabel }: EntityWithNameSelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zavadil-react-common",
-  "version": "2.0.1",
+  "version": "2.0.4",
   "description": "Common types for React Typescript UI apps.",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/src/component/forms/EntityIdSelect.tsx

@@ -0,0 +1,49 @@
+import {useMemo} from "react";
+import {NumberSelect} from "./NumberSelect";
+import {EntityBase} from "zavadil-ts-common";
+import {GenericSelectOption} from "./StringSelect";
+
+export type EntityIdSelectProps<T extends EntityBase> = {
+	id?: number | null;
+	onChange: (n: number | null | undefined) => any;
+	options?: Array<T> | null;
+	showEmptyOption?: boolean;
+	disabled?: boolean;
+	emptyOptionLabel?: string;
+	sort?: boolean;
+	labelGetter: (item: T) => string;
+}
+
+export function EntityIdSelect<T extends EntityBase>(
+	{id, sort, disabled, labelGetter, onChange, options, showEmptyOption, emptyOptionLabel}: EntityIdSelectProps<T>
+) {
+	const lOptions: GenericSelectOption<number>[] = useMemo(
+		() => {
+			let result: Array<T> = []
+			if (options) {
+				result = sort ? options.sort((a, b) => labelGetter(a) > labelGetter(b) ? 1 : -1) : options;
+			}
+			return result
+				.map(
+					(o) => {
+						return {
+							id: o.id,
+							label: labelGetter(o)
+						}
+					}
+				);
+		},
+		[options]
+	);
+
+	return (
+		<NumberSelect
+			disabled={disabled}
+			value={id}
+			options={lOptions}
+			onChange={onChange}
+			showEmptyOption={showEmptyOption}
+			emptyOptionLabel={emptyOptionLabel}
+		/>
+	);
+}

package/src/component/forms/EntitySelect.tsx

@@ -0,0 +1,38 @@
+import {EntityBase} from "zavadil-ts-common";
+import {EntityIdSelect} from "./EntityIdSelect";
+
+export type EntitySelectProps<T extends EntityBase> = {
+	value?: T | null;
+	onChange: (e: T | null | undefined) => any;
+	options?: Array<T> | null;
+	showEmptyOption?: boolean;
+	disabled?: boolean;
+	emptyOptionLabel?: string;
+	sort?: boolean;
+	labelGetter: (item: T) => string;
+}
+
+export function EntitySelect<T extends EntityBase>(
+	{value, sort, disabled, labelGetter, onChange, options, showEmptyOption, emptyOptionLabel}: EntitySelectProps<T>
+) {
+
+	return (
+		<EntityIdSelect
+			disabled={disabled}
+			id={value ? value.id : null}
+			options={options}
+			onChange={
+				(id) => {
+					if (!options || !id) {
+						onChange(undefined);
+						return;
+					}
+					onChange(options.find((o) => o.id === id));
+				}
+			}
+			labelGetter={labelGetter}
+			showEmptyOption={showEmptyOption}
+			emptyOptionLabel={emptyOptionLabel}
+		/>
+	);
+}

package/src/component/forms/EntityWithNameIdSelect.tsx

@@ -0,0 +1,29 @@
+import {EntityWithName} from "zavadil-ts-common";
+import {EntityIdSelect} from "./EntityIdSelect";
+
+export type EntityWithNameIdSelectProps<T extends EntityWithName> = {
+	id?: number | null;
+	onChange: (n: number | null | undefined) => any;
+	options?: Array<T> | null;
+	showEmptyOption?: boolean;
+	disabled?: boolean;
+	emptyOptionLabel?: string;
+	sort?: boolean;
+}
+
+export function EntityWithNameIdSelect<T extends EntityWithName>(
+	{id, sort, disabled, onChange, options, showEmptyOption, emptyOptionLabel}: EntityWithNameIdSelectProps<T>
+) {
+	return (
+		<EntityIdSelect
+			id={id}
+			labelGetter={(e) => e.name}
+			disabled={disabled}
+			sort={sort}
+			options={options}
+			onChange={onChange}
+			showEmptyOption={showEmptyOption}
+			emptyOptionLabel={emptyOptionLabel}
+		/>
+	);
+}

package/src/component/forms/EntityWithNameSelect.tsx

@@ -0,0 +1,29 @@
+import {EntityWithName} from "zavadil-ts-common";
+import {EntitySelect} from "./EntitySelect";
+
+export type EntityWithNameSelectProps<T extends EntityWithName> = {
+	value?: T | null;
+	onChange: (e: T | null | undefined) => any;
+	options?: Array<T> | null;
+	showEmptyOption?: boolean;
+	disabled?: boolean;
+	emptyOptionLabel?: string;
+	sort?: boolean;
+}
+
+export function EntityWithNameSelect<T extends EntityWithName>(
+	{value, sort, disabled, onChange, options, showEmptyOption, emptyOptionLabel}: EntityWithNameSelectProps<T>
+) {
+	return (
+		<EntitySelect
+			value={value}
+			labelGetter={(e) => e.name}
+			disabled={disabled}
+			sort={sort}
+			options={options}
+			onChange={onChange}
+			showEmptyOption={showEmptyOption}
+			emptyOptionLabel={emptyOptionLabel}
+		/>
+	);
+}