@ask-ell/react 0.0.1 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -5,3 +5,7 @@ This library was generated with [Nx](https://nx.dev).
5
5
  ## Building
6
6
 
7
7
  Run `nx build react` to build the library.
8
+
9
+ ## Running unit tests
10
+
11
+ Run `nx test react` to execute the unit tests via [Jest](https://jestjs.io).
package/package.json CHANGED
@@ -1,19 +1,10 @@
1
1
  {
2
2
  "name": "@ask-ell/react",
3
- "version": "0.0.1",
3
+ "version": "0.0.3",
4
4
  "private": false,
5
- "type": "module",
6
- "main": "./dist/index.js",
7
- "module": "./dist/index.js",
8
- "types": "./dist/index.d.ts",
9
- "exports": {
10
- "./package.json": "./package.json",
11
- ".": {
12
- "types": "./dist/index.d.ts",
13
- "import": "./dist/index.js",
14
- "default": "./dist/index.js"
15
- }
16
- },
5
+ "type": "commonjs",
6
+ "main": "./src/index.js",
7
+ "types": "./src/index.d.ts",
17
8
  "dependencies": {
18
9
  "react": "^19.2.0",
19
10
  "tslib": "^2.3.0"
@@ -21,4 +12,4 @@
21
12
  "devDependencies": {
22
13
  "@types/react": "^19.2.2"
23
14
  }
24
- }
15
+ }
package/src/forms.d.ts ADDED
@@ -0,0 +1,32 @@
1
+ import { Dispatch, FormEvent, SetStateAction } from "react";
2
+ export declare enum SubmitMode {
3
+ ON_TRIGGER = 0,
4
+ AUTOMATIC = 1
5
+ }
6
+ export type ErrorSetter<FormData> = (key: keyof FormData) => (errorMessage: string) => void;
7
+ export type OnSubmitCallbackParams<FormData> = {
8
+ formData: FormData;
9
+ appendError: ErrorSetter<FormData>;
10
+ };
11
+ export type OnSubmitCallback<FormData> = (params: OnSubmitCallbackParams<FormData>) => void;
12
+ export type UseFormParams<FormData> = {
13
+ defaultValue: FormData;
14
+ onSubmit: OnSubmitCallback<FormData>;
15
+ submitMode?: SubmitMode;
16
+ };
17
+ type FormDataFieldUpdater<FormData> = <Key extends keyof FormData>(key: Key) => (value: FormData[Key]) => void;
18
+ type SubmitTrigger = () => void;
19
+ export interface ErrorsMap<FormData> extends Map<keyof FormData, string[]> {
20
+ }
21
+ export type FormController<FormData> = {
22
+ formData: FormData;
23
+ errors: ErrorsMap<FormData>;
24
+ setFormData: Dispatch<SetStateAction<FormData>>;
25
+ updateFormData: FormDataFieldUpdater<FormData>;
26
+ submit: SubmitTrigger;
27
+ reset: () => void;
28
+ };
29
+ export declare function useFormController<FormData>({ defaultValue, onSubmit, submitMode }: UseFormParams<FormData>): FormController<FormData>;
30
+ export declare const preventDefault: (callback: () => void) => (event: FormEvent) => void;
31
+ export {};
32
+ //# sourceMappingURL=forms.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"forms.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/forms.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAY,MAAM,OAAO,CAAC;AAEtE,oBAAY,UAAU;IAClB,UAAU,IAAA;IACV,SAAS,IAAA;CACZ;AAED,MAAM,MAAM,WAAW,CAAC,QAAQ,IAAI,CAAC,GAAG,EAAE,MAAM,QAAQ,KAAK,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;AAE5F,MAAM,MAAM,sBAAsB,CAAC,QAAQ,IAAI;IAC3C,QAAQ,EAAE,QAAQ,CAAC;IACnB,WAAW,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;CACtC,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,QAAQ,IAAI,CAAC,MAAM,EAAE,sBAAsB,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;AAE5F,MAAM,MAAM,aAAa,CAAC,QAAQ,IAAI;IAClC,YAAY,EAAE,QAAQ,CAAC;IACvB,QAAQ,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACrC,UAAU,CAAC,EAAE,UAAU,CAAA;CAC1B,CAAC;AAEF,KAAK,oBAAoB,CAAC,QAAQ,IAAI,CAAC,GAAG,SAAS,MAAM,QAAQ,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,IAAI,CAAC;AAE/G,KAAK,aAAa,GAAG,MAAM,IAAI,CAAC;AAEhC,MAAM,WAAW,SAAS,CAAC,QAAQ,CAAE,SAAQ,GAAG,CAAC,MAAM,QAAQ,EAAE,MAAM,EAAE,CAAC;CAAI;AAE9E,MAAM,MAAM,cAAc,CAAC,QAAQ,IAAI;IACnC,QAAQ,EAAE,QAAQ,CAAC;IACnB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC5B,WAAW,EAAE,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChD,cAAc,EAAE,oBAAoB,CAAC,QAAQ,CAAC,CAAC;IAC/C,MAAM,EAAE,aAAa,CAAC;IACtB,KAAK,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,QAAQ,EAAE,EAAE,YAAY,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,aAAa,CAAC,QAAQ,CAAC,GAAG,cAAc,CAAC,QAAQ,CAAC,CAiDrI;AAED,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,IAAI,MAAM,OAAO,SAAS,KAAG,IAG3E,CAAC"}
package/src/forms.js ADDED
@@ -0,0 +1,50 @@
1
+ import { useState } from "react";
2
+ export var SubmitMode;
3
+ (function (SubmitMode) {
4
+ SubmitMode[SubmitMode["ON_TRIGGER"] = 0] = "ON_TRIGGER";
5
+ SubmitMode[SubmitMode["AUTOMATIC"] = 1] = "AUTOMATIC";
6
+ })(SubmitMode || (SubmitMode = {}));
7
+ export function useFormController({ defaultValue, onSubmit, submitMode }) {
8
+ const [formData, setFormData] = useState(defaultValue);
9
+ const [errors, setErrors] = useState(new Map());
10
+ const appendError = (key) => (message) => {
11
+ const existingErrors = errors.get(key) ?? [];
12
+ existingErrors.push(message);
13
+ errors.set(key, existingErrors);
14
+ setErrors(new Map(errors));
15
+ };
16
+ const prepareOnSubmit = (callback) => {
17
+ errors.clear();
18
+ setErrors(new Map(errors));
19
+ callback();
20
+ };
21
+ const updateFormData = (key) => (value) => {
22
+ setTimeout(() => {
23
+ const newFormData = {
24
+ ...formData,
25
+ [key]: value
26
+ };
27
+ setFormData(() => newFormData);
28
+ if (submitMode === SubmitMode.AUTOMATIC) {
29
+ prepareOnSubmit(() => onSubmit({ formData: newFormData, appendError }));
30
+ }
31
+ });
32
+ };
33
+ const submit = () => prepareOnSubmit(() => onSubmit({ formData, appendError }));
34
+ const reset = () => {
35
+ setFormData(defaultValue);
36
+ errors.clear();
37
+ };
38
+ return {
39
+ formData,
40
+ errors,
41
+ setFormData,
42
+ updateFormData,
43
+ submit,
44
+ reset
45
+ };
46
+ }
47
+ export const preventDefault = (callback) => (event) => {
48
+ event.preventDefault();
49
+ callback();
50
+ };
package/src/index.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ export * from './forms';
2
+ export * from './keyboard-events';
3
+ export * from './select-events';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAA;AACvB,cAAc,mBAAmB,CAAA;AACjC,cAAc,iBAAiB,CAAA"}
package/src/index.js ADDED
@@ -0,0 +1,3 @@
1
+ export * from './forms';
2
+ export * from './keyboard-events';
3
+ export * from './select-events';
@@ -0,0 +1,5 @@
1
+ import { ChangeEvent, KeyboardEvent } from 'react';
2
+ export declare const handleEnterKeyDown: (callback: () => void) => (event: KeyboardEvent<HTMLInputElement>) => void;
3
+ export declare const handleKeyboardEvent: (callback: (fieldValue: string) => void) => <TargetType>(event: KeyboardEvent<TargetType>) => void;
4
+ export declare const handleChangeEvent: (callback: (fieldValue: string) => void) => <TargetType>(event: ChangeEvent<TargetType>) => void;
5
+ //# sourceMappingURL=keyboard-events.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"keyboard-events.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/keyboard-events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAGnD,eAAO,MAAM,kBAAkB,GAC5B,UAAU,MAAM,IAAI,MAAM,OAAO,aAAa,CAAC,gBAAgB,CAAC,SAIhE,CAAC;AAEJ,eAAO,MAAM,mBAAmB,GAC7B,UAAU,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,MAAM,UAAU,EAAE,OAAO,aAAa,CAAC,UAAU,CAAC,SAExF,CAAC;AAEJ,eAAO,MAAM,iBAAiB,GAC3B,UAAU,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,MAAM,UAAU,EAAE,OAAO,WAAW,CAAC,UAAU,CAAC,SAEtF,CAAC"}
@@ -0,0 +1,11 @@
1
+ export const handleEnterKeyDown = (callback) => (event) => {
2
+ if (event.key === 'Enter') {
3
+ callback();
4
+ }
5
+ };
6
+ export const handleKeyboardEvent = (callback) => (event) => {
7
+ callback(event.target.value);
8
+ };
9
+ export const handleChangeEvent = (callback) => (event) => {
10
+ callback(event.target.value);
11
+ };
@@ -0,0 +1,2 @@
1
+ export declare const handleSelectChange: (callback: (data: string) => void) => <T>(event: T) => void;
2
+ //# sourceMappingURL=select-events.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"select-events.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/select-events.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,kBAAkB,GAC1B,UAAU,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,MAC5B,CAAC,EAAE,OAAO,CAAC,KAAG,IAElB,CAAC"}
@@ -0,0 +1,3 @@
1
+ export const handleSelectChange = (callback) => (event) => {
2
+ callback(event.target.value);
3
+ };
package/src/forms.ts DELETED
@@ -1,92 +0,0 @@
1
- import { Dispatch, FormEvent, SetStateAction, useState } from "react";
2
-
3
- export enum SubmitMode {
4
- ON_TRIGGER,
5
- AUTOMATIC
6
- }
7
-
8
- export type ErrorSetter<FormData> = (key: keyof FormData) => (errorMessage: string) => void;
9
-
10
- export type OnSubmitCallbackParams<FormData> = {
11
- formData: FormData;
12
- appendError: ErrorSetter<FormData>;
13
- };
14
-
15
- export type OnSubmitCallback<FormData> = (params: OnSubmitCallbackParams<FormData>) => void;
16
-
17
- export type UseFormParams<FormData> = {
18
- defaultValue: FormData;
19
- onSubmit: OnSubmitCallback<FormData>;
20
- submitMode?: SubmitMode
21
- };
22
-
23
- type FormDataFieldUpdater<FormData> = <Key extends keyof FormData>(key: Key) => (value: FormData[Key]) => void;
24
-
25
- type SubmitTrigger = () => void;
26
-
27
- export interface ErrorsMap<FormData> extends Map<keyof FormData, string[]> { }
28
-
29
- export type FormController<FormData> = {
30
- formData: FormData;
31
- errors: ErrorsMap<FormData>;
32
- setFormData: Dispatch<SetStateAction<FormData>>;
33
- updateFormData: FormDataFieldUpdater<FormData>;
34
- submit: SubmitTrigger;
35
- reset: () => void;
36
- };
37
-
38
- export function useFormController<FormData>({ defaultValue, onSubmit, submitMode }: UseFormParams<FormData>): FormController<FormData> {
39
- const [formData, setFormData] = useState<FormData>(defaultValue);
40
- const [errors, setErrors] = useState<ErrorsMap<FormData>>(new Map());
41
-
42
- const appendError: ErrorSetter<FormData> = (key: keyof FormData) => (message: string): void => {
43
- const existingErrors: string[] = errors.get(key) ?? [];
44
- existingErrors.push(message);
45
- errors.set(key, existingErrors);
46
- setErrors(new Map(errors));
47
- }
48
-
49
- const prepareOnSubmit = (callback: () => void) => {
50
- errors.clear()
51
- setErrors(new Map(errors));
52
- callback();
53
- }
54
-
55
- const updateFormData: FormDataFieldUpdater<FormData> = <Key extends keyof FormData>(key: Key) => (value: FormData[Key]) => {
56
- setTimeout((): void => {
57
- const newFormData: FormData = {
58
- ...formData,
59
- [key]: value
60
- }
61
- setFormData(() => newFormData);
62
- if (submitMode === SubmitMode.AUTOMATIC) {
63
- prepareOnSubmit(
64
- (): void => onSubmit({ formData: newFormData, appendError })
65
- );
66
- }
67
- });
68
- };
69
-
70
- const submit: SubmitTrigger = (): void => prepareOnSubmit(
71
- (): void => onSubmit({ formData, appendError })
72
- );
73
-
74
- const reset = (): void => {
75
- setFormData(defaultValue)
76
- errors.clear();
77
- }
78
-
79
- return {
80
- formData,
81
- errors,
82
- setFormData,
83
- updateFormData,
84
- submit,
85
- reset
86
- }
87
- }
88
-
89
- export const preventDefault = (callback: () => void) => (event: FormEvent): void => {
90
- event.preventDefault();
91
- callback();
92
- };
package/src/index.ts DELETED
@@ -1,3 +0,0 @@
1
- export * from './forms.js'
2
- export * from './keyboard-events.js'
3
- export * from './select-events.js'
@@ -1,19 +0,0 @@
1
- import { ChangeEvent, KeyboardEvent } from 'react';
2
-
3
-
4
- export const handleEnterKeyDown =
5
- (callback: () => void) => (event: KeyboardEvent<HTMLInputElement>) => {
6
- if (event.key === 'Enter') {
7
- callback();
8
- }
9
- };
10
-
11
- export const handleKeyboardEvent =
12
- (callback: (fieldValue: string) => void) => <TargetType>(event: KeyboardEvent<TargetType>) => {
13
- callback((event.target as any).value as string);
14
- };
15
-
16
- export const handleChangeEvent =
17
- (callback: (fieldValue: string) => void) => <TargetType>(event: ChangeEvent<TargetType>) => {
18
- callback((event.target as any).value as string);
19
- };
@@ -1,5 +0,0 @@
1
- export const handleSelectChange =
2
- (callback: (data: string) => void) =>
3
- <T>(event: T): void => {
4
- callback((event as any).target.value);
5
- };
package/tsconfig.json DELETED
@@ -1,10 +0,0 @@
1
- {
2
- "extends": "../../tsconfig.base.json",
3
- "files": [],
4
- "include": [],
5
- "references": [
6
- {
7
- "path": "./tsconfig.lib.json"
8
- }
9
- ]
10
- }
package/tsconfig.lib.json DELETED
@@ -1,14 +0,0 @@
1
- {
2
- "extends": "../../tsconfig.base.json",
3
- "compilerOptions": {
4
- "baseUrl": ".",
5
- "rootDir": "src",
6
- "outDir": "dist",
7
- "tsBuildInfoFile": "dist/tsconfig.lib.tsbuildinfo",
8
- "emitDeclarationOnly": false,
9
- "forceConsistentCasingInFileNames": true,
10
- "types": ["node"]
11
- },
12
- "include": ["src/**/*.ts"],
13
- "references": []
14
- }