@availity/mui-controlled-form 2.3.0 → 3.0.0
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/CHANGELOG.md +46 -0
- package/dist/index.d.ts +13 -13
- package/dist/index.js +468 -706
- package/package.json +29 -29
- package/project.json +5 -6
- package/src/index.ts +1 -1
- package/src/lib/AsyncAutocomplete.test.tsx +2 -2
- package/src/lib/Autocomplete.test.tsx +2 -2
- package/src/lib/Checkbox.test.tsx +1 -1
- package/src/lib/Checkbox.tsx +1 -3
- package/src/lib/CodesAutocomplete.test.tsx +2 -2
- package/src/lib/Datepicker.test.tsx +1 -1
- package/src/lib/Datepicker.tsx +3 -5
- package/src/lib/Input.test.tsx +1 -1
- package/src/lib/Input.tsx +1 -3
- package/src/lib/OrganizationAutocomplete.test.tsx +2 -2
- package/src/lib/ProviderAutocomplete.test.tsx +2 -2
- package/src/lib/ProviderAutocomplete.tsx +1 -1
- package/src/lib/RadioGroup.test.tsx +1 -1
- package/src/lib/RadioGroup.tsx +2 -5
- package/src/lib/Select.test.tsx +2 -6
- package/src/lib/Select.tsx +1 -3
- package/src/lib/TextField.test.tsx +1 -1
- package/src/lib/TextField.tsx +1 -3
- package/src/lib/Timepicker.test.tsx +1 -1
- package/src/lib/Timepicker.tsx +3 -5
- package/src/lib/Types.tsx +1 -1
- package/dist/index.d.mts +0 -103
- package/dist/index.mjs +0 -777
- package/jest.config.js +0 -7
- package/tsconfig.spec.json +0 -10
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@availity/mui-controlled-form",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0",
|
|
4
4
|
"description": "Availity MUI/react-hook-form controlled form components - part of the @availity/element design system",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -21,56 +21,56 @@
|
|
|
21
21
|
"author": "Availity Developers <AVOSS@availity.com>",
|
|
22
22
|
"browser": "./dist/index.js",
|
|
23
23
|
"main": "./dist/index.js",
|
|
24
|
-
"module": "./dist/index.mjs",
|
|
25
24
|
"types": "./dist/index.d.ts",
|
|
26
25
|
"exports": {
|
|
27
|
-
"./package.json": "./package.json",
|
|
28
26
|
".": {
|
|
29
27
|
"types": "./dist/index.d.ts",
|
|
30
|
-
"import": "./dist/index.
|
|
31
|
-
|
|
32
|
-
|
|
28
|
+
"import": "./dist/index.js"
|
|
29
|
+
},
|
|
30
|
+
"./package.json": "./package.json"
|
|
33
31
|
},
|
|
34
32
|
"scripts": {
|
|
35
|
-
"build": "tsup src/index.ts --format esm
|
|
36
|
-
"dev": "tsup src/index.ts --format esm
|
|
33
|
+
"build": "tsup src/index.ts --format esm --dts",
|
|
34
|
+
"dev": "tsup src/index.ts --format esm --watch --dts",
|
|
37
35
|
"clean": "rm -rf dist",
|
|
38
36
|
"clean:nm": "rm -rf node_modules",
|
|
39
37
|
"publish": "yarn npm publish --tolerate-republish --access public",
|
|
40
38
|
"publish:canary": "yarn npm publish --access public --tag canary"
|
|
41
39
|
},
|
|
42
40
|
"dependencies": {
|
|
43
|
-
"@availity/mui-autocomplete": "^
|
|
44
|
-
"@availity/mui-checkbox": "^
|
|
45
|
-
"@availity/mui-datepicker": "^
|
|
46
|
-
"@availity/mui-form-utils": "^
|
|
47
|
-
"@availity/mui-textfield": "^
|
|
48
|
-
"react-hook-form": "^7.
|
|
41
|
+
"@availity/mui-autocomplete": "^3.0.0",
|
|
42
|
+
"@availity/mui-checkbox": "^3.0.0",
|
|
43
|
+
"@availity/mui-datepicker": "^3.0.0",
|
|
44
|
+
"@availity/mui-form-utils": "^3.0.0",
|
|
45
|
+
"@availity/mui-textfield": "^3.0.0",
|
|
46
|
+
"react-hook-form": "^7.79.0"
|
|
49
47
|
},
|
|
50
48
|
"devDependencies": {
|
|
51
|
-
"@availity/api-axios": "^
|
|
52
|
-
"@availity/mui-button": "^
|
|
53
|
-
"@availity/mui-layout": "^
|
|
54
|
-
"@availity/mui-menu": "^
|
|
55
|
-
"@availity/mui-paper": "^
|
|
56
|
-
"@availity/mui-typography": "^
|
|
49
|
+
"@availity/api-axios": "^13.2.0",
|
|
50
|
+
"@availity/mui-button": "^3.0.0",
|
|
51
|
+
"@availity/mui-layout": "^3.0.0",
|
|
52
|
+
"@availity/mui-menu": "^3.0.0",
|
|
53
|
+
"@availity/mui-paper": "^3.0.0",
|
|
54
|
+
"@availity/mui-typography": "^3.0.0",
|
|
57
55
|
"@hookform/resolvers": "^4.1.3",
|
|
58
|
-
"@mui/material": "^7.3.
|
|
59
|
-
"@tanstack/react-query": "^
|
|
60
|
-
"dayjs": "^1.11.
|
|
61
|
-
"react": "19.2.
|
|
62
|
-
"react-dom": "19.2.
|
|
63
|
-
"tsup": "^8.
|
|
64
|
-
"typescript": "^5.
|
|
56
|
+
"@mui/material": "^7.3.11",
|
|
57
|
+
"@tanstack/react-query": "^5.101.0",
|
|
58
|
+
"dayjs": "^1.11.21",
|
|
59
|
+
"react": "19.2.7",
|
|
60
|
+
"react-dom": "19.2.7",
|
|
61
|
+
"tsup": "^8.5.1",
|
|
62
|
+
"typescript": "^5.9.3",
|
|
65
63
|
"yup": "^1.6.1"
|
|
66
64
|
},
|
|
67
65
|
"peerDependencies": {
|
|
68
|
-
"@availity/api-axios": "^
|
|
66
|
+
"@availity/api-axios": "^13.0.2",
|
|
69
67
|
"@mui/material": "^7.0.0",
|
|
68
|
+
"@tanstack/react-query": "^5.101.0",
|
|
70
69
|
"react": ">=17.0.0"
|
|
71
70
|
},
|
|
72
71
|
"publishConfig": {
|
|
73
72
|
"access": "public"
|
|
74
73
|
},
|
|
75
|
-
"sideEffects": false
|
|
74
|
+
"sideEffects": false,
|
|
75
|
+
"type": "module"
|
|
76
76
|
}
|
package/project.json
CHANGED
|
@@ -8,23 +8,20 @@
|
|
|
8
8
|
"lint": {
|
|
9
9
|
"executor": "@nx/eslint:lint",
|
|
10
10
|
"options": {
|
|
11
|
-
"eslintConfig": ".eslintrc.json",
|
|
12
11
|
"silent": false,
|
|
13
12
|
"fix": false,
|
|
14
13
|
"cache": true,
|
|
15
14
|
"cacheLocation": "./node_modules/.cache/controlled-form/.eslintcache",
|
|
16
15
|
"maxWarnings": -1,
|
|
17
16
|
"quiet": false,
|
|
18
|
-
"noEslintrc": false,
|
|
19
17
|
"hasTypeAwareRules": true,
|
|
20
18
|
"cacheStrategy": "metadata"
|
|
21
19
|
}
|
|
22
20
|
},
|
|
23
21
|
"test": {
|
|
24
|
-
"executor": "
|
|
25
|
-
"outputs": ["{workspaceRoot}/coverage/controlled-form"],
|
|
22
|
+
"executor": "nx:run-commands",
|
|
26
23
|
"options": {
|
|
27
|
-
"
|
|
24
|
+
"command": "vitest run packages/controlled-form"
|
|
28
25
|
}
|
|
29
26
|
},
|
|
30
27
|
"version": {
|
|
@@ -34,7 +31,9 @@
|
|
|
34
31
|
"commitMessageFormat": "chore({projectName}): release version ${version} [skip ci]",
|
|
35
32
|
"tagPrefix": "@availity/{projectName}@",
|
|
36
33
|
"trackDeps": true,
|
|
37
|
-
"skipCommitTypes": [
|
|
34
|
+
"skipCommitTypes": [
|
|
35
|
+
"docs"
|
|
36
|
+
]
|
|
38
37
|
}
|
|
39
38
|
}
|
|
40
39
|
}
|
package/src/index.ts
CHANGED
|
@@ -42,7 +42,7 @@ const loadOptions = async (offset: number, limit: number) => {
|
|
|
42
42
|
};
|
|
43
43
|
};
|
|
44
44
|
|
|
45
|
-
const onSubmit =
|
|
45
|
+
const onSubmit = vi.fn();
|
|
46
46
|
|
|
47
47
|
describe('ControlledAsyncAutocomplete', () => {
|
|
48
48
|
beforeAll(() => {
|
|
@@ -54,7 +54,7 @@ describe('ControlledAsyncAutocomplete', () => {
|
|
|
54
54
|
// Remove any handlers you may have added
|
|
55
55
|
// in individual tests (runtime handlers).
|
|
56
56
|
server.resetHandlers();
|
|
57
|
-
|
|
57
|
+
vi.restoreAllMocks();
|
|
58
58
|
});
|
|
59
59
|
|
|
60
60
|
// terminate the server
|
|
@@ -2,13 +2,13 @@ import { fireEvent, render, waitFor } from '@testing-library/react';
|
|
|
2
2
|
import { ControlledAutocomplete } from './Autocomplete';
|
|
3
3
|
import { TestForm } from './UtilComponents';
|
|
4
4
|
|
|
5
|
-
const onSubmit =
|
|
5
|
+
const onSubmit = vi.fn();
|
|
6
6
|
|
|
7
7
|
describe('ControlledAutocomplete', () => {
|
|
8
8
|
afterEach(() => {
|
|
9
9
|
// Remove any handlers you may have added
|
|
10
10
|
// in individual tests (runtime handlers).
|
|
11
|
-
|
|
11
|
+
vi.restoreAllMocks();
|
|
12
12
|
});
|
|
13
13
|
|
|
14
14
|
test('should set the value and submit the form', async () => {
|
|
@@ -3,7 +3,7 @@ import { FormControl, FormLabel, FormControlLabel, FormGroup } from '@availity/m
|
|
|
3
3
|
import { ControlledCheckbox } from './Checkbox';
|
|
4
4
|
import { TestForm } from './UtilComponents';
|
|
5
5
|
|
|
6
|
-
const onSubmit =
|
|
6
|
+
const onSubmit = vi.fn();
|
|
7
7
|
|
|
8
8
|
describe('ControlledCheckbox', () => {
|
|
9
9
|
test('should set the value and submit the form data', async () => {
|
package/src/lib/Checkbox.tsx
CHANGED
|
@@ -17,8 +17,7 @@ export const ControlledCheckbox = <Output = boolean,>({
|
|
|
17
17
|
shouldUnregister,
|
|
18
18
|
transform,
|
|
19
19
|
...rest
|
|
20
|
-
}: ControlledCheckboxProps<Output>) =>
|
|
21
|
-
return (
|
|
20
|
+
}: ControlledCheckboxProps<Output>) => (
|
|
22
21
|
<Controller
|
|
23
22
|
name={name}
|
|
24
23
|
defaultValue={defaultValue}
|
|
@@ -42,4 +41,3 @@ export const ControlledCheckbox = <Output = boolean,>({
|
|
|
42
41
|
)}
|
|
43
42
|
/>
|
|
44
43
|
);
|
|
45
|
-
};
|
|
@@ -5,7 +5,7 @@ import { server } from '@availity/mock/src/lib/server';
|
|
|
5
5
|
import { ControlledCodesAutocomplete } from './CodesAutocomplete';
|
|
6
6
|
import { TestForm } from './UtilComponents';
|
|
7
7
|
|
|
8
|
-
const onSubmit =
|
|
8
|
+
const onSubmit = vi.fn();
|
|
9
9
|
|
|
10
10
|
describe('ControlledCodesAutocomplete', () => {
|
|
11
11
|
beforeAll(() => {
|
|
@@ -17,7 +17,7 @@ describe('ControlledCodesAutocomplete', () => {
|
|
|
17
17
|
// Remove any handlers you may have added
|
|
18
18
|
// in individual tests (runtime handlers).
|
|
19
19
|
server.resetHandlers();
|
|
20
|
-
|
|
20
|
+
vi.restoreAllMocks();
|
|
21
21
|
});
|
|
22
22
|
|
|
23
23
|
// terminate the server
|
|
@@ -4,7 +4,7 @@ import dayjs from 'dayjs';
|
|
|
4
4
|
import { ControlledDatepicker } from './Datepicker';
|
|
5
5
|
import { TestForm } from './UtilComponents';
|
|
6
6
|
|
|
7
|
-
const onSubmit =
|
|
7
|
+
const onSubmit = vi.fn();
|
|
8
8
|
|
|
9
9
|
describe('ControlledDatepicker', () => {
|
|
10
10
|
test('should render successfully and submit selection', async () => {
|
package/src/lib/Datepicker.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Datepicker, DatepickerProps } from '@availity/mui-datepicker';
|
|
2
2
|
import { RegisterOptions, FieldValues, Controller } from 'react-hook-form';
|
|
3
|
-
import { ControllerProps, TransformProp } from './Types';
|
|
4
3
|
import { Dayjs } from 'dayjs';
|
|
4
|
+
import { ControllerProps, TransformProp } from './Types';
|
|
5
5
|
|
|
6
6
|
export type ControlledDatepickerProps<Output = Dayjs | null> = Omit<
|
|
7
7
|
DatepickerProps,
|
|
@@ -22,8 +22,7 @@ export const ControlledDatepicker = <Output = Dayjs | null,>({
|
|
|
22
22
|
FieldProps,
|
|
23
23
|
transform,
|
|
24
24
|
...rest
|
|
25
|
-
}: ControlledDatepickerProps<Output>) =>
|
|
26
|
-
return (
|
|
25
|
+
}: ControlledDatepickerProps<Output>) => (
|
|
27
26
|
<Controller
|
|
28
27
|
name={name}
|
|
29
28
|
defaultValue={defaultValue}
|
|
@@ -53,7 +52,7 @@ export const ControlledDatepicker = <Output = Dayjs | null,>({
|
|
|
53
52
|
),
|
|
54
53
|
inputRef: ref,
|
|
55
54
|
inputProps: {
|
|
56
|
-
onBlur
|
|
55
|
+
onBlur,
|
|
57
56
|
},
|
|
58
57
|
}}
|
|
59
58
|
onChange={(e) => onChange(transform?.output?.(e) ?? e)}
|
|
@@ -62,4 +61,3 @@ export const ControlledDatepicker = <Output = Dayjs | null,>({
|
|
|
62
61
|
)}
|
|
63
62
|
/>
|
|
64
63
|
);
|
|
65
|
-
};
|
package/src/lib/Input.test.tsx
CHANGED
|
@@ -2,7 +2,7 @@ import { render, fireEvent, waitFor } from '@testing-library/react';
|
|
|
2
2
|
import { ControlledInput } from './Input';
|
|
3
3
|
import { TestForm } from './UtilComponents';
|
|
4
4
|
|
|
5
|
-
const onSubmit =
|
|
5
|
+
const onSubmit = vi.fn();
|
|
6
6
|
|
|
7
7
|
describe('ControlledInput', () => {
|
|
8
8
|
test('should render the error styling if an error is returned', async () => {
|
package/src/lib/Input.tsx
CHANGED
|
@@ -18,8 +18,7 @@ export const ControlledInput = <Output = string,>({
|
|
|
18
18
|
value,
|
|
19
19
|
transform,
|
|
20
20
|
...rest
|
|
21
|
-
}: ControlledInputProps<Output>) =>
|
|
22
|
-
return (
|
|
21
|
+
}: ControlledInputProps<Output>) => (
|
|
23
22
|
<Controller
|
|
24
23
|
name={name}
|
|
25
24
|
defaultValue={defaultValue}
|
|
@@ -44,4 +43,3 @@ export const ControlledInput = <Output = string,>({
|
|
|
44
43
|
)}
|
|
45
44
|
/>
|
|
46
45
|
);
|
|
47
|
-
};
|
|
@@ -5,7 +5,7 @@ import { server } from '@availity/mock/src/lib/server';
|
|
|
5
5
|
import { ControlledOrganizationAutocomplete } from './OrganizationAutocomplete';
|
|
6
6
|
import { TestForm } from './UtilComponents';
|
|
7
7
|
|
|
8
|
-
const onSubmit =
|
|
8
|
+
const onSubmit = vi.fn();
|
|
9
9
|
|
|
10
10
|
describe('ControlledOrganizationAutocomplete', () => {
|
|
11
11
|
beforeAll(() => {
|
|
@@ -17,7 +17,7 @@ describe('ControlledOrganizationAutocomplete', () => {
|
|
|
17
17
|
// Remove any handlers you may have added
|
|
18
18
|
// in individual tests (runtime handlers).
|
|
19
19
|
server.resetHandlers();
|
|
20
|
-
|
|
20
|
+
vi.restoreAllMocks();
|
|
21
21
|
});
|
|
22
22
|
|
|
23
23
|
// terminate the server
|
|
@@ -5,7 +5,7 @@ import { server } from '@availity/mock/src/lib/server';
|
|
|
5
5
|
import { ControlledProviderAutocomplete } from './ProviderAutocomplete';
|
|
6
6
|
import { TestForm } from './UtilComponents';
|
|
7
7
|
|
|
8
|
-
const onSubmit =
|
|
8
|
+
const onSubmit = vi.fn();
|
|
9
9
|
|
|
10
10
|
describe('ControlledProviderAutocomplete', () => {
|
|
11
11
|
beforeAll(() => {
|
|
@@ -17,7 +17,7 @@ describe('ControlledProviderAutocomplete', () => {
|
|
|
17
17
|
// Remove any handlers you may have added
|
|
18
18
|
// in individual tests (runtime handlers).
|
|
19
19
|
server.resetHandlers();
|
|
20
|
-
|
|
20
|
+
vi.restoreAllMocks();
|
|
21
21
|
});
|
|
22
22
|
|
|
23
23
|
// terminate the server
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import type { AsyncAutocompleteProps, Provider } from '@availity/mui-autocomplete';
|
|
2
2
|
import { handleGetProviderOptionLabel, fetchProviders } from '@availity/mui-autocomplete';
|
|
3
3
|
import type { ChipTypeMap } from '@mui/material/Chip';
|
|
4
|
-
import type { Optional } from './utils';
|
|
5
4
|
import type { ApiConfig } from '@availity/api-axios';
|
|
5
|
+
import type { Optional } from './utils';
|
|
6
6
|
import { ControlledAsyncAutocomplete, type ControlledAsyncAutocompleteProps } from './AsyncAutocomplete';
|
|
7
7
|
|
|
8
8
|
export interface ControlledProviderAutocompleteProps<
|
|
@@ -3,7 +3,7 @@ import { FormControlLabel, Radio } from '@availity/mui-form-utils';
|
|
|
3
3
|
import { ControlledRadioGroup } from './RadioGroup';
|
|
4
4
|
import { TestForm } from './UtilComponents';
|
|
5
5
|
|
|
6
|
-
const onSubmit =
|
|
6
|
+
const onSubmit = vi.fn();
|
|
7
7
|
|
|
8
8
|
describe('ControlledRadioGroup', () => {
|
|
9
9
|
test('should set the value and submit the form data', async () => {
|
package/src/lib/RadioGroup.tsx
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
|
-
import { FormControlProps, RadioGroup, RadioGroupProps } from '@availity/mui-form-utils';
|
|
1
|
+
import { FormControlProps, RadioGroup, RadioGroupProps , FormControl, FormLabel, FormHelperText } from '@availity/mui-form-utils';
|
|
2
2
|
import { Controller, RegisterOptions, FieldValues } from 'react-hook-form';
|
|
3
|
-
import { FormControl, FormLabel, FormHelperText } from '@availity/mui-form-utils';
|
|
4
3
|
import { ControllerProps, TransformProp } from './Types';
|
|
5
4
|
|
|
6
5
|
export type ControlledRadioGroupProps<Output = string> = {
|
|
@@ -26,8 +25,7 @@ export const ControlledRadioGroup = <Output = string,>({
|
|
|
26
25
|
value,
|
|
27
26
|
transform,
|
|
28
27
|
...rest
|
|
29
|
-
}: ControlledRadioGroupProps<Output>) =>
|
|
30
|
-
return (
|
|
28
|
+
}: ControlledRadioGroupProps<Output>) => (
|
|
31
29
|
<Controller
|
|
32
30
|
name={name}
|
|
33
31
|
defaultValue={defaultValue}
|
|
@@ -61,4 +59,3 @@ export const ControlledRadioGroup = <Output = string,>({
|
|
|
61
59
|
)}
|
|
62
60
|
/>
|
|
63
61
|
);
|
|
64
|
-
};
|
package/src/lib/Select.test.tsx
CHANGED
|
@@ -1,13 +1,9 @@
|
|
|
1
1
|
import { render, fireEvent, waitFor } from '@testing-library/react';
|
|
2
|
-
import { Paper } from '@availity/mui-paper';
|
|
3
|
-
import { Typography } from '@availity/mui-typography';
|
|
4
|
-
import { Grid } from '@availity/mui-layout';
|
|
5
|
-
import { Button } from '@availity/mui-button';
|
|
6
|
-
import { ControlledSelect } from './Select';
|
|
7
2
|
import { MenuItem } from '@availity/mui-menu';
|
|
3
|
+
import { ControlledSelect } from './Select';
|
|
8
4
|
import { TestForm } from './UtilComponents';
|
|
9
5
|
|
|
10
|
-
const onSubmit =
|
|
6
|
+
const onSubmit = vi.fn();
|
|
11
7
|
|
|
12
8
|
describe('ControlledSelect', () => {
|
|
13
9
|
test('should render the error styling if an error is returned', async () => {
|
package/src/lib/Select.tsx
CHANGED
|
@@ -21,8 +21,7 @@ export const ControlledSelect = <Output = string, Input = unknown>({
|
|
|
21
21
|
value,
|
|
22
22
|
transform,
|
|
23
23
|
...rest
|
|
24
|
-
}: ControlledSelectProps<Output, Input>) =>
|
|
25
|
-
return (
|
|
24
|
+
}: ControlledSelectProps<Output, Input>) => (
|
|
26
25
|
<Controller
|
|
27
26
|
name={name}
|
|
28
27
|
defaultValue={defaultValue}
|
|
@@ -47,4 +46,3 @@ export const ControlledSelect = <Output = string, Input = unknown>({
|
|
|
47
46
|
)}
|
|
48
47
|
/>
|
|
49
48
|
);
|
|
50
|
-
};
|
|
@@ -2,7 +2,7 @@ import { render, fireEvent, waitFor } from '@testing-library/react';
|
|
|
2
2
|
import { ControlledTextField } from './TextField';
|
|
3
3
|
import { TestForm } from './UtilComponents';
|
|
4
4
|
|
|
5
|
-
const onSubmit =
|
|
5
|
+
const onSubmit = vi.fn();
|
|
6
6
|
|
|
7
7
|
describe('ControlledTextField', () => {
|
|
8
8
|
test('should render the error styling if an error is returned', async () => {
|
package/src/lib/TextField.tsx
CHANGED
|
@@ -19,8 +19,7 @@ export const ControlledTextField = <Output = string,>({
|
|
|
19
19
|
value,
|
|
20
20
|
transform,
|
|
21
21
|
...rest
|
|
22
|
-
}: ControlledTextFieldProps<Output>) =>
|
|
23
|
-
return (
|
|
22
|
+
}: ControlledTextFieldProps<Output>) => (
|
|
24
23
|
<Controller
|
|
25
24
|
name={name}
|
|
26
25
|
defaultValue={defaultValue}
|
|
@@ -64,4 +63,3 @@ export const ControlledTextField = <Output = string,>({
|
|
|
64
63
|
)}
|
|
65
64
|
/>
|
|
66
65
|
);
|
|
67
|
-
};
|
|
@@ -4,7 +4,7 @@ import dayjs from 'dayjs';
|
|
|
4
4
|
import { ControlledTimepicker } from './Timepicker';
|
|
5
5
|
import { TestForm } from './UtilComponents';
|
|
6
6
|
|
|
7
|
-
const onSubmit =
|
|
7
|
+
const onSubmit = vi.fn();
|
|
8
8
|
|
|
9
9
|
describe('ControlledTimepicker', () => {
|
|
10
10
|
test('should render successfully and submit selection', async () => {
|
package/src/lib/Timepicker.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Timepicker, TimepickerProps } from '@availity/mui-datepicker';
|
|
2
2
|
import { RegisterOptions, FieldValues, Controller } from 'react-hook-form';
|
|
3
|
-
import { ControllerProps, TransformProp } from './Types';
|
|
4
3
|
import { Dayjs } from 'dayjs';
|
|
4
|
+
import { ControllerProps, TransformProp } from './Types';
|
|
5
5
|
|
|
6
6
|
export type ControlledTimepickerProps<Output = Dayjs | null> = Omit<
|
|
7
7
|
TimepickerProps,
|
|
@@ -22,8 +22,7 @@ export const ControlledTimepicker = <Output = Dayjs | null,>({
|
|
|
22
22
|
FieldProps,
|
|
23
23
|
transform,
|
|
24
24
|
...rest
|
|
25
|
-
}: ControlledTimepickerProps<Output>) =>
|
|
26
|
-
return (
|
|
25
|
+
}: ControlledTimepickerProps<Output>) => (
|
|
27
26
|
<Controller
|
|
28
27
|
name={name}
|
|
29
28
|
defaultValue={defaultValue}
|
|
@@ -53,7 +52,7 @@ export const ControlledTimepicker = <Output = Dayjs | null,>({
|
|
|
53
52
|
),
|
|
54
53
|
inputRef: ref,
|
|
55
54
|
inputProps: {
|
|
56
|
-
onBlur
|
|
55
|
+
onBlur,
|
|
57
56
|
},
|
|
58
57
|
}}
|
|
59
58
|
onChange={(e) => onChange(transform?.output?.(e) ?? e)}
|
|
@@ -62,4 +61,3 @@ export const ControlledTimepicker = <Output = Dayjs | null,>({
|
|
|
62
61
|
)}
|
|
63
62
|
/>
|
|
64
63
|
);
|
|
65
|
-
};
|
package/src/lib/Types.tsx
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { FieldValues, ControllerProps as MuiControllerProps, RegisterOptions } from 'react-hook-form';
|
|
2
|
+
import { HTMLAttributes } from 'react';
|
|
2
3
|
import { ControlledAutocompleteProps } from './Autocomplete';
|
|
3
4
|
import {
|
|
4
5
|
ControlledAsyncAutocompleteProps,
|
|
@@ -13,7 +14,6 @@ import {
|
|
|
13
14
|
ControlledTextFieldProps,
|
|
14
15
|
ControlledTimepickerProps,
|
|
15
16
|
} from '..';
|
|
16
|
-
import { HTMLAttributes } from 'react';
|
|
17
17
|
|
|
18
18
|
export type ControllerProps = {
|
|
19
19
|
/** Unique name of your input */
|
package/dist/index.d.mts
DELETED
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import { AutocompleteProps, AsyncAutocompleteProps, Code, Organization, Provider } from '@availity/mui-autocomplete';
|
|
3
|
-
import { RegisterOptions, FieldValues, ControllerProps as ControllerProps$1 } from 'react-hook-form';
|
|
4
|
-
export { FormProvider, SubmitHandler, UseFormProps, UseFormReturn, useForm, useFormContext } from 'react-hook-form';
|
|
5
|
-
import { ChipTypeMap } from '@mui/material/Chip';
|
|
6
|
-
import { CheckboxProps } from '@availity/mui-checkbox';
|
|
7
|
-
import { ApiConfig } from '@availity/api-axios';
|
|
8
|
-
import { DatepickerProps, TimepickerProps } from '@availity/mui-datepicker';
|
|
9
|
-
import { Dayjs } from 'dayjs';
|
|
10
|
-
import { InputProps, RadioGroupProps, FormControlProps, SelectProps } from '@availity/mui-form-utils';
|
|
11
|
-
import { TextFieldProps } from '@availity/mui-textfield';
|
|
12
|
-
|
|
13
|
-
type ControlledAutocompleteProps<T, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], Output = AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null> = Omit<AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent>, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null, Output>;
|
|
14
|
-
declare const ControlledAutocomplete: <T, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"], Output = AutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent>["value"] | null>({ name, FieldProps, defaultValue, rules, onBlur, onChange, shouldUnregister, value, transform, ...rest }: ControlledAutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => react_jsx_runtime.JSX.Element;
|
|
15
|
-
|
|
16
|
-
type ControllerProps = {
|
|
17
|
-
/** Unique name of your input */
|
|
18
|
-
name: ControllerProps$1['name'];
|
|
19
|
-
/** **Important**: Can not apply undefined to defaultValue or defaultValues at useForm.
|
|
20
|
-
* - You need to either set defaultValue at the field-level or useForm's defaultValues. undefined is not a valid value.
|
|
21
|
-
* - If your form will invoke reset with default values, you will need to provide useForm with defaultValues.
|
|
22
|
-
* - Calling onChange with undefined is not valid. You should use null or the empty string as your default/cleared value instead. */
|
|
23
|
-
defaultValue?: ControllerProps$1['defaultValue'];
|
|
24
|
-
/** If the input is disabled */
|
|
25
|
-
disabled?: ControllerProps$1['disabled'];
|
|
26
|
-
/** react-hook-form internal validation rules in the same format as [register options](https://react-hook-form.com/docs/useform/register#options), which includes:
|
|
27
|
-
* required, min, max, minLength, maxLength, pattern, validate
|
|
28
|
-
*
|
|
29
|
-
* Not used if 3rd party schema/resolver used. */
|
|
30
|
-
rules?: ControllerProps$1['rules'];
|
|
31
|
-
/** Input will be unregistered after unmount and defaultValues will be removed as well. */
|
|
32
|
-
shouldUnregister?: ControllerProps$1['shouldUnregister'];
|
|
33
|
-
};
|
|
34
|
-
type TransformProp<Input = string, Output = string> = {
|
|
35
|
-
/** Object containing functions to parse the input value and format the output value. Useful for converting values from API responses to display values and back.
|
|
36
|
-
* - `input`: Function to transform the value from the underlying data to the input value.
|
|
37
|
-
* - `output`: Function to transform the value from the input to the underlying data.
|
|
38
|
-
*
|
|
39
|
-
* Example: The input always expects a dayjs object, but your endpoint expects and returns a string:
|
|
40
|
-
* `{ input: (value) => value ? dayjs(value) : null, output: (value) => value.format('YYYY-MM-DD') }`
|
|
41
|
-
*/
|
|
42
|
-
transform?: {
|
|
43
|
-
input?: (value: Output) => Input;
|
|
44
|
-
output?: (value: Input) => Output;
|
|
45
|
-
};
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
type ControlledAsyncAutocompleteProps<Option, Multiple extends boolean | undefined, DisableClearable extends boolean | undefined, FreeSolo extends boolean | undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null> = {
|
|
49
|
-
defaultToFirstOption?: boolean;
|
|
50
|
-
defaultToOnlyOption?: boolean;
|
|
51
|
-
} & Omit<AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null, Output>;
|
|
52
|
-
declare const ControlledAsyncAutocomplete: <Option, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>["value"] | null>({ name, onBlur, onChange, rules, shouldUnregister, value, FieldProps, defaultToFirstOption, defaultToOnlyOption, transform, ...rest }: ControlledAsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => react_jsx_runtime.JSX.Element;
|
|
53
|
-
|
|
54
|
-
type ControlledCheckboxProps<Output = boolean> = Omit<CheckboxProps, 'disabled' | 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'disabled' | 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<boolean, Output>;
|
|
55
|
-
declare const ControlledCheckbox: <Output = boolean>({ name, disabled, onChange, onBlur, value, defaultValue, rules, shouldUnregister, transform, ...rest }: ControlledCheckboxProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
56
|
-
|
|
57
|
-
type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
|
|
58
|
-
|
|
59
|
-
interface ControlledCodesAutocompleteProps<Option = Code, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null> extends Omit<Optional<ControlledAsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>, 'queryKey'>, 'loadOptions'> {
|
|
60
|
-
/** The code list id. */
|
|
61
|
-
list: string;
|
|
62
|
-
/** Config passed to the AvCodesApi.query function */
|
|
63
|
-
apiConfig?: ApiConfig;
|
|
64
|
-
}
|
|
65
|
-
declare const ControlledCodesAutocomplete: <Option = Code, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>["value"] | null>({ apiConfig, queryOptions, queryKey, list, watchParams, ...rest }: ControlledCodesAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => react_jsx_runtime.JSX.Element;
|
|
66
|
-
|
|
67
|
-
type ControlledDatepickerProps<Output = Dayjs | null> = Omit<DatepickerProps, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<Dayjs | null, Output>;
|
|
68
|
-
declare const ControlledDatepicker: <Output = Dayjs | null>({ name, defaultValue, onBlur, onChange, rules, shouldUnregister, value, FieldProps, transform, ...rest }: ControlledDatepickerProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
69
|
-
|
|
70
|
-
type ControlledInputProps<Output = string> = Omit<InputProps, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<string, Output>;
|
|
71
|
-
declare const ControlledInput: <Output = string>({ name, defaultValue, disabled, onBlur, onChange, rules, shouldUnregister, value, transform, ...rest }: ControlledInputProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
72
|
-
|
|
73
|
-
interface ControlledOrgAutocompleteProps<Option = Organization, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null> extends Omit<Optional<ControlledAsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>, 'queryKey'>, 'loadOptions'> {
|
|
74
|
-
/** Axios ApiConfig */
|
|
75
|
-
apiConfig?: ApiConfig;
|
|
76
|
-
}
|
|
77
|
-
declare const ControlledOrganizationAutocomplete: <Option = Organization, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>["value"] | null>({ queryKey, apiConfig, ...rest }: ControlledOrgAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => react_jsx_runtime.JSX.Element;
|
|
78
|
-
|
|
79
|
-
interface ControlledProviderAutocompleteProps<Option = Provider, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>['value'] | null> extends Omit<Optional<ControlledAsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>, 'queryKey'>, 'loadOptions'> {
|
|
80
|
-
/** Customer ID of the Organization you are requesting the providers for */
|
|
81
|
-
customerId: string;
|
|
82
|
-
/** Config passed to the AvProvidersApi.getProviders function */
|
|
83
|
-
apiConfig?: ApiConfig;
|
|
84
|
-
}
|
|
85
|
-
declare const ControlledProviderAutocomplete: <Option = Provider, Multiple extends boolean | undefined = false, DisableClearable extends boolean | undefined = false, FreeSolo extends boolean | undefined = false, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"], Output = AsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent>["value"] | null>({ apiConfig, customerId, queryKey, ...rest }: ControlledProviderAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => react_jsx_runtime.JSX.Element;
|
|
86
|
-
|
|
87
|
-
type ControlledRadioGroupProps<Output = string> = {
|
|
88
|
-
name: string;
|
|
89
|
-
label: string;
|
|
90
|
-
helperText?: string;
|
|
91
|
-
} & Omit<RadioGroupProps, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<string, Output> & Pick<FormControlProps, 'required'>;
|
|
92
|
-
declare const ControlledRadioGroup: <Output = string>({ name, helperText, label, defaultValue, onBlur, onChange, required, rules, shouldUnregister, value, transform, ...rest }: ControlledRadioGroupProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
93
|
-
|
|
94
|
-
type ControlledSelectProps<Output = string, Input = unknown> = Omit<SelectProps<Input>, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<Input, Output>;
|
|
95
|
-
declare const ControlledSelect: <Output = string, Input = unknown>({ name, defaultValue, disabled, onBlur, onChange, rules, shouldUnregister, value, transform, ...rest }: ControlledSelectProps<Output, Input>) => react_jsx_runtime.JSX.Element;
|
|
96
|
-
|
|
97
|
-
type ControlledTextFieldProps<Output = string> = Omit<TextFieldProps, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<string, Output>;
|
|
98
|
-
declare const ControlledTextField: <Output = string>({ name, defaultValue, disabled, helperText, onBlur, onChange, rules, shouldUnregister, value, transform, ...rest }: ControlledTextFieldProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
99
|
-
|
|
100
|
-
type ControlledTimepickerProps<Output = Dayjs | null> = Omit<TimepickerProps, 'onBlur' | 'onChange' | 'value' | 'name'> & Pick<RegisterOptions<FieldValues, string>, 'onBlur' | 'onChange' | 'value'> & ControllerProps & TransformProp<Dayjs | null, Output>;
|
|
101
|
-
declare const ControlledTimepicker: <Output = Dayjs | null>({ name, defaultValue, onBlur, onChange, rules, shouldUnregister, value, FieldProps, transform, ...rest }: ControlledTimepickerProps<Output>) => react_jsx_runtime.JSX.Element;
|
|
102
|
-
|
|
103
|
-
export { ControlledAsyncAutocomplete, type ControlledAsyncAutocompleteProps, ControlledAutocomplete, type ControlledAutocompleteProps, ControlledCheckbox, type ControlledCheckboxProps, ControlledCodesAutocomplete, type ControlledCodesAutocompleteProps, ControlledDatepicker, type ControlledDatepickerProps, ControlledInput, type ControlledInputProps, type ControlledOrgAutocompleteProps, ControlledOrganizationAutocomplete, ControlledProviderAutocomplete, type ControlledProviderAutocompleteProps, ControlledRadioGroup, type ControlledRadioGroupProps, ControlledSelect, type ControlledSelectProps, ControlledTextField, type ControlledTextFieldProps, ControlledTimepicker, type ControlledTimepickerProps };
|