@instructure/ui-form-field 10.19.1 → 10.19.2-snapshot-1

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 (12) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/es/FormFieldGroup/__new-tests__/FormFieldGroup.test.js +1 -1
  3. package/es/FormFieldMessages/__new-tests__/FormFieldMessages.test.js +2 -2
  4. package/es/FormFieldMessages/index.js +1 -1
  5. package/lib/FormFieldGroup/__new-tests__/FormFieldGroup.test.js +1 -1
  6. package/lib/FormFieldMessages/__new-tests__/FormFieldMessages.test.js +2 -2
  7. package/lib/FormFieldMessages/index.js +1 -1
  8. package/package.json +15 -15
  9. package/src/FormFieldGroup/__new-tests__/FormFieldGroup.test.tsx +1 -1
  10. package/src/FormFieldMessages/__new-tests__/FormFieldMessages.test.tsx +2 -2
  11. package/src/FormFieldMessages/index.tsx +2 -2
  12. package/tsconfig.build.tsbuildinfo +1 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
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
+ ## [10.19.2-snapshot-1](https://github.com/instructure/instructure-ui/compare/v10.19.1...v10.19.2-snapshot-1) (2025-06-06)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **ui-form-field:** make JAWS read input field labels and form error separately ([9c23166](https://github.com/instructure/instructure-ui/commit/9c23166433a8a4afa4a1b4e358d8d4080f13a23b))
12
+
13
+
14
+
15
+
16
+
6
17
  ## [10.19.1](https://github.com/instructure/instructure-ui/compare/v10.19.0...v10.19.1) (2025-06-05)
7
18
 
8
19
  **Note:** Version bump only for package @instructure/ui-form-field
package/es/FormFieldGroup/__new-tests__/FormFieldGroup.test.js CHANGED
@@ -93,7 +93,7 @@ describe('<FormFieldGroup />', () => {
93
93
  })),
94
94
  container = _render3.container;
95
95
  const formFieldGroup = container.querySelector("fieldset[class$='-formFieldLayout']");
96
- const message = container.querySelector("span[id^='FormFieldLayout_']");
96
+ const message = container.querySelector("div[id^='FormFieldLayout_']");
97
97
  expect(message).toBeInTheDocument();
98
98
  expect(formFieldGroup).toBeInTheDocument();
99
99
  expect(formFieldGroup).toHaveAttribute('aria-describedby');
package/es/FormFieldMessages/__new-tests__/FormFieldMessages.test.js CHANGED
@@ -57,7 +57,7 @@ describe('<FormFieldMessages />', () => {
57
57
  messages: messages
58
58
  })),
59
59
  container = _render.container;
60
- const formFieldMessages = container.querySelector("span[class$='-formFieldMessages']");
60
+ const formFieldMessages = container.querySelector("div[class$='-formFieldMessages']");
61
61
  expect(formFieldMessages).toBeInTheDocument();
62
62
  expect(formFieldMessages).toHaveTextContent('Invalid nameGood job!Full name, first and last');
63
63
  });
@@ -72,7 +72,7 @@ describe('<FormFieldMessages />', () => {
72
72
  messages: messages
73
73
  })),
74
74
  container = _render2.container;
75
- const formFieldMessages = container.querySelector("span[class$='-formFieldMessages']");
75
+ const formFieldMessages = container.querySelector("div[class$='-formFieldMessages']");
76
76
  const iconSvg = container.querySelector('svg[name="IconWarning"]');
77
77
  expect(iconSvg).toBeInTheDocument();
78
78
  expect(formFieldMessages).toBeInTheDocument();
