@startupjs-ui/form 0.2.2 → 0.3.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.
Files changed (4) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/index.d.ts +38 -3
  3. package/index.tsx +50 -1
  4. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -3,6 +3,25 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [0.3.0](https://github.com/startupjs/startupjs-ui/compare/v0.2.3...v0.3.0) (2026-05-27)
7
+
8
+
9
+ ### Features
10
+
11
+ * [BREAKING] [0.3] improve accessibility props for E2E tests. Support testID everywhere ([#31](https://github.com/startupjs/startupjs-ui/issues/31)) ([882588c](https://github.com/startupjs/startupjs-ui/commit/882588ca37d5e1fd14b5717b5697cf9ed47042e4))
12
+
13
+
14
+
15
+
16
+
17
+ ## [0.2.3](https://github.com/startupjs/startupjs-ui/compare/v0.2.2...v0.2.3) (2026-05-15)
18
+
19
+ **Note:** Version bump only for package @startupjs-ui/form
20
+
21
+
22
+
23
+
24
+
6
25
  ## [0.2.2](https://github.com/startupjs/startupjs-ui/compare/v0.2.1...v0.2.2) (2026-05-11)
7
26
 
8
27
  **Note:** Version bump only for package @startupjs-ui/form
package/index.d.ts CHANGED
@@ -3,6 +3,21 @@
3
3
 
4
4
  import { type ReactNode } from 'react';
5
5
  import { type StyleProp, type ViewStyle } from 'react-native';
6
+ import { type UIRole } from '@startupjs-ui/core';
7
+ type FormWrapperProps = {
8
+ style: StyleProp<ViewStyle> | undefined;
9
+ testID?: string;
10
+ id?: string;
11
+ role?: UIRole;
12
+ 'aria-label'?: string;
13
+ 'aria-labelledby'?: string;
14
+ 'aria-describedby'?: string;
15
+ 'aria-errormessage'?: string;
16
+ 'aria-invalid'?: boolean;
17
+ 'aria-required'?: boolean;
18
+ 'aria-disabled'?: boolean;
19
+ 'aria-readonly'?: boolean;
20
+ };
6
21
  export declare const _PropsJsonSchema: {};
7
22
  export interface FormProps {
8
23
  /** Schema describing form fields (json-schema compatible) */
@@ -24,15 +39,35 @@ export interface FormProps {
24
39
  /** Custom inputs by type key */
25
40
  customInputs?: Record<string, any>;
26
41
  /** Custom wrapper renderer for inputs */
27
- _renderWrapper?: (params: {
28
- style: StyleProp<ViewStyle> | undefined;
29
- }, children: ReactNode) => ReactNode;
42
+ _renderWrapper?: (params: FormWrapperProps, children: ReactNode) => ReactNode;
30
43
  /** Enable validation or pass validate hook from useValidate */
31
44
  validate?: boolean | any;
32
45
  /** Disable interactions */
33
46
  disabled?: boolean;
34
47
  /** Render as read-only */
35
48
  readonly?: boolean;
49
+ /** Test identifier */
50
+ testID?: string;
51
+ /** Web id for the wrapper */
52
+ id?: string;
53
+ /** ARIA role for the wrapper */
54
+ role?: UIRole;
55
+ /** Accessible name for the wrapper */
56
+ 'aria-label'?: string;
57
+ /** Id of the element that labels the wrapper */
58
+ 'aria-labelledby'?: string;
59
+ /** Id of the element that describes the wrapper */
60
+ 'aria-describedby'?: string;
61
+ /** Id of the element that describes the wrapper error */
62
+ 'aria-errormessage'?: string;
63
+ /** Invalid state for the wrapper */
64
+ 'aria-invalid'?: boolean;
65
+ /** Required state for the wrapper */
66
+ 'aria-required'?: boolean;
67
+ /** Disabled state for the wrapper */
68
+ 'aria-disabled'?: boolean;
69
+ /** Readonly state for the wrapper */
70
+ 'aria-readonly'?: boolean;
36
71
  /** Model binding for form values */
37
72
  $value: any;
38
73
  /** Do not use; pass `fields` instead (will throw if set) */
package/index.tsx CHANGED
@@ -1,12 +1,28 @@
1
1
  import { useMemo, useCallback, useState, useId, useRef, type ReactNode } from 'react'
2
2
  import { type StyleProp, type ViewStyle } from 'react-native'
3
3
  import { pug, observer, $ } from 'startupjs'
4
+ import { type UIRole } from '@startupjs-ui/core'
4
5
  import ObjectInput from '@startupjs-ui/object-input'
5
6
  import { CustomInputsContext } from '@startupjs-ui/input'
6
7
  import _debounce from 'lodash/debounce'
7
8
  import { FormPropsContext } from './useFormProps'
8
9
  import { Validator } from './useValidate'
9
10
 
11
+ type FormWrapperProps = {
12
+ style: StyleProp<ViewStyle> | undefined
13
+ testID?: string
14
+ id?: string
15
+ role?: UIRole
16
+ 'aria-label'?: string
17
+ 'aria-labelledby'?: string
18
+ 'aria-describedby'?: string
19
+ 'aria-errormessage'?: string
20
+ 'aria-invalid'?: boolean
21
+ 'aria-required'?: boolean
22
+ 'aria-disabled'?: boolean
23
+ 'aria-readonly'?: boolean
24
+ }
25
+
10
26
  export const _PropsJsonSchema = {/* FormProps */}
11
27
 
12
28
  export interface FormProps {
@@ -29,13 +45,35 @@ export interface FormProps {
29
45
  /** Custom inputs by type key */
30
46
  customInputs?: Record<string, any>
31
47
  /** Custom wrapper renderer for inputs */
32
- _renderWrapper?: (params: { style: StyleProp<ViewStyle> | undefined }, children: ReactNode) => ReactNode
48
+ _renderWrapper?: (params: FormWrapperProps, children: ReactNode) => ReactNode
33
49
  /** Enable validation or pass validate hook from useValidate */
34
50
  validate?: boolean | any
35
51
  /** Disable interactions */
36
52
  disabled?: boolean
37
53
  /** Render as read-only */
38
54
  readonly?: boolean
55
+ /** Test identifier */
56
+ testID?: string
57
+ /** Web id for the wrapper */
58
+ id?: string
59
+ /** ARIA role for the wrapper */
60
+ role?: UIRole
61
+ /** Accessible name for the wrapper */
62
+ 'aria-label'?: string
63
+ /** Id of the element that labels the wrapper */
64
+ 'aria-labelledby'?: string
65
+ /** Id of the element that describes the wrapper */
66
+ 'aria-describedby'?: string
67
+ /** Id of the element that describes the wrapper error */
68
+ 'aria-errormessage'?: string
69
+ /** Invalid state for the wrapper */
70
+ 'aria-invalid'?: boolean
71
+ /** Required state for the wrapper */
72
+ 'aria-required'?: boolean
73
+ /** Disabled state for the wrapper */
74
+ 'aria-disabled'?: boolean
75
+ /** Readonly state for the wrapper */
76
+ 'aria-readonly'?: boolean
39
77
  /** Model binding for form values */
40
78
  $value: any
41
79
  /** Do not use; pass `fields` instead (will throw if set) */
@@ -135,6 +173,17 @@ function Form ({
135
173
  errors=errors || $errors.get()
136
174
  style=style
137
175
  inputStyle=inputStyle
176
+ testID=props.testID
177
+ id=props.id
178
+ role=props.role
179
+ aria-label=props['aria-label']
180
+ aria-labelledby=props['aria-labelledby']
181
+ aria-describedby=props['aria-describedby']
182
+ aria-errormessage=props['aria-errormessage']
183
+ aria-invalid=props['aria-invalid']
184
+ aria-required=props['aria-required']
185
+ aria-disabled=props['aria-disabled']
186
+ aria-readonly=props['aria-readonly']
138
187
  _renderWrapper=_renderWrapper
139
188
  disabled=disabled
140
189
  readonly=readonly
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@startupjs-ui/form",
3
- "version": "0.2.2",
3
+ "version": "0.3.0",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -8,9 +8,9 @@
8
8
  "types": "index.d.ts",
9
9
  "type": "module",
10
10
  "dependencies": {
11
- "@startupjs-ui/core": "^0.2.0",
12
- "@startupjs-ui/input": "^0.2.2",
13
- "@startupjs-ui/object-input": "^0.2.2",
11
+ "@startupjs-ui/core": "^0.3.0",
12
+ "@startupjs-ui/input": "^0.3.0",
13
+ "@startupjs-ui/object-input": "^0.3.0",
14
14
  "lodash": "^4.17.20"
15
15
  },
16
16
  "peerDependencies": {
@@ -18,5 +18,5 @@
18
18
  "react-native": "*",
19
19
  "startupjs": "*"
20
20
  },
21
- "gitHead": "1cbacbc3c6a919fc0ce6d3e2e335bcfe18a940d8"
21
+ "gitHead": "8d212b47680af1dfe582f9759b38724b46488e25"
22
22
  }