package/es/FormFieldMessages/index.js CHANGED
@@ -69,7 +69,7 @@ let FormFieldMessages = (_dec = withStyle(generateStyle, generateComponentTheme)
69
69
  const _this$props3 = this.props,
70
70
  messages = _this$props3.messages,
71
71
  styles = _this$props3.styles;
72
- return messages && messages.length > 0 ? _jsx("span", {
72
+ return messages && messages.length > 0 ? _jsx("div", {
73
73
  css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessages,
74
74
  ...omitProps(this.props, FormFieldMessages.allowedProps),
75
75
  ref: this.handleRef,
package/lib/FormFieldGroup/__new-tests__/FormFieldGroup.test.js CHANGED
@@ -94,7 +94,7 @@ describe('<FormFieldGroup />', () => {
94
94
  })),
95
95
  container = _render3.container;
96
96
  const formFieldGroup = container.querySelector("fieldset[class$='-formFieldLayout']");
97
- const message = container.querySelector("span[id^='FormFieldLayout_']");
97
+ const message = container.querySelector("div[id^='FormFieldLayout_']");
98
98
  expect(message).toBeInTheDocument();
99
99
  expect(formFieldGroup).toBeInTheDocument();
100
100
  expect(formFieldGroup).toHaveAttribute('aria-describedby');
package/lib/FormFieldMessages/__new-tests__/FormFieldMessages.test.js CHANGED
@@ -58,7 +58,7 @@ describe('<FormFieldMessages />', () => {
58
58
  messages: messages
59
59
  })),
60
60
  container = _render.container;
61
- const formFieldMessages = container.querySelector("span[class$='-formFieldMessages']");
61
+ const formFieldMessages = container.querySelector("div[class$='-formFieldMessages']");
62
62
  expect(formFieldMessages).toBeInTheDocument();
63
63
  expect(formFieldMessages).toHaveTextContent('Invalid nameGood job!Full name, first and last');
64
64
  });
@@ -73,7 +73,7 @@ describe('<FormFieldMessages />', () => {
73
73
  messages: messages
74
74
  })),
75
75
  container = _render2.container;
76
- const formFieldMessages = container.querySelector("span[class$='-formFieldMessages']");
76
+ const formFieldMessages = container.querySelector("div[class$='-formFieldMessages']");
77
77
  const iconSvg = container.querySelector('svg[name="IconWarning"]');
78
78
  expect(iconSvg).toBeInTheDocument();
79
79
  expect(formFieldMessages).toBeInTheDocument();
package/lib/FormFieldMessages/index.js CHANGED
@@ -75,7 +75,7 @@ let FormFieldMessages = exports.FormFieldMessages = (_dec = (0, _emotion.withSty
75
75
  const _this$props3 = this.props,
76
76
  messages = _this$props3.messages,
77
77
  styles = _this$props3.styles;
78
- return messages && messages.length > 0 ? (0, _jsxRuntime.jsx)("span", {
78
+ return messages && messages.length > 0 ? (0, _jsxRuntime.jsx)("div", {
79
79
  css: styles === null || styles === void 0 ? void 0 : styles.formFieldMessages,
80
80
  ...(0, _omitProps.omitProps)(this.props, FormFieldMessages.allowedProps),
81
81
  ref: this.handleRef,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-form-field",
3
- "version": "10.19.1",
3
+ "version": "10.19.2-snapshot-1",
4
4
  "description": "Form layout components.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,26 +23,26 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-axe-check": "10.19.1",
27
- "@instructure/ui-babel-preset": "10.19.1",
28
- "@instructure/ui-test-utils": "10.19.1",
29
- "@instructure/ui-themes": "10.19.1",
26
+ "@instructure/ui-axe-check": "10.19.2-snapshot-1",
27
+ "@instructure/ui-babel-preset": "10.19.2-snapshot-1",
28
+ "@instructure/ui-test-utils": "10.19.2-snapshot-1",
29
+ "@instructure/ui-themes": "10.19.2-snapshot-1",
30
30
  "@testing-library/jest-dom": "^6.6.3",
31
31
  "@testing-library/react": "^16.0.1",
32
32
  "vitest": "^2.1.8"
33
33
  },
34
34
  "dependencies": {
35
35
  "@babel/runtime": "^7.26.0",
36
- "@instructure/console": "10.19.1",
37
- "@instructure/emotion": "10.19.1",
38
- "@instructure/shared-types": "10.19.1",
39
- "@instructure/ui-a11y-content": "10.19.1",
40
- "@instructure/ui-a11y-utils": "10.19.1",
41
- "@instructure/ui-grid": "10.19.1",
42
- "@instructure/ui-icons": "10.19.1",
43
- "@instructure/ui-react-utils": "10.19.1",
44
- "@instructure/ui-utils": "10.19.1",
45
- "@instructure/uid": "10.19.1",
36
+ "@instructure/console": "10.19.2-snapshot-1",
37
+ "@instructure/emotion": "10.19.2-snapshot-1",
38
+ "@instructure/shared-types": "10.19.2-snapshot-1",
39
+ "@instructure/ui-a11y-content": "10.19.2-snapshot-1",
40
+ "@instructure/ui-a11y-utils": "10.19.2-snapshot-1",
41
+ "@instructure/ui-grid": "10.19.2-snapshot-1",
42
+ "@instructure/ui-icons": "10.19.2-snapshot-1",
43
+ "@instructure/ui-react-utils": "10.19.2-snapshot-1",
44
+ "@instructure/ui-utils": "10.19.2-snapshot-1",
45
+ "@instructure/uid": "10.19.2-snapshot-1",
46
46
  "prop-types": "^15.8.1"
47
47
  },
48
48
  "peerDependencies": {
package/src/FormFieldGroup/__new-tests__/FormFieldGroup.test.tsx CHANGED
@@ -121,7 +121,7 @@ describe('<FormFieldGroup />', () => {
121
121
  const formFieldGroup = container.querySelector(
122
122
  "fieldset[class$='-formFieldLayout']"
123
123
  )
124
- const message = container.querySelector("span[id^='FormFieldLayout_']")
124
+ const message = container.querySelector("div[id^='FormFieldLayout_']")
125
125
 
126
126
  expect(message).toBeInTheDocument()
127
127
  expect(formFieldGroup).toBeInTheDocument()
package/src/FormFieldMessages/__new-tests__/FormFieldMessages.test.tsx CHANGED
@@ -60,7 +60,7 @@ describe('<FormFieldMessages />', () => {
60
60
  const { container } = render(<FormFieldMessages messages={messages} />)
61
61
 
62
62
  const formFieldMessages = container.querySelector(
63
- "span[class$='-formFieldMessages']"
63
+ "div[class$='-formFieldMessages']"
64
64
  )
65
65
 
66
66
  expect(formFieldMessages).toBeInTheDocument()
@@ -84,7 +84,7 @@ describe('<FormFieldMessages />', () => {
84
84
  const { container } = render(<FormFieldMessages messages={messages} />)
85
85
 
86
86
  const formFieldMessages = container.querySelector(
87
- "span[class$='-formFieldMessages']"
87
+ "div[class$='-formFieldMessages']"
88
88
  )
89
89
  const iconSvg = container.querySelector('svg[name="IconWarning"]')
90
90
 
package/src/FormFieldMessages/index.tsx CHANGED
@@ -80,7 +80,7 @@ class FormFieldMessages extends Component<FormFieldMessagesProps> {
80
80
  const { messages, styles } = this.props
81
81
 
82
82
  return messages && messages.length > 0 ? (
83
- <span
83
+ <div
84
84
  css={styles?.formFieldMessages}
85
85
  {...omitProps(this.props, FormFieldMessages.allowedProps)}
86
86
  ref={this.handleRef}
@@ -92,7 +92,7 @@ class FormFieldMessages extends Component<FormFieldMessagesProps> {
92
92
  </span>
93
93
  )
94
94
  })}
95
- </span>
95
+ </div>
96
96
  ) : null
97
97
  }
98
98
  